.intro{background:#070b1b;color:#edf5ff;isolation:isolate;transition:opacity .6s,filter .6s;overflow:hidden}
.intro::before{display:none}.intro::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(#030612b0,transparent 20%,transparent 75%,#030612e8);box-shadow:inset 0 0 150px #02040d}
.cinema-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0}.intro-header,.intro-stage,.intro-footer{position:relative;z-index:2}
.intro-header{padding:32px 4vw;border-bottom:0}.intro-header .brand{font-size:18px;letter-spacing:5px}.intro-header .brand img{filter:grayscale(1);width:28px;height:28px}.intro-header>div{gap:24px}.intro .check-label{color:#bfcbdf;font-size:12px}.intro input{accent-color:#a4dfff}.intro-skip{color:#e0e9f7;background:#ffffff09;border:1px solid #ffffff26;border-radius:4px;padding:10px 18px;font-size:12px}
.intro-stage{flex:1;display:flex;align-items:center;justify-content:flex-start;padding:0 8vw;min-height:0}.intro-rings,.scene-side{display:none}.scene-number{top:24px;left:8vw;right:auto;font-size:12px;color:#7a8ba8;letter-spacing:2px}
.intro-main{width:55%;max-width:740px;text-align:left;margin:0;padding:30px 0;animation:cinema-copy 1.2s cubic-bezier(.16,1,.3,1) both;position:relative}
.intro-main .eyebrow{color:#94d9ff;letter-spacing:3px;font-size:12px;margin-bottom:24px}.intro-main h1{font-size:clamp(54px,6.7vw,104px);line-height:1.02;letter-spacing:-5px;margin:0 0 28px;font-weight:500;text-wrap:balance}.intro-main h1 span{color:#94d9ff;background:linear-gradient(120deg,#fff,#89cdff);background-clip:text;-webkit-text-fill-color:transparent}
.intro-main>p:not(.eyebrow){color:#aab8cf;max-width:420px;line-height:1.7;font-size:16px}.intro-controls{justify-content:flex-start;margin:30px 0 0}.intro-controls .button{background:#d7edff;color:#0a1221;border:0;border-radius:3px;padding:16px 25px;box-shadow:0 0 35px #8acaff20}.intro-logo{display:none}.intro-decoration{justify-content:flex-start;margin:28px 0;gap:10px;flex-wrap:wrap}.intro-decoration span{font-size:12px;border:1px solid #9fceff30;color:#bdd3e8;background:#10203366;border-radius:3px;padding:8px 12px}.intro-caption{min-height:80px}
.intro-footer{padding:22px 4vw 28px;border-top:1px solid #b7d9ff18;background:#05091655;font-size:12px;color:#71839e;letter-spacing:1px}.intro-footer>span:nth-child(2){color:#9aabc2}.intro-progress{height:2px;background:#ffffff0c;bottom:0}.intro-progress span{background:#a4dfff;box-shadow:0 0 12px #8ed4ff}.intro.running[data-scene="1"] .eyebrow{color:#ffbc8e}.intro.running[data-scene="1"] h1 span{background-image:linear-gradient(120deg,#fff,#ffa975)}.intro.running[data-scene="2"] .eyebrow{color:#bcb3ff}.intro.running[data-scene="2"] h1 span{background-image:linear-gradient(120deg,#fff,#a79aff)}
.intro.closing{visibility:visible;opacity:0;filter:blur(14px);pointer-events:none}.intro.running .intro-main{animation:cinema-copy 1.2s cubic-bezier(.16,1,.3,1) both}
@keyframes cinema-copy{from{opacity:0;transform:translateY(40px);filter:blur(12px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@media(max-width:700px){.intro-header{padding:22px 20px}.intro-header .brand{font-size:14px;letter-spacing:3px}.intro-header .brand img{display:none}.intro-header>div{gap:12px}.intro-skip{padding:9px 12px}.intro-stage{align-items:flex-end;padding:0 25px 24px}.scene-number{left:25px;top:12px;font-size:12px}.intro-main{width:100%;padding:0;max-width:500px}.intro-main h1{font-size:clamp(46px,12vw,72px);letter-spacing:-2.5px;margin-bottom:16px}.intro-main .eyebrow{margin-bottom:15px;letter-spacing:2px}.intro-main>p:not(.eyebrow){font-size:14px;line-height:1.55}.intro-decoration{margin:18px 0;gap:6px}.intro-decoration span{padding:6px 8px}.intro-footer{padding:16px 25px 20px;display:flex;gap:8px;flex-direction:column;align-items:flex-start}.intro-footer>span:nth-child(2){font-size:12px}.intro-caption{min-height:65px}.intro-controls{margin:18px 0 0}.intro::after{background:linear-gradient(#03061280,transparent 15%,transparent 30%,#030612b0 60%,#030612f0)}}
@media(max-height:650px) and (min-width:701px){.intro-header{padding:20px 4vw}.intro-main h1{font-size:64px}.intro-main{padding:0}.intro-decoration{margin:15px 0}.intro-caption{min-height:0}.scene-number{top:0}}
.intro-main .eyebrow{justify-content:flex-start}.intro-main>p{margin-left:0;margin-right:0}.intro-main .intro-caption{margin:24px 0 0!important;color:#aab8cf!important}.intro.running .intro-main h1{font-size:clamp(54px,6.7vw,104px)}.intro-header>div{flex-direction:row;align-items:center}
@media(max-width:700px){.intro.running .intro-main h1{font-size:clamp(46px,12vw,72px)}.intro-stage{min-height:0}.intro-main .intro-caption{min-height:65px}.intro-header{align-items:center;gap:10px}}
/* Playback becomes a full-frame film; titles sit over the traveling camera. */
.intro.running .intro-stage{align-items:flex-end;justify-content:center;padding:0 5vw 24px}.intro.running .intro-main{width:100%;max-width:1000px;text-align:center;padding:0;transform:translate(var(--travel-x,0),var(--travel-y,0)) scale(var(--travel-scale,1));animation:film-title .9s ease both}.intro.running .intro-main .eyebrow{justify-content:center;margin:0 0 12px}.intro.running .intro-main h1{font-size:clamp(40px,4.8vw,70px);letter-spacing:-2px;margin:0 0 12px;line-height:1}.intro.running h1 br{display:none}.intro.running h1 span::before{content:' '}.intro.running .intro-decoration{display:none}.intro.running .intro-main .intro-caption{margin:0 auto!important;max-width:640px;min-height:48px;font-size:15px;color:#d0dced!important}.intro.running::after{background:linear-gradient(#030612a0,transparent 20%,transparent 45%,#030612dd 85%)}
@keyframes film-title{from{opacity:0;filter:blur(10px);translate:0 30px}to{opacity:1;filter:blur(0);translate:0 0}}
@media(max-width:700px){.intro.running .intro-main h1{font-size:40px;line-height:1.06}.intro.running h1 br{display:block}.intro.running .intro-main .intro-caption{font-size:13px;line-height:1.5;min-height:60px}.intro.running .intro-stage{padding:0 25px 22px}.intro.running .intro-main .eyebrow{font-size:12px}}
@media(prefers-reduced-motion:reduce){.intro-main,.intro.running .intro-main{animation:none;transform:none}.intro.closing{filter:none;transition:none}}