:root{
  --forest:#013F32;--lime:#E7FE25;--paper:#FDFDFD;--ink:#161616;
  --forest-2:#02594A;--forest-3:#0B2A24;--mist:#EEF3EF;--amber:#E0A000;--red:#C4331B;
  --d:"Archivo",system-ui,sans-serif;--b:"Manrope",system-ui,sans-serif;--m:"JetBrains Mono",ui-monospace,monospace;
  --ease:cubic-bezier(.16,1,.3,1);--w:min(1760px,92vw);
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font-family:var(--b);background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden;line-height:1.5}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
img{max-width:100%;display:block}
.wrap{max-width:var(--w);margin:0 auto;padding:0 32px}
.mono{font-family:var(--m);font-weight:600}
.eyebrow{font-family:var(--m);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;font-weight:700;color:var(--forest);opacity:.7;margin-bottom:18px;display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--lime)}
h1,h2,h3{font-family:var(--d);font-weight:800;letter-spacing:-.045em;line-height:1.02}
h2{font-size:clamp(2.2rem,4.2vw,3.6rem)}
h3{font-size:1.35rem;letter-spacing:-.03em}
.lead{font-size:1.15rem;color:rgba(22,22,22,.66);font-weight:500;line-height:1.6;max-width:56ch}

/* lime sweep behind key words: the signature */
.hl{position:relative;display:inline-block;white-space:nowrap;isolation:isolate}
.hl::after{content:"";position:absolute;left:-.06em;right:-.06em;bottom:.08em;height:.42em;background:var(--lime);z-index:-1;
 transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease) .25s;border-radius:2px}
.chain .hl,.here .hl{color:var(--paper)}
.chain .hl::after,.here .hl::after{height:.5em;bottom:.04em;background:#01251E;box-shadow:inset 0 -3px 0 var(--lime)}
.in .hl::after,.hl.on::after{transform:scaleX(1)}

/* ---------- nav ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;padding:18px 0;transition:.35s var(--ease)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between}
.nav.solid{background:rgba(253,253,253,.86);backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%);
 padding:12px 0;border-bottom:1px solid rgba(1,63,50,.1)}
.logo{display:flex;align-items:center;gap:11px;font-family:var(--d);font-weight:800;font-size:1.25rem;letter-spacing:-.04em}
.logo .mk{width:34px;height:34px;border-radius:10px;background:var(--forest);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.logo .mk i{display:block;width:14px;height:4px;border-radius:3px;background:var(--paper)}
.logo .mk i:last-child{width:21px;background:var(--lime)}
.links{display:flex;gap:34px;font-weight:700;font-size:.92rem}
.links a{position:relative;padding:4px 0}
.links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:.3s var(--ease)}
.links a:hover::after{transform:scaleX(1)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 24px;border-radius:100px;font-weight:800;font-size:.95rem;border:0;transition:.25s var(--ease);will-change:transform}
.btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn.lime{background:var(--lime);color:var(--forest)}
.btn.lime:hover{background:#F2FF5C}
.btn.forest{background:var(--forest);color:var(--paper)}
.btn.forest:hover{background:var(--forest-2)}
.btn.ghost{background:transparent;color:var(--forest);border:1.5px solid rgba(1,63,50,.25)}
.btn.ghost:hover{border-color:var(--forest);background:rgba(1,63,50,.04)}

.logo svg.mk{background:none;border-radius:0;display:block;flex:none}
/* ---------- hero ---------- */
.hero{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:56px;padding-top:120px;padding-bottom:60px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;right:-18vw;top:-12vh;width:64vw;height:64vw;border-radius:50%;
 background:radial-gradient(circle,rgba(231,254,37,.22),transparent 62%);pointer-events:none;animation:drift 18s ease-in-out infinite alternate}
@keyframes drift{from{transform:translate(0,0)}to{transform:translate(-40px,30px)}}
.hero h1{font-size:clamp(3.2rem,6.4vw,5.6rem);font-weight:900}
.hero h1 .ln{display:block;overflow:hidden}
.hero h1 .ln span{display:block;transform:translateY(110%);animation:lift 1s var(--ease) forwards}
.hero h1 .ln:nth-child(2) span{animation-delay:.1s}
.hero h1 .ln:nth-child(3) span{animation-delay:.2s}
@keyframes lift{to{transform:none}}
.hero .lead{margin:28px 0 36px;opacity:0;animation:fade .9s var(--ease) .55s forwards}
.hero .cta{display:flex;gap:14px;align-items:center;opacity:0;animation:fade .9s var(--ease) .75s forwards}
@keyframes fade{to{opacity:1}}
.hero .note{margin-top:26px;font-size:.82rem;color:rgba(22,22,22,.5);font-weight:600;display:flex;gap:18px;opacity:0;animation:fade .9s var(--ease) .95s forwards}
.hero .note span{display:flex;align-items:center;gap:7px}
.hero .note i{width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px rgba(231,254,37,.35)}

/* the hero visual: a live pass board, not a screenshot */
.hv{position:relative;opacity:0;transform:translateY(24px);animation:up 1.1s var(--ease) .4s forwards}
@keyframes up{to{opacity:1;transform:none}}
.board{background:var(--forest);border-radius:26px;padding:14px;box-shadow:0 44px 90px rgba(1,63,50,.35),0 0 0 1px rgba(255,255,255,.06) inset;transform:perspective(1400px) rotateY(-6deg) rotateX(3deg);transition:transform 1s var(--ease)}
.hv:hover .board{transform:perspective(1400px) rotateY(-2deg) rotateX(1deg)}
.bd{background:#EFF2EE;border-radius:14px;overflow:hidden;font-size:.72rem}
.bd .t{display:flex;align-items:center;justify-content:space-between;padding:11px 15px;background:var(--paper);border-bottom:1.5px solid rgba(1,63,50,.14)}
.bd .t b{font-family:var(--d);font-weight:800;font-size:.95rem;letter-spacing:-.03em}
.bd .t .old{font-family:var(--m);font-size:.62rem;font-weight:700;padding:5px 9px;border-radius:7px;background:var(--amber);color:#3D2A00}
.bd .cols{display:grid;grid-template-columns:1fr 1fr 1fr;height:340px}
.bd .col{border-right:1.5px solid rgba(1,63,50,.14);display:flex;flex-direction:column}
.bd .col:last-child{border-right:0}
.bd .ch{font-family:var(--m);font-size:.52rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:rgba(22,22,22,.55);padding:9px 12px 7px;border-bottom:1.5px solid rgba(1,63,50,.14);display:flex;justify-content:space-between}
.bd .col.ready .ch{background:var(--lime);color:var(--forest)}
.bd .cb{padding:8px;display:flex;flex-direction:column;gap:7px;overflow:hidden}
.bd .tk{background:var(--paper);border:1.5px solid rgba(1,63,50,.14);border-radius:10px;padding:8px 10px;animation:tkin .7s var(--ease) both}
.bd .tk.rdy{background:var(--lime);border-color:var(--lime);color:var(--forest)}
@keyframes tkin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.bd .tk .n{font-family:var(--d);font-weight:800;font-size:1.05rem;letter-spacing:-.04em;display:flex;justify-content:space-between;align-items:baseline}
.bd .tk .n small{font-family:var(--m);font-size:.58rem;font-weight:700;color:rgba(22,22,22,.55)}
.bd .tk.rdy .n small{color:rgba(1,63,50,.65)}
.bd .tk .n small.hot{color:#8F6300}
.bd .tk .l{display:flex;align-items:center;gap:6px;padding:3px 0;font-weight:700;font-size:.66rem}
.bd .tk .l i{width:10px;height:10px;border-radius:3px;border:1.5px solid rgba(1,63,50,.25);flex:none}
.bd .tk .l.d i{background:var(--forest);border-color:var(--forest)}
.bd .tk .l.d span{opacity:.45;text-decoration:line-through}
.bd .tk .st{font-family:var(--m);font-size:.5rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(22,22,22,.5);font-weight:700;margin:5px 0 2px;display:flex;justify-content:space-between}
.bd .tk .bz{margin-top:6px;background:var(--forest);color:var(--lime);border-radius:7px;padding:7px;text-align:center;font-family:var(--d);font-weight:800;font-size:.7rem;letter-spacing:-.01em;animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(1,63,50,.5)}55%{box-shadow:0 0 0 9px rgba(1,63,50,0)}}
.chip{position:absolute;background:var(--paper);border-radius:14px;padding:12px 16px;box-shadow:0 18px 40px rgba(1,63,50,.22);display:flex;align-items:center;gap:11px;animation:float 6s ease-in-out infinite}
.chip svg{width:20px;height:20px;stroke:var(--forest);fill:none;stroke-width:2.2;flex:none}
.chip b{display:block;font-size:.82rem;font-weight:800;letter-spacing:-.01em}
.chip span{font-size:.7rem;color:rgba(22,22,22,.55);font-weight:600}
.chip.a{left:-40px;bottom:64px;animation-delay:-2s}
.chip.b{right:-28px;top:40px;animation-delay:-4s}
.chip.b svg{stroke:var(--forest)}
.chip.b .ic{width:34px;height:34px;border-radius:9px;background:var(--lime);display:grid;place-items:center}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* ---------- 3D device: real perspective, rotation driven by scroll ---------- */
.stage3d{perspective:1500px;perspective-origin:50% 42%}
.dev3d{position:relative;transform-style:preserve-3d;will-change:transform;--thick:30px}
/* the four side faces are what make it read as a solid object rather than a card */
.dev3d .edge{position:absolute;inset:0;border-radius:26px;background:linear-gradient(160deg,#0b3128,#02201a);
 transform:translateZ(calc(var(--thick)*-1));box-shadow:0 46px 90px rgba(1,63,50,.45)}
.dev3d .sideL,.dev3d .sideR{position:absolute;top:14px;bottom:14px;width:var(--thick);
 background:linear-gradient(180deg,#1a5544 0%,#0b3128 26%,#02201a 100%)}
.dev3d .sideL{left:0;transform-origin:left center;transform:rotateY(90deg)}
.dev3d .sideR{right:0;transform-origin:right center;transform:rotateY(-90deg)}
.dev3d .sideT,.dev3d .sideB{position:absolute;left:14px;right:14px;height:var(--thick);
 background:linear-gradient(90deg,#02201a,#154a3b 50%,#02201a)}
.dev3d .sideT{top:0;transform-origin:center top;transform:rotateX(-90deg)}
.dev3d .sideB{bottom:0;transform-origin:center bottom;transform:rotateX(90deg)}
.dev3d .sheen{position:absolute;inset:0;border-radius:26px;pointer-events:none;opacity:0;
 background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,.26) 47%,transparent 63%)}
.dev3d .board{position:relative;transform:none}
.hv:hover .dev3d .board{transform:none}
@keyframes spinin{from{transform:rotateY(-45deg) rotateX(-22deg) rotateZ(-3deg) translateX(-7%) scale(.92);opacity:0}
 to{transform:rotateY(0) rotateX(0) rotateZ(0) translateX(0) scale(1);opacity:1}}
.dev3d.enter{animation:spinin 1.15s var(--ease) .35s both}
@media(prefers-reduced-motion:reduce){.dev3d,.dev3d.enter{transform:none!important;animation:none!important;opacity:1!important}}
/* ---------- ticker ---------- */
.ticker{background:var(--forest);color:var(--paper);padding:18px 0;overflow:hidden;position:relative}
.ticker::before,.ticker::after{content:"";position:absolute;top:0;bottom:0;width:120px;z-index:1;pointer-events:none}
.ticker::before{left:0;background:linear-gradient(90deg,var(--forest),transparent)}
.ticker::after{right:0;background:linear-gradient(-90deg,var(--forest),transparent)}
.tk-track{display:flex;gap:56px;width:max-content;animation:marquee 34s linear infinite}
.ticker:hover .tk-track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
.tk-track span{font-family:var(--d);font-weight:700;font-size:1.05rem;letter-spacing:-.02em;display:flex;align-items:center;gap:56px;white-space:nowrap}
.tk-track span::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--lime)}

/* ---------- sections ---------- */
section{padding:120px 0}
.split{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.1s}.reveal.d2{transition-delay:.2s}.reveal.d3{transition-delay:.3s}.reveal.d4{transition-delay:.4s}

/* image placeholder: designed, not apologetic */
.ph{position:relative;border-radius:22px;overflow:hidden;background:linear-gradient(135deg,#0B2A24,#013F32 60%,#02594A);min-height:380px;display:flex;align-items:flex-end;padding:22px}
.ph::before{content:"";position:absolute;inset:0;background:
 repeating-linear-gradient(115deg,transparent 0 22px,rgba(231,254,37,.045) 22px 23px),
 radial-gradient(circle at 30% 20%,rgba(231,254,37,.18),transparent 45%);pointer-events:none}
.ph .tag{position:relative;font-family:var(--m);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--lime);font-weight:700;background:rgba(1,63,50,.7);padding:8px 12px;border-radius:8px;border:1px dashed rgba(231,254,37,.4)}
.ph.tall{min-height:520px}
.ph.short{min-height:260px}

/* five surfaces */
.surfaces{background:var(--mist)}
.sgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:56px}
.sc{background:var(--paper);border-radius:20px;padding:26px 22px;border:1.5px solid rgba(1,63,50,.1);position:relative;overflow:hidden;transition:.35s var(--ease);min-height:280px;display:flex;flex-direction:column}
.sc::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:.45s var(--ease)}
.sc:hover{transform:translateY(-6px);box-shadow:0 26px 50px rgba(1,63,50,.14);border-color:transparent}
.sc:hover::before{transform:scaleX(1)}
.sc .ic{width:46px;height:46px;border-radius:13px;background:var(--forest);display:grid;place-items:center;margin-bottom:22px}
.sc .ic svg{width:22px;height:22px;stroke:var(--lime);fill:none;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.sc .dev{font-family:var(--m);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(22,22,22,.5);font-weight:700;margin-bottom:8px}
.sc h3{margin-bottom:8px}
.sc p{font-size:.88rem;color:rgba(22,22,22,.62);font-weight:500;line-height:1.55;flex:1}
.sc .more{margin-top:18px;font-weight:800;font-size:.82rem;color:var(--forest);display:flex;align-items:center;gap:6px}
.sc .more svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

/* custody chain */
.chain{background:var(--forest);color:var(--paper)}
.chain .eyebrow{color:var(--lime);opacity:1}
.chain .lead{color:rgba(253,253,253,.65)}
.flow{margin-top:64px;position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:0}
.flow::before{content:"";position:absolute;left:8%;right:8%;top:38px;height:2px;background:rgba(253,253,253,.15)}
.flow .line{position:absolute;left:8%;top:38px;height:2px;background:var(--lime);width:0;transition:width 1.8s var(--ease)}
.in .flow .line{width:84%}
.step{text-align:center;padding:0 12px;position:relative}
.step .dot{width:76px;height:76px;border-radius:50%;background:var(--forest-3);border:2px solid rgba(253,253,253,.2);display:grid;place-items:center;margin:0 auto 20px;transition:.6s var(--ease);position:relative}
.step .dot svg{width:30px;height:30px;stroke:rgba(253,253,253,.7);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:.6s}
.in .step .dot{background:var(--lime);border-color:var(--lime)}
.in .step .dot svg{stroke:var(--forest)}
.in .step:nth-child(2) .dot{transition-delay:.25s}.in .step:nth-child(3) .dot{transition-delay:.5s}
.in .step:nth-child(4) .dot{transition-delay:.75s}.in .step:nth-child(5) .dot{transition-delay:1s}
.in .step:nth-child(6) .dot{transition-delay:1.25s}
.step b{font-family:var(--d);font-weight:800;font-size:1.1rem;letter-spacing:-.03em;display:block;margin-bottom:6px}
.step span{font-size:.84rem;color:rgba(253,253,253,.6);font-weight:500;display:block;line-height:1.5}
.step .num{font-family:var(--m);font-size:.6rem;letter-spacing:.16em;color:var(--lime);font-weight:700;display:block;margin-bottom:8px}
.three{margin-top:72px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.three div{background:rgba(253,253,253,.05);border:1.5px solid rgba(253,253,253,.1);border-radius:18px;padding:26px}
.three b{font-family:var(--d);font-size:2.4rem;font-weight:800;letter-spacing:-.05em;color:var(--lime);display:block;line-height:1}
.three em{font-style:normal;font-family:var(--m);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(253,253,253,.5);font-weight:700;display:block;margin:10px 0 8px}
.three p{font-size:.88rem;color:rgba(253,253,253,.7);line-height:1.55}

/* anti-counterfeit */
.outcomes{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:40px}
.oc{border-radius:16px;padding:20px 22px;display:flex;gap:16px;align-items:flex-start;border:1.5px solid rgba(1,63,50,.1);background:var(--paper);transition:.3s var(--ease)}
.oc:hover{transform:translateX(6px)}
.oc .k{width:12px;height:12px;border-radius:50%;flex:none;margin-top:5px}
.oc.ok .k{background:var(--lime);box-shadow:0 0 0 4px rgba(231,254,37,.35)}
.oc.bad .k{background:var(--red);box-shadow:0 0 0 4px rgba(196,51,27,.2)}
.oc.warn .k{background:var(--amber);box-shadow:0 0 0 4px rgba(224,160,0,.25)}
.oc b{display:block;font-weight:800;margin-bottom:3px}
.oc span{font-size:.86rem;color:rgba(22,22,22,.6);line-height:1.5}

/* count */
.count{background:var(--mist)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:48px}
.pool{background:var(--paper);border-radius:22px;padding:34px;border:1.5px solid rgba(1,63,50,.1)}
.pool .eq{font-family:var(--m);font-size:1.1rem;font-weight:700;color:var(--forest);background:var(--mist);padding:16px 18px;border-radius:12px;margin:20px 0}
.pool p{font-size:.92rem;color:rgba(22,22,22,.62);line-height:1.6}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:64px}
.stat{padding:30px 0;border-top:2px solid var(--forest)}
.stat b{font-family:var(--d);font-size:3.4rem;font-weight:800;letter-spacing:-.06em;line-height:1;display:flex;align-items:flex-start;gap:2px}
.stat b span{font:inherit;color:var(--forest)}
.stat b em{font-style:normal;color:var(--forest);font-size:1.6rem;margin-top:.15em}
.stat span{display:block;margin-top:10px;font-weight:600;color:rgba(22,22,22,.6);font-size:.92rem}

/* built for here */
.here{background:var(--forest);color:var(--paper)}
.here .eyebrow{color:var(--lime);opacity:1}
.here .lead{color:rgba(253,253,253,.65)}
.hgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:56px}
.hc{background:rgba(253,253,253,.05);border:1.5px solid rgba(253,253,253,.1);border-radius:20px;padding:30px;transition:.35s var(--ease)}
.hc:hover{background:rgba(231,254,37,.08);border-color:rgba(231,254,37,.4)}
.hc svg{width:30px;height:30px;stroke:var(--lime);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;margin-bottom:20px}
.hc b{font-family:var(--d);font-size:1.15rem;font-weight:800;letter-spacing:-.03em;display:block;margin-bottom:8px}
.hc p{font-size:.88rem;color:rgba(253,253,253,.65);line-height:1.55}

/* quote */
.quote{text-align:center;max-width:860px;margin:0 auto}
.quote blockquote{font-family:var(--d);font-weight:700;font-size:clamp(1.6rem,3vw,2.4rem);letter-spacing:-.035em;line-height:1.25;margin:28px 0}
.quote .who{display:flex;align-items:center;justify-content:center;gap:14px}
.quote .av{width:52px;height:52px;border-radius:50%;background:var(--forest);display:grid;place-items:center;color:var(--lime);font-family:var(--d);font-weight:800;font-size:.9rem}
.quote .who b{display:block;font-weight:800;font-size:.95rem}
.quote .who span{font-size:.82rem;color:rgba(22,22,22,.55);font-weight:600}

/* pricing */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:56px;align-items:stretch}
.plan{border-radius:22px;padding:34px;border:1.5px solid rgba(1,63,50,.12);background:var(--paper);display:flex;flex-direction:column;transition:.35s var(--ease)}
.plan:hover{transform:translateY(-6px);box-shadow:0 26px 50px rgba(1,63,50,.12)}
.plan.hot{background:var(--forest);color:var(--paper);border-color:var(--forest)}
.plan .pn{font-family:var(--m);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;opacity:.6}
.plan .pp{font-family:var(--d);font-size:2.6rem;font-weight:800;letter-spacing:-.05em;margin:14px 0 4px}
.plan .pp small{font-family:var(--b);font-size:.9rem;font-weight:600;opacity:.6;letter-spacing:0}
.plan .pd{font-size:.9rem;opacity:.7;margin-bottom:24px;line-height:1.5}
.plan ul{list-style:none;padding:0;margin:0 0 28px;display:flex;flex-direction:column;gap:11px;flex:1}
.plan li{display:flex;gap:10px;font-size:.9rem;font-weight:600}
.plan li svg{width:17px;height:17px;stroke:var(--forest);fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;flex:none;margin-top:2px}
.plan.hot li svg{stroke:var(--lime)}
.plan .btn{justify-content:center}

/* faq */
.faq{max-width:820px;margin:48px auto 0}
.q{border-top:1.5px solid rgba(1,63,50,.12)}
.q:last-child{border-bottom:1.5px solid rgba(1,63,50,.12)}
.q button{width:100%;background:none;border:0;text-align:left;padding:24px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;font-family:var(--d);font-weight:700;font-size:1.15rem;letter-spacing:-.025em;color:var(--ink)}
.q button svg{width:22px;height:22px;stroke:var(--forest);fill:none;stroke-width:2.4;stroke-linecap:round;flex:none;transition:.35s var(--ease)}
.q.open button svg{transform:rotate(45deg)}
.q .a{max-height:0;overflow:hidden;transition:max-height .5s var(--ease)}
.q .a p{padding:0 0 26px;color:rgba(22,22,22,.65);line-height:1.65;max-width:64ch}

/* cta */
.cta-band{margin:0 32px;border-radius:32px;background:var(--forest);color:var(--paper);padding:96px 64px;position:relative;overflow:hidden;text-align:center}
.cta-band::before{content:"";position:absolute;left:-10%;bottom:-40%;width:50%;height:120%;border-radius:50%;background:radial-gradient(circle,rgba(231,254,37,.28),transparent 60%)}
.cta-band h2{position:relative;font-size:clamp(2.4rem,4.6vw,4rem);max-width:18ch;margin:0 auto 22px}
.cta-band p{position:relative;color:rgba(253,253,253,.65);font-size:1.1rem;max-width:50ch;margin:0 auto 36px}
.cta-band .row{position:relative;display:flex;gap:14px;justify-content:center}

/* footer */
footer{padding:80px 0 40px;margin-top:100px;border-top:1.5px solid rgba(1,63,50,.1)}
.fg{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px}
.fg h4{font-family:var(--m);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:rgba(22,22,22,.5);margin-bottom:18px}
.fg a{display:block;font-weight:600;font-size:.92rem;margin-bottom:10px;color:rgba(22,22,22,.75)}
.fg a:hover{color:var(--forest)}
.fg p{font-size:.9rem;color:rgba(22,22,22,.6);max-width:36ch;line-height:1.6;margin-top:16px}
.fb{display:flex;justify-content:space-between;margin-top:60px;padding-top:26px;border-top:1px solid rgba(1,63,50,.1);font-size:.8rem;color:rgba(22,22,22,.45);font-weight:600}

@media(max-width:1080px){.sgrid{grid-template-columns:repeat(3,1fr)}.hgrid{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.hero{grid-template-columns:1fr;padding-top:110px}.split,.two,.outcomes{grid-template-columns:1fr}.flow{grid-template-columns:1fr;gap:28px}.flow::before,.flow .line{display:none}.three,.plans,.stats{grid-template-columns:1fr}.sgrid,.hgrid{grid-template-columns:1fr 1fr}.links{display:none}.fg{grid-template-columns:1fr 1fr}.cta-band{padding:60px 28px}}
@media(max-width:600px){.sgrid,.hgrid,.fg{grid-template-columns:1fr}.chip{display:none}}
/* ---------- mobile pass: menu, photo crops, trims ---------- */
.burger{display:none;width:42px;height:42px;border:0;background:transparent;padding:0;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.burger span{display:block;width:22px;height:2px;border-radius:2px;background:var(--forest);transition:.3s var(--ease)}
.nav.open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav.open .burger span:nth-child(2){opacity:0}
.nav.open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.links .menu-cta{display:none}
/* a photo dropped into .ph crops to the box instead of stretching */
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.map-embed{height:460px}
@media(max-width:900px){
 .burger{display:flex}
 .nav .wrap{position:relative}
 .nav .wrap>.btn{display:none}
 .links{display:flex;flex-direction:column;gap:0;position:absolute;top:calc(100% + 16px);left:0;right:0;background:var(--paper);
  border:1.5px solid rgba(1,63,50,.1);border-radius:18px;padding:6px 22px 8px;box-shadow:0 26px 54px rgba(1,63,50,.16);
  opacity:0;visibility:hidden;transform:translateY(-10px);transition:.35s var(--ease)}
 .nav.open .links{opacity:1;visibility:visible;transform:none}
 .links a{font-family:var(--d);font-weight:800;font-size:1.05rem;letter-spacing:-.025em;padding:16px 0;border-bottom:1.5px solid rgba(1,63,50,.08)}
 .links a::after{display:none}
 .links .menu-cta{display:block;text-align:center;background:var(--lime);border-radius:100px;padding:15px 0;margin:14px 0 10px;border-bottom:0}
 /* a grid item defaults to min-width:auto, so the wide pass board was stretching the
    hero's single column past the screen and dragging the headline out with it */
 .hero>div,.hero>.hv{min-width:0}
}
@media(max-width:600px){
 .wrap{padding-left:22px;padding-right:22px}
 section{padding:80px 0}
 .cta-band{margin:0 22px;padding:54px 24px}
 .ph,.ph.tall{min-height:0;aspect-ratio:4/3}
 .ph.short{min-height:0;aspect-ratio:16/9}
 .board{transform:none}
 .bd{font-size:.66rem}
 .bd .cols{height:270px}
 .map-embed{height:300px}
 .fb{flex-direction:column;gap:10px}
 /* display type: a notch smaller, and let a highlighted phrase wrap rather than
    run off the screen, since .hl is nowrap by design */
 .hero h1{font-size:clamp(2.5rem,11.4vw,3.4rem)}
 h2{font-size:clamp(1.85rem,8.2vw,2.6rem)}
 .hl{white-space:normal}
 .eyebrow{font-size:.62rem;letter-spacing:.16em}
 /* two pills side by side on a phone force the label to wrap, and a wrapped label
    inside a 100px radius turns the button into a blob. Stack them instead. */
 .hero .cta,.cta-band .row{flex-direction:column;align-items:stretch}
 .hero .cta .btn,.cta-band .row .btn{justify-content:center;white-space:nowrap}
}
/* ---------- broadening revision: sector strip, examples, product grid ---------- */
.shown{font-family:var(--m);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:rgba(22,22,22,.45);margin-top:20px;text-align:center;line-height:1.7}
.sect{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:48px}
.tile{background:var(--paper);border:1.5px solid rgba(1,63,50,.1);border-radius:16px;padding:22px 20px;display:flex;flex-direction:column;gap:12px;transition:.3s var(--ease)}
.tile:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(1,63,50,.12);border-color:transparent}
.tile svg{width:24px;height:24px;stroke:var(--forest);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.tile b{font-family:var(--d);font-weight:800;font-size:.98rem;letter-spacing:-.025em;line-height:1.25;flex:1}
.flag{font-family:var(--m);font-size:.54rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;padding:5px 9px;border-radius:6px;align-self:flex-start}
.flag.live{background:var(--lime);color:var(--forest)}
.flag.build{background:rgba(224,160,0,.18);color:#8F6300}
.flag.soon{background:var(--mist);color:rgba(22,22,22,.5)}
.sectnote{margin-top:34px;font-size:.92rem;color:rgba(22,22,22,.62);font-weight:500;line-height:1.6;max-width:70ch}
.sectnote a{font-weight:800;color:var(--forest);border-bottom:2px solid var(--lime)}
.egs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px;padding-top:24px;border-top:1.5px solid rgba(1,63,50,.12)}
.egs b{font-family:var(--m);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--forest);font-weight:700;display:block;margin-bottom:7px}
.egs p{font-size:.84rem;color:rgba(22,22,22,.6);line-height:1.55}
.step .eg{font-family:var(--m);font-size:.58rem;letter-spacing:.05em;line-height:1.6;color:rgba(253,253,253,.42);display:block;margin-top:14px;padding-top:12px;border-top:1px solid rgba(253,253,253,.14);text-transform:uppercase}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:56px}
.sc.soon{background:transparent;border-style:dashed;border-color:rgba(1,63,50,.3)}
.sc.soon .ic{background:transparent;border:1.5px dashed rgba(1,63,50,.3)}
.sc.soon .ic svg{stroke:var(--forest)}
@media(max-width:1080px){.sect{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.sect{grid-template-columns:repeat(2,1fr)}.pgrid{grid-template-columns:1fr}.egs{grid-template-columns:1fr;gap:16px}}
@media(max-width:600px){.sect{grid-template-columns:1fr}}
/* ticker: even spacing so the loop seam is invisible however many items there are */
.tk-track{gap:0;animation-direction:reverse}
.tk-track span{margin-right:56px}
/* The ribbon carries content rather than decoration: frozen, it hides every item
   past the right edge. So it keeps moving even where the reduced-motion rule at
   the foot of this file switches other animations off. The script sets its
   duration inline, which is what keeps that rule from flattening it to 0s. */
.tk-track{animation-name:marquee!important;animation-timing-function:linear!important;animation-iteration-count:infinite!important;animation-direction:reverse!important}
.ticker:hover .tk-track{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
 .hero h1 .ln span,.hero .lead,.hero .cta,.hero .note,.hv{opacity:1;transform:none}
 .hl::after{transform:scaleX(1)}
 .flow .line{width:84%}
}

/* ---------- back to top: liquid glass ---------- */
.lgdefs{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.totop{position:fixed;right:22px;bottom:26px;z-index:55;width:54px;height:54px;border-radius:50%;
 display:grid;place-items:center;padding:0;border:0;cursor:pointer;
 background:rgba(253,253,253,.42);
 /* plain blur first, so a browser without url() support still gets glass */
 -webkit-backdrop-filter:blur(6px) saturate(180%);
 backdrop-filter:blur(6px) saturate(180%);
 box-shadow:inset 0 1px 0 #ffffff5c, inset 0 -1px 0 rgba(255,255,255,.18),
  0 10px 26px rgba(1,63,50,.24), 0 0 0 1px rgba(255,255,255,.35);
 opacity:0;visibility:hidden;transform:translateY(14px) scale(.86);
 transition:opacity .35s var(--ease),transform .35s var(--ease),visibility .35s}
@supports (backdrop-filter: url(#lg)){
 .totop{backdrop-filter:url(#lg) blur(3px) saturate(180%)}
}
.totop::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;
 background:linear-gradient(150deg,rgba(255,255,255,.55),rgba(255,255,255,0) 46%)}
.totop svg{position:relative;width:21px;height:21px;stroke:var(--forest);fill:none;stroke-width:2.6;
 stroke-linecap:round;stroke-linejoin:round}
.totop.show{opacity:1;visibility:visible;transform:none}
.totop:hover{transform:translateY(-2px)}
.totop:active{transform:scale(.94)}
@media(max-width:900px){.totop{right:16px;bottom:108px;width:50px;height:50px}}
@media(prefers-reduced-motion:reduce){.totop{transition:none}}