/* A full-width filmstrip. Native scroll remains usable without JavaScript. */
.cinema{--poster-width:min(78vw,1280px);--cinema-entry:1;padding:90px 0 42px;overflow:clip;scroll-margin-top:110px}
.cinema-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:34px}
.cinema-heading .eyebrow{font-size:9px;letter-spacing:2px;color:#686c64;margin-bottom:18px}
.cinema-heading h2{font-size:clamp(34px,4.2vw,60px);letter-spacing:-.055em;line-height:1.08;max-width:850px}
.cinema-browse{font-size:12px;font-weight:650;white-space:nowrap;min-height:44px;display:flex;align-items:center;gap:16px}.cinema-browse span{font-size:22px;color:var(--orange)}
.cinema-mask{clip-path:none}
.cinema-rail{position:relative;display:flex;gap:16px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 calc((100% - var(--poster-width))/2);touch-action:pan-x pan-y pinch-zoom;cursor:grab}
.cinema-rail::-webkit-scrollbar{display:none}.cinema-rail:focus-visible{outline-offset:-4px}.cinema-rail.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.cinema-slide{position:relative;flex:0 0 var(--poster-width);width:var(--poster-width);aspect-ratio:16/9;scroll-snap-align:center;scroll-snap-stop:always;isolation:isolate;overflow:hidden;color:#fff;background:#132520;border-radius:6px;--slide-accent:#ffa365}
.cinema-art,.cinema-shade{position:absolute;inset:0;pointer-events:none}.cinema-art{overflow:hidden}.cinema-image{width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;user-select:none;pointer-events:none}
.cinema-shade{background:linear-gradient(90deg,#06140fea 0%,#06140f72 36%,#06140f05 73%),linear-gradient(0deg,#07110fe8,transparent 44%)}
.cinema-copy{position:absolute;z-index:1;left:5.5%;top:9%;max-width:58%;pointer-events:none}
.cinema-kicker{font-size:clamp(8px,.8vw,11px);font-weight:700;letter-spacing:2px;color:#ffffffc9;margin-bottom:22px}
.cinema-copy h3{font-size:clamp(36px,5.7vw,88px);font-weight:800;line-height:1.02;letter-spacing:-.065em;text-wrap:balance}.cinema-copy em{color:var(--slide-accent);font-style:normal}.cinema-name{margin-top:22px;font-size:clamp(12px,1.3vw,19px);font-weight:750;letter-spacing:-.025em}
.cinema-bottom{position:absolute;z-index:2;bottom:7%;left:5.5%;right:5.5%;display:flex;align-items:center;justify-content:space-between;gap:22px}.cinema-caption p{font-size:clamp(12px,1.2vw,18px);font-weight:650;line-height:1.5}.cinema-caption>span{display:block;margin-top:6px;font-size:clamp(9px,.85vw,12px);color:#dbe0da;line-height:1.5}
.cinema-actions{display:flex;align-items:center;gap:18px;flex-shrink:0}.cinema-actions a{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;font-size:12px;font-weight:750;white-space:nowrap}.cinema-launch{background:#fff;color:#131713;border-radius:30px;padding:13px 22px;transition:background .2s,transform .25s}.cinema-launch:hover{background:#f4e5d6;transform:translateY(-2px)}.cinema-actions svg{width:16px;height:16px}.cinema-guide{padding:8px 0}.cinema-guide:hover{text-decoration:underline;text-underline-offset:5px}.cinema a:focus-visible{outline-color:#ffab79;outline-offset:4px}
.cinema-super-quest{--slide-accent:#ffdb83;background:#102422}.cinema-super-quest .cinema-image{object-position:62% 44%}.cinema-super-quest .cinema-shade{background:linear-gradient(90deg,#101d25d9,#101d2525 72%),linear-gradient(0deg,#0d1a25e8,transparent 50%)}
.cinema-resonant{--slide-accent:#f5b591;background:radial-gradient(ellipse at 76% 42%,#735b3c,#302b24 58%,#171d18)}.cinema-resonant .cinema-image{width:76%;margin-left:auto;object-fit:contain;object-position:right center}.cinema-resonant .cinema-shade{background:linear-gradient(90deg,#181d18b8,transparent 62%),linear-gradient(0deg,#171d18e8,transparent 35%)}
.cinema-metal-slug-arcade{--slide-accent:#ffc48a}.cinema-metal-slug-arcade .cinema-shade{background:linear-gradient(90deg,#111911d1,transparent 76%),linear-gradient(0deg,#091810ec,transparent 53%)}
.cinema-character{position:absolute;width:28%;aspect-ratio:1;bottom:19%;height:auto;object-fit:contain;filter:drop-shadow(0 16px 14px #04150980);transform-origin:50% 100%}.cinema-fire{left:45%}.cinema-water{right:0;bottom:22%}
.cinema-controls{display:flex;align-items:center;justify-content:space-between;min-height:76px;gap:20px}.cinema-position{display:flex;gap:10px;font-size:11px;font-weight:650;font-variant-numeric:tabular-nums}.cinema-position>span+span{color:#81857c}.cinema-dots{display:flex;gap:4px}.cinema-dots button{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;background:none}.cinema-dots button span{width:7px;height:7px;border-radius:10px;background:#a6aaa1;transition:width .4s,background .3s}.cinema-dots button[aria-pressed=true] span{width:30px;background:var(--orange)}.cinema-arrows{display:flex;gap:10px}.cinema-arrows button{height:44px;width:44px;border:0;border-radius:50%;display:grid;place-items:center;background:#e8e9e1;transition:background .2s,transform .2s}.cinema-arrows button:hover{background:#dadcd0;transform:scale(1.06)}.cinema-arrows svg{width:20px;height:20px}.cinema-arrows button:first-child svg{transform:rotate(180deg)}
/* Each transition finishes and rests. There is no idle autoplay or scroll capture. */
/* Keep all copy and actions readable immediately; only artwork transitions. */
.cinema-ready .cinema-slide:not(.is-current) .cinema-art{filter:brightness(.68)}
.cinema-ready .cinema-art{transition:filter .65s}
.cinema-ready .cinema-image{transform:scale(1.055);transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.cinema-ready .is-current .cinema-image{transform:scale(1)}
.cinema-ready .cinema-character{transform:translateY(28px) scale(.94);transition:transform 1.1s .15s cubic-bezier(.16,1,.3,1)}.cinema-ready .is-current .cinema-character{transform:none}.cinema-ready .cinema-water{transition-delay:.23s}
@media(min-width:1100px) and (min-height:800px){.cinema{padding-top:110px}.overture-driven .world-overture{height:190svh;min-height:0;padding:0}.overture-driven .overture-sticky{position:sticky;top:88px;min-height:calc(100svh - 88px);display:flex;flex-direction:column;justify-content:center;padding-block:25px}}
@media(max-width:1100px){.cinema-bottom{gap:14px}.cinema-caption p{font-size:12px}.cinema-caption>span{font-size:9px}.cinema-actions{gap:12px}.cinema-actions a{font-size:11px}.cinema-launch{padding:11px 16px}.cinema-copy{top:9%}.cinema-kicker{margin-bottom:14px}.cinema-name{margin-top:15px}}
@media(max-width:760px){
 .cinema{--poster-width:88vw;padding:30px 0 16px;scroll-margin-top:90px}.cinema-heading{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:22px}.cinema-heading .eyebrow{font-size:7px;letter-spacing:1.5px;margin-bottom:13px}.cinema-heading h2{font-size:36px;max-width:340px}.cinema-browse{font-size:11px;min-height:38px}.cinema-rail{gap:12px}.cinema-slide{aspect-ratio:auto;min-height:0;display:grid;grid-template-rows:auto 1fr;border-radius:8px}.cinema-art{position:relative;inset:auto;aspect-ratio:16/10;grid-row:1;width:100%}.cinema-image{object-fit:cover}.cinema-shade{display:none}.cinema-copy{position:relative;left:auto;top:auto;max-width:none;padding:24px 22px 0;grid-row:2;align-self:start}.cinema-kicker{font-size:8px;margin-bottom:12px;letter-spacing:1.3px}.cinema-copy h3{font-size:clamp(32px,8.2vw,52px);line-height:1.03}.cinema-name{font-size:12px;margin-top:15px}.cinema-bottom{position:relative;inset:auto;display:flex;flex-direction:column;align-items:stretch;gap:20px;padding:15px 22px 24px;grid-row:3}.cinema-caption p{font-size:12px;line-height:1.65}.cinema-caption>span{font-size:9px;line-height:1.65;margin-top:8px}.cinema-actions{justify-content:space-between;gap:10px}.cinema-actions a{font-size:11px}.cinema-launch{padding-inline:18px}.cinema-resonant .cinema-image{width:100%;height:100%;object-position:center}.cinema-super-quest .cinema-image{object-position:72% 40%}.cinema-metal-slug-arcade .cinema-art{aspect-ratio:16/9}.cinema-character{width:43%;bottom:5%}.cinema-fire{left:15%}.cinema-water{right:2%;bottom:10%}.cinema-controls{gap:8px;min-height:70px}.cinema-position{font-size:10px;gap:5px}.cinema-dots{gap:0}.cinema-dots button{width:44px;min-height:44px}.cinema-arrows{gap:6px}.cinema-arrows button{width:44px;height:44px}.cinema-mask{clip-path:none}
}
@media(max-width:420px){.cinema-position{display:none}.cinema-dots button{width:44px}}
@media(prefers-reduced-motion:reduce){.cinema *, .cinema *::before{transition:none!important;animation:none!important;scroll-behavior:auto!important}.cinema-mask{clip-path:none}.cinema-ready .cinema-image,.cinema-ready .cinema-character{transform:none}}
.motion-paused .cinema *{transition:none!important;animation:none!important}.motion-paused .cinema-mask{clip-path:none}
@media print{.cinema-rail{display:block;overflow:visible;padding:0}.cinema-slide{width:100%;break-inside:avoid;margin-bottom:20px;filter:none!important}.cinema-slide[data-cinema-clone],.cinema-controls{display:none!important}.cinema-copy,.cinema-bottom{opacity:1!important;transform:none!important}}

@media(max-width:360px){.cinema-controls{flex-wrap:wrap;justify-content:center;row-gap:0}.cinema-dots{flex-basis:100%;justify-content:center}.cinema-arrows{margin-bottom:8px}}

/* Keep all three cars visible on phones; the clean scene leaves HTML copy crisp. */
.cinema-camber-reign{--slide-accent:#fff71e;background:#110017}.cinema-camber-reign .cinema-shade{background:linear-gradient(90deg,#110017c4 0%,#11001755 31%,transparent 68%),linear-gradient(0deg,#110017dd,transparent 40%)}.cinema-camber-reign .cinema-launch{background:#fff71e;color:#110017}.cinema-camber-reign a:focus-visible{outline-color:#fff71e}
@media(max-width:760px){.cinema-camber-reign .cinema-art{aspect-ratio:1672/941}.cinema-camber-reign .cinema-image{object-fit:contain}}
