.home-feature-cards{
  position:absolute;
  z-index:3;
  top:clamp(128px,18svh,205px);
  left:50%;
  width:min(1040px,calc(100% - 2 * var(--pad)));
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  transform:translateX(-50%);
  opacity:0;
  pointer-events:none;
  transition:opacity .8s ease;
}
.home-page.hero-media-ready.home-cards-ready .home-feature-cards{opacity:1;pointer-events:auto}
.home-feature-card{
  position:relative;
  min-width:0;
  height:clamp(140px,22svh,210px);
  display:block;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.29);
  border-radius:12px;
  background:transparent;
  box-shadow:0 16px 40px rgba(0,0,0,.36);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.home-feature-card:hover,.home-feature-card:focus-visible{
  transform:translateY(-5px);
  border-color:#e1bd68;
  box-shadow:0 22px 48px rgba(0,0,0,.52);
  outline:none;
}
.home-feature-card::before,.home-feature-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.home-feature-card::before{
  z-index:2;
  background:linear-gradient(145deg,rgba(255,255,255,.1),transparent 34%,rgba(255,220,146,.035) 75%,transparent);
  box-shadow:inset 0 1px rgba(255,231,171,.34),inset 0 -1px rgba(236,192,103,.22);
}
.home-feature-card::after{
  z-index:3;
  background:linear-gradient(105deg,transparent 33%,rgba(244,184,63,.1) 42%,rgba(255,233,150,.62) 49%,rgba(255,182,52,.3) 52%,transparent 63%);
  opacity:0;
  transform:translateX(-135%);
}
.home-feature-card.is-glinting::after{animation:home-card-gold-glint 1.35s ease-in-out both}
@keyframes home-card-gold-glint{
  0%{opacity:0;transform:translateX(-135%)}
  18%{opacity:.8}
  78%{opacity:.8}
  100%{opacity:0;transform:translateX(135%)}
}
.home-feature-card-media{position:absolute;inset:0;overflow:hidden;background:transparent}
.home-feature-card-media img{width:100%;height:100%;object-fit:cover}
.home-feature-card--battle .home-feature-card-media{display:grid;place-items:center;background:transparent}
.home-feature-card--battle .home-feature-card-media img{width:100%;height:100%;object-fit:cover;filter:drop-shadow(0 5px 16px rgba(0,0,0,.75))}
.home-feature-card--notebook .home-feature-card-media img{object-position:center 54%}
.home-feature-card--room .home-feature-card-media{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  background:linear-gradient(90deg,#092c30 0 50%,#341820 50% 100%);
}
.home-feature-card-animal{min-width:0;height:100%;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 70%,rgba(3,185,143,.2),transparent 70%)}
.home-feature-card-animal--bear{background:radial-gradient(circle at 50% 70%,rgba(255,73,96,.2),transparent 70%)}
.home-feature-card--room .home-feature-card-media img{width:124%;height:115%;object-fit:contain;filter:drop-shadow(0 0 14px rgba(25,221,166,.3))}
.home-feature-card--room .home-feature-card-animal--bull img{transform:translateY(-5%)}
.home-feature-card--room .home-feature-card-animal--bear img{transform:translateY(-5%);filter:drop-shadow(0 0 14px rgba(255,73,96,.3))}
.home-feature-card-caption{
  position:absolute;
  z-index:1;
  right:0;
  bottom:0;
  left:0;
  min-height:51px;
  padding:9px 13px;
  display:grid;
  grid-template-columns:1fr auto;
  align-content:center;
  align-items:center;
  gap:3px 8px;
  background:transparent;
  color:#fff;
  text-shadow:0 2px 6px #000,0 0 12px rgba(0,0,0,.9);
}
.home-feature-card-caption small{grid-column:1;color:#e1bd68;font:700 8px/1 Manrope,sans-serif;letter-spacing:.17em}
.home-feature-card-caption strong{grid-column:1;font:700 clamp(12px,1.2vw,17px)/1.2 'Noto Sans JP',sans-serif;white-space:nowrap}
.home-feature-card-caption>span{grid-column:2;grid-row:1/3;color:#e1bd68;font-size:18px;line-height:1}
.home-page.home-chart-mode .home-feature-cards{display:none}

@media(min-width:780px) and (max-height:760px){
  .movie-copy .hero-headline{font-size:min(var(--hero-headline-desktop,150px),12svh)!important}
}
@media(max-width:779px){
  .home-feature-cards{
    top:clamp(145px,19svh,180px);
    width:min(430px,calc(100% - 2 * var(--pad)));
    grid-template-columns:1fr;
    gap:7px;
  }
  .home-feature-card{height:clamp(56px,7.2svh,61px);border-radius:8px}
  .home-feature-card-caption{min-height:0;padding:7px 11px}
  .home-feature-card-caption strong{font-size:13px}
  .home-feature-card--room .home-feature-card-media img{width:100%;height:160%}
}
@media(max-width:779px) and (max-height:640px){
  .home-feature-cards{top:136px}
  .home-feature-cards{gap:5px}
  .home-feature-card{height:clamp(42px,7svh,46px)}
  .home-feature-card-caption{padding:4px 8px;gap:2px 6px}
  .home-feature-card-caption strong{font-size:11px}
  .movie-copy .hero-headline{font-size:min(var(--hero-headline-mobile,60px),9svh)!important}
}
@media(max-width:779px) and (max-height:520px){
  .home-feature-cards{top:128px;width:calc(100% - 24px);grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
  .home-feature-card{height:50px}
  .home-feature-card-caption{min-height:22px;padding:2px 5px}
  .home-feature-card-caption small{display:none}
  .home-feature-card-caption strong{font-size:9px}
  .home-feature-card-caption>span{grid-row:1;font-size:12px}
}
@media(prefers-reduced-motion:reduce){
  .home-feature-cards,.home-feature-card{transition:none}
  .home-feature-card.is-glinting::after{animation:none}
}