/* Scroll choreography is progressive enhancement; the story remains readable without it. */
.cinematic .chapter{height:165svh;min-height:0;padding:0;display:block}
.cinematic .chapter:last-child{height:100svh}
.cinematic .hero{height:215svh}
.cinematic .story{height:205svh}
.cinematic .meet{height:190svh}
.cinematic .ice,.cinematic .gravity,.cinematic .bloom,.cinematic .stardust{height:195svh}
.ice .chapter-copy h2 em{color:#277b8b}.bloom .chapter-copy h2 em{color:#a4424d}
.gravity .chapter-copy h2 em{color:#a3e5fa}.stardust .chapter-copy h2 em{color:#cfb2ff}
.cinematic .stardust .chapter-copy h2{font-size:clamp(44px,5.7vw,98px)}
.moment-caption{position:fixed;z-index:4;top:12vh;left:0;right:0;text-align:center;color:#f4eaff;pointer-events:none;opacity:0;will-change:opacity,transform;text-shadow:0 2px 24px #20133266}
.moment-caption span{display:block;font-size:10px;letter-spacing:.3em;margin-bottom:12px}
.moment-caption strong{font-weight:500;font-size:clamp(24px,3vw,42px);letter-spacing:-.04em}
.cinematic .chapter-frame{position:fixed;inset:0;height:100svh;visibility:hidden;pointer-events:none;will-change:opacity;overflow:clip;z-index:4}
.cinematic .hero .chapter-frame{padding:128px 4.5% 110px;z-index:1}
.cinematic .story .chapter-frame,.cinematic .meet .chapter-frame{padding:0 7%;display:flex;align-items:center}
.cinematic .meet .chapter-frame{justify-content:flex-end}
.cinematic .world .chapter-frame{padding:13vh 4.5% 100px;text-align:center;z-index:1}
.cinematic .chapter-frame.is-current{visibility:visible}
.cinematic .chapter-frame.is-current a{pointer-events:auto}
.cinematic .chapter-copy{padding-top:7vh;padding-bottom:80px}
.cinematic .hero h1,.cinematic .world h2{perspective:1000px;white-space:nowrap;user-select:none}
.title-char{display:inline-block;will-change:transform,opacity;transform-origin:50% 90%;backface-visibility:hidden}
.split-line{display:block;overflow:clip;margin:-.08em 0;padding:.08em 0;perspective:900px}
.split-line>span{display:block;will-change:transform;transform-origin:0 100%;backface-visibility:hidden}
.cinematic .chapter-copy p,.cinematic .eyebrow,.cinematic .text-link,.cinematic .hero-bottom,.cinematic .hero-topline,.cinematic .world-bottom,.cinematic .world-caption{will-change:transform,opacity}
.cinematic .header{position:fixed;will-change:transform,opacity}
.cinematic .rail{background:#142018eb;backdrop-filter:blur(18px);border-top:1px solid #ffffff12}
.cinematic .rail:before{content:'';height:2px;position:absolute;top:-1px;left:0;right:0;background:linear-gradient(90deg,#ad8bff,#dcff6b);transform:scaleX(var(--story-progress,0));transform-origin:left;will-change:transform}
.cinematic .chapters a{transition:color .25s,opacity .25s,transform .25s}
.cinematic .chapters a:hover{transform:translateY(-3px);opacity:1}
.cinematic .chapters a.active{color:#d9ff65}
.cinematic .scroll-circle{position:relative;border-color:#24302155}
.cinematic .scroll-circle:after{content:'';position:absolute;inset:-6px;border:1px solid currentColor;border-radius:50%;opacity:0;transition:transform .5s,opacity .5s;transform:scale(.82)}
.cinematic .scroll-link:hover .scroll-circle:after{opacity:.3;transform:scale(1.06)}
.cinematic .scroll-link .scroll-circle{animation:invitation 2.8s ease-in-out infinite}
.cinematic .nav-cta,.cinematic .again{transition:background .25s,color .25s,transform .4s cubic-bezier(.2,.8,.2,1)}
.cinematic .text-link span,.cinematic .nav-cta span,.cinematic .again span{transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.cinematic .text-link:hover span,.cinematic .nav-cta:hover span{transform:translate(4px,-4px)}
.cinematic .again:hover span{transform:rotate(-80deg)}
.cinematic .drag-hint{animation:hint-in 1s 1.8s both}
.cinema-shade{position:fixed;inset:0;z-index:3;pointer-events:none;opacity:calc(var(--travel,0)*.6);background:radial-gradient(ellipse at center,transparent 35%,#0e062b60 100%);mix-blend-mode:multiply}
.cinema-shade:before,.cinema-shade:after{content:'';position:absolute;left:0;right:0;height:calc(var(--travel,0)*3.5vh);background:#171223;opacity:.6}
.cinema-shade:before{top:0}.cinema-shade:after{bottom:62px}
.cinematic.is-paused .scroll-circle,.cinematic.is-paused .drag-hint{animation-play-state:paused}
html:has(body.is-paused){scroll-behavior:auto}
.cinematic .vertical-note{opacity:.4}
@keyframes invitation{0%,100%{translate:0 0}50%{translate:0 5px}}
@keyframes hint-in{from{opacity:0;filter:blur(5px)}to{opacity:.65;filter:blur(0)}}
@media(min-width:1600px){.cinematic .hero .chapter-frame{padding-top:145px}}
@media(max-width:700px){
 .cinematic .chapter{height:175svh}.cinematic .chapter:last-child{height:100svh}
 .cinematic .hero{height:230svh}.cinematic .story{height:220svh}.cinematic .meet{height:200svh}
 .cinematic .ice,.cinematic .gravity,.cinematic .bloom,.cinematic .stardust{height:205svh}
 .cinematic .chapters{gap:0}.cinematic .chapters a{width:29px;font-size:11px}
 .cinematic .rail{padding:0 4%}.cinematic .rail button{padding-left:8px;gap:6px;font-size:10px}
 .cinematic .stardust .chapter-copy h2{font-size:clamp(36px,10.5vw,52px)}
 .cinematic .stardust .chapter-copy h2 em{white-space:normal}
 .moment-caption{top:14vh}.moment-caption strong{font-size:29px}
 .cinematic .hero .chapter-frame{padding:110px 6% 100px}
 .cinematic .story .chapter-frame,.cinematic .meet .chapter-frame{padding:0 7%;display:block}
 .cinematic .chapter-copy,.cinematic .meet .chapter-copy{padding:48px 0 0;width:100%}
 .cinematic .chapter-copy h2{font-size:clamp(38px,11.5vw,59px);margin:18px 0}
 .cinematic .chapter-copy p{font-size:16px;line-height:1.4;margin-bottom:10px}
 .cinematic .chapter-copy .text-link{font-size:14px;padding-bottom:8px}
 .cinematic .world .chapter-frame{padding:75px 5% 100px}
 .cinema-shade:after{bottom:54px}
 .cinematic .hero .hero-topline{font-size:12px}
 .cinematic .world-caption{font-size:12px;white-space:normal;width:90%}
}
@media(max-height:700px) and (max-width:700px){
 .cinematic .chapter-copy{padding-top:25px!important}
 .cinematic .chapter-copy h2{font-size:32px;margin:13px 0}
 .cinematic .chapter-copy p{font-size:16px;line-height:1.35}
}
@media(prefers-reduced-motion:reduce){.cinematic .scroll-circle,.cinematic .drag-hint{animation:none}.cinema-shade{display:none}.title-char,.split-line>span{will-change:auto}}
@media(max-width:380px){.cinematic .chapters a{width:25px}.cinematic .rail button{gap:4px;font-size:9px}}