*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--fg);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img,canvas{display:block}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px}
section{position:relative;padding:120px 0}

#intro{position:fixed;inset:0;background:var(--bg);z-index:100;display:flex;align-items:flex-end;justify-content:space-between;padding:40px;transition:transform 1s cubic-bezier(.77,0,.18,1)}
#intro.done{transform:translateY(-100%)}
#intro b{font-size:clamp(60px,12vw,180px);font-weight:500;letter-spacing:-.04em;line-height:.8;font-family:var(--display)}
#intro span{font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
#glow{position:fixed;top:0;left:0;width:400px;height:400px;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(circle,var(--glow) 0%,transparent 65%);mix-blend-mode:var(--blend,screen);opacity:.7}
#progress{position:fixed;top:0;left:0;right:0;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:0 50%;z-index:60}

nav.top{position:fixed;top:0;left:0;right:0;z-index:50;padding:20px 0;transition:background .3s,backdrop-filter .3s}
nav.top.solid{background:var(--navbg);backdrop-filter:blur(14px)}
nav.top .wrap{display:flex;align-items:center;justify-content:space-between;max-width:1240px;gap:40px}
.logo{font-weight:600;letter-spacing:-.02em;font-size:18px;display:flex;align-items:center;gap:10px}
.logo i{display:inline-block;flex:none;height:var(--s,30px);width:calc(var(--s,30px) * 2 / 3);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='12 -6 42 63'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23d6f3ff'/%3E%3Cstop offset='1' stop-color='%234f7bff'/%3E%3C/linearGradient%3E%3ClinearGradient id='l' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%235fe0ff'/%3E%3Cstop offset='1' stop-color='%232a4fd8'/%3E%3C/linearGradient%3E%3Cfilter id='f' x='-50%25' y='-50%25' width='200%25' height='200%25'%3E%3CfeGaussianBlur stdDeviation='1.6' result='b'/%3E%3CfeMerge%3E%3CfeMergeNode in='b'/%3E%3CfeMergeNode in='SourceGraphic'/%3E%3C/feMerge%3E%3C/filter%3E%3C/defs%3E%3Cpath d='M25 8h14M27 8v16L14 47q-2 5 3 7h30q5-2 3-7L37 24V8' fill='none' stroke='url(%23g)' stroke-width='2.6' stroke-linejoin='round' stroke-linecap='round'/%3E%3Cpath d='M15 46Q23 40 32 44T49 44L50 48q1 5-3 7H17q-4-2-3-7z' fill='url(%23l)'/%3E%3Cg filter='url(%23f)' fill='%23fff'%3E%3Cpath d='M34 -3.5Q34 1 38.5 1Q34 1 34 5.5Q34 1 29.5 1Q34 1 34 -3.5Z'/%3E%3Cpath d='M29 24.4Q29 27 31.6 27Q29 27 29 29.6Q29 27 26.4 27Q29 27 29 24.4Z'/%3E%3Cpath d='M37 30.8Q37 33 39.2 33Q37 33 37 35.2Q37 33 34.8 33Q37 33 37 30.8Z'/%3E%3Cpath d='M25 31.6Q25 33 26.4 33Q25 33 25 34.4Q25 33 23.6 33Q25 33 25 31.6Z'/%3E%3Cpath d='M31 36.8Q31 38 32.2 38Q31 38 31 39.2Q31 38 29.8 38Q31 38 31 36.8Z'/%3E%3C/g%3E%3C/svg%3E") 0 0/100% 100% no-repeat}
nav.top ul{display:flex;gap:32px;list-style:none;font-size:14px;color:var(--mute)}
nav.top ul a:hover{color:var(--fg)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:999px;font-weight:500;font-size:15px;background:var(--accent);color:var(--onaccent);transition:transform .25s,box-shadow .25s;cursor:pointer;border:0;font-family:inherit}
.btn:hover{box-shadow:0 10px 40px -8px var(--accent)}
.btn.ghost{background:transparent;color:var(--fg);border:1px solid var(--line)}
.btn.ghost:hover{box-shadow:none;border-color:var(--fg)}

.w{display:inline-block;overflow:hidden;vertical-align:bottom;padding:.08em .14em .26em;margin:-.08em -.14em -.26em}
.w>span{display:inline-block;transform:translateY(110%);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.in .w>span,[data-split].in .w>span{transform:none}
body:not(.ready) .hero [data-split] .w>span{transform:translateY(110%)}
body.ready .hero [data-split] .w>span{transform:none}
[data-reveal]{opacity:0;transform:translateY(40px);transition:opacity .9s,transform .9s cubic-bezier(.2,.8,.2,1)}
[data-reveal].in{opacity:1;transform:none}
[data-tilt]{transition:transform .25s ease-out;will-change:transform;position:relative;overflow:hidden}
[data-tilt]::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(400px circle at var(--mx,50%) var(--my,0%),var(--shine),transparent 50%);opacity:0;transition:opacity .3s}
[data-tilt]:hover::after{opacity:1}

.marquee{overflow:hidden;white-space:nowrap;border-block:1px solid var(--line);padding:22px 0}
.marquee div{display:inline-block;animation:mq 30s linear infinite;font-size:20px;color:var(--mute)}
.marquee span{margin:0 28px}
.marquee span::after{content:"\2726";margin-left:56px;color:var(--accent)}
@keyframes mq{to{transform:translateX(-50%)}}
.eyebrow{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:22px;display:block}
.cursor{display:inline-block;width:2px;height:1em;background:var(--accent);margin-left:4px;vertical-align:-.1em;animation:bl 1s steps(1) infinite}
@keyframes bl{50%{opacity:0}}
.badge-note{position:fixed;bottom:16px;left:16px;z-index:70;font:12px var(--sans);background:var(--fg);color:var(--bg);padding:8px 14px;border-radius:999px;opacity:.85}
.badge-note a{text-decoration:underline;margin-left:6px}
footer{padding:48px 0;border-top:1px solid var(--line);color:var(--mute);font-size:14px}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
@media(max-width:800px){nav.top ul{display:none}section{padding:80px 0}.grid4,.grid3{grid-template-columns:1fr!important}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.snd{background:transparent;border:1px solid var(--line);color:var(--mute);border-radius:99px;padding:8px 14px;font:500 12px var(--sans);cursor:pointer;transition:.25s}
.snd:hover{color:var(--fg);border-color:var(--accent)}.snd.off{opacity:.55}
.snd.icon{width:42px;height:42px;padding:0;display:inline-grid;place-items:center;border-radius:50%}
.snd.icon svg{width:18px;height:18px}
.navr{display:flex;gap:10px;align-items:center}
.kbd{border:1px solid var(--line);background:transparent;color:var(--mute);border-radius:99px;padding:8px 14px;font:500 12px var(--sans);cursor:pointer}
.kbd:hover{color:var(--fg);border-color:var(--accent)}
.pal{position:fixed;inset:0;background:rgba(3,4,10,.7);backdrop-filter:blur(10px);z-index:200;display:none;align-items:flex-start;justify-content:center;padding-top:16vh}
.pal.open{display:flex}
.pal-box{width:min(620px,92vw);background:#0b0e1c;border:1px solid #2a3157;border-radius:18px;box-shadow:0 0 120px -20px rgba(124,140,255,.6);overflow:hidden;animation:palin .25s cubic-bezier(.2,.9,.3,1.1)}
@keyframes palin{from{transform:translateY(-14px) scale(.97);opacity:0}}
.pal-in{width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--fg);font:400 18px var(--sans);padding:22px 24px;outline:0}
.pal-item{display:flex;justify-content:space-between;gap:16px;padding:14px 24px;cursor:pointer;color:var(--mute)}
.pal-item b{color:var(--fg);font-weight:500}.pal-item span{font-size:13px}
.pal-item.on,.pal-item:hover{background:rgba(124,140,255,.14)}
.pal-empty{padding:24px;color:var(--mute)}
.pal-foot{padding:12px 24px;border-top:1px solid var(--line);font-size:12px;color:var(--mute)}
.step{opacity:.35;transition:opacity .5s,padding .4s}.step.active{opacity:1}.step.active .n{color:var(--accent)}
canvas.net{position:absolute;inset:0;width:100%;height:100%}
nav.top a,nav.top button{white-space:nowrap}
@media(max-width:1150px){nav.top ul{display:none}}
@media(max-width:560px){.kbd{display:none}}