:root{
  --void:#041734;--blue:#0075ff;--cyan:#008ef0;--hub:#002652;--orbit:#0f172a;--deck:#1a1f36;
  --hull:#1f2937;--steel:#374151;--console:#445458;--mute:#64748b;--mist:#a7babe;--halo:#e5e7eb;--white:#fff;--green:#4ade80;
  --inter:'Inter',ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --max:1200px;--r-btn:8px;--r-card:12px;
  --shadow-xl:rgba(0,0,0,.25) 0 25px 50px -12px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--void);color:var(--white);font-family:var(--inter);font-feature-settings:"ss01","cv11";font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,p,ul{margin:0;padding:0}
ul{list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
em{font-style:normal;color:var(--blue)}
.mono{font-family:var(--mono)}
.c-mute{color:var(--mute)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:6px}

/* nav */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.nav.is-stuck{background:rgba(4,23,52,.82);backdrop-filter:blur(14px);border-color:rgba(55,65,81,.6)}
.nav__inner{max-width:1360px;margin:0 auto;padding:0 24px;height:64px;display:flex;align-items:center;gap:32px}
.brand{display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px;letter-spacing:-.01em}
.brand b{font-weight:300}
.brand img{display:block;width:auto}
.nav__links{display:flex;gap:4px;margin-right:auto}
.nav__links a{padding:8px 14px;font-size:14px;font-weight:500;color:#d7e2f0;border-radius:8px;transition:color .2s,background .2s}
.nav__links a:hover{color:#fff;background:rgba(255,255,255,.06)}
.nav__actions{display:flex;align-items:center;gap:16px}
.lang{display:flex;border:1px solid var(--steel);border-radius:9999px;padding:2px}
.lang button{padding:3px 11px;font-size:11px;font-weight:500;letter-spacing:.05em;border-radius:9999px;color:var(--mist);transition:.2s}
.lang button[aria-pressed=true]{background:#fff;color:var(--void)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border-radius:var(--r-btn);font-size:14px;font-weight:500;border:1px solid transparent;transition:transform .2s,background .2s,border-color .2s;white-space:nowrap}
.btn--sm{padding:7px 16px}
.btn--primary{background:#fff;color:var(--void)}
.btn--primary:hover{background:#e8f0fb;transform:translateY(-1px)}
.btn--ghost{border-color:#cfdfec66;color:#fff}
.btn--ghost:hover{border-color:#cfdfec;background:rgba(255,255,255,.05)}

.pill{display:inline-block;padding:4px 10px;border-radius:9999px;font-size:10px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;background:var(--orbit);border:1px solid var(--steel);color:var(--mist)}
.pill--green{background:rgba(74,222,128,.14);border-color:rgba(74,222,128,.35);color:var(--green)}

/* type */
.display{font-weight:300;font-size:clamp(36px,5vw,60px);line-height:1.04;letter-spacing:-.04em;max-width:19ch;margin:0 auto}
.h2{font-weight:300;font-size:clamp(32px,4.4vw,52px);line-height:1.12;letter-spacing:-.03em;max-width:20ch}
.sub,.lead{color:var(--mist);font-size:18px;max-width:56ch;margin-top:20px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--mist);margin-bottom:24px}
.dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(74,222,128,.6);animation:ping 2s infinite}
@keyframes ping{70%{box-shadow:0 0 0 9px rgba(74,222,128,0)}100%{box-shadow:0 0 0 0 rgba(74,222,128,0)}}

/* hero */
.hero{position:relative;padding:112px 0 0;text-align:center;overflow:hidden}
.hero__text{position:relative;z-index:3;padding:0 24px}
.hero .lead{margin:18px auto 0;color:#9fb3c8;font-size:16px;max-width:58ch}
.cta-row{display:flex;gap:12px;justify-content:center;margin-top:24px}
.cmd{display:inline-flex;align-items:center;gap:14px;margin-top:20px;padding:8px 16px;background:rgba(15,23,42,.8);border:1px solid var(--steel);border-radius:12px;font-size:12px;color:#fff;transition:border-color .2s}
.cmd:hover{border-color:var(--blue)}
.cmd svg{color:var(--mute);stroke:currentColor}
.cmd.copied::after{content:attr(data-msg);color:var(--green);font-size:11px}
.stage{position:relative;height:clamp(300px,32vw,400px);margin-top:0}
.stage canvas{position:absolute;inset:0;width:100%;height:100%}
.stage__chips{position:absolute;inset:0;pointer-events:none}
.chip{position:absolute;width:40px;height:40px;margin:-20px 0 0 -20px;display:grid;place-items:center;border-radius:12px;background:rgba(15,23,42,.9);border:1px solid var(--steel);color:#bfdbfe;animation:bob 6s ease-in-out infinite;box-shadow:var(--shadow-xl)}
.chip svg{width:20px;height:20px}
.chip:nth-child(even){animation-delay:-3s;color:var(--green)}
.chip:nth-child(3n){animation-duration:8s;color:#fde047}
@keyframes bob{50%{transform:translateY(-9px)}}
.core{position:absolute;left:50%;top:50%;width:96px;height:96px;margin:-48px 0 0 -48px;z-index:2;filter:drop-shadow(0 0 30px rgba(0,117,255,.5))}
.core img{display:block;position:relative}
.core__ring{position:absolute;inset:-6px;border:1px solid rgba(0,117,255,.5);border-radius:30px;animation:ring 3.2s ease-out infinite}
.core__ring--2{animation-delay:1.6s}
@keyframes ring{0%{transform:scale(.8);opacity:.9}100%{transform:scale(2.2);opacity:0}}
.trust{position:relative;z-index:3;padding:0 24px 72px;margin-top:-16px}
.trust__label{font-size:11px;letter-spacing:.05em;color:var(--mist);display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap}
.trust__list{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 44px;max-width:900px;margin:30px auto 0}
.trust__list li{font-size:19px;font-weight:500;letter-spacing:-.02em;color:#c7d2e0;opacity:.7;transition:opacity .3s}
.trust__list li:hover{opacity:1}
.trust__list li:nth-child(3n){font-weight:300;font-style:italic}
.trust__list li:nth-child(4n){font-family:var(--mono);font-size:15px;font-weight:400}

/* sections */
.section{padding:104px 0}
.section--alt{background:var(--orbit);border-block:1px solid var(--hull)}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:56px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:56px}
.card{background:var(--orbit);border:1px solid var(--steel);border-radius:var(--r-card);padding:24px;box-shadow:rgba(0,0,0,.25) 0 4px 12px,rgba(255,255,255,.04) 0 1px 0 inset;transition:border-color .3s,transform .3s}
.card:hover{border-color:#3b82f6aa;transform:translateY(-4px)}
.card h3{font-size:20px;font-weight:500;margin:22px 0 8px;letter-spacing:-.01em}
.card p{color:#8aa0b8;font-size:15px}
.card--flat{background:var(--deck)}
.card--flat h3{margin-top:28px}
.num{font-size:12px;color:var(--blue)}
.card__vis{height:110px;border-radius:8px;background:var(--void);border:1px solid var(--hull);position:relative;overflow:hidden;display:grid;place-items:center}

/* card visuals */
.vis-pay{display:flex;align-items:flex-end;justify-content:center;gap:10px;padding:16px}
.vis-pay i{width:14px;background:var(--blue);border-radius:3px;height:30%;animation:eq 2.4s ease-in-out infinite}
.vis-pay i:nth-child(2){animation-delay:-.6s;background:var(--green)}
.vis-pay i:nth-child(3){animation-delay:-1.2s}
.vis-pay i:nth-child(4){animation-delay:-1.8s;background:var(--green)}
@keyframes eq{0%,100%{height:25%}50%{height:90%}}
.mini-card{width:96px;height:60px;border-radius:8px;border:1px solid var(--blue);background:var(--hub);position:relative;animation:tilt 5s ease-in-out infinite}
.mini-card b{position:absolute;left:10px;top:10px;width:16px;height:12px;border-radius:3px;background:#fde047}
.mini-card u{position:absolute;left:10px;bottom:10px;width:50px;height:4px;border-radius:2px;background:#6094c1}
@keyframes tilt{0%,100%{transform:perspective(300px) rotateY(-18deg) rotateX(6deg)}50%{transform:perspective(300px) rotateY(18deg) rotateX(-4deg)}}
.vis-sys svg{width:78%;fill:none;stroke:var(--blue);stroke-width:1.5}
.vis-sys path{stroke-dasharray:6 6;animation:dash 1.4s linear infinite}
.vis-sys circle{fill:var(--void);stroke:var(--green)}
@keyframes dash{to{stroke-dashoffset:-24}}
.vis-net span{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--green)}
.vis-net span:nth-child(1){left:14%;top:25%}.vis-net span:nth-child(2){left:14%;bottom:25%}.vis-net span:nth-child(3){right:14%;top:50%}
.vis-net em{width:14px;height:14px;border-radius:4px;background:var(--blue);animation:pulse 2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 12px rgba(0,117,255,0)}0%{box-shadow:0 0 0 0 rgba(0,117,255,.6)}}

/* workflow */
.wf>*{min-width:0}
.wf{display:grid;grid-template-columns:5fr 6fr;gap:64px;margin-top:56px;align-items:start}
.tabs{display:flex;flex-direction:column;gap:4px;border-left:1px solid var(--hull)}
.tabs button{position:relative;display:block;width:100%;text-align:left;padding:6px 0 6px 20px;font-size:clamp(28px,3.4vw,40px);font-weight:300;letter-spacing:-.03em;color:#2f4460;transition:color .3s}
.tabs button:hover{color:#6e87a6}
.tabs button[aria-selected=true]{color:#fff}
.tabs button i{position:absolute;left:-1px;top:0;bottom:0;width:2px;background:var(--blue);transform:scaleY(0);transform-origin:top}
.tabs button[aria-selected=true] i{transform:scaleY(1);animation:prog var(--dur,6s) linear}
@keyframes prog{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.wf__desc{margin-top:28px;color:var(--mist);max-width:44ch;min-height:72px}
.term{margin-top:20px;background:var(--void);border:1px solid var(--hull);border-radius:var(--r-card);padding:18px 20px;font-family:var(--mono);font-size:12px;line-height:1.63;min-height:170px;overflow:hidden}
.term div{white-space:pre;opacity:0;transform:translateY(4px);animation:line .4s forwards}
@keyframes line{to{opacity:1;transform:none}}
.k{color:#d8b4fe}.s{color:#4fd785}.n{color:#fde047}.f{color:#bfdbfe}.cm{color:#6094c1}

.win{background:#fff;color:#0f172a;border-radius:16px;box-shadow:var(--shadow-xl);overflow:hidden;position:relative;height:500px;transform:perspective(1400px) rotateY(-3deg);transition:transform .6s}
.win:hover{transform:perspective(1400px) rotateY(0)}
.win__bar{display:flex;align-items:center;gap:6px;padding:12px 16px;background:#f3f6fa;border-bottom:1px solid #e5e7eb}
.win__bar i{width:10px;height:10px;border-radius:50%;background:#d5dbe3}
.win__bar span{margin-left:12px;font-size:11px;color:#64748b;flex:1}
.win__bar .pill--green{color:#15803d;background:#dcfce7;border-color:#bbf7d0}
.win__note{position:absolute;bottom:10px;right:16px;font-size:10px;color:#94a3b8}
.pane{position:absolute;inset:44px 0 30px;padding:24px;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .4s,transform .4s,visibility .4s}
.pane.is-on{opacity:1;visibility:visible;transform:none}
.wf__right .win{position:relative}
.issue{display:grid;gap:22px}
.plastic{position:relative;height:190px;max-width:320px;border-radius:16px;background:#041734;color:#fff;padding:20px;overflow:hidden;box-shadow:0 18px 30px -12px rgba(4,23,52,.6)}
.plastic::before{content:"";position:absolute;width:260px;height:260px;border:1px solid rgba(0,117,255,.5);border-radius:50%;right:-80px;top:-100px;box-shadow:0 0 0 30px rgba(0,117,255,.07),0 0 0 60px rgba(0,117,255,.05)}
.plastic::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.14) 50%,transparent 60%);transform:translateX(-100%);animation:sheen 4s ease-in-out infinite}
@keyframes sheen{60%,100%{transform:translateX(100%)}}
.plastic__chip{display:block;width:34px;height:26px;border-radius:5px;background:#fde047}
.plastic__nova{position:absolute;right:20px;top:20px;font-weight:600;letter-spacing:.2em;font-size:13px}
.plastic__pan{position:absolute;left:20px;bottom:46px;font-size:15px;letter-spacing:.08em}
.plastic__meta{position:absolute;left:20px;bottom:20px;font-size:10px;color:#a7babe}
.kv{display:grid;gap:0}
.kv li{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #eef1f5;font-size:13px}
.kv span{color:#64748b}.kv b{font-weight:500}
.kv--row{grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.kv--row li{flex-direction:column;align-items:flex-start;border:1px solid #e5e7eb;border-radius:10px;padding:12px}
.kv--row b{font-size:20px;font-weight:600}
.feed-h{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:500;margin-bottom:12px}
.feed{display:grid;gap:0;overflow:hidden;height:340px;align-content:start}
.feed li{display:grid;grid-template-columns:30px 1fr auto auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #eef1f5;font-size:13px;animation:drop .5s}
.feed li .ic{width:30px;height:30px;border-radius:8px;background:#eff6ff;color:#0075ff;display:grid;place-items:center}
.feed li .ic svg{width:16px;height:16px}
.feed li small{display:block;color:#94a3b8;font-size:11px}
.feed li .ok{background:#dcfce7;color:#15803d;font-size:10px;font-weight:500;padding:3px 8px;border-radius:9999px;letter-spacing:.05em}
.feed li .no{background:#fee2e2;color:#b91c1c}
@keyframes drop{from{opacity:0;transform:translateY(-14px)}}
.graph{width:100%;height:auto}
.g-lines path{stroke:#dbe4ef;stroke-width:1.5}
.g-flow path{stroke:#0075ff;stroke-width:2;stroke-dasharray:4 14;stroke-linecap:round;animation:dash 1.2s linear infinite}
.g-node rect{fill:#f8fafc;stroke:#dbe4ef}
.g-txt text{font-size:10px;fill:#334155;font-family:var(--inter)}
.g-core{fill:#fff;font-size:10px;font-weight:600;letter-spacing:.1em}
.bars{display:flex;align-items:flex-end;gap:5px;height:170px;padding:8px 0;border-bottom:1px solid #eef1f5}
.bars i{flex:1;background:#4ade80;border-radius:3px 3px 0 0;transform-origin:bottom;animation:grow 1s both}
.bars i:nth-child(3n){background:#86efac}
@keyframes grow{from{transform:scaleY(0)}}

/* band */
.band .h2{max-width:24ch}
.band .h2 em{white-space:nowrap}

/* stack (light section) */
.section--light{background:linear-gradient(#fff,#e6eef8);color:#0f172a;padding-bottom:96px}
.section--light .h2{color:#0b1c3a}
.section--light .sub{color:#475569}
.hscroll{display:flex;gap:16px;overflow-x:auto;padding:56px max(24px,calc((100vw - var(--max))/2 + 24px)) 24px;scroll-snap-type:x proximity;scroll-padding-inline:max(24px,calc((100vw - var(--max))/2 + 24px));scrollbar-width:thin;cursor:grab}
.hscroll.drag{cursor:grabbing;scroll-snap-type:none}
.lcard{flex:0 0 280px;scroll-snap-align:start;background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:24px;min-height:280px;display:flex;flex-direction:column;box-shadow:0 10px 15px -3px rgba(15,23,42,.06);transition:transform .3s,box-shadow .3s}
.lcard:hover{transform:translateY(-6px);box-shadow:0 25px 40px -12px rgba(0,117,255,.25)}
.lcard svg{color:var(--blue);stroke:currentColor}
.lcard h3{font-size:18px;font-weight:600;margin:56px 0 8px}
.lcard p{font-size:14px;color:#64748b}
.lcard a{margin-top:auto;padding-top:20px;font-size:13px;font-weight:500;color:var(--blue)}
.lcard a::after{content:" →"}

/* models */
.models{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.mlist{display:grid;gap:0;border-top:1px solid var(--steel)}
.mlist li{display:grid;grid-template-columns:80px 1fr;column-gap:20px;padding:24px 0;border-bottom:1px solid var(--steel)}
.mlist .pill{grid-row:span 2;align-self:start;text-align:center}
.mlist h3{font-size:20px;font-weight:500}
.mlist p{color:#8aa0b8;font-size:15px;margin-top:4px}

/* cta */
.cta{position:relative;padding:120px 0 200px;border-top:1px solid var(--hull);overflow:hidden;background:var(--orbit)}
.cta__grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;position:relative;z-index:2}
.form{display:grid;gap:14px;background:rgba(4,23,52,.85);border:1px solid var(--steel);border-radius:var(--r-card);padding:24px;backdrop-filter:blur(8px)}
.form label{display:grid;gap:6px;font-size:12px;color:var(--mist);font-weight:500}
.form input,.form textarea{font:inherit;font-size:14px;color:#fff;background:var(--orbit);border:1px solid var(--steel);border-radius:8px;padding:10px 12px;resize:vertical;transition:border-color .2s}
.form input:focus,.form textarea:focus{outline:0;border-color:var(--blue)}
.form .invalid{border-color:#f87171}
.hp{position:absolute;left:-9999px;opacity:0;height:0}
.form__err{color:#f87171;font-size:13px}
.form__ok{color:var(--green);font-size:13px}
.wave{position:absolute;inset:auto 0 0;height:180px;display:flex;align-items:flex-end;gap:6px;padding:0 6px;z-index:1;opacity:.9}
.wave i{flex:1;min-width:2px;background:var(--blue);opacity:.55;border-radius:2px 2px 0 0;height:20%}

.foot{border-top:1px solid var(--hull);padding:40px 0;background:var(--void)}
.foot__in{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap}
.foot p{font-size:13px;color:var(--mist)}
.foot__brand p{margin-top:12px}
.foot__legal{text-align:right;display:grid;gap:4px}

/* reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.reveal.in{opacity:1;transform:none}
.display .w{display:inline-block;opacity:0;filter:blur(12px);transform:translateY(14px);animation:wi .9s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(var(--i)*70ms + 150ms)}
@keyframes wi{to{opacity:1;filter:none;transform:none}}

@media (max-width:1000px){
  .grid4{grid-template-columns:1fr 1fr}.grid3{grid-template-columns:1fr}
  .wf{grid-template-columns:1fr;gap:40px}.models,.cta__grid{grid-template-columns:1fr;gap:40px}
  .nav__links{display:none}.nav__actions{margin-left:auto}
  .win{transform:none}
}
@media (max-width:620px){
  .grid4{grid-template-columns:1fr}
  .hero{padding-top:110px}.cta-row{flex-direction:column;align-items:stretch;max-width:280px;margin-inline:auto}
  .brand img{height:42px}.nav__inner{gap:12px}
  .foot__legal{text-align:left}.section{padding:72px 0}
  .cmd{max-width:100%;font-size:10px;padding:8px 12px}.cmd .mono{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .chip{width:32px;height:32px;margin:-16px 0 0 -16px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}.reveal{opacity:1;transform:none}.display .w{opacity:1;filter:none;transform:none}
}