/* Full-viewport footage; copy and navigation sit above the image. */
.experience{position:relative;height:100vh;height:100dvh;background:var(--ink);color:var(--paper)}
.experience.scene-enhanced{height:400vh;height:400svh}
.experience-stage{position:sticky;top:0;width:100%;height:100vh;height:100dvh;min-height:0;overflow:hidden;isolation:isolate}
.car-visual{position:absolute;inset:0;width:100%;height:100%;margin:0;max-width:none;z-index:0;pointer-events:none;--scene-focus:33%}
.car-visual img,.car-visual canvas{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--scene-focus) 50%;display:block}
.scroll-canvas{opacity:0}
.frames-visible .scroll-canvas{opacity:1}
.experience-stage:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#05080bb3 0%,#05080b38 25%,transparent 44%,transparent 60%,#05080b80 80%,#05080bf2 100%)}
.hero-heading,.finish-heading{position:absolute;left:0;right:0;top:clamp(120px,17svh,200px);z-index:3;pointer-events:none;text-align:left;text-shadow:0 2px 30px #0006}
.hero-heading .eyebrow,.finish-heading .eyebrow{font-size:.8125rem;letter-spacing:.13em;color:#f0f3e8}
.hero-heading h1,.finish-heading>p:last-child{font-size:clamp(3.8rem,7.8vw,9rem);font-weight:500;line-height:.99;letter-spacing:-.06em;margin-top:18px;max-width:850px}
.hero-heading h1>span{display:block}
.hero-heading h1>span,.finish-heading>p:last-child>span{color:var(--lime)}
.finish-heading{opacity:0}
.hero-side{display:none}
.hero-bottom{position:absolute;z-index:4;left:0;right:0;bottom:max(18px,env(safe-area-inset-bottom))}
.hero-bottom-top{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:18px}
.scene-copy{font-size:clamp(1.125rem,1.65vw,1.75rem);line-height:1.35;letter-spacing:-.025em;text-shadow:0 1px 15px #0008}
.scene-copy>span{display:inline-block;color:#d8ddcf;font-size:.875rem;line-height:1.6;letter-spacing:0;margin-top:4px}
.play-scene{display:flex;align-items:center;gap:12px;background:none;color:#f5f5f1;font-size:.875rem;padding:10px 0;min-height:44px;white-space:nowrap}
.play-icon{height:36px;width:36px;border:1px solid #ffffff70;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;padding-left:2px;transition:background .2s,color .2s}
.play-scene:hover .play-icon{background:var(--lime);color:var(--ink);border-color:var(--lime)}
.scene-track{height:2px;background:#ffffff40;overflow:hidden}
.scene-track>span{display:block;height:100%;background:var(--lime);transform-origin:left;transform:scaleX(0)}
.hero-bottom-lower{display:flex;justify-content:space-between;gap:24px;align-items:center;margin-top:7px}
.phase-nav{display:flex;gap:28px}
.phase-nav>button{display:flex;align-items:center;gap:8px;background:none;color:#d3d9c9;font-size:.875rem;min-height:44px;padding:9px 0;white-space:nowrap}
.phase-nav>button>span{font-size:.75rem;color:#b8c0ac;font-variant-numeric:tabular-nums}
.phase-nav>button[aria-current],.phase-nav>button:hover{color:var(--lime)}
.phase-nav>button[aria-current]>span{color:var(--lime)}
.scroll-cue{display:flex;align-items:center;gap:17px;font-size:.75rem;letter-spacing:.08em;color:#e2e7da;white-space:nowrap}
.scroll-cue>span{color:var(--lime);font-size:1.3rem}
.in-experience.has-scrolled:not(.menu-open) .header{background:#10111330;backdrop-filter:none}
@media(max-width:1150px){.scroll-cue{display:none}.phase-nav{gap:25px}.hero-heading h1,.finish-heading>p:last-child{font-size:clamp(3.8rem,8.8vw,7rem)}}
@media(max-width:720px){
 .hero-heading,.finish-heading{top:116px}
 .hero-heading .eyebrow,.finish-heading .eyebrow{font-size:.75rem;letter-spacing:.075em;max-width:270px}
 .hero-heading h1,.finish-heading>p:last-child{font-size:clamp(3rem,13vw,5.5rem);margin-top:15px;line-height:1.01;max-width:100%}
 .hero-bottom{bottom:max(13px,env(safe-area-inset-bottom))}
 .hero-bottom-top{gap:12px;margin-bottom:14px;align-items:center}
 .scene-copy{font-size:1.125rem;max-width:250px}
 .scene-copy>span{font-size:.8125rem;max-width:230px;line-height:1.5}
 .play-scene{font-size:.8125rem;gap:7px}
 .play-icon{height:32px;width:32px}
 .hero-bottom-lower{margin-top:5px;gap:0}
 .phase-nav{width:100%;justify-content:space-between;gap:8px}
 .phase-nav>button{font-size:.875rem;min-height:44px;gap:0}
 .phase-nav>button>span{display:none}
 .experience-stage:after{background:linear-gradient(180deg,#05080bb3 0%,#05080b38 30%,transparent 43%,transparent 62%,#05080b9c 81%,#05080bf5 100%)}
}
@media(max-width:370px){.hero-bottom.shell{padding-inline:18px}.hero-heading h1,.finish-heading>p:last-child{font-size:3.15rem}.phase-nav{gap:6px}.phase-nav>button{font-size:.8125rem}.scene-copy{font-size:1rem}.scene-copy>span{font-size:.75rem}.play-scene{font-size:.75rem}}
@media(max-height:700px){.hero-heading,.finish-heading{top:108px}.hero-heading h1,.finish-heading>p:last-child{font-size:clamp(3rem,9svh,4.8rem)}.hero-bottom-top{margin-bottom:10px}.scene-copy>span{display:none}}
@media(max-height:480px) and (orientation:landscape){.hero-heading,.finish-heading{top:88px}.hero-heading .eyebrow,.finish-heading .eyebrow{display:none}.hero-heading h1,.finish-heading>p:last-child{font-size:2.9rem;margin-top:0}.hero-heading h1>span{display:inline}.hero-bottom{bottom:8px}.hero-bottom-top{margin-bottom:4px}.scene-copy{font-size:1.1rem}.phase-nav>button{min-height:36px}.play-scene{padding-block:0;min-height:36px}}
@media(prefers-reduced-motion:reduce){.experience.scene-enhanced{height:100vh;height:100dvh}.scroll-cue{display:none}}