/* SampleROI — marketing site styles. Self-contained: no external fonts, CDNs or frameworks. */
@font-face{font-family:"Geist";src:url("fonts/Geist-Variable.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Geist Mono";src:url("fonts/GeistMono-Variable.woff2") format("woff2");font-weight:100 900;font-display:swap}

:root{
  --bg:#05070D;
  --bg-2:#080B13;
  --panel:#0B0F18;
  --panel-2:#0F1420;
  --line:rgba(255,255,255,.08);
  --line-2:rgba(255,255,255,.14);
  --text:#F4F6FA;
  --text-2:#B8C0CC;
  --muted:#B8C0CC;
  --green:#39FF6E;
  --green-2:#22C55E;
  --green-ink:#03140A;
  --green-glow:rgba(57,255,110,.22);
  --red:#FF5C7A;
  --amber:#FFB547;
  --radius:16px;
  --radius-sm:10px;
  --max:1200px;
  --font:"Geist",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;
  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:20px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:6px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-999px;top:8px;background:var(--green);color:var(--green-ink);padding:8px 14px;border-radius:8px;z-index:100;font-weight:600}
.skip:focus{left:12px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
.mono{font-family:var(--mono)}
.g{color:var(--green)}

/* ---------- background atmosphere ---------- */
.atmos{position:absolute;inset:0 0 auto 0;height:1100px;pointer-events:none;z-index:0;overflow:hidden}
.atmos::before{content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 20%,#000 30%,transparent 75%);
          mask-image:radial-gradient(ellipse 70% 60% at 50% 20%,#000 30%,transparent 75%)}
.atmos::after{content:"";position:absolute;left:50%;top:-240px;width:1100px;height:700px;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(57,255,110,.18),rgba(57,255,110,.05) 55%,transparent 75%);filter:blur(10px)}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:50;backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px);background:rgba(5,7,13,.72);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:24px}
.brand img{height:30px;width:auto}
.nav-links{display:flex;gap:28px;font-size:16px;color:var(--text-2)}
.nav-links a:hover{color:var(--text)}
.nav-cta{display:flex;gap:10px;align-items:center}
.menu-btn{display:none;background:none;border:1px solid var(--line-2);border-radius:10px;width:40px;height:40px;align-items:center;justify-content:center;cursor:pointer}
.menu-btn span{display:block;width:16px;height:1.5px;background:var(--text);position:relative}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0;width:16px;height:1.5px;background:var(--text)}
.menu-btn span::before{top:-5px}.menu-btn span::after{top:5px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px;border-radius:12px;font-weight:600;font-size:16px;letter-spacing:-.01em;transition:transform .15s ease,box-shadow .2s ease,background .2s ease,border-color .2s;white-space:nowrap;cursor:pointer;border:0}
.btn-sm{height:36px;padding:0 14px;font-size:16px;border-radius:10px}
.btn-primary{background:var(--green);color:var(--green-ink);box-shadow:0 0 0 1px rgba(57,255,110,.5),0 8px 30px -8px rgba(57,255,110,.55),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 0 0 1px rgba(57,255,110,.7),0 14px 40px -8px rgba(57,255,110,.7),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-ghost{background:rgba(255,255,255,.04);border:1px solid var(--line-2);color:var(--text)}
.btn-ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.24)}
.btn .arrow{transition:transform .15s}
.btn:hover .arrow{transform:translateX(3px)}

/* ---------- hero ---------- */
.hero{position:relative;padding:88px 0 40px;text-align:center;z-index:1}
.pill{display:inline-flex;align-items:center;gap:10px;padding:6px 14px 6px 8px;border-radius:999px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);font-size:16px;color:var(--text-2)}
.pill .dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);animation:pulse 2.4s ease-in-out infinite}
.pill b{color:var(--text);font-weight:600}
.hero h1{font-size:clamp(40px,6.6vw,80px);line-height:1.02;letter-spacing:-.045em;font-weight:650;margin:26px auto 22px;max-width:18ch;text-wrap:balance}
.hero h1 .grad{background:linear-gradient(180deg,#fff 10%,#9AA3B2 120%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero h1 .g{text-shadow:0 0 40px rgba(57,255,110,.35)}
.hero p.lede{font-size:clamp(17px,1.6vw,20px);color:var(--text-2);max-width:680px;margin:0 auto 34px;line-height:1.55}
.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.hero-cta .btn{height:50px;padding:0 22px;font-size:16px}
.ticks{display:flex;gap:22px;justify-content:center;flex-wrap:wrap;margin-top:26px;font-size:16px;color:var(--muted)}
.ticks span{display:inline-flex;align-items:center;gap:7px}
.ticks svg{color:var(--green)}

/* ---------- product mock ---------- */
.stage{position:relative;margin:64px auto 230px;max-width:1120px;perspective:2000px}
.stage::before{content:"";position:absolute;left:8%;right:8%;top:8%;bottom:-6%;background:radial-gradient(closest-side,rgba(57,255,110,.22),transparent 70%);filter:blur(40px);z-index:-1}
.window{position:relative;text-align:left;border-radius:18px;background:linear-gradient(180deg,rgba(18,24,36,.92),rgba(9,12,19,.96));border:1px solid var(--line-2);box-shadow:0 0 0 1px rgba(0,0,0,.6),0 40px 120px -30px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.06);overflow:hidden}
.window::after{content:"";position:absolute;inset:0;border-radius:18px;pointer-events:none;background:linear-gradient(180deg,rgba(57,255,110,.08),transparent 30%)}
.win-bar{display:flex;align-items:center;gap:14px;height:44px;padding:0 16px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.015)}
.lights{display:flex;gap:7px}.lights i{width:11px;height:11px;border-radius:50%;background:#2A303C;display:block}
.win-url{flex:1;display:flex;justify-content:center}
.win-url span{font-family:var(--mono);font-size:16px;color:var(--muted);background:rgba(255,255,255,.04);border:1px solid var(--line);padding:3px 12px;border-radius:7px}
.win-badge{font-family:var(--mono);font-size:16px;color:var(--green);border:1px solid rgba(57,255,110,.35);background:rgba(57,255,110,.08);padding:3px 8px;border-radius:6px}
.app{display:grid;grid-template-columns:200px 1fr;min-height:520px}
.side{border-right:1px solid var(--line);padding:18px 12px;display:flex;flex-direction:column;gap:4px;background:rgba(0,0,0,.18)}
.side .mark{display:flex;align-items:center;gap:10px;padding:4px 8px 16px;font-weight:600;font-size:16px}
.side .mark img{width:22px;height:auto}
.side a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;font-size:16px;color:var(--text-2)}
.side a.on{background:rgba(57,255,110,.08);color:var(--text);box-shadow:inset 2px 0 0 var(--green)}
.side a i{width:14px;height:14px;border-radius:4px;border:1.5px solid currentColor;opacity:.7;display:block}
.side .sp{flex:1}
.side .ro{margin:8px;padding:10px;border-radius:10px;border:1px dashed rgba(57,255,110,.35);font-size:16px;color:var(--text-2);line-height:1.45}
.side .ro b{color:var(--green);font-family:var(--mono);font-weight:500;display:block;font-size:16px;margin-bottom:2px}
.main{padding:20px 22px 22px;display:flex;flex-direction:column;gap:16px;min-width:0}
.main-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.main-head h3{margin:0;font-size:17px;letter-spacing:-.02em;font-weight:600}
.main-head p{margin:2px 0 0;font-size:16px;color:var(--muted)}
.chip{font-family:var(--mono);font-size:16px;padding:4px 9px;border-radius:7px;border:1px solid var(--line-2);color:var(--text-2);background:rgba(255,255,255,.03);white-space:nowrap}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.kpi{padding:14px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.kpi small{display:block;font-size:16px;color:var(--muted);margin-bottom:6px}
.kpi strong{font-size:24px;letter-spacing:-.03em;font-weight:620;font-variant-numeric:tabular-nums}
.kpi em{display:block;font-style:normal;font-size:16px;margin-top:4px;color:var(--text-2)}
.kpi.bad strong{color:#fff}.kpi.bad em{color:var(--red)}
.kpi.good strong{color:var(--green)}
.panels{display:grid;grid-template-columns:1.35fr 1fr;gap:12px}
.panel{border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.015);padding:14px}
.panel h4{margin:0 0 12px;font-size:16px;font-weight:550;color:var(--text-2);display:flex;justify-content:space-between}
.panel h4 span{font-family:var(--mono);font-weight:400;color:var(--muted);font-size:16px}
.bars{display:flex;align-items:flex-end;gap:10px;height:150px;padding-top:6px;border-bottom:1px solid var(--line)}
.bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;position:relative}
.bar .col{width:100%;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,var(--green),rgba(57,255,110,.25));height:0;transition:height 1.1s cubic-bezier(.2,.8,.2,1);box-shadow:0 0 18px -4px rgba(57,255,110,.6)}
.bar .col.paid{background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.06));box-shadow:none}
.bar b{position:absolute;top:-2px;font-size:16px;font-family:var(--mono);color:var(--text-2);font-weight:400;transform:translateY(-100%)}
.bar-x{display:flex;gap:10px;margin-top:6px}.bar-x span{flex:1;text-align:center;font-size:16px;color:var(--muted);font-family:var(--mono)}
.legend{display:flex;gap:14px;font-size:16px;color:var(--muted);margin-top:10px}
.legend i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px;background:var(--green)}
.legend i.w{background:rgba(255,255,255,.3)}
.leakrows{display:flex;flex-direction:column;gap:11px}
.leakrow .t{display:flex;justify-content:space-between;font-size:16px;margin-bottom:5px;color:var(--text-2)}
.leakrow .t b{font-family:var(--mono);font-weight:500;color:var(--text)}
.track{height:7px;border-radius:99px;background:rgba(255,255,255,.06);overflow:hidden}
.track i{display:block;height:100%;width:0;border-radius:99px;background:var(--red);transition:width 1.2s cubic-bezier(.2,.8,.2,1)}
.track i.a{background:var(--amber)}.track i.gg{background:var(--green)}
.quality{display:flex;align-items:center;gap:12px;margin-top:4px;padding-top:12px;border-top:1px solid var(--line)}
.quality .ring{--p:3;width:46px;height:46px;border-radius:50%;background:conic-gradient(var(--green) calc(var(--p)*1%),rgba(255,255,255,.08) 0);display:grid;place-items:center;flex:none}
.quality .ring::after{content:"";width:34px;height:34px;border-radius:50%;background:var(--panel)}
.quality p{margin:0;font-size:16px;color:var(--text-2);line-height:1.4}
.quality p b{color:var(--text)}

/* floating diff card */
.diff-float{position:absolute;right:-96px;bottom:-230px;width:400px;z-index:3;border-radius:14px;background:rgba(10,14,22,.96);border:1px solid rgba(57,255,110,.35);box-shadow:0 30px 80px -20px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.5),0 0 60px -20px rgba(57,255,110,.45);backdrop-filter:blur(10px);text-align:left;overflow:hidden;animation:float 6s ease-in-out infinite}
.diff-head{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}
.diff-head b{font-size:16px;font-weight:600;display:flex;align-items:center;gap:8px}
.diff-head b::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--amber);box-shadow:0 0 10px var(--amber)}
.diff-head span{font-family:var(--mono);font-size:16px;color:var(--muted)}
.diff-body{padding:8px 0;font-family:var(--mono);font-size:16px}
.drow{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:8px 14px;opacity:0;transform:translateY(6px);transition:opacity .5s,transform .5s}
.drow.in{opacity:1;transform:none}
.drow .k{color:var(--text-2);font-family:var(--font);font-size:16px}
.drow .v{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.del{color:#FF8FA3;background:rgba(255,92,122,.1);padding:1px 6px;border-radius:4px;text-decoration:line-through;text-decoration-color:rgba(255,92,122,.6)}
.add{color:var(--green);background:rgba(57,255,110,.1);padding:1px 6px;border-radius:4px}
.diff-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;border-top:1px solid var(--line);background:rgba(255,255,255,.015)}
.diff-foot small{font-size:16px;color:var(--muted)}
.diff-foot .acts{display:flex;gap:8px}
.mini{height:30px;padding:0 12px;border-radius:8px;font-size:16px;font-weight:600;display:inline-flex;align-items:center;border:1px solid var(--line-2);background:rgba(255,255,255,.04)}
.mini.ok{background:var(--green);color:var(--green-ink);border-color:transparent;box-shadow:0 0 20px -4px rgba(57,255,110,.7)}
.caption{margin:28px auto 0;font-size:16px;color:var(--muted);text-align:center;max-width:640px}

/* ---------- strip ---------- */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.012);margin-top:72px}
.strip .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-top:22px;padding-bottom:22px;flex-wrap:wrap}
.strip p{margin:0;font-size:16px;color:var(--muted)}
.strip ul{display:flex;gap:28px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.strip li{font-family:var(--mono);font-size:16px;color:var(--text-2);display:flex;align-items:center;gap:8px}
.strip li::before{content:"";width:6px;height:6px;border-radius:2px;background:var(--green);opacity:.8}

/* ---------- sections ---------- */
section{position:relative;z-index:1}
.sec{padding:120px 0 0}
.eyebrow{font-family:var(--mono);font-size:16px;letter-spacing:.08em;text-transform:uppercase;color:var(--green);margin:0 0 14px;display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:18px;height:1px;background:var(--green)}
.sec h2{font-size:clamp(32px,4.2vw,52px);line-height:1.06;letter-spacing:-.04em;font-weight:640;margin:0 0 18px;max-width:20ch}
.sec .sub{font-size:18px;color:var(--text-2);max-width:640px;margin:0;line-height:1.6}
.sec-head{margin-bottom:52px}
.sec-head.center{text-align:center}
.sec-head.center h2,.sec-head.center .sub{margin-left:auto;margin-right:auto}
.sec-head.center .eyebrow{justify-content:center}
.card{border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));position:relative;overflow:hidden}
.card:hover{border-color:var(--line-2)}

/* proof */
.proof-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.stat{padding:26px;grid-column:span 4;display:flex;flex-direction:column;gap:8px;min-height:190px}
.stat .n{font-size:clamp(38px,4.2vw,54px);letter-spacing:-.045em;font-weight:620;line-height:1;font-variant-numeric:tabular-nums}
.stat .n.g{text-shadow:0 0 30px rgba(57,255,110,.3)}
.stat .n.r{color:#fff}
.stat h3{margin:6px 0 0;font-size:16px;font-weight:600;letter-spacing:-.01em}
.stat p{margin:0;font-size:16px;color:var(--text-2);line-height:1.5}
.stat .tag{position:absolute;top:18px;right:18px;font-family:var(--mono);font-size:16px;color:var(--muted);border:1px solid var(--line);padding:2px 7px;border-radius:6px}
.stat.wide{grid-column:span 7}
.stat.narrow{grid-column:span 5}
.dots{display:grid;grid-template-columns:repeat(25,1fr);gap:5px;margin-top:10px}
.dots i{aspect-ratio:1;border-radius:3px;background:rgba(255,255,255,.08);display:block}
.dots i.on{background:var(--green);box-shadow:0 0 10px rgba(57,255,110,.7)}
.skus{display:flex;flex-direction:column;gap:12px;margin-top:8px}
.sku .t{display:flex;justify-content:space-between;font-size:16px;color:var(--text-2);margin-bottom:6px}
.sku .t b{color:var(--text);font-family:var(--mono);font-weight:500}
.sku .track{height:8px}
.sku .track i{background:linear-gradient(90deg,rgba(57,255,110,.35),var(--green))}
.footnote{font-size:16px;color:var(--muted);margin-top:18px;line-height:1.55;max-width:900px}

/* how */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:s}
.step{padding:28px}
.step .num{font-family:var(--mono);font-size:16px;color:var(--green);border:1px solid rgba(57,255,110,.35);background:rgba(57,255,110,.07);width:30px;height:30px;border-radius:9px;display:grid;place-items:center;margin-bottom:22px}
.step h3{margin:0 0 10px;font-size:20px;letter-spacing:-.02em;font-weight:600}
.step p{margin:0 0 18px;color:var(--text-2);font-size:16px}
.step code,.code-inline{font-family:var(--mono);font-size:16px;color:var(--text-2);background:rgba(255,255,255,.04);border:1px solid var(--line);padding:2px 6px;border-radius:5px}
.step ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:16px;color:var(--text-2)}
.step li{display:flex;gap:9px;align-items:flex-start}
.step li::before{content:"";flex:none;width:14px;height:14px;margin-top:4px;border-radius:4px;background:rgba(57,255,110,.15);box-shadow:inset 0 0 0 1px rgba(57,255,110,.5)}
.step-line{position:absolute;top:43px;left:72px;right:-16px;height:1px;background:linear-gradient(90deg,rgba(57,255,110,.5),transparent)}

/* bento features */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.feat{padding:26px;grid-column:span 2;min-height:220px;display:flex;flex-direction:column}
.feat.big{grid-column:span 3}
.feat .ic{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:rgba(57,255,110,.08);border:1px solid rgba(57,255,110,.25);color:var(--green);margin-bottom:18px}
.feat h3{margin:0 0 8px;font-size:17px;letter-spacing:-.015em;font-weight:600}
.feat p{margin:0;color:var(--text-2);font-size:16px}
.feat .tool{margin-top:auto;padding-top:18px;font-family:var(--mono);font-size:16px;color:var(--muted)}
.score{display:flex;flex-direction:column;gap:8px;margin-top:18px}
.score div{display:grid;grid-template-columns:1fr 46px 110px;align-items:center;gap:10px;font-size:16px;color:var(--text-2);padding:8px 10px;border:1px solid var(--line);border-radius:9px;background:rgba(0,0,0,.2)}
.score div b{font-family:var(--mono);font-weight:500;color:var(--text);text-align:right}
.score .d{font-family:var(--mono);font-size:16px;padding:2px 6px;border-radius:5px;text-align:center}
.d.ap{color:var(--green);background:rgba(57,255,110,.1)}.d.hd{color:var(--amber);background:rgba(255,181,71,.1)}.d.rj{color:#FF8FA3;background:rgba(255,92,122,.1)}

/* approval deep dive */
.split{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:center}
.checks{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-direction:column;gap:18px}
.checks li{display:grid;grid-template-columns:28px 1fr;gap:14px}
.checks .ck{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:rgba(57,255,110,.08);border:1px solid rgba(57,255,110,.3);color:var(--green)}
.checks h3{margin:0 0 3px;font-size:16px;font-weight:600}
.checks p{margin:0;font-size:16px;color:var(--text-2)}
.term{border-radius:16px;border:1px solid var(--line-2);background:#070A11;box-shadow:0 30px 80px -30px rgba(0,0,0,.9),0 0 80px -40px rgba(57,255,110,.5);overflow:hidden}
.term .win-bar{background:rgba(255,255,255,.02)}
.term pre{margin:0;padding:20px 22px;font-family:var(--mono);font-size:16px;line-height:1.75;color:var(--text-2);overflow-x:auto}
.term .c{color:var(--muted)}.term .k{color:#9CC3FF}.term .s{color:var(--green)}.term .w{color:var(--amber)}.term .r{color:#FF8FA3}
.dtable{width:100%;border-collapse:collapse;font-size:16px}
.dtable th,.dtable td{padding:7px 8px;border-bottom:1px solid var(--line);text-align:left;font-family:var(--mono);font-weight:400}
.dtable th{color:var(--muted);font-size:16px;text-transform:uppercase;letter-spacing:.06em}

/* calculator */
.calc{display:grid;grid-template-columns:1.05fr 1fr;gap:0;overflow:hidden}
.calc-in{padding:34px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:26px}
.field label{display:flex;justify-content:space-between;align-items:baseline;font-size:16px;color:var(--text-2);margin-bottom:12px}
.field label output{font-family:var(--mono);color:var(--text);font-size:16px;background:rgba(255,255,255,.04);border:1px solid var(--line);padding:2px 10px;border-radius:7px}
.field .hint{font-size:16px;color:var(--muted);margin-top:8px}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:99px;background:linear-gradient(90deg,var(--green) var(--fill,50%),rgba(255,255,255,.1) var(--fill,50%));outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--green);box-shadow:0 0 0 4px rgba(57,255,110,.15),0 0 16px rgba(57,255,110,.6);cursor:pointer}
input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid var(--green);cursor:pointer}
.calc-out{padding:34px;background:radial-gradient(120% 90% at 100% 0%,rgba(57,255,110,.10),transparent 60%);display:flex;flex-direction:column;gap:18px}
.calc-out .big{font-size:clamp(44px,5vw,64px);font-weight:640;letter-spacing:-.045em;line-height:1;color:var(--green);text-shadow:0 0 40px rgba(57,255,110,.35);font-variant-numeric:tabular-nums}
.calc-out .lbl{font-size:16px;color:var(--text-2)}
.outs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px}
.outs div{border:1px solid var(--line);border-radius:12px;padding:14px;background:rgba(0,0,0,.2)}
.outs small{display:block;font-size:16px;color:var(--muted);margin-bottom:4px}
.outs b{font-size:21px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.calc-out .fine{font-size:16px;color:var(--muted);margin-top:auto}

/* compare */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:rgba(255,255,255,.012)}
table.cmp{width:100%;border-collapse:collapse;min-width:880px;font-size:16px}
.cmp th,.cmp td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.cmp thead th{font-size:16px;color:var(--text-2);font-weight:550;background:rgba(255,255,255,.02)}
.cmp thead th.us{color:var(--text);background:rgba(57,255,110,.07);box-shadow:inset 0 2px 0 var(--green)}
.cmp td.us{background:rgba(57,255,110,.035);color:var(--text)}
.cmp tbody th{font-weight:550;color:var(--text);width:220px;font-size:16px}
.cmp td{color:var(--text-2)}
.cmp tr:last-child th,.cmp tr:last-child td{border-bottom:0}
.y{color:var(--green);font-weight:600}
.nl{color:var(--muted)}

/* pricing */
.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.plan{padding:28px 24px;display:flex;flex-direction:column}
.plan.hot{border-color:rgba(57,255,110,.45);background:linear-gradient(180deg,rgba(57,255,110,.09),rgba(57,255,110,.01) 60%);box-shadow:0 0 0 1px rgba(57,255,110,.2),0 30px 80px -40px rgba(57,255,110,.6)}
.plan .badge{position:absolute;top:18px;right:18px;font-family:var(--mono);font-size:16px;color:var(--green-ink);background:var(--green);padding:3px 8px;border-radius:6px;font-weight:600}
.plan h3{margin:0;font-size:16px;font-weight:600}
.plan .for{font-size:16px;color:var(--muted);margin:4px 0 22px;min-height:40px}
.plan .price{font-size:44px;font-weight:640;letter-spacing:-.04em;line-height:1}
.plan .price small{font-size:16px;color:var(--muted);font-weight:500;letter-spacing:0}
.plan ul{list-style:none;padding:0;margin:24px 0 28px;display:flex;flex-direction:column;gap:10px;font-size:16px;color:var(--text-2)}
.plan li{display:flex;gap:10px}
.plan li svg{flex:none;margin-top:4px;color:var(--green)}
.plan .btn{margin-top:auto;width:100%}

/* trust */
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.tcard{padding:26px}
.tcard .ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(57,255,110,.08);border:1px solid rgba(57,255,110,.25);color:var(--green);margin-bottom:18px}
.tcard h3{margin:0 0 8px;font-size:16.5px;font-weight:600}
.tcard p{margin:0;font-size:16px;color:var(--text-2)}
.disclaimer{margin-top:22px;font-size:16px;color:var(--muted);text-align:center}

/* faq */
.faq{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:10px}
.faq details{border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.015);padding:0 22px;transition:border-color .2s,background .2s}
.faq details[open]{border-color:var(--line-2);background:rgba(255,255,255,.03)}
.faq summary{list-style:none;cursor:pointer;padding:20px 0;font-weight:560;font-size:16px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono);font-size:20px;color:var(--green);transition:transform .2s;flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 20px;color:var(--text-2);font-size:16px}

/* final cta */
.final{margin-top:140px;text-align:center;padding:80px 24px;border-radius:24px;border:1px solid var(--line-2);position:relative;overflow:hidden;background:radial-gradient(70% 120% at 50% 0%,rgba(57,255,110,.16),transparent 60%),linear-gradient(180deg,#0A0F18,#06080E)}
.final::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse at 50% 0%,#000,transparent 70%);mask-image:radial-gradient(ellipse at 50% 0%,#000,transparent 70%)}
.final>*{position:relative}
.final img.tile{width:72px;height:72px;margin:0 auto 24px;border-radius:18px;box-shadow:0 0 60px -10px rgba(57,255,110,.6)}
.final h2{font-size:clamp(32px,4.4vw,54px);letter-spacing:-.04em;line-height:1.05;margin:0 auto 16px;max-width:18ch;font-weight:640}
.final p{color:var(--text-2);font-size:18px;margin:0 auto 30px;max-width:560px}

/* footer */
footer{margin-top:100px;border-top:1px solid var(--line);padding:48px 0 56px;position:relative;z-index:1}
.foot{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px}
.foot img{height:28px;width:auto;margin-bottom:14px}
.foot p{margin:0;color:var(--muted);font-size:16px;max-width:340px}
.foot h4{margin:0 0 12px;font-size:16px;color:var(--text);font-weight:600}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:16px;color:var(--muted)}
.foot a:hover{color:var(--text)}
.legal{margin-top:40px;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:16px;color:var(--muted)}

/* reveal */
.rv{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}

@keyframes pulse{0%,100%{opacity:1}50%{opacity:.45}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes scan{0%{transform:translateY(-100%)}100%{transform:translateY(600%)}}
.scan{position:absolute;left:0;right:0;top:44px;height:80px;background:linear-gradient(180deg,transparent,rgba(57,255,110,.05),transparent);animation:scan 6s linear infinite;pointer-events:none}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .nav-links{display:none}
  .nav.open{background:#05070D;backdrop-filter:none;-webkit-backdrop-filter:none}
  .menu-btn{display:inline-flex}
  .nav.open .nav-links{display:flex;flex-direction:column;align-items:stretch;gap:0;position:absolute;top:100%;left:0;right:0;padding:8px 18px 18px;background:#05070D;box-shadow:0 30px 60px rgba(0,0,0,.8);border-bottom:1px solid var(--line)}
  .nav.open .nav-links a{padding:14px 4px;border-bottom:1px solid var(--line);font-size:16px}
  .stage{margin-bottom:0}
  .diff-float{position:relative;right:auto;bottom:auto;width:min(420px,calc(100% - 28px));margin:-32px 24px 0 auto}
  .plans{grid-template-columns:repeat(2,1fr)}
  .trust{grid-template-columns:repeat(2,1fr)}
  .stat{grid-column:span 6}.stat.wide,.stat.narrow{grid-column:span 12}
}
@media (max-width:860px){
  .app{grid-template-columns:1fr}
  .side{display:none}
  .panels{grid-template-columns:1fr}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .split{grid-template-columns:1fr;gap:36px}
  .steps{grid-template-columns:1fr}.step-line{display:none}
  .bento{grid-template-columns:1fr}.feat,.feat.big{grid-column:auto}
  .calc{grid-template-columns:1fr}.calc-in{border-right:0;border-bottom:1px solid var(--line)}
  .foot{grid-template-columns:1fr 1fr}
  .diff-float{position:relative;right:auto;bottom:auto;width:auto;margin:-28px 14px 0;animation:none}
  .caption{margin-top:24px}
}
@media (max-width:560px){
  .wrap{padding:0 18px}
  .nav .wrap{height:60px}
  .brand img{height:24px}
  .nav-cta .btn-ghost{display:none}
  .hero{padding:56px 0 24px}
  .hero h1{font-size:40px;letter-spacing:-.04em}
  .hero-cta .btn{width:100%}
  .ticks{gap:10px 16px}
  .stage{margin-top:44px}
  .win-url{display:none}
  .main{padding:16px 14px}
  .kpi strong{font-size:20px}
  .sec{padding-top:88px}
  .plans,.trust{grid-template-columns:1fr}
  .stat{grid-column:span 12;min-height:0}
  .dots{grid-template-columns:repeat(20,1fr)}
  .outs{grid-template-columns:1fr 1fr}
  .calc-in,.calc-out{padding:24px}
  .foot{grid-template-columns:1fr}
  .final{padding:56px 20px;margin-top:100px}
  .strip ul{gap:14px 20px}
  .pill-x{display:none}
  .swipe{display:block}
  .cmp th,.cmp td{padding:14px 14px;font-size:16px}
  .cmp td{min-width:150px}
  .cmp tbody th,.cmp thead th:first-child{position:sticky;left:0;z-index:2;background:#0A0D15;min-width:128px;max-width:128px;box-shadow:1px 0 0 var(--line)}
  .hero h1{font-size:38px}
  .drow{grid-template-columns:1fr;gap:4px}
  .diff-head span{display:none}
  .diff-foot small{display:none}
  .diff-foot .acts{margin-left:auto}
}
.mini{white-space:nowrap}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
  .drow{opacity:1;transform:none}
}

.swipe{display:none;font-size:16px;color:var(--muted);margin:0 0 10px;font-family:var(--mono)}
/* case-study acceleration rows: before (muted) vs after (red) */
.sku .track+.track{margin-top:4px}
.sku .track i.a{background:rgba(255,255,255,.28)}
.sku .track i:not(.a):not(.gg){background:linear-gradient(90deg,rgba(255,92,122,.35),var(--red))}
.sku .track i.gg{background:var(--green)}

/* ===================== v5: visual-first case study ===================== */
.sec .sub b{color:var(--text);font-weight:600}
.lead-in{display:inline-block;font-family:var(--mono);font-size:16px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.lead-in.g{color:var(--green)}.lead-in.r{color:#FF8FA3}
.fn{font-size:16px!important;color:var(--muted)!important;line-height:1.5}
.footnote.center{text-align:center;margin-left:auto;margin-right:auto}

/* benefits */
.benefits{padding:72px 0 0}
.bens{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ben{padding:22px 22px 24px;border-radius:var(--radius);border:1px solid var(--line);background:linear-gradient(180deg,rgba(57,255,110,.05),rgba(255,255,255,.01) 70%)}
.ben-ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:var(--green);background:rgba(57,255,110,.1);border:1px solid rgba(57,255,110,.3);box-shadow:0 0 30px -8px rgba(57,255,110,.5);margin-bottom:16px}
.ben h3{margin:0 0 6px;font-size:18px;letter-spacing:-.02em;font-weight:620}
.ben p{margin:0;font-size:16px;color:var(--text-2);line-height:1.5}

/* case-study brand */
.cs-brand{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:6px 0 22px}
.cs-brand img{height:44px;width:auto}
.cs-brand span{font-size:16px;color:var(--text-2);padding:6px 12px;border:1px solid var(--line-2);border-radius:999px;background:rgba(255,255,255,.03)}
.cs-brand span b{color:var(--text);font-weight:600}

/* tabs */
.tabs{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:-16px 0 22px}
.tabs button{height:38px;padding:0 16px;border-radius:10px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--text-2);font-size:16px;font-weight:550;cursor:pointer;transition:all .2s}
.tabs button:hover{color:var(--text);border-color:rgba(255,255,255,.24)}
.tabs button[aria-selected=true]{background:rgba(57,255,110,.12);border-color:rgba(57,255,110,.5);color:var(--text);box-shadow:inset 0 0 0 1px rgba(57,255,110,.2),0 0 24px -8px rgba(57,255,110,.6)}
.tab-range{margin-left:auto;font-family:var(--mono);font-size:16px;color:var(--muted)}

/* stat tiles */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.tile{padding:22px 22px 20px;display:flex;flex-direction:column;gap:6px}
.tile-ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;margin-bottom:8px}
.tile-ic.r{color:#FF8FA3;background:rgba(255,92,122,.1);border:1px solid rgba(255,92,122,.3)}
.tile-ic.a{color:var(--amber);background:rgba(255,181,71,.1);border:1px solid rgba(255,181,71,.3)}
.tile small{font-size:16px;color:var(--muted);font-weight:500}
.tile .n{font-size:clamp(34px,3.4vw,46px);font-weight:640;letter-spacing:-.045em;line-height:1.05;font-variant-numeric:tabular-nums;color:#fff}
.tile .n.na{font-size:24px;color:var(--text-2);letter-spacing:-.02em;padding:8px 0 6px}
.tile p{margin:0;font-size:16px;color:var(--text-2);line-height:1.5}
.tile p b{color:var(--text);font-weight:600}
.tile .fn{margin-top:auto;padding-top:10px;border-top:1px dashed var(--line)}
.tile .proj{display:inline-block;font-family:var(--mono);font-size:16px;color:var(--amber);border:1px solid rgba(255,181,71,.4);padding:1px 6px;border-radius:5px;margin-left:6px;vertical-align:middle;letter-spacing:.04em}

/* charts */
.charts{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.chart{padding:24px}
.chart header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:18px}
.chart h3{margin:0;font-size:19px;letter-spacing:-.02em;font-weight:620;line-height:1.25}
.vbars{display:flex;align-items:flex-end;gap:3px;height:170px;border-bottom:1px solid var(--line);position:relative}
.vbars .vb{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;position:relative}
.vbars .vb i{display:block;width:100%;border-radius:4px 4px 1px 1px;height:0;transition:height 1.1s cubic-bezier(.2,.8,.2,1);background:rgba(255,255,255,.16)}
.vbars .vb.sel i{background:linear-gradient(180deg,#FF8FA3,rgba(255,92,122,.35));box-shadow:0 0 16px -4px rgba(255,92,122,.6)}
.vbars.stack .vb i.kept{background:linear-gradient(180deg,var(--green),rgba(57,255,110,.3));border-radius:1px}
.vbars.stack .vb i.cut{background:repeating-linear-gradient(135deg,rgba(255,92,122,.85) 0 3px,rgba(255,92,122,.35) 3px 6px);border-radius:4px 4px 0 0}
.vbars.stack .vb.sel{box-shadow:inset 0 -1px 0 var(--amber)}
.vx{display:flex;gap:3px;margin-top:6px}.vx span{flex:1;text-align:center;font-size:16px;color:var(--muted);font-family:var(--mono);white-space:nowrap}
.legend i.sel{background:#FF8FA3}.legend i.kept{background:var(--green)}.legend i.cut{background:repeating-linear-gradient(135deg,rgba(255,92,122,.9) 0 2px,rgba(255,92,122,.3) 2px 4px)}
.deltas{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}
.deltas div{border:1px solid var(--line);border-radius:12px;padding:12px;background:rgba(0,0,0,.2)}
.deltas small{display:block;font-size:16px;color:var(--muted);margin-bottom:4px}
.deltas b{display:block;font-size:19px;font-weight:620;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
.deltas b span{color:#FF8FA3;font-weight:400}
.deltas b.g{color:var(--green)}
.deltas em{display:block;font-style:normal;font-size:16px;color:var(--text-2);margin-top:2px}
.chart .fn{margin:14px 0 0}

/* three visuals */
.viz3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.viz{padding:24px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.viz h3{margin:14px 0 4px;font-size:17px;letter-spacing:-.015em;font-weight:600;line-height:1.3}
.viz p{margin:0;font-size:16px;color:var(--text-2);line-height:1.5}
.donut{--p:95.9;width:150px;height:150px;border-radius:50%;margin:8px auto 0;align-self:center;background:conic-gradient(var(--green) calc(var(--p)*1%),rgba(255,255,255,.08) 0);display:grid;place-items:center;box-shadow:0 0 50px -16px rgba(57,255,110,.6)}
.donut>div{width:110px;height:110px;border-radius:50%;background:#090C14;display:flex;flex-direction:column;align-items:center;justify-content:center}
.donut b{font-size:28px;font-weight:640;letter-spacing:-.03em;color:var(--green)}
.donut small{font-size:16px;color:var(--muted);font-family:var(--mono)}
.viz .dots{width:100%;grid-template-columns:repeat(20,1fr);gap:4px;margin-top:12px}
.viz .dots i{background:rgba(255,92,122,.22)}
.gauge{--v:1.39;position:relative;width:200px;margin:10px auto 0;align-self:center}
.gauge svg{width:100%;display:block;overflow:visible}
.gauge .gt{fill:none;stroke:rgba(255,255,255,.08);stroke-width:12;stroke-linecap:round}
.gauge .gv{fill:none;stroke:var(--green);stroke-width:12;stroke-linecap:round;stroke-dasharray:calc(var(--v)*100/6) 200;filter:drop-shadow(0 0 6px rgba(57,255,110,.7))}
.gauge .tg{stroke:var(--amber);stroke-width:2.5}
.gauge>div{position:absolute;left:0;right:0;bottom:-2px;text-align:center}
.gauge b{display:block;font-size:28px;font-weight:640;letter-spacing:-.03em;line-height:1;color:#fff}
.gauge small{font-size:16px;color:var(--amber);font-family:var(--mono)}
.scale{display:flex;justify-content:space-between;font-family:var(--mono);font-size:16px;color:var(--muted);margin-top:6px}

/* testimonial */
.quote{margin:16px 0 0;padding:40px 44px;display:grid;grid-template-columns:auto 1fr;gap:10px 28px;align-items:start;background:radial-gradient(80% 140% at 0% 0%,rgba(57,255,110,.10),transparent 60%),linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));border-color:rgba(57,255,110,.25)}
.quote .qmark{color:var(--green);opacity:.85;grid-row:span 2}
.quote blockquote{margin:0;font-size:clamp(19px,1.9vw,24px);line-height:1.45;letter-spacing:-.015em;font-weight:500;color:var(--text);text-wrap:pretty}
.quote figcaption{display:flex;align-items:center;gap:16px;margin-top:18px}
.quote figcaption img{height:32px;width:auto}
.quote figcaption span{font-size:16px;color:var(--muted);border-left:1px solid var(--line-2);padding-left:16px}
.quote figcaption b{display:block;color:var(--text);font-size:16px;font-weight:600}

/* accordions */
.acc{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.acc details{border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.015);padding:0 20px}
.acc details[open]{background:rgba(255,255,255,.03);border-color:var(--line-2)}
.acc summary{list-style:none;cursor:pointer;padding:16px 0;font-size:16px;color:var(--text-2);display:flex;justify-content:space-between;align-items:center;gap:12px}
.acc summary b{color:var(--text);font-weight:600}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-family:var(--mono);font-size:18px;color:var(--green);transition:transform .2s}
.acc details[open] summary::after{transform:rotate(45deg)}
.acc details p{margin:0 0 14px;font-size:16px;color:var(--text-2);line-height:1.6;max-width:920px}
.acc .tbl-wrap{margin:0 0 18px}
.wtable{width:100%;border-collapse:collapse;font-size:16px;min-width:640px}
.wtable th,.wtable td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:right;font-variant-numeric:tabular-nums}
.wtable th:first-child,.wtable td:first-child{text-align:left;color:var(--text-2)}
.wtable thead th{font-size:16px;color:var(--muted);font-weight:550}
.wtable td.on,.wtable th.on{background:rgba(57,255,110,.06);color:var(--text)}
.wtable tr:last-child td{border-bottom:0}

/* leak vs fixed */
.vs{display:grid;grid-template-columns:1fr 56px 1fr;align-items:stretch}
.vs-col{border-radius:var(--radius);border:1px solid var(--line);padding:28px}
.vs-col.bad{background:linear-gradient(180deg,rgba(255,92,122,.07),rgba(255,255,255,.01) 70%);border-color:rgba(255,92,122,.22)}
.vs-col.good{background:linear-gradient(180deg,rgba(57,255,110,.08),rgba(255,255,255,.01) 70%);border-color:rgba(57,255,110,.3);box-shadow:0 30px 80px -50px rgba(57,255,110,.7)}
.vs-col h3{margin:0 0 18px;font-size:18px;font-weight:620;display:flex;align-items:center;gap:10px}
.vs-dot{width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 12px var(--red)}
.good .vs-dot{background:var(--green);box-shadow:0 0 12px var(--green)}
.vs-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0}
.vs-col li{display:flex;flex-direction:column;gap:2px;padding:13px 0 13px 30px;border-top:1px solid var(--line);position:relative}
.vs-col li::before{content:"✕";position:absolute;left:2px;top:13px;font-size:16px;color:#FF8FA3;font-weight:700}
.good li::before{content:"✓";color:var(--green)}
.vs-col li b{font-size:16px;font-weight:600;color:var(--text)}
.vs-col li span{font-size:16px;color:var(--text-2)}
.vs-mid{display:grid;place-items:center}
.vs-mid span{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:var(--green-ink);font-weight:700;box-shadow:0 0 30px -4px rgba(57,255,110,.8)}

/* steps v5 */
.step-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.step-top .num{margin:0}
.step-ic{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;color:var(--green);background:rgba(57,255,110,.1);border:1px solid rgba(57,255,110,.32);box-shadow:0 0 34px -8px rgba(57,255,110,.55)}
.step-line{top:53px;left:92px}

@media (max-width:1080px){
  .bens{grid-template-columns:repeat(2,1fr)}
  .tiles{grid-template-columns:repeat(2,1fr)}
  .charts{grid-template-columns:1fr}
  .viz3{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .vs{grid-template-columns:1fr;gap:0}
  .vs-mid{padding:10px 0}.vs-mid span{transform:rotate(90deg)}
  .viz3{grid-template-columns:1fr}
}
@media (max-width:560px){
  .benefits{padding-top:56px}
  .bens{grid-template-columns:1fr 1fr;gap:10px}
  .ben{padding:16px}
  .ben-ic{width:38px;height:38px;margin-bottom:12px}
  .ben h3{font-size:16px}
  .ben p{font-size:16px}
  .tiles{grid-template-columns:1fr 1fr;gap:10px}
  .tile{padding:16px}
  .tile .n{font-size:30px}
  .tile p{font-size:16px}
  .tile-ic{display:none}
  .tabs{margin-top:-24px}
  .tabs button{flex:1;padding:0 8px;font-size:16px}
  .tab-range{margin:6px 0 0;width:100%}
  .chart{padding:18px}
  .vbars{height:130px;gap:2px}.vx{gap:2px}
  .deltas{grid-template-columns:1fr 1fr}
  .deltas div:last-child{grid-column:span 2}
  .deltas b{font-size:17px}
  .quote{grid-template-columns:1fr;padding:28px 22px}
  .quote .qmark{grid-row:auto}
  .cs-brand img{height:36px}
  .vs-col{padding:20px}
}
.viz .dots{grid-template-columns:repeat(10,1fr);gap:4px;width:150px;margin:8px auto 0;align-self:center}
.viz .dots i.on{background:var(--green);box-shadow:0 0 10px rgba(57,255,110,.8)}
.legend i.gray{background:rgba(255,255,255,.3)}
.scale{font-size:16px!important}
@media (max-width:560px){.viz .dots{grid-template-columns:repeat(10,1fr);width:150px}}
/* who it's for */
.hero p.lede b{color:var(--text);font-weight:600;display:block;margin-bottom:6px}
.who{padding:72px 0 0}
.who-lbl{font-family:var(--mono);font-size:16px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:center;margin:0 0 16px}
.who-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.who-card{display:flex;gap:18px;align-items:flex-start;padding:24px 26px;border-radius:var(--radius);border:1px solid rgba(57,255,110,.22);background:linear-gradient(135deg,rgba(57,255,110,.07),rgba(255,255,255,.01) 60%)}
.who-ic{flex:none;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;color:var(--green-ink);background:var(--green);box-shadow:0 0 30px -6px rgba(57,255,110,.7)}
.who-card h3{margin:0 0 4px;font-size:20px;letter-spacing:-.02em;font-weight:640}
.who-card p{margin:0;font-size:16px;color:var(--text-2);line-height:1.5}
.benefits{padding-top:16px}
@media (max-width:860px){.who-row{grid-template-columns:1fr}}
@media (max-width:560px){.who{padding-top:56px}.who-card{padding:18px}.who-card h3{font-size:18px}}
@media (min-width:861px){.hero h1{max-width:none}.hero h1 span{white-space:nowrap}}

/* ===================== v5.1: legibility type scale (floor 14px labels/footnotes, 15px+ readable, 16–18px body) + AA contrast ===================== */
:root{--muted:#9AA3B2;--text-2:#C3CAD6}
body{font-size:17px}
.pill{font-size:16px}.ticks{font-size:16px}
.caption{font-size:16px;max-width:760px;line-height:1.55}
.strip p,.strip li{font-size:16px}
.eyebrow{font-size:16px}
.sec .sub{font-size:19px}
.hero p.lede{font-size:clamp(17px,1.6vw,20px)}
/* mock dashboard */
.win-url span,.win-badge,.chip{font-size:16px}
.side a{font-size:16px}.side .mark{font-size:16px}
.side .ro,.side .ro b{font-size:16px}
.main-head h3{font-size:19px}.main-head p{font-size:16px}
.kpi small,.kpi em{font-size:16px}.kpi strong{font-size:27px}
.panel h4,.panel h4 span{font-size:16px}
.bar-x span,.legend{font-size:16px}
.leakrow .t,.quality p{font-size:16px}
.diff-head b{font-size:16px}.diff-head span{font-size:16px}
.diff-body,.drow .k{font-size:16px}.diff-foot small{font-size:16px}.mini{font-size:16px;height:34px}
.diff-float{width:440px}
/* sections */
.step p{font-size:16px}.step ul{font-size:16px}.step .num{font-size:16px;width:34px;height:34px}
.feat h3{font-size:19px}.feat p{font-size:16px}.feat .tool{font-size:16px}
.score div{font-size:16px;grid-template-columns:1fr 48px 124px}.score .d{font-size:16px}
.checks h3{font-size:18px}.checks p{font-size:16px}.code-inline,.step code{font-size:16px}
.term pre{font-size:16px}.dtable{font-size:16px}.dtable th{font-size:16px}
.field label{font-size:16px}.field label output{font-size:16px}.field .hint{font-size:16px}
.calc-out .lbl{font-size:16px}.outs small{font-size:16px}.outs b{font-size:23px}.calc-out .fine{font-size:16px}
table.cmp{font-size:16px}.cmp thead th{font-size:16px}.cmp tbody th{font-size:16px}
.footnote{font-size:16px}.swipe{font-size:16px}
.plan h3{font-size:18px}.plan .for{font-size:16px}.plan ul{font-size:16px}.plan .badge{font-size:16px}
.tcard h3{font-size:18px}.tcard p{font-size:16px}.disclaimer{font-size:16px}
.faq summary{font-size:17px}.faq details p{font-size:16px}
.foot p,.foot ul{font-size:16px}.foot h4{font-size:16px}.legal{font-size:16px}
/* case study + new blocks */
.lead-in{font-size:16px}.fn{font-size:16px!important}
.who-lbl{font-size:16px}.who-card p{font-size:16px}
.ben h3{font-size:19px}.ben p{font-size:16px}
.cs-brand span{font-size:16px}
.tabs button{font-size:16px;height:42px}.tab-range{font-size:16px}
.tile small{font-size:16px}.tile p{font-size:16px}.tile .proj{font-size:16px}
.chart h3{font-size:20px}.vx span{font-size:16px}
.deltas small,.deltas em{font-size:16px}.deltas b{font-size:21px}
.viz h3{font-size:18.5px}.viz p{font-size:16px}
.donut small,.gauge small,.scale{font-size:16px!important}
.quote figcaption span{font-size:16px}.quote figcaption b{font-size:16.5px}
.acc summary{font-size:16px}.acc details p{font-size:16px}
.wtable{font-size:16px}.wtable thead th{font-size:16px}
.vs-col li b{font-size:17px}.vs-col li span{font-size:16px}.vs-col h3{font-size:20px}
@media (max-width:560px){
  body{font-size:16px}
  .sec .sub{font-size:17px}
  .tiles{grid-template-columns:1fr}
  .tile p{font-size:16px}.tile .n{font-size:36px}
  .bens{grid-template-columns:1fr}
  .ben{display:grid;grid-template-columns:44px 1fr;gap:4px 14px;align-items:start}
  .ben-ic{grid-row:span 2;margin:0}
  .ben h3{font-size:17px;margin:0}.ben p{font-size:16px}
  .kpi small,.kpi em{font-size:16px}.kpi strong{font-size:22px}
  .cmp th,.cmp td{font-size:16px}
  .cmp td{min-width:170px}
  .deltas b{font-size:19px}
  .score div{grid-template-columns:1fr 40px 104px;font-size:16px}
  .diff-float{width:auto}
  .vx span:nth-child(odd){visibility:visible}
}
.tile .proj{font-size:16px}.vs-col li::before{font-size:16px}
@media (min-width:1081px){.diff-float{bottom:-292px}.stage{margin-bottom:330px}}
.side .ro b{overflow-wrap:anywhere;letter-spacing:0}
.side .ro b{overflow-wrap:normal}

/* ===================== v12: 2-minute layout, add-on pricing, works-with-your-stack ===================== */
:root{--muted:#B8C0CC;--text-2:#D3D9E2}
body{font-size:20px;line-height:1.6}
.sec{padding-top:104px}
.sec .sub{font-size:21px;max-width:720px}
.hero p.lede{font-size:clamp(20px,1.8vw,23px);max-width:760px}
/* problem */
.problem{padding:96px 0 0}
.prob{padding:56px 48px 44px;text-align:center;border-color:rgba(255,92,122,.3);background:radial-gradient(70% 120% at 50% 0%,rgba(255,92,122,.12),transparent 65%),linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01))}
.prob .eyebrow{justify-content:center}
.prob-n{font-size:clamp(96px,14vw,184px);font-weight:700;letter-spacing:-.06em;line-height:.95;color:#FF8FA3;font-variant-numeric:tabular-nums;text-shadow:0 0 80px rgba(255,92,122,.35)}
.prob-t{font-size:clamp(22px,2.4vw,32px);line-height:1.3;letter-spacing:-.02em;max-width:24ch;margin:14px auto 30px;color:var(--text)}
.prob-t b{color:#FF8FA3}
.prob-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:820px;margin:0 auto 22px}
.prob-row div{border:1px solid var(--line-2);border-radius:14px;padding:16px 12px;background:rgba(255,255,255,.02)}
.prob-row b{display:block;font-size:32px;letter-spacing:-.03em;color:#fff}
.prob-row span{font-size:17px;color:var(--text-2)}
.prob .fn{max-width:760px;margin:0 auto}
/* case-study brand */
.cs-hero{text-align:center;margin-bottom:44px}
.cs-hero .eyebrow{justify-content:center}
.cs-logo{width:min(440px,78vw);height:auto;margin:18px auto 18px}
.cs-claim{font-size:clamp(24px,2.6vw,34px);letter-spacing:-.02em;line-height:1.3;margin:0 0 26px;color:var(--text);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 16px}
.cs-claim b{color:#FFC93C;font-weight:650}
.cs-pill{display:inline-block;font-size:clamp(18px,1.8vw,22px);font-weight:600;color:var(--green-ink);background:linear-gradient(180deg,#FFD54A,#FFB21F);border-radius:999px;padding:6px 18px;letter-spacing:-.01em}
.cs-hero h2,.cs-hero .sub{margin-left:auto;margin-right:auto}
.quote{margin-top:20px}
.quote figcaption img{height:52px}
.quote blockquote{font-size:clamp(22px,2.2vw,28px)}
.charts{grid-template-columns:1.5fr 1fr;margin-top:20px}
.viz2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:4px 0 20px}
/* solution */
.fixes{display:flex;flex-direction:column;gap:16px}
.fixrow{display:grid;grid-template-columns:1.05fr 44px 1.35fr 1fr;gap:24px;align-items:center;padding:26px 28px}
.fx-found b{display:block;font-size:40px;letter-spacing:-.04em;line-height:1.05;color:#FF8FA3;margin:6px 0 6px}
.fx-found p,.fx-fix p,.fx-up p{margin:0;font-size:17px;line-height:1.5;color:var(--text-2)}
.fx-arrow{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:var(--green-ink);font-weight:800;font-size:22px;box-shadow:0 0 30px -6px rgba(57,255,110,.7)}
.fx-fix{display:flex;gap:16px;align-items:flex-start}
.fx-ic{flex:none;width:52px;height:52px;border-radius:14px;display:grid;place-items:center;color:var(--green);background:rgba(57,255,110,.1);border:1px solid rgba(57,255,110,.3)}
.fx-fix h3{font-size:23px;line-height:1.2;letter-spacing:-.02em;margin:4px 0 6px}
.fx-up{border-left:1px dashed var(--line-2);padding-left:22px}
.fx-up p b{color:#fff}
.tag{display:inline-block;font-family:var(--mono);font-size:16px;letter-spacing:.02em;padding:3px 10px;border-radius:7px;margin-bottom:8px;border:1px solid}
.tag.a{color:var(--amber);border-color:rgba(255,181,71,.45);background:rgba(255,181,71,.08)}
.upside{margin:20px 0;padding:30px 32px;display:grid;grid-template-columns:1fr 1.3fr;gap:28px;align-items:center;border-color:rgba(255,181,71,.35);background:radial-gradient(60% 140% at 100% 0%,rgba(255,181,71,.10),transparent 60%),linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01))}
.upside h3{font-size:28px;letter-spacing:-.02em;margin:0 0 6px}
.upside p{margin:0;font-size:17px;color:var(--text-2)}
.up-n{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.up-n div{border:1px solid var(--line-2);border-radius:14px;padding:18px}
.up-n b{display:block;font-size:40px;letter-spacing:-.04em;color:var(--amber);line-height:1.1}
.up-n span{font-size:17px;color:var(--text-2)}
#solution .chart{margin-top:0}
/* stack */
.flow3{display:grid;grid-template-columns:1fr 48px 1.15fr 48px 1fr;gap:14px;align-items:stretch}
.f3{padding:26px 24px}
.f3 h3{font-size:22px;line-height:1.25;letter-spacing:-.02em;margin:6px 0 8px}
.f3 h3 em{font-style:normal;color:var(--text-2)}
.f3 p{margin:0;font-size:17px;color:var(--text-2);line-height:1.5}
.f3.us{border-color:rgba(57,255,110,.45);background:radial-gradient(80% 120% at 50% 0%,rgba(57,255,110,.14),transparent 60%),linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));box-shadow:0 0 60px -20px rgba(57,255,110,.5)}
.f3.us img{width:40px;height:40px;margin-bottom:10px}
.f3-arr{display:grid;place-items:center;color:var(--green);font-size:30px;font-weight:700}
.adds{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.adds .card{padding:24px 26px}
.adds h3{font-size:20px;margin:0 0 10px}
.adds ul{margin:0;padding-left:20px;font-size:17px;color:var(--text-2);line-height:1.7}
.adds .us{border-color:rgba(57,255,110,.35)}
.adds .us ul{color:var(--text)}
.adds .us li::marker{color:var(--green)}
/* pricing */
.plans.p3{grid-template-columns:repeat(3,1fr);max-width:1080px;margin:0 auto}
.plan li span{flex:1}
.price-alt{margin:8px 0 0;font-size:18px;color:var(--text-2)}
.price-alt b{color:var(--text)}
.soon{display:inline-block;font-family:var(--mono);font-size:16px;line-height:1.2;color:var(--amber);border:1px solid rgba(255,181,71,.45);background:rgba(255,181,71,.08);padding:1px 8px;border-radius:6px;margin-left:6px;vertical-align:1px}
.plan .price small{font-size:17px}
/* go deeper */
.deep .sec-head{margin-bottom:32px}
.deep-d{border:1px solid var(--line-2);border-radius:var(--radius);background:rgba(255,255,255,.02);margin-bottom:14px}
.deep-d[open]{background:rgba(255,255,255,.03)}
.deep-d>summary{list-style:none;cursor:pointer;padding:24px 28px;display:grid;grid-template-columns:1fr auto;gap:4px 16px;align-items:center}
.deep-d>summary::-webkit-details-marker{display:none}
.deep-d>summary::after{content:"+";grid-column:2;grid-row:1/span 2;font-family:var(--mono);font-size:30px;color:var(--green);transition:transform .2s}
.deep-d[open]>summary::after{transform:rotate(45deg)}
.dd-t{font-size:24px;font-weight:620;letter-spacing:-.02em;color:var(--text)}
.dd-s{font-size:18px;color:var(--text-2)}
.dd-body{padding:4px 28px 32px}
.deep-sub{font-size:18px;color:var(--text-2);margin:0 0 24px;max-width:760px}
.deep-d .sec-head{margin-bottom:24px}
@media (max-width:980px){
  .fixrow{grid-template-columns:1fr;gap:14px}
  .fx-arrow{transform:rotate(90deg)}
  .fx-up{border-left:0;border-top:1px dashed var(--line-2);padding:14px 0 0}
  .flow3{grid-template-columns:1fr}
  .f3-arr{transform:rotate(90deg);height:36px}
  .plans.p3{grid-template-columns:1fr;max-width:520px}
  .upside{grid-template-columns:1fr}
  .charts{grid-template-columns:1fr}
}
@media (max-width:560px){
  body{font-size:18px}
  .sec{padding-top:80px}
  .sec .sub{font-size:18px}
  .prob{padding:36px 18px 28px}
  .prob-row{grid-template-columns:1fr;gap:10px}
  .prob-row b{font-size:28px}
  .adds,.viz2,.up-n{grid-template-columns:1fr}
  .deep-d>summary{padding:20px 18px}
  .dd-t{font-size:21px}.dd-s{font-size:16px}
  .dd-body{padding:0 16px 24px}
  .fixrow{padding:22px 20px}
  .fx-found b{font-size:34px}
  .quote{padding:28px 22px}
  .quote figcaption{flex-wrap:wrap}
}

/* v12 floor: every text >= 16px (auto-generated from all sub-16px rules) */
.acc details p,
.bar b,
.bar-x span,
.ben p,
.btn,
.btn-sm,
.calc-out .fine,
.calc-out .lbl,
.caption,
.chip,
.cmp tbody th,
.cmp td,
.cmp th,
.cmp thead th,
.code-inline,
.cs-brand span,
.deltas em,
.deltas small,
.diff-body,
.diff-foot small,
.diff-head b,
.diff-head span,
.disclaimer,
.donut small,
.drow .k,
.dtable,
.dtable th,
.eyebrow,
.feat .tool,
.field .hint,
.fn,
.foot h4,
.foot p,
.foot ul,
.footnote,
.gauge small,
.kpi em,
.kpi small,
.lead-in,
.leakrow .t,
.legal,
.legend,
.main-head p,
.mini,
.nav-links,
.outs small,
.panel h4,
.panel h4 span,
.pill,
.plan .badge,
.plan .for,
.plan ul,
.quality p,
.quote figcaption span,
.scale,
.score .d,
.score div,
.side .mark,
.side .ro,
.side .ro b,
.side a,
.sku .t,
.stat .tag,
.stat p,
.step .num,
.step code,
.step ul,
.strip li,
.strip p,
.swipe,
.tab-range,
.tabs button,
.tcard p,
.term pre,
.ticks,
.tile .proj,
.tile p,
.tile small,
.viz p,
.vs-col li span,
.vs-col li::before,
.vx span,
.who-lbl,
.win-badge,
.win-url span,
.wtable,
.wtable thead th,
table.cmp{font-size:16px!important}
/* v12 readable body sizes (override the 16px floor where text is body copy) */
.tile p,.viz p,.plan ul,.acc details p,.tcard p,.field label,.calc-out .lbl{font-size:18px!important}
.who-card p,.step p,.feat p,.checks p,.faq details p,.final p{font-size:19px!important}
.faq summary{font-size:20px}
.tile small,.lead-in,.eyebrow,.plan .for{font-size:17px!important}
.btn{font-size:17px!important}.btn-sm{font-size:16px!important}
.caption,.footnote,.fn{font-size:16px!important;color:var(--muted)}
.ticks{font-size:17px!important}.pill{font-size:17px!important}
.cmp td,.cmp th{font-size:17px!important}
.who-card h3,.ben h3,.feat h3,.tcard h3{font-size:22px}
@media (max-width:560px){.tile p,.viz p,.plan ul,.acc details p,.tcard p,.who-card p,.step p,.feat p,.checks p,.faq details p,.final p{font-size:18px!important}}

/* v13: hero price line (driven by PLANS in app.js) */
.hero-price{margin:16px 0 0;text-align:center;font-size:19px!important;font-weight:600;color:#D3D9E2}
.hero-price a{color:inherit;text-decoration:none;border-bottom:1px dashed rgba(211,217,226,.45);padding-bottom:2px}
.hero-price a:hover{color:#fff;border-bottom-color:#3BFF6E}
@media (max-width:560px){.hero-price{font-size:18px!important}}

/* v14: final pricing (rendered from PRICING in app.js) */
#pricing-root{display:flex;flex-direction:column;gap:20px;max-width:1240px;margin:0 auto}
.bill{display:inline-flex;align-self:center;gap:4px;padding:4px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.03)}
.bill button{font:inherit;font-size:17px;font-weight:600;color:#D3D9E2;background:none;border:0;border-radius:999px;padding:10px 20px;cursor:pointer}
.bill button span{font-size:16px;color:var(--green);margin-left:6px}
.bill button[aria-pressed="true"]{background:#F3F6FA;color:#05070D}
.bill button[aria-pressed="true"] span{color:#0B7A2E}
.bill button:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.card.audit{display:grid;grid-template-columns:1fr 1.25fr;gap:32px;padding:30px 32px;border-color:rgba(57,255,110,.3)}
.audit h3{margin:8px 0 6px;font-size:30px;letter-spacing:-.02em}
.audit h3 b{color:var(--green);margin-left:8px}
.audit-terms{margin:0 0 10px;font-size:18px;color:#D3D9E2}
.audit-tag{margin:0 0 20px;font-size:19px;color:#F3F6FA;font-weight:600;line-height:1.4}
.audit-h{margin:0 0 8px;font-size:16px!important;font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;color:#B8C0CC}
.audit ul{list-style:none;padding:0;margin:0 0 18px;display:flex;flex-direction:column;gap:8px;font-size:18px;color:#D3D9E2}
.audit-note{margin:14px 0 0;font-size:16px;line-height:1.5;color:#B8C0CC}
.audit ul.audit-shows{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;margin-bottom:0}
.audit li{display:flex;gap:10px}.audit li svg{flex:none;margin-top:5px;color:var(--green)}.audit li span{flex:1}
.plans.p4{grid-template-columns:repeat(4,1fr);gap:16px}
.plans.p4 .plan{padding:28px 22px}
.plans.p4 .plan .for{min-height:52px}
.plans.p4 .price{font-size:46px}
.plans.p4 .price-alt{font-size:16px!important;color:#B8C0CC;margin:8px 0 0}
.plans.p4 .price-alt b{color:#F3F6FA}
.plan-cap{margin:16px 0 0;padding:12px 0 0;border-top:1px solid rgba(255,255,255,.1);font-size:17px;color:#D3D9E2;line-height:1.45}
.plan-cap b{color:#F3F6FA}.plan-cap span{color:#B8C0CC;font-size:16px}
.plan-extra{margin:10px 0 0;font-size:16px;color:#D3D9E2;line-height:1.45}
.plan-extra b{color:#F3F6FA}.plan-extra span{color:#B8C0CC}
.plans.p4 .plan ul{margin:18px 0 24px;font-size:17px!important}
.plan-contact{display:block;text-align:center;margin-top:12px;font-size:16px;color:#D3D9E2;text-decoration:underline;text-underline-offset:3px}
.plan-contact:hover{color:#fff}
.card.founding{display:grid;grid-template-columns:1.2fr 1.5fr auto;gap:28px;align-items:center;padding:26px 30px;border-color:rgba(255,181,71,.4);background:linear-gradient(180deg,rgba(255,181,71,.07),rgba(255,181,71,.01))}
.founding h3{margin:8px 0 6px;font-size:22px;line-height:1.3}
.founding p{margin:0;font-size:17px;color:#D3D9E2}
.f-prices{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.f-prices div{display:flex;flex-direction:column;padding:12px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
.f-prices small{font-size:16px;color:#B8C0CC}.f-prices b{font-size:28px;color:#F3F6FA;letter-spacing:-.02em}.f-prices em{font-style:normal;font-size:16px;color:#B8C0CC}
.lead-in.a{color:var(--amber)}
.pnotes{text-align:center;display:flex;flex-direction:column;gap:6px;align-items:center}
.pnotes p{margin:0;font-size:16px;color:#B8C0CC;max-width:900px}
.pnotes .guarantee{display:flex;gap:10px;align-items:center;font-size:19px;color:#F3F6FA}
.pnotes .guarantee svg{color:var(--green)}
@media (max-width:1100px){.plans.p4{grid-template-columns:repeat(2,1fr)}.card.founding{grid-template-columns:1fr}.card.founding .btn{justify-self:start}}
@media (max-width:760px){.card.audit{grid-template-columns:1fr;padding:24px 20px}.audit ul.audit-shows{grid-template-columns:1fr}.plans.p4{grid-template-columns:1fr}.f-prices{grid-template-columns:repeat(2,1fr)}.card.founding{padding:22px 20px}.bill button{padding:10px 14px}}
.f-prices b i{font-style:normal;font-size:16px;color:#B8C0CC;font-weight:500;margin-left:2px}

/* v15: MCP / AI-assistant section */
.mcp-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:start;margin-top:8px}
.mcp-clients{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.mc{font-family:var(--mono);font-size:16px;color:#F3F6FA;padding:7px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04)}
.mc::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);margin-right:9px;vertical-align:1px}
.mc-any{color:#D3D9E2;border-style:dashed}.mc-any::before{background:#B8C0CC}
.mcp-pts{list-style:none;padding:0;margin:0 0 22px;display:flex;flex-direction:column;gap:14px}
.mcp-pts li{display:flex;gap:12px}.mcp-pts svg{flex:none;margin-top:6px;color:var(--green)}
.mcp-pts b{display:block;font-size:19px;color:#F3F6FA}.mcp-pts span{font-size:17px;color:#D3D9E2;line-height:1.5}
.mcp-add{padding:20px 22px}
.mcp-add-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.mcp-ep{margin:10px 0 10px;font-size:17px;color:#D3D9E2}.mcp-ep code{font-family:var(--mono);font-size:16px;color:var(--green);background:rgba(57,255,110,.07);border:1px solid rgba(57,255,110,.3);padding:2px 8px;border-radius:6px}
.mcp-snip{margin:0;padding:14px 16px;border-radius:10px;background:#070A11;border:1px solid var(--line-2);font-family:var(--mono);font-size:16px!important;line-height:1.6;color:#D3D9E2;overflow-x:auto}
.mcp-fn{margin:12px 0 0;font-size:16px;color:#B8C0CC;line-height:1.5}.mcp-fn a{color:#F3F6FA}
.mcp-panel{border-radius:18px;border:1px solid rgba(57,255,110,.3);background:linear-gradient(180deg,#0B1018,#070A11);box-shadow:0 30px 80px -30px rgba(0,0,0,.9),0 0 80px -40px rgba(57,255,110,.45);padding:22px 24px}
.mp-head{display:flex;align-items:center;gap:10px;padding-bottom:14px;border-bottom:1px solid var(--line-2);font-size:18px}.mp-head img{border-radius:7px}
.mp-tag{margin-left:auto;font-family:var(--mono);font-size:16px;color:#B8C0CC}
.mp-lbl{display:block;font-family:var(--mono);font-size:16px;text-transform:uppercase;letter-spacing:.06em;color:#B8C0CC;margin-bottom:6px}.mp-lbl.g{color:var(--green)}
.mp-ask{margin:16px 0 0;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid var(--line-2)}
.mp-ask p{margin:0;font-size:19px;color:#F3F6FA;font-weight:600}
.mp-ans{margin:16px 0 0}.mp-ans p{margin:0 0 10px;font-size:17px;color:#D3D9E2;line-height:1.5}.mp-ans b{color:#F3F6FA}
.mp-t{width:100%;border-collapse:collapse;font-size:16px}.mp-t th{font-family:var(--mono);font-weight:500;font-size:16px;color:#B8C0CC;text-align:right;padding:6px 8px;border-bottom:1px solid var(--line-2)}
.mp-t td{text-align:right;padding:7px 8px;border-bottom:1px solid var(--line);color:#F3F6FA}.mp-t th:first-child,.mp-t td:first-child{text-align:left}.mp-t td.r{color:#FF8FA3}
.mp-stage{margin:16px 0 0;padding:14px 16px;border-radius:12px;border:1px solid rgba(255,181,71,.4);background:rgba(255,181,71,.06)}
.mp-st-h{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.mp-badge{font-family:var(--mono);font-size:16px;color:var(--amber)}.mp-tool{font-family:var(--mono);font-size:16px;color:#D3D9E2}
.mp-stage p{margin:8px 0 12px;font-size:17px;color:#D3D9E2;line-height:1.5}.mp-stage b{color:#F3F6FA}
.mp-btns{display:flex;gap:10px}.mp-btn{font-size:17px;font-weight:600;padding:9px 22px;border-radius:10px;cursor:default}
.mp-btn.ok{background:var(--green);color:var(--green-ink)}.mp-btn.no{border:1px solid var(--line-2);color:#F3F6FA;background:rgba(255,255,255,.04)}
.mp-fn{margin:14px 0 0;font-size:16px;color:#B8C0CC;line-height:1.5}
@media (max-width:960px){.mcp-grid{grid-template-columns:1fr;gap:32px}}
@media (max-width:560px){.mcp-panel{padding:18px 16px}.mp-t th,.mp-t td{padding:6px 5px}.mp-tag{display:none}}
.mcp-pts .soon{color:var(--amber);font-size:16px;line-height:1.2}
.mcp-grid>*{min-width:0}
@media (max-width:960px){.mcp-panel{order:-1}}

/* v16: pitch, hero clarity, 3-step strip */
.lede-pos{margin:14px auto 0;max-width:640px;font-size:18px;color:#D3D9E2;text-align:center}.lede-pos b{color:var(--green)}
.hero-price .hp-x{color:#D3D9E2;font-size:17px}
.steps3{padding:56px 0 0}
.s3-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:none}
.s3{display:flex;gap:16px;align-items:flex-start;padding:22px 24px;border-radius:var(--radius);border:1px solid var(--line-2);background:rgba(255,255,255,.025);position:relative}
.s3-n{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-size:18px;font-weight:600;color:var(--green-ink);background:var(--green);box-shadow:0 0 24px -6px rgba(57,255,110,.7)}
.s3 h3{margin:2px 0 6px;font-size:21px;letter-spacing:-.02em;color:#F3F6FA}
.s3 p{margin:0;font-size:17px;line-height:1.5;color:#D3D9E2}
.s3:not(:last-child)::after{content:"→";position:absolute;right:-14px;top:50%;transform:translateY(-50%);color:var(--green);font-size:18px;z-index:1}
@media (max-width:860px){.s3-row{grid-template-columns:1fr}.s3:not(:last-child)::after{content:"↓";right:auto;left:42px;top:auto;bottom:-20px;transform:none}}
.hero p.lede{margin-bottom:0}.hero p.lede b{display:inline;margin:0}
.hero .lede-pos{margin:14px auto 30px}
.hero .lede-pos{max-width:none}
/* v17: price line above the CTAs */
.hero .lede-pos{margin-bottom:18px}
.hero-price{margin:0 0 22px}
@media (max-width:560px){
  .hero .pill{margin-bottom:0}
  .hero h1{margin-bottom:16px}
  .hero p.lede{font-size:18px!important;line-height:1.5}
  .hero .lede-pos{font-size:17px;margin:10px auto 14px}
  .hero-price{margin-bottom:16px}.hero-price .hp-x{display:block;font-size:16px;font-weight:500;margin-top:4px}
}
@media (max-width:560px){.hero-price .hp-dot{display:none}}
@media (max-width:560px){.hero-price .hp-x::first-letter{text-transform:uppercase}}
/* FTC disclosure next to the founder testimonial (readable: >=16px, no dimmer than #B8C0CC) */
.quote .disclose{grid-column:2;margin:6px 0 0;font-size:16px!important;line-height:1.5;color:#B8C0CC!important;font-weight:500}
@media (max-width:900px){.quote .disclose{grid-column:auto}}

/* v18 (Oct 25, 2026): SampleROI positioning. Readability: body 20px desktop / 18px mobile, nothing under 16px, dimmest text #B8C0CC */
@media (max-width:560px){body{font-size:18px}}
.tag.m{color:var(--green);border-color:rgba(57,255,110,.45);background:rgba(57,255,110,.07);margin:0 0 0 6px;padding:1px 8px;vertical-align:middle}
.tag.e{color:var(--amber);border-color:rgba(255,181,71,.45);background:rgba(255,181,71,.08);margin:0 0 0 6px;padding:1px 8px;vertical-align:middle}
.cfo{margin-top:28px;display:grid;grid-template-columns:1fr 1.25fr;gap:36px;padding:34px 36px;border-color:rgba(57,255,110,.35);background:linear-gradient(180deg,rgba(57,255,110,.06),rgba(57,255,110,.01));text-align:left}
.cfo h2{margin:8px 0 10px;font-size:clamp(28px,3vw,38px);letter-spacing:-.03em;line-height:1.1}
.cfo-l p{margin:0 0 22px;font-size:19px;color:#D3D9E2}
.cfo-r{margin:0;display:grid;gap:14px}
.cfo-r div{display:grid;grid-template-columns:150px 1fr;gap:14px;padding:12px 0;border-top:1px solid var(--line)}
.cfo-r div:first-child{border-top:0}
.cfo-r dt{font-family:var(--mono);font-size:16px;text-transform:uppercase;letter-spacing:.06em;color:#B8C0CC;padding-top:3px}
.cfo-r dd{margin:0;font-size:19px;color:#E6EAF0;line-height:1.5}.cfo-r dd b{color:#fff}
@media (max-width:900px){.cfo{grid-template-columns:1fr;padding:26px 22px;gap:22px}.cfo-r div{grid-template-columns:1fr;gap:4px}.cfo-r dd{font-size:18px}}
#tiktok-rules .tbl-wrap{max-width:1000px;margin:0 auto}
table.cmp.tt{min-width:640px}
table.cmp.tt td,table.cmp.tt th{font-size:18px!important;line-height:1.45}
table.cmp.tt td.nl{color:#B8C0CC}
.ag3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ag{padding:26px 26px 24px}.ag h3{margin:16px 0 6px;font-size:22px;letter-spacing:-.02em}.ag p{margin:0;font-size:19px;color:#D3D9E2;line-height:1.5}
.ag-price{margin-top:18px;display:grid;grid-template-columns:1fr 1fr auto;gap:24px;align-items:center;padding:24px 30px}
.ag-price>div{display:flex;flex-direction:column;gap:2px}.ag-price b{font-size:30px;letter-spacing:-.03em;color:#fff}.ag-price span:not(.lead-in){font-size:18px;color:#D3D9E2}
@media (max-width:900px){.ag3{grid-template-columns:1fr}.ag-price{grid-template-columns:1fr;padding:22px 20px}.ag-price .btn{justify-self:start}}
.card.founding.apro{grid-template-columns:1.6fr auto;border-color:rgba(57,255,110,.35);background:linear-gradient(180deg,rgba(57,255,110,.06),rgba(57,255,110,.01));margin-bottom:18px}
.apro-pts{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 22px}
.apro-pts li{display:flex;gap:10px;align-items:flex-start;font-size:18px;color:#D3D9E2}.apro-pts svg{flex:none;margin-top:5px;color:var(--green)}
@media (max-width:760px){.card.founding.apro{grid-template-columns:1fr}.apro-pts{grid-template-columns:1fr}}
.price small.from{font-size:18px;font-weight:500;color:#D3D9E2;margin-right:2px}
.f-prices b i{font-style:normal}
.cost-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:6px}
.cost-in{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid var(--line-2);border-radius:10px;background:rgba(255,255,255,.04);font-size:18px;color:#D3D9E2}
.cost-in input{width:120px;background:transparent;border:0;outline:0;color:#fff;font:inherit;font-size:18px}
.cost-in input::placeholder{color:#B8C0CC}
.cost-in:focus-within{border-color:var(--green)}
.presets{display:inline-flex;gap:8px}
.presets button{font:inherit;font-size:17px;padding:8px 14px;border-radius:10px;border:1px solid var(--line-2);background:rgba(255,255,255,.04);color:#E6EAF0;cursor:pointer}
.presets button[aria-pressed=true]{background:var(--green);color:var(--green-ink);border-color:var(--green)}
.calc-out .big{font-size:clamp(30px,3.4vw,44px)!important}
.nav-links{gap:24px;white-space:nowrap}
@media (min-width:861px){.hero h1 .g{font-size:.66em;letter-spacing:-.035em;display:inline-block;margin-top:8px}}
