
:root{--acc:#8CC63F;--acc-l:#4E9A3E;--bg:#171717;--fg:#F0F0F8;--mut:#8A8A8A;--cream:#FFF9F1}
:root:not([data-theme="light"]){--bg:#171717}
*{box-sizing:border-box}
html{scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--bg);color:var(--fg);font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button,input{font-family:inherit}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:1200px;margin:0 auto;padding:0 32px}
.lbl{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--mut);margin:0}
.acc{color:var(--acc)}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.03em}
.p{font-size:14px;line-height:1.75;color:#A0A0A0;margin:0}

/* dot grid, fixed like the reference canvas */
.grid{position:fixed;inset:0;z-index:-2;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.09) 1px,transparent 1.2px);background-size:22px 22px}

/* preloader */
.pre{position:fixed;inset:0;z-index:100;background:#171717;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:56px;transition:opacity .7s ease,visibility .7s}
.pre.off{opacity:0;visibility:hidden;pointer-events:none}
.pre .num{font-size:120px;font-weight:800;letter-spacing:-.04em;line-height:1}
.pre .num em{font-style:normal;color:#5A5A5A}
.pre .pd{display:flex;gap:120px}
.pre .pd span{display:flex;flex-direction:column;align-items:center;gap:14px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#C8C8C8}
.pre .pd i{width:6px;height:6px;border-radius:50%;background:#F0F0F8}
.pre .pd span:last-child i{background:var(--acc)}

/* nav */
.nav{position:fixed;top:12px;left:50%;transform:translateX(-50%);width:min(1200px,calc(100% - 24px));height:64px;z-index:50;display:flex;align-items:center;gap:6px;padding:0 14px 0 28px;border-radius:999px;background:rgba(32,32,32,.86);border:1px solid rgba(255,255,255,.07);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 24px 60px rgba(0,0,0,.45);transition:background .5s ease,opacity .8s ease}
.nav.on-light{background:rgba(72,72,72,.92)}
.nav .brand{display:inline-flex;flex-direction:column;align-items:flex-start;margin-right:26px}
.nav .brand img{height:16px;width:auto;display:block}
.logo-dots{display:flex;gap:9px;margin-top:6px}
.logo-dots i{width:4px;height:4px;border-radius:50%;background:#F0F0F8;opacity:.9}
.logo-dots i:last-child{background:var(--acc);opacity:1}
.nav-links{display:flex;align-items:center}
.nav-link{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#B0B0B0;padding:0 16px;height:44px;display:inline-flex;align-items:center;gap:7px}
.nav-link:hover{color:#F0F0F8}
.nav-link sup{font-size:7px;letter-spacing:.14em;color:var(--acc);margin-top:-8px}
.nav-link em{font-style:normal;font-size:8px;opacity:.7}
.ic-btn{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;color:#B0B0B0;border-radius:50%}
.ic-btn:hover{color:#F0F0F8}
.btn-pill{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 18px 0 14px;border-radius:999px;background:#F0F0F8;color:#171717;font-size:13px;font-weight:700;border:1px solid transparent;cursor:pointer;letter-spacing:.02em}
.btn-pill:hover{background:#fff}
.btn-pill i{width:10px;height:10px;border-radius:50%;background:var(--acc)}
.ind{position:fixed;right:22px;top:50%;transform:translateY(-50%);z-index:40;display:flex;align-items:center;gap:12px;pointer-events:none}
.ind .bar{position:relative;width:1px;height:64px;background:rgba(255,255,255,.14)}
.ind .bar i{position:absolute;left:-1px;width:3px;height:10px;background:#F0F0F8;border-radius:2px}
.ind span{font-size:10px;letter-spacing:.2em;color:#8A8A8A}

/* hero */
.hero{position:relative;padding-bottom:40px}
.globe-wrap{position:relative;height:100svh;min-height:560px;width:100%;overflow:hidden;cursor:grab;touch-action:pan-y}
.globe-wrap:active{cursor:grabbing}
.globe-wrap canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.globe-glow{position:absolute;left:50%;top:50%;width:70vmin;height:70vmin;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.06) 55%,rgba(255,255,255,.02) 70%,rgba(255,255,255,0) 72%);pointer-events:none}
.hero-copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:-16vh}
.h1{font-size:clamp(40px,6.4vw,92px);line-height:1;max-width:1200px}
.h1 .w{display:inline-block}
.hero-copy .p{max-width:600px;margin-top:40px;font-size:15px;color:#C0C0C0}
.live{display:inline-flex;align-items:center;gap:8px;height:28px;padding:0 12px 0 10px;border-radius:999px;background:#242424;border:1px solid rgba(255,255,255,.08);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:#C8C8C8}
.live i{width:7px;height:7px;border-radius:50%;background:var(--acc);box-shadow:0 0 10px var(--acc);animation:blink 1.6s ease-in-out infinite}
@keyframes blink{50%{opacity:.3}}

/* marquees */
.mq{position:relative;overflow:hidden;width:100%}
.mq-track{display:flex;width:max-content;align-items:center;animation:mq 50s linear infinite}
.mq-track.rev{animation-direction:reverse;animation-duration:58s}
.mq:hover .mq-track{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}
.src{font-size:15px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#5A5A5A;padding:0 48px;white-space:nowrap}
.stats{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:18px;height:48px;padding:0 26px;border-radius:12px;background:#1C1C1C;border:1px solid rgba(255,255,255,.1);font-size:12px;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;box-shadow:0 0 0 28px #171717;color:#E8E8E8}
.stats em{font-style:normal;color:#4A4A4A}
.stats b{color:var(--acc);font-weight:700}
.spark{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);pointer-events:none;overflow:visible}
.spark rect{fill:none;stroke:var(--acc);stroke-width:1.5;stroke-dasharray:6 94;stroke-linecap:round;animation:sparkRun 12s linear infinite;filter:drop-shadow(0 0 4px var(--acc))}
@keyframes sparkRun{to{stroke-dashoffset:-100}}

/* cards */
.cards{padding:30px 0 0;overflow:hidden}
.card{width:440px;flex:none;margin:0 10px;padding:22px 26px 20px;border-radius:14px;background:#1E1E1E;border:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;gap:12px}
.card:hover{border-color:rgba(255,255,255,.18)}
.card .lbl{font-size:10px;letter-spacing:.22em}
.stars{font-size:12px;letter-spacing:.1em;color:var(--acc)}
.q{font-size:13.5px;line-height:1.65;font-style:italic;color:#E6E6E6;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.more{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--acc);padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.07)}
.who{display:flex;align-items:center;gap:12px;font-size:12px;color:#A0A0A0}
.who span.t{color:#5A5A5A}
.av{width:36px;height:36px;border-radius:50%;background:#2A2A2A;border:1px solid rgba(255,255,255,.1);display:inline-flex;align-items:center;justify-content:center;font-size:11px;color:#F0F0F8;font-weight:700;flex:none}
.note{text-align:center;font-size:9px;letter-spacing:.2em;color:#4A4A4A;padding:14px 0 10px}

/* ink */
.ink{position:relative;height:56vh;min-height:380px;overflow:hidden;background:#171717}
.ink-f{position:absolute;top:-300px;left:-300px;right:-300px;bottom:-300px;filter:url(#ink-edge);will-change:transform}
.ink-f i{position:absolute;left:0;right:0;bottom:0;display:block;height:100%;background:var(--cream);transform-origin:center bottom;transform:scaleY(.3);will-change:transform}

/* framework */
.framework{position:relative;background:var(--cream);color:#171717;padding:120px 0 40px;text-align:center;overflow:hidden}
.framework .grid-l{position:absolute;inset:0;background-image:radial-gradient(rgba(23,23,23,.12) 1px,transparent 1.2px);background-size:22px 22px;pointer-events:none}
.framework canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.framework .wrap{position:relative;display:flex;flex-direction:column;align-items:center;gap:30px}
.h2{font-size:clamp(44px,7.7vw,111px);line-height:1}
.framework .p{max-width:660px;color:#3A3A3A}
.framework .acc{color:var(--acc-l)}
.pdots{display:flex;align-items:center;margin-top:48px}
.pdots i{width:5px;height:5px;border-radius:50%;background:#8A8A8A}
.pdots i:last-child{background:var(--acc-l)}
.pdots b{width:52px;height:1px;background:rgba(23,23,23,.18)}

/* loop (pinned horizontal) */
.loop{position:relative;height:100svh;min-height:600px;overflow:hidden;background:var(--cream);color:#171717}
.track{position:absolute;top:0;bottom:0;left:0;width:400%;display:flex;will-change:transform}
.ph{position:relative;width:25%;height:100%;display:flex;align-items:center;padding-left:9%}
.ph .wm{position:absolute;left:38%;top:50%;transform:translateY(-54%);font-size:clamp(220px,42vw,600px);font-weight:800;letter-spacing:-.08em;line-height:1;opacity:.07;pointer-events:none;user-select:none}
.ph .t{font-size:clamp(48px,7.7vw,111px);font-weight:800;letter-spacing:.02em;line-height:1;margin:0;position:relative}
.ph .t b.dot{color:var(--acc)}
.ph .rule{width:120px;height:1px;background:currentColor;opacity:.25;margin:30px 0 26px}
.ph .one{font-size:16px;margin:0 0 24px;opacity:.9}
.ph ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ph li{font-size:12.5px;opacity:.75;display:flex;gap:14px}
.ph li:before{content:"—";opacity:.5}
.rail{position:absolute;left:50%;bottom:44px;transform:translateX(-50%);display:flex;align-items:center;z-index:2}
.rail .seg{width:56px;height:1px;background:currentColor;opacity:.25}
.rail .st{position:relative;width:20px;height:20px;display:flex;align-items:center;justify-content:center}
.rail .st i{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.4}
.rail .st.done i,.rail .st.act i{opacity:0}
.rail .st.last i{background:var(--acc);opacity:1}
.rail .st b{position:absolute;font-size:20px;font-weight:800;line-height:1;opacity:0;transform:scale(.6);transition:opacity .3s,transform .3s}
.rail .st.act b,.rail .st.done b{opacity:1;transform:none}
.rail .st.last b{color:var(--acc)}
.rail .st span{position:absolute;top:28px;font-size:8px;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap;opacity:.55}
.rail .st.act span{opacity:1}
.rail .st.last span{color:var(--acc)}

/* audit / signal */
.audit{position:relative;padding:60px 0 140px;overflow:hidden}
.audit canvas.aurora{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity .8s ease;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 18%,#000 82%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 18%,#000 82%,transparent 100%)}
.audit:focus-within canvas.aurora{opacity:.75}
.audit .wrap{position:relative;min-height:680px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:24px}
.audit .h2{font-size:clamp(40px,6.6vw,96px);max-width:1100px}
.audit .h2 .w{display:inline-block}
.flt{position:absolute;font-size:13px;color:#A0A0A0;white-space:nowrap;display:flex;align-items:center;gap:12px;will-change:transform}
.flt small{font-size:12px;color:#5A5A5A;display:inline-flex;gap:6px}
.flt small b{font-weight:400;color:#8A8A8A}
.inbox{display:flex;align-items:center;width:100%;max-width:420px;height:58px;padding:0 10px 0 20px;border-radius:14px;background:#202020;border:1px solid rgba(255,255,255,.08);position:relative;z-index:2}
.inbox input{flex:1;min-width:0;height:100%;background:transparent;border:0;color:#F0F0F8;font-size:13px;outline:none}
.inbox input::placeholder{color:#7A7A7A}
.inbox button{width:40px;height:40px;border:0;background:transparent;color:#C8C8C8;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-radius:10px}
.inbox button:hover{color:#F0F0F8;background:#2A2A2A}
.inbox:focus-within{border-color:rgba(255,255,255,.25)}
.count{font-size:14px;color:#F0F0F8;font-weight:700;display:inline-block}

/* wave */
.wave{position:relative;overflow:hidden;padding:120px 0 90px}
.wave svg{display:block;width:100%;height:auto;overflow:visible}
.wave text{font-family:'JetBrains Mono',monospace;font-weight:800;font-size:58px;letter-spacing:.04em;fill:#4A4A4A;text-transform:uppercase}
.wave tspan.a{fill:var(--acc)}

/* talk */
.talk{padding:20px 0 120px}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.cc{display:flex;align-items:center;gap:22px;padding:22px 28px;border-radius:14px;background:#1E1E1E;border:1px solid rgba(255,255,255,.07);color:#F0F0F8;min-height:92px}
.cc:hover{border-color:rgba(255,255,255,.2)}
.cc:hover .ttl{color:var(--acc)}
.cc .ic{width:50px;height:50px;border-radius:50%;border:1px solid rgba(255,255,255,.12);display:inline-flex;align-items:center;justify-content:center;flex:none;color:#C8C8C8}
.cc .ttl{font-size:18px;font-weight:700;transition:color .2s}
.cc .sub{font-size:12px;color:#8A8A8A}
.cc .ar{margin-left:auto;transition:transform .2s;color:#8A8A8A;font-size:22px}
.cc:hover .ar{transform:translateX(6px);color:#F0F0F8}
.input{height:40px;padding:0 14px;border-radius:8px;border:1px solid rgba(255,255,255,.12);background:#171717;color:#F0F0F8;font-size:12px;min-width:0;flex:1}
.input:focus{outline:2px solid rgba(255,255,255,.25);outline-offset:1px}
.sm-btn{height:40px;padding:0 14px;border-radius:8px;border:1px solid rgba(255,255,255,.12);background:#F0F0F8;color:#171717;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;cursor:pointer}

/* cure */
.cure{position:relative;padding:80px 0 140px;overflow:hidden}
.cure canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.cure .wrap{position:relative;display:flex;flex-direction:column;gap:56px}
.cure h2{font-size:clamp(36px,5.4vw,78px);line-height:1.08;position:relative;max-width:1180px}
.cure h2 .w{display:inline-block;opacity:0;filter:blur(10px)}
.cure h2 .w.last{color:var(--acc)}
.caret{position:absolute;top:0;left:0;width:.5em;height:1em;background:var(--acc);opacity:0;pointer-events:none}

/* footer */
.foot{position:relative;padding:20px 0 36px;overflow:hidden}
.foot canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.foot .wrap{position:relative;display:flex;flex-direction:column;gap:60px}
.chip{display:inline-flex;align-items:center;gap:12px;height:42px;padding:0 20px;border-radius:999px;border:1px solid rgba(255,255,255,.1);font-size:12px;color:#B0B0B0}
.chip:hover{border-color:rgba(255,255,255,.3);color:#F0F0F8}
.fcols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.fcol{display:flex;flex-direction:column;gap:6px}
.fcol .g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
.fcol a{display:block;font-size:13px;color:#A0A0A0;padding:7px 0}
.fcol a:hover{color:#F0F0F8}
.fcol a b{color:var(--acc);font-weight:400;font-size:10px;margin-left:4px}
.loc{display:inline-flex;align-items:center;gap:10px;height:32px;padding:0 14px;border:1px solid rgba(255,255,255,.1);border-radius:6px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#8A8A8A;position:relative}
.loc b{color:#F0F0F8;font-weight:700}
.loc i{width:6px;height:6px;border-radius:50%;background:var(--acc);box-shadow:0 0 8px var(--acc)}
.foot .legal a:hover{color:var(--acc)}

html.lite .ink-f{filter:none}html.lite .nav{backdrop-filter:none;-webkit-backdrop-filter:none}
@media (max-width:900px){
  .nav{padding-left:18px}.nav-links,.ic-btn{display:none}
  .globe-wrap{height:72svh;min-height:420px}
  .hero-copy{margin-top:-6vh}
  .stats{position:static;transform:none;margin:14px auto 0;width:max-content;max-width:100%;box-shadow:none;flex-wrap:wrap;height:auto;padding:12px 16px;gap:10px 14px}
  .card{width:300px}
  .ph{padding-left:6%}
  .wave text{font-size:40px}
  .flt{display:none}
  .two,.fcols{grid-template-columns:repeat(1,minmax(0,1fr))}
  .ind{display:none}
  .pre .num{font-size:64px}.pre .pd{gap:28px}
}
@media (prefers-reduced-motion:reduce){
  .mq-track,.live i,.spark rect{animation:none}
}
