.intro{position:relative;height:460vh;background:#050816;color:#fff}
.intro-sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#070b22 url(assets/home/intro-poster.jpg) center/cover no-repeat}
.intro video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease}
.intro video.on{opacity:1}
.intro-sticky::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(120% 90% at 50% 45%,rgba(3,5,16,0) 35%,rgba(3,5,16,.7) 100%),linear-gradient(180deg,rgba(3,5,16,.5),rgba(3,5,16,0) 28%,rgba(3,5,16,0) 72%,rgba(3,5,16,.45))}
.intro-sticky>*:not(video){position:absolute;z-index:2}
.intro-logo{top:clamp(18px,3vw,34px);left:50%;transform:translateX(-50%)}
.intro-logo img{height:52px;width:auto;display:block;filter:drop-shadow(0 2px 14px rgba(0,0,0,.45))}
.intro-stage{inset:0;display:grid;place-items:center;text-align:center;padding:0 clamp(20px,6vw,120px);pointer-events:none}
.intro-line{grid-area:1/1;margin:0;font-size:clamp(34px,6.4vw,92px);line-height:1.04;letter-spacing:-.045em;font-weight:700;opacity:0;transform:translateY(24px) scale(.98);filter:blur(10px);transition:opacity .6s ease,transform .7s cubic-bezier(.2,.8,.2,1),filter .6s ease;max-width:1100px;text-shadow:0 2px 40px rgba(0,0,20,.6)}
.intro-line.on{opacity:1;transform:none;filter:none}
.intro-line.sm{font-size:clamp(26px,4.6vw,66px)}
.intro-bar{left:50%;bottom:clamp(54px,7vh,84px);transform:translateX(-50%);width:min(280px,60vw);height:3px;border-radius:3px;background:rgba(255,255,255,.22);overflow:hidden}
.intro-bar i{display:block;height:100%;width:0;background:#fff;border-radius:3px}
.intro-hint{margin:0;left:50%;bottom:clamp(20px,3.2vh,34px);transform:translateX(-50%);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.75);transition:opacity .5s;animation:introHint 2s ease-in-out infinite}
@keyframes introHint{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,7px)}}
.intro-skip{top:clamp(16px,2.6vw,30px);right:clamp(16px,3vw,36px);appearance:none;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.12);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;font:inherit;font-size:14px;font-weight:600;padding:10px 18px;border-radius:999px;cursor:pointer;transition:background .2s}
.intro-skip:hover{background:rgba(255,255,255,.24)}
.intro-skip:focus-visible{outline:2px solid #6bb8ff;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.intro{display:none!important}}
html:not(.nx-intro) .intro{display:none}

.intro.done{position:fixed;inset:0;height:100vh;height:100svh;z-index:2000;opacity:0;pointer-events:none;transition:opacity .8s ease}