:root{--bg:#0A0F0C;--bg2:#101812;--fg:#EEF3EE;--mute:#8E9C92;--g:#7CC242;--g2:#5AA541;--line:rgba(255,255,255,.09);--light:#F5F7F2;--ink:#0F1A12}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--light);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit}.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.nav{position:fixed;inset:0 0 auto;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:14px 28px;color:var(--fg);transition:.3s}
.nav.s{background:rgba(10,15,12,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;letter-spacing:-.01em}
.brand img{width:34px;height:34px;border-radius:8px;background:#fff}
.nav nav{display:flex;gap:22px;align-items:center;font-size:14px}.nav nav a{text-decoration:none;opacity:.85}
.btn{display:inline-block;background:var(--g);color:#08110a;padding:13px 22px;border-radius:999px;font-weight:600;text-decoration:none;transition:.2s}
.btn:hover{background:#94d65a;transform:translateY(-1px)}.btn.sm{padding:8px 16px;opacity:1!important}
.btn.ghost{background:transparent;color:var(--fg);border:1px solid rgba(255,255,255,.25)}
.hero{position:relative;min-height:100vh;display:flex;align-items:center;background:var(--bg);color:var(--fg);overflow:hidden;padding:120px 0 80px}
.grid-bg{position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(ellipse at 70% 40%,#000 20%,transparent 75%)}
.glow{position:absolute;width:720px;height:720px;right:-180px;top:-120px;background:radial-gradient(circle,rgba(124,194,66,.35),rgba(255,120,30,.08) 45%,transparent 70%);filter:blur(20px);animation:pulse 8s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.08) translate(-20px,20px)}}
.hero .wrap{position:relative}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--mute);border:1px solid var(--line);padding:6px 14px;border-radius:999px;margin-bottom:28px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--g);box-shadow:0 0 12px var(--g);animation:blink 2s infinite}@keyframes blink{50%{opacity:.3}}
h1{font-size:clamp(44px,8vw,104px);line-height:.98;letter-spacing:-.045em;font-weight:700;max-width:12ch}
h1 em{font-style:normal;background:linear-gradient(90deg,var(--g),#c9f08f);-webkit-background-clip:text;color:transparent}
.lede{font-size:clamp(17px,2vw,21px);color:#b9c6bc;max-width:58ch;margin:28px 0 36px}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.chips{list-style:none;display:flex;gap:28px;flex-wrap:wrap;margin-top:56px;padding-top:24px;border-top:1px solid var(--line);color:var(--mute);font-size:14px}.chips b{color:var(--fg);font-weight:600}
.sec{padding:120px 0}.sec.dark{background:var(--bg);color:var(--fg)}
.kicker{font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--g2);margin-bottom:16px}.dark .kicker{color:var(--g)}
h2{font-size:clamp(32px,4.6vw,56px);line-height:1.04;letter-spacing:-.035em;font-weight:700;max-width:20ch}
.mute{color:var(--mute)}.sub{color:var(--mute);font-size:18px;margin-top:16px;max-width:56ch}
.two{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.prose p{font-size:18px;color:#3c4a40;margin-bottom:18px}
.layers{list-style:none;margin-top:48px;border-top:1px solid var(--line)}
.layers li{display:grid;grid-template-columns:80px 1fr 40px;align-items:center;gap:16px;padding:26px 8px;border-bottom:1px solid var(--line);transition:.25s}
.layers li:hover{background:rgba(124,194,66,.06);padding-left:20px}.layers .n{font:600 14px ui-monospace,monospace;color:var(--g)}
.layers h3{font-size:clamp(20px,2.4vw,28px);letter-spacing:-.02em}.layers p{color:var(--mute)}.arr{color:var(--g);font-size:22px}
.note{font-size:13px;color:var(--mute);margin-top:20px}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:48px}
.card{background:#fff;border:1px solid #e1e6df;border-radius:22px;padding:32px;transition:.25s}.card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -20px rgba(15,26,18,.25)}
.ill{width:100%;height:110px;color:var(--g2);margin-bottom:20px;background:var(--light);border-radius:14px;padding:10px}
.card h3{font-size:24px;letter-spacing:-.02em;margin-bottom:8px}.card p{color:#4a574e}
.tag{display:inline-block;margin-top:18px;font-size:12px;padding:5px 12px;border-radius:999px;background:#e8f3dd;color:#2f5f1c;font-weight:600}
.commit{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:22px;overflow:hidden;margin-top:48px}
.commit li{background:var(--bg2);padding:30px 26px}.commit h3{font-size:18px;margin-bottom:10px}.commit h3:before{content:"";display:block;width:24px;height:3px;background:var(--g);margin-bottom:18px}.commit p{color:var(--mute);font-size:15px}
.careers{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:center}
.panel{background:var(--bg);color:var(--fg);border-radius:22px;padding:36px;background-image:radial-gradient(circle at 100% 0,rgba(124,194,66,.3),transparent 60%)}.panel p{margin-bottom:22px;color:#b9c6bc}
.contact div{padding:18px 0;border-bottom:1px solid var(--line)}.contact dt{font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:var(--mute)}.contact dd{font-size:20px;margin-top:4px}.contact a{color:var(--g)}
.foot{background:#060a07;color:var(--fg);padding:56px 0}.foot .tl{font-size:22px;font-weight:600;margin:18px 0 8px}.small{font-size:13px}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s,transform .7s}.reveal.in{opacity:1;transform:none}
@media (max-width:760px){.nav nav a:not(.btn){display:none}.two,.cards,.careers{grid-template-columns:1fr;gap:28px}.sec{padding:80px 0}.layers li{grid-template-columns:44px 1fr;}.arr{display:none}.hero{min-height:auto;padding:130px 0 70px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
/* ---- motion v2 ---- */
#sparks{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.grid-bg{animation:gridpan 22s linear infinite}
@keyframes gridpan{to{background-position:56px 56px,56px 56px}}
.glow{will-change:transform}
.molten{position:absolute;left:-10%;right:-10%;bottom:-40px;height:220px;background:linear-gradient(90deg,transparent,rgba(255,110,20,.22),rgba(255,190,60,.18),rgba(124,194,66,.2),transparent);background-size:200% 100%;filter:blur(40px);animation:flow 12s ease-in-out infinite alternate;pointer-events:none}
@keyframes flow{to{background-position:100% 0}}
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em}
.split .w>span{display:inline-block;transform:translateY(110%) rotate(4deg);opacity:0;transition:transform .9s cubic-bezier(.2,.8,.2,1),opacity .9s;transition-delay:calc(var(--i)*110ms + 150ms)}
.split.go .w>span{transform:none;opacity:1}
.split em .w>span{background:linear-gradient(90deg,var(--g),#ffb347,#c9f08f,var(--g));background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 6s linear infinite}
@keyframes sheen{to{background-position:300% 0}}
.intro{opacity:0;transform:translateY(16px);transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1)}
.go-intro .intro{opacity:1;transform:none}
.go-intro .eyebrow{transition-delay:.05s}.go-intro .lede{transition-delay:.75s}.go-intro .cta{transition-delay:.95s}.go-intro .chips{transition-delay:1.15s}
.scrollcue{position:absolute;left:50%;bottom:28px;width:22px;height:36px;border:1.5px solid rgba(255,255,255,.3);border-radius:12px}
.scrollcue span{position:absolute;left:50%;top:7px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:var(--g);animation:cue 1.8s infinite}
@keyframes cue{60%{transform:translateY(12px);opacity:0}100%{opacity:0}}
.ticker{background:var(--g);color:#08110a;overflow:hidden;white-space:nowrap;padding:14px 0;font-weight:700;letter-spacing:-.01em}
.ticker .track{display:inline-flex;gap:28px;animation:marq 38s linear infinite}.ticker i{font-style:normal;opacity:.5}
@keyframes marq{to{transform:translateX(-50%)}}
.reveal{transform:translateY(34px);filter:blur(6px);transition:opacity .9s,transform .9s cubic-bezier(.2,.8,.2,1),filter .9s;transition-delay:var(--d,0s)}
.reveal.in{filter:none}
.flow{position:relative;padding-left:44px;margin-top:48px}.flow .layers{margin-top:0}
.rail{position:absolute;left:10px;top:0;bottom:0;width:2px;background:var(--line)}
.rail .fill{position:absolute;inset:0 0 auto;height:0;background:linear-gradient(var(--g),#ffb347);box-shadow:0 0 14px var(--g)}
.rail .ingot{position:absolute;left:-6px;top:0;width:14px;height:14px;border-radius:50%;background:#ffd27a;box-shadow:0 0 18px 6px rgba(255,150,40,.6);transform:translateY(var(--y,0));opacity:0;transition:opacity .4s}
.flow.on .ingot{opacity:1}
.stage{transform:translateX(-30px)}.stage .n{transition:color .4s,text-shadow .4s}
.stage.lit .n{color:#ffd27a;text-shadow:0 0 12px rgba(255,170,60,.8)}
.stage .arr{transition:transform .3s}.stage:hover .arr{transform:translateX(8px)}
.draw{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s cubic-bezier(.6,0,.2,1)}
.in .draw{stroke-dashoffset:0}
.in .coil g circle:nth-child(2){transition-delay:.2s}.in .coil g circle:nth-child(3){transition-delay:.4s}.in .coil g circle:nth-child(4){transition-delay:.6s}.in .coil path{transition-delay:.9s}
.coil g circle{transform-origin:40px 45px}.in .coil g circle:nth-child(odd){animation:spin 14s linear 1.8s infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.bars path.draw{transition-duration:1.2s}.in .bars path.draw{transition-delay:.15s}
.tick{opacity:0;transition:opacity .6s 1.2s}.in .tick{opacity:1;animation:dash 3s linear 1.8s infinite}
@keyframes dash{to{stroke-dashoffset:-16}}
.card{transform-style:preserve-3d;will-change:transform}
.card.reveal.in{transition:opacity .9s,transform .25s ease-out,filter .9s,box-shadow .25s}
.commit li{position:relative;transition:background .3s}.commit li:hover{background:#15211a}
.commit h3:before{width:0;transition:width .8s cubic-bezier(.2,.8,.2,1) .3s;transition-delay:calc(var(--d,0s) + .3s)}
.commit li.in h3:before{width:24px}
.btn{position:relative;overflow:hidden}.btn:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45),transparent 70%);transform:translateX(-120%);transition:transform .6s}.btn:hover:after{transform:translateX(120%)}
.panel{background-size:160% 160%;animation:pan 10s ease-in-out infinite alternate}@keyframes pan{to{background-position:100% 100%}}
h2{transition:opacity .9s,transform .9s cubic-bezier(.2,.8,.2,1)}
.js h2:not(.in-h){opacity:0;transform:translateY(24px)}
@media (prefers-reduced-motion:reduce){.split .w>span,.intro,.js h2:not(.in-h),.stage,.reveal{opacity:1!important;transform:none!important;filter:none!important}.draw{stroke-dashoffset:0}.tick{opacity:1}.commit h3:before{width:24px}#sparks,.scrollcue{display:none}.rail .fill{height:100%}}
