/* Original cinematic direction: pinned supplied video, three scenes and scroll scrub. */
.cinematic { position:relative; background:#02060b; }
.cinematic-pin { height:100vh; min-height:640px; position:relative; overflow:hidden; background:#02060b; }
.cinematic video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.85) contrast(1.05) brightness(.8); }
.cinematic-vignette { position:absolute; inset:-10%; background:radial-gradient(circle at center,transparent 25%,rgba(0,0,0,.28) 60%,rgba(0,0,0,.85) 100%); pointer-events:none; }
.cinematic-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,8,15,.83),rgba(3,8,15,.2) 70%),linear-gradient(0deg,rgba(3,7,13,.8),transparent 45%); }
.scene { position:absolute; left:8vw; top:50%; width:min(860px,82vw); z-index:4; opacity:0; transform:translateY(calc(-50% + 25px)) scale(.98); pointer-events:none; transition:opacity .4s,transform .65s cubic-bezier(.2,.7,.2,1); }
.scene.is-active { opacity:1; transform:translateY(-50%) scale(1); pointer-events:auto; }
.cinematic h1 { font-size:clamp(56px,7vw,105px); line-height:.96; letter-spacing:-.065em; margin-bottom:28px; }
.cinematic h2 { font-size:clamp(48px,6.5vw,94px); line-height:1; letter-spacing:-.06em; margin-bottom:27px; }
.cinematic em { font-style:normal; color:#b9dcff; }
.cinematic .eyebrow { color:#b7c8df; font-size:10px; letter-spacing:.2em; margin-bottom:23px; }
.cinematic .scene>p:not(.eyebrow) { color:#d0dae6; font-size:17px; line-height:1.8; max-width:610px; margin-bottom:0; }
.cinematic .button { background:#fff; color:#07101b; border-radius:999px; }
.cinematic .text-link { color:#fff; }
.story-controls { position:absolute; bottom:35px; left:8vw; right:6vw; display:flex; align-items:center; gap:35px; z-index:5; color:#b7c2d0; font-size:10px; }
.scroll-cue { display:flex; align-items:center; gap:12px; text-transform:uppercase; letter-spacing:.13em; }
.scroll-cue i { width:30px; height:1px; background:#b7c2d0; }
.story-controls>a { margin-left:auto; }
.hero-meter { width:110px; height:1px; background:rgba(255,255,255,.25); }
.hero-meter i { display:block; width:100%; height:100%; transform:scaleX(0); transform-origin:left; background:#fff; }
@media(max-width:800px) {
  .cinematic { height:500vh; }.cinematic-pin { min-height:620px; }.scene { left:7vw; width:85vw; }
  .cinematic h1 { font-size:clamp(47px,8.6vw,70px); }.cinematic h2 { font-size:clamp(44px,8vw,67px); }
  .cinematic .scene>p:not(.eyebrow) { font-size:15px; max-width:530px; }.story-controls { left:7vw; gap:18px; }.hero-meter { width:75px; }
}
@media(max-width:480px) {
  .cinematic-pin { min-height:700px; }.scene { top:48%; }.cinematic h1 { font-size:49px; }.cinematic h2 { font-size:44px; }
  .cinematic .eyebrow { font-size:8px; letter-spacing:.12em; }.cinematic .scene>p:not(.eyebrow) { font-size:14px; }
  .cinematic .actions { gap:17px; }.cinematic .actions .text-link { font-size:11px; }.story-controls { font-size:8px; }.scroll-cue i { width:17px; }.hero-meter { display:none; }
}
@media(max-height:700px) and (min-width:801px) { .cinematic h1 { font-size:70px; }.cinematic h2 { font-size:64px; }.scene { top:53%; }.cinematic-pin { min-height:600px; } }
@media(prefers-reduced-motion:reduce) {
  .cinematic { height:auto; }.cinematic-pin { position:relative; height:auto; min-height:720px; }
  .scene-a { position:relative; inset:auto; transform:none!important; opacity:1; width:auto; padding:155px 7vw 125px; }
  .scene-b,.scene-c,.hero-meter,.scroll-cue { display:none; }.cinematic video { transform:none!important; }.story-controls>a { margin-left:0; }
}
.hero-static .cinematic { height:auto; }.hero-static .cinematic-pin { position:relative; }
.hero-static .scene-a { opacity:1; pointer-events:auto; }.hero-static .scene-b,.hero-static .scene-c { display:none; }

