/* ---------- Tokens ---------- */
:root{
  --ink:#0A0F1E;
  --ink-deep:#070B16;
  --panel:#121A2E;
  --panel-2:#18223A;
  --panel-3:#202B45;
  --lime:#C6F432;
  --lime-hover:#D6FF55;
  --white:#FFFFFF;
  --light:#F4F5F7;
  --muted:#8A93A6;
  --soft:#C9CFDB;
  --muted-on-light:#525B6E;
  --border-light:#E1E4EA;
  --line:rgba(255,255,255,.08);
  --line-strong:rgba(255,255,255,.14);

  --ff-head:"Space Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --ff-body:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  /* type scale (mobile first, fluid) */
  --fs-xs:.8125rem;
  --fs-sm:.9375rem;
  --fs-base:1rem;
  --fs-md:clamp(1.0625rem, 1rem + .3vw, 1.1875rem);
  --fs-lg:clamp(1.1875rem, 1.05rem + .6vw, 1.4375rem);
  --fs-h3:clamp(1.25rem, 1.1rem + .7vw, 1.625rem);
  --fs-h2:clamp(1.875rem, 1.35rem + 2.5vw, 3.375rem);
  --fs-h1:clamp(2.25rem, 1.4rem + 4vw, 4.375rem);
  --fs-stat:clamp(2.75rem, 1.9rem + 4vw, 4.75rem);

  /* spacing (4px base) */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;

  --r-sm:10px; --r-md:14px; --r-lg:22px; --r-pill:999px;

  --gutter:16px;
  --wrap:1200px;
  --sec:72px;

  --shadow-lg:0 30px 80px -24px rgba(3,6,15,.65);
  --ease:cubic-bezier(.2,.7,.2,1);
}
@media (min-width:720px){ :root{ --gutter:32px; --sec:96px; } }
@media (min-width:1080px){ :root{ --gutter:40px; --sec:128px; } }

/* ---------- Base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:80px; }
body{
  margin:0; background:var(--ink); color:var(--ink);
  font-family:var(--ff-body); font-size:var(--fs-base); line-height:1.6;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
img,svg{ display:block; max-width:100%; }
img{ height:auto; }
h1,h2,h3,h4{ font-family:var(--ff-head); font-weight:700; margin:0; line-height:1.06; letter-spacing:-.03em; }
p,ul,ol,dl,dd,figure,blockquote{ margin:0; padding:0; }
ul,ol{ list-style:none; }
a{ color:inherit; }
button{ font:inherit; color:inherit; }
.vh{ position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.hidden{ display:none!important; }

.skip{ position:absolute; left:var(--s-4); top:-60px; z-index:100; background:var(--lime); color:var(--ink); padding:var(--s-3) var(--s-4); border-radius:var(--r-sm); font-weight:600; text-decoration:none; }
.skip:focus{ top:var(--s-3); }

.dark{ background:var(--ink); color:var(--white); --focus:var(--lime); }
.dark-panel{ background:var(--panel); color:var(--white); --focus:var(--lime); }
.light{ background:var(--light); color:var(--ink); --focus:var(--ink); }
.white{ background:var(--white); color:var(--ink); --focus:var(--ink); }
:focus-visible{ outline:3px solid var(--focus, var(--lime)); outline-offset:3px; border-radius:6px; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gutter); }
.section{ padding-block:var(--sec); position:relative; }

/* ---------- Shared bits ---------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:var(--s-2);
  font-family:var(--ff-head); font-size:var(--fs-xs); font-weight:600;
  text-transform:uppercase; letter-spacing:.14em; color:var(--muted-on-light);
}
.eyebrow::before{ content:""; width:8px; height:8px; border-radius:2px; background:var(--lime); box-shadow:0 0 0 3px rgba(198,244,50,.18); }
.dark .eyebrow, .dark-panel .eyebrow{ color:var(--lime); }
.light .eyebrow::before, .white .eyebrow::before{ background:var(--ink); box-shadow:none; }

.sec-head{ max-width:780px; margin-bottom:var(--s-7); }
.sec-head h2{ font-size:var(--fs-h2); margin-top:var(--s-4); }
.sec-head .lede{ margin-top:var(--s-4); font-size:var(--fs-md); color:var(--muted-on-light); max-width:42em; }
.dark .sec-head .lede, .dark-panel .sec-head .lede{ color:var(--soft); }
.hl{ color:var(--lime); }
.mark{ background:linear-gradient(transparent 58%, rgba(198,244,50,.85) 58%, rgba(198,244,50,.85) 92%, transparent 92%); padding-inline:.06em; }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:52px; padding:0 var(--s-5); border-radius:var(--r-pill); border:1.5px solid transparent;
  font-family:var(--ff-head); font-weight:600; font-size:1.0625rem; letter-spacing:-.01em;
  text-decoration:none; cursor:pointer; white-space:nowrap;
  transition:background-color .2s, color .2s, border-color .2s, box-shadow .25s, transform .2s;
}
.btn svg{ width:18px; height:18px; flex:none; transition:transform .2s var(--ease); }
.btn:hover svg{ transform:translateX(3px); }
.btn-lime{ background:var(--lime); color:var(--ink); }
.btn-lime:hover{ background:var(--lime-hover); box-shadow:0 10px 34px -10px rgba(198,244,50,.6); }
.btn-ghost{ border-color:rgba(255,255,255,.24); color:var(--white); }
.btn-ghost:hover{ border-color:var(--lime); color:var(--lime); }
.btn-ink{ background:var(--ink); color:var(--white); }
.btn-ink:hover{ background:var(--panel-3); }
.btn-line{ border-color:rgba(10,15,30,.22); color:var(--ink); }
.btn-line:hover{ border-color:var(--ink); }
.btn-sm{ min-height:44px; padding:0 18px; font-size:.9375rem; }
.btn-block{ width:100%; }

.ico{ width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(10,15,30,.86); color:var(--white);
  -webkit-backdrop-filter:saturate(1.4) blur(14px); backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid var(--line); --focus:var(--lime);
}
.hdr{ display:flex; align-items:center; justify-content:space-between; gap:var(--s-4); height:64px; }
.wordmark{ display:inline-flex; align-items:center; gap:10px; min-height:44px; text-decoration:none; color:var(--white); }
.wm-mark{ width:30px; height:30px; border-radius:8px; background:var(--lime); display:grid; place-items:center; flex:none; }
.wm-mark svg{ width:20px; height:20px; }
.wm-text{ font-family:var(--ff-head); font-weight:700; font-size:1.125rem; letter-spacing:-.025em; line-height:1; }
.wm-text span{ color:var(--muted); font-weight:500; }
.hdr-right{ display:flex; align-items:center; gap:var(--s-3); }
.hdr-cta{ display:none; }
.menu-btn{
  width:44px; height:44px; border-radius:12px; border:1px solid var(--line-strong); background:transparent;
  display:grid; place-items:center; cursor:pointer;
}
.menu-btn span{ display:block; width:18px; height:2px; background:var(--white); border-radius:2px; position:relative; transition:background .2s; }
.menu-btn span::before,.menu-btn span::after{ content:""; position:absolute; left:0; width:18px; height:2px; background:var(--white); border-radius:2px; transition:transform .25s var(--ease); }
.menu-btn span::before{ transform:translateY(-6px); }
.menu-btn span::after{ transform:translateY(6px); }
.menu-btn[aria-expanded="true"] span{ background:transparent; }
.menu-btn[aria-expanded="true"] span::before{ transform:rotate(45deg); }
.menu-btn[aria-expanded="true"] span::after{ transform:rotate(-45deg); }

.nav{ display:none; position:absolute; top:64px; left:0; right:0; background:var(--ink); border-bottom:1px solid var(--line); padding:var(--s-3) var(--gutter) var(--s-5); }
.nav.open{ display:block; }
.nav ul{ display:grid; }
.nav a.nav-link{ display:flex; align-items:center; min-height:52px; font-family:var(--ff-head); font-weight:600; font-size:1.125rem; text-decoration:none; color:var(--white); border-bottom:1px solid var(--line); }
.nav .btn{ margin-top:var(--s-5); width:100%; }

@media (min-width:720px){
  .hdr-cta{ display:inline-flex; }
  .nav .btn{ display:none; }
}
@media (min-width:1080px){
  .hdr{ height:72px; }
  .menu-btn,.hdr-cta{ display:none; }
  .nav{ display:flex; align-items:center; gap:var(--s-6); position:static; background:none; border:0; padding:0; }
  .nav ul{ display:flex; gap:var(--s-6); }
  .nav a.nav-link{ min-height:44px; border:0; font-size:.9375rem; font-weight:500; color:var(--soft); transition:color .2s; }
  .nav a.nav-link:hover{ color:var(--white); }
  .nav .btn{ display:inline-flex; margin:0; width:auto; }
}

/* ---------- Hero ---------- */
.hero{ position:relative; overflow:hidden; padding:var(--s-6) 0 var(--s-8); }
.hero-bg{ position:absolute; inset:0; pointer-events:none; }
.hero-bg::before{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:44px 44px; background-position:-1px -1px;
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 70% 10%, #000 25%, transparent 75%);
          mask-image:radial-gradient(ellipse 90% 70% at 70% 10%, #000 25%, transparent 75%);
}
.hero-bg::after{
  content:""; position:absolute; width:720px; height:720px; right:-260px; top:-220px; border-radius:50%;
  background:radial-gradient(closest-side, rgba(198,244,50,.22), rgba(198,244,50,.06) 55%, transparent);
  filter:blur(10px);
}
.hero-grid{ position:relative; display:grid; gap:var(--s-8); align-items:center; }
.hero h1{ font-size:var(--fs-h1); margin-top:var(--s-4); letter-spacing:-.035em; line-height:1.02; }
.hero-pay{
  display:inline-flex; align-items:center; gap:var(--s-2); margin-top:var(--s-5);
  padding:10px 16px 10px 12px; border-radius:var(--r-pill);
  border:1px solid rgba(198,244,50,.45); background:rgba(198,244,50,.08);
  font-family:var(--ff-head); font-weight:700; font-size:1.0625rem; color:var(--lime); letter-spacing:-.01em;
}
.hero-pay svg{ width:20px; height:20px; }
.hero-sub{ margin-top:var(--s-5); font-size:var(--fs-md); color:var(--soft); max-width:34em; }
.hero-ctas{ display:grid; gap:var(--s-3); margin-top:var(--s-6); }
.hero-note{ margin-top:var(--s-3); font-size:var(--fs-sm); color:var(--muted); }
.trust{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s-3) var(--s-4); margin-top:var(--s-7); padding-top:var(--s-5); border-top:1px solid var(--line); }
.trust li{ display:flex; align-items:center; gap:10px; font-size:var(--fs-sm); color:#DCE1EA; font-weight:500; line-height:1.3; }
.trust .chk{ width:22px; height:22px; flex:none; border-radius:50%; background:rgba(198,244,50,.14); color:var(--lime); display:grid; place-items:center; }
.trust .chk svg{ width:14px; height:14px; stroke-width:2.5; }

@media (min-width:480px){ .hero-ctas{ display:flex; flex-wrap:wrap; } }
@media (min-width:720px){ .hero{ padding-top:var(--s-8); } .trust{ grid-template-columns:repeat(4, auto); justify-content:start; gap:var(--s-5); } }
@media (min-width:1080px){
  .hero{ padding:var(--s-9) 0 var(--s-9); }
  .hero-grid{ grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr); gap:var(--s-8); }
  .trust{ grid-template-columns:repeat(2, auto); }
}
@media (min-width:1240px){ .trust{ grid-template-columns:repeat(4, auto); } }

/* SERP mock */
.serp-wrap{ position:relative; width:100%; max-width:440px; margin-inline:auto; padding:var(--s-5) 0 var(--s-7); }
.serp-wrap::before{ content:""; position:absolute; inset:10% -6% 4%; background:radial-gradient(closest-side, rgba(198,244,50,.25), transparent); filter:blur(30px); }
.serp{
  position:relative; background:#fff; color:#202124; border-radius:20px; padding:var(--s-4);
  box-shadow:var(--shadow-lg), 0 0 0 1px rgba(255,255,255,.08);
  font-family:Arial, "Helvetica Neue", Helvetica, sans-serif; line-height:1.4;
}
.serp-bar{ display:flex; align-items:center; gap:10px; height:44px; padding:0 14px; border-radius:999px; border:1px solid #DFE1E5; box-shadow:0 1px 6px rgba(32,33,36,.12); font-size:15px; }
.serp-bar svg{ width:18px; height:18px; stroke:#5F6368; stroke-width:2; fill:none; stroke-linecap:round; flex:none; }
.serp-bar .caret{ width:1.5px; height:18px; background:#1A73E8; margin-left:-6px; animation:blink 1.1s steps(2) infinite; }
@keyframes blink{ 50%{ opacity:0; } }
.serp-tabs{ display:flex; gap:18px; margin:12px 4px 0; font-size:13px; color:#5F6368; border-bottom:1px solid #EBEBEB; }
.serp-tabs span{ padding-bottom:9px; }
.serp-tabs .on{ color:#1A73E8; box-shadow:inset 0 -3px 0 #1A73E8; }
.serp-ad{ padding:14px 4px 12px; border-bottom:1px solid #EBEBEB; }
.serp-spons{ font-size:12px; font-weight:700; }
.serp-site{ display:flex; align-items:center; gap:10px; margin-top:8px; }
.serp-fav{ width:28px; height:28px; border-radius:50%; background:var(--ink); display:grid; place-items:center; flex:none; }
.serp-fav svg{ width:16px; height:16px; }
.serp-site b{ display:block; font-size:14px; font-weight:400; color:#202124; }
.serp-site small{ display:block; font-size:12px; color:#4D5156; }
.serp-title{ margin-top:6px; font-size:18px; color:#1A0DAB; line-height:1.3; }
.serp-desc{ margin-top:4px; font-size:13.5px; color:#4D5156; }
.serp-map{
  position:relative; height:112px; margin-top:12px; border-radius:12px; overflow:hidden;
  background:
    linear-gradient(115deg, transparent 46%, #fff 46%, #fff 49%, transparent 49%),
    linear-gradient(20deg, transparent 62%, #fff 62%, #fff 64.5%, transparent 64.5%),
    linear-gradient(90deg, transparent 30%, #F8E7B4 30%, #F8E7B4 32%, transparent 32%),
    radial-gradient(circle at 80% 80%, #CFE8D0 0 18%, transparent 19%),
    radial-gradient(circle at 12% 20%, #CFE8D0 0 14%, transparent 15%),
    #E8EEF2;
}
.pin{ position:absolute; width:14px; height:14px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:#9AA0A6; border:2px solid #fff; }
.pin.you{ width:22px; height:22px; background:var(--lime); border:3px solid var(--ink); z-index:1; }
.serp-pack li{ display:flex; align-items:center; justify-content:space-between; gap:var(--s-3); padding:10px 8px; border-bottom:1px solid #EBEBEB; }
.serp-pack li:last-child{ border-bottom:0; }
.serp-pack .you{ background:rgba(198,244,50,.28); border-radius:12px; border-bottom-color:transparent; margin-top:8px; }
.serp-pack b{ display:block; font-size:15px; font-weight:400; color:#202124; }
.stars{ color:#E8A500; font-size:12px; letter-spacing:1px; }
.serp-pack small{ display:block; font-size:12.5px; color:#4D5156; }
.you-tag{ flex:none; font-family:var(--ff-head); font-weight:700; font-size:12px; background:var(--ink); color:var(--lime); padding:4px 10px; border-radius:999px; }
.sk{ display:block; height:9px; border-radius:6px; background:#ECEFF1; margin:5px 0; }
.sk.w1{ width:150px; } .sk.w2{ width:96px; } .sk.w3{ width:130px; } .sk.w4{ width:80px; }

.chip-paid{
  position:absolute; top:6px; right:12px; z-index:2;
  background:var(--lime); color:var(--ink); font-family:var(--ff-head); font-weight:700; font-size:13px;
  padding:7px 12px; border-radius:999px; box-shadow:0 10px 30px -10px rgba(198,244,50,.7);
}
.toast{
  position:absolute; left:0; right:24px; bottom:0; z-index:2;
  display:flex; align-items:center; gap:12px; padding:12px 14px;
  background:var(--panel); color:var(--white); border:1px solid var(--line-strong); border-radius:16px;
  box-shadow:var(--shadow-lg); animation:float 6s ease-in-out infinite;
}
.toast-ico{ width:36px; height:36px; border-radius:10px; background:var(--lime); color:var(--ink); display:grid; place-items:center; flex:none; }
.toast-ico svg{ width:18px; height:18px; stroke-width:2.5; }
.toast b{ display:block; font-family:var(--ff-head); font-size:15px; letter-spacing:-.01em; }
.toast small{ display:block; font-size:13px; color:var(--soft); }
.toast .live{ margin-left:auto; display:flex; align-items:center; gap:6px; font-size:12px; color:var(--lime); font-weight:600; white-space:nowrap; }
.toast .live::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--lime); animation:pulse 2s infinite; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(198,244,50,.6); } 70%{ box-shadow:0 0 0 8px rgba(198,244,50,0); } 100%{ box-shadow:0 0 0 0 rgba(198,244,50,0); } }
@keyframes float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-6px); } }
@media (min-width:1080px){ .serp-wrap{ max-width:460px; margin-right:0; } .toast{ left:-48px; right:auto; min-width:340px; } .chip-paid{ right:-18px; } }

/* ---------- Stats band ---------- */
.stats-band{ border-top:1px solid var(--line); padding-block:var(--s-7) var(--s-8); }
.stats{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s-6) var(--s-4); }
.stat{ border-top:1px solid var(--line-strong); padding-top:var(--s-4); position:relative; }
.stat::before{ content:""; position:absolute; top:-1px; left:0; width:28px; height:2px; background:var(--lime); }
.stat-num{ font-family:var(--ff-head); font-weight:700; font-size:var(--fs-stat); line-height:.95; letter-spacing:-.045em; color:var(--white); white-space:nowrap; }
.stat-num .u{ font-size:.42em; letter-spacing:-.02em; color:var(--lime); font-weight:600; }
.stat-label{ margin-top:var(--s-3); font-size:var(--fs-sm); color:#DCE1EA; font-weight:500; line-height:1.4; }
.stat-src{ margin-top:var(--s-1); font-size:var(--fs-xs); color:var(--muted); line-height:1.4; }
@media (min-width:1080px){ .stats{ grid-template-columns:repeat(4,1fr); gap:var(--s-6); } }

/* ---------- Marquee ---------- */
.marquee{ background:var(--lime); color:var(--ink); overflow:hidden; padding-block:18px; border-block:1px solid rgba(10,15,30,.15); }
.marquee-row{ display:flex; width:max-content; animation:marquee 38s linear infinite; }
.marquee-list{ display:flex; align-items:center; flex:none; }
.marquee-list li{ display:flex; align-items:center; font-family:var(--ff-head); font-weight:700; font-size:clamp(1.25rem, 1rem + 1vw, 1.75rem); letter-spacing:-.02em; padding-right:28px; white-space:nowrap; }
.marquee-list li::after{ content:""; width:12px; height:12px; margin-left:28px; background:var(--ink); transform:rotate(45deg); border-radius:2px; }
.marquee-label{ font-size:var(--fs-xs)!important; letter-spacing:.14em!important; text-transform:uppercase; font-weight:600!important; }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* ---------- Problem ---------- */
.vs{ display:grid; gap:var(--s-4); }
.vs-card{ border-radius:var(--r-lg); padding:var(--s-5); position:relative; overflow:hidden; }
.vs-bad{ background:var(--white); border:1px solid var(--border-light); }
.vs-good{ background:var(--ink); color:var(--white); }
.vs-good::after{ content:""; position:absolute; width:360px; height:360px; right:-160px; top:-160px; background:radial-gradient(closest-side, rgba(198,244,50,.2), transparent); pointer-events:none; }
.vs-head{ display:flex; align-items:center; gap:var(--s-3); padding-bottom:var(--s-4); border-bottom:1px solid var(--border-light); }
.vs-good .vs-head{ border-color:var(--line-strong); }
.vs-badge{ width:36px; height:36px; border-radius:10px; display:grid; place-items:center; flex:none; }
.vs-bad .vs-badge{ background:#EDEFF3; color:var(--muted-on-light); }
.vs-good .vs-badge{ background:var(--lime); color:var(--ink); }
.vs-badge svg{ width:18px; height:18px; stroke-width:2.5; }
.vs-head h3{ font-size:var(--fs-lg); }
.vs dl{ display:grid; }
.vs-row{ padding-block:var(--s-4); border-bottom:1px solid var(--border-light); }
.vs-good .vs-row{ border-color:var(--line); }
.vs-row:last-child{ border-bottom:0; padding-bottom:0; }
.vs dt{ font-size:var(--fs-xs); font-weight:600; text-transform:uppercase; letter-spacing:.1em; color:var(--muted-on-light); }
.vs-good dt{ color:var(--muted); }
.vs dd{ margin-top:6px; font-size:var(--fs-md); line-height:1.45; }
.vs-bad dd{ color:#3A4256; }
.vs-good dd{ color:var(--white); }
@media (min-width:900px){ .vs{ grid-template-columns:1fr 1fr; gap:var(--s-5); } .vs-card{ padding:var(--s-6); } }

.heard{ margin-top:var(--s-8); }
.heard-head{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:var(--s-2) var(--s-5); margin-bottom:var(--s-5); }
.heard-head h3{ font-size:var(--fs-h3); }
.heard-head p{ font-size:var(--fs-sm); color:var(--muted-on-light); }
.heard-grid{ display:grid; gap:var(--s-3); }
.heard-grid li{
  position:relative; background:var(--white); border:1px solid var(--border-light); border-radius:var(--r-md);
  padding:var(--s-4) var(--s-5) var(--s-4) 52px; font-size:var(--fs-base); color:#283044; line-height:1.5;
}
.heard-grid li::before{ content:"\201C"; position:absolute; left:18px; top:6px; font-family:var(--ff-head); font-size:44px; font-weight:700; color:var(--ink); opacity:.18; }
.heard-grid li.big{ background:var(--ink); color:var(--white); border-color:var(--ink); font-family:var(--ff-head); font-size:var(--fs-lg); font-weight:600; letter-spacing:-.015em; line-height:1.3; padding-block:var(--s-5); }
.heard-grid li.big::before{ color:var(--lime); opacity:1; }
.heard-grid li.big small{ display:block; margin-top:var(--s-3); font-family:var(--ff-body); font-size:var(--fs-sm); font-weight:400; color:var(--muted); letter-spacing:0; }
@media (min-width:720px){ .heard-grid{ grid-template-columns:1fr 1fr; } .heard-grid li.big{ grid-column:1 / -1; } }
@media (min-width:1080px){ .heard-grid{ grid-template-columns:repeat(3,1fr); } }

.pull{ margin-top:var(--s-8); padding-top:var(--s-7); border-top:1px solid #D7DBE3; display:grid; gap:var(--s-5); align-items:end; }
.pull p.big{ font-family:var(--ff-head); font-weight:700; font-size:clamp(1.75rem, 1.2rem + 2.6vw, 3.25rem); line-height:1.08; letter-spacing:-.035em; max-width:18em; }
.pull p.small{ font-size:var(--fs-md); color:var(--muted-on-light); max-width:28em; }
@media (min-width:1080px){ .pull{ grid-template-columns:1.6fr 1fr; gap:var(--s-8); } }

/* ---------- Results / case study ---------- */
.case{ display:grid; gap:var(--s-4); }
.card-dk{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r-lg); padding:var(--s-5); }
.chart-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:var(--s-4); }
.chart-head h3{ font-size:var(--fs-lg); }
.chart-head p{ font-size:var(--fs-sm); color:var(--muted); margin-top:4px; }
.chart-total{ text-align:right; font-family:var(--ff-head); font-weight:700; font-size:2.25rem; line-height:1; letter-spacing:-.04em; color:var(--lime); }
.chart-total small{ display:block; font-family:var(--ff-body); font-size:var(--fs-xs); color:var(--muted); font-weight:500; letter-spacing:0; margin-top:6px; }
.bars{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s-3); align-items:end; height:240px; margin-top:var(--s-6); padding-bottom:var(--s-2); border-bottom:1px solid var(--line-strong); position:relative; }
.bars::before{ content:""; position:absolute; inset:0 0 8px; background:repeating-linear-gradient(to top, transparent 0 59px, var(--line) 59px 60px); pointer-events:none; }
.bar{ position:relative; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; height:100%; }
.bar-val{ font-family:var(--ff-head); font-weight:700; font-size:1.375rem; letter-spacing:-.03em; margin-bottom:var(--s-2); }
.bar-fill{ width:100%; max-width:84px; border-radius:10px 10px 4px 4px; background:linear-gradient(180deg, var(--lime), #9FCB1E); transform-origin:bottom; }
.bar.zero .bar-val{ font-size:var(--fs-sm); color:var(--muted); font-family:var(--ff-body); font-weight:500; letter-spacing:0; }
.bar.zero .bar-fill{ height:3px; background:var(--muted); opacity:.5; border-radius:2px; }
.bar.dim .bar-fill{ background:linear-gradient(180deg, rgba(198,244,50,.55), rgba(198,244,50,.3)); }
.bar-x{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s-3); margin-top:var(--s-3); text-align:center; }
.bar-x span{ font-size:var(--fs-sm); font-weight:600; color:var(--white); line-height:1.25; }
.bar-x small{ display:block; font-size:12px; color:var(--muted); font-weight:500; }
.js .bar-fill{ transform:scaleY(0); transition:transform 1s var(--ease); }
.js .in .bar-fill{ transform:scaleY(1); }
.js .in .bar:nth-child(2) .bar-fill{ transition-delay:.12s; }
.js .in .bar:nth-child(3) .bar-fill{ transition-delay:.24s; }
.js .in .bar:nth-child(4) .bar-fill{ transition-delay:.36s; }

.tiles{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s-4); }
.tile{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r-lg); padding:var(--s-5) var(--s-4); display:flex; flex-direction:column; }
.tile-num{ font-family:var(--ff-head); font-weight:700; font-size:clamp(2rem, 1.6rem + 1.6vw, 2.75rem); line-height:1; letter-spacing:-.04em; white-space:nowrap; }
.tile-num .u{ font-size:.5em; color:var(--lime); letter-spacing:-.01em; }
.tile-label{ margin-top:var(--s-3); font-size:var(--fs-sm); color:#DCE1EA; line-height:1.4; }
.tile-foot{ margin-top:auto; padding-top:var(--s-3); font-size:var(--fs-xs); color:var(--muted); line-height:1.4; }
.case-note{ margin-top:var(--s-5); font-size:var(--fs-sm); color:var(--muted); display:flex; gap:10px; align-items:flex-start; max-width:62em; }
.case-note svg{ width:18px; height:18px; flex:none; margin-top:2px; color:var(--lime); }
@media (min-width:720px){ .card-dk{ padding:var(--s-6); } .tile{ padding:var(--s-5); } }
@media (min-width:1080px){ .case{ grid-template-columns:1.25fr 1fr; gap:var(--s-5); } }

.quotes{ margin-top:var(--s-9); }
.quotes-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:var(--s-4); margin-bottom:var(--s-5); }
.quotes-head h3{ font-size:var(--fs-h3); }
.quotes-head p{ margin-top:6px; font-size:var(--fs-sm); color:var(--muted); }
.q-nav{ display:none; gap:var(--s-2); }
.q-nav button{ width:48px; height:48px; border-radius:50%; border:1px solid var(--line-strong); background:transparent; color:var(--white); display:grid; place-items:center; cursor:pointer; transition:border-color .2s, color .2s, opacity .2s; }
.q-nav button:hover{ border-color:var(--lime); color:var(--lime); }
.q-nav button:disabled{ opacity:.35; cursor:default; border-color:var(--line-strong); color:var(--white); }
.q-nav svg{ width:20px; height:20px; }
.q-track{
  display:flex; gap:var(--s-4); overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain;
  margin-inline:calc(var(--gutter) * -1); padding:var(--s-1) var(--gutter) var(--s-4); scroll-padding-inline:var(--gutter);
  scrollbar-width:thin; scrollbar-color:var(--panel-3) transparent;
}
.q-track::-webkit-scrollbar{ height:6px; }
.q-track::-webkit-scrollbar-thumb{ background:var(--panel-3); border-radius:6px; }
.q-card{
  margin:0; flex:0 0 86%; scroll-snap-align:start; display:flex; flex-direction:column; gap:var(--s-5);
  background:var(--panel); border:1px solid var(--line); border-radius:var(--r-lg); padding:var(--s-5); min-height:260px;
}
.q-card.feature{ background:var(--lime); color:var(--ink); border-color:var(--lime); }
.q-mark{ width:34px; height:26px; color:var(--lime); flex:none; }
.q-card.feature .q-mark{ color:var(--ink); }
.q-card blockquote p{ font-family:var(--ff-head); font-weight:600; font-size:var(--fs-lg); line-height:1.3; letter-spacing:-.02em; }
.q-card figcaption{ margin-top:auto; padding-top:var(--s-4); border-top:1px solid var(--line-strong); font-size:var(--fs-sm); color:var(--muted); line-height:1.45; }
.q-card.feature figcaption{ border-color:rgba(10,15,30,.2); color:#2C3545; }
.q-card figcaption b{ display:block; color:var(--white); font-weight:600; }
.q-card.feature figcaption b{ color:var(--ink); }
@media (min-width:720px){ .q-card{ flex-basis:calc(50% - 8px); padding:var(--s-6); } .q-nav{ display:flex; } }
@media (min-width:1080px){ .q-card{ flex-basis:calc(33.333% - 11px); } .q-track{ margin-inline:0; padding-inline:0; scroll-padding-inline:0; } }

/* ---------- How it works ---------- */
.steps{ display:grid; gap:var(--s-4); counter-reset:step; }
.step{ position:relative; display:flex; flex-direction:column; background:var(--light); border-radius:var(--r-lg); padding:var(--s-5); border:1px solid var(--border-light); }
.step-num{ display:inline-grid; place-items:center; width:48px; height:48px; border-radius:14px; background:var(--ink); color:var(--lime); font-family:var(--ff-head); font-weight:700; font-size:1.125rem; letter-spacing:-.02em; }
.step h3{ margin-top:var(--s-5); font-size:var(--fs-h3); }
.step p{ margin-top:var(--s-3); color:#3A4256; }
.step-tag{ margin-top:auto; padding-top:var(--s-5); }
.step-tag span{ display:inline-flex; align-items:center; gap:8px; font-size:var(--fs-xs); font-weight:600; text-transform:uppercase; letter-spacing:.1em; color:var(--ink); background:var(--white); border:1px solid var(--border-light); padding:7px 12px; border-radius:999px; }
.step-tag span::before{ content:""; width:6px; height:6px; border-radius:50%; background:#8DB51A; }
.loop{
  margin-top:var(--s-5); display:flex; flex-direction:column; gap:var(--s-5);
  background:var(--ink); color:var(--white); border-radius:var(--r-lg); padding:var(--s-5);
}
.loop-words{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s-2) var(--s-3); font-family:var(--ff-head); font-weight:700; font-size:clamp(1.375rem, 1.1rem + 1.4vw, 2.125rem); letter-spacing:-.03em; line-height:1.15; }
.loop-words svg{ width:22px; height:22px; color:var(--lime); stroke-width:2.25; }
.loop-words span:last-child{ color:var(--lime); }
@media (min-width:720px){ .steps{ grid-template-columns:1fr 1fr; } .step{ padding:var(--s-6); } .loop{ padding:var(--s-6); } }
@media (min-width:1080px){ .steps{ grid-template-columns:repeat(4,1fr); } .loop{ flex-direction:row; align-items:center; justify-content:space-between; padding:var(--s-5) var(--s-6); } }

/* ---------- Dashboard ---------- */
.dash-grid{ display:grid; gap:var(--s-7); align-items:center; }
.dash-points{ display:grid; gap:var(--s-4); margin-top:var(--s-6); }
.dash-points li{ display:flex; gap:var(--s-3); align-items:flex-start; font-size:var(--fs-md); color:#DCE1EA; line-height:1.45; }
.dash-points .chk{ width:26px; height:26px; flex:none; border-radius:8px; background:rgba(198,244,50,.14); color:var(--lime); display:grid; place-items:center; margin-top:1px; }
.dash-points .chk svg{ width:15px; height:15px; stroke-width:2.5; }
.dash-copy .btn{ margin-top:var(--s-6); }

.dash{ background:var(--panel); border:1px solid var(--line-strong); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-lg), 0 0 0 6px rgba(255,255,255,.02); }
.dash-top{ display:flex; align-items:center; gap:var(--s-3); padding:12px 14px; border-bottom:1px solid var(--line); background:#0F1628; }
.dots{ display:flex; gap:6px; }
.dots i{ width:10px; height:10px; border-radius:50%; background:#2A3550; }
.dash-title{ font-family:var(--ff-head); font-weight:600; font-size:13px; color:var(--soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dash-badge{ margin-left:auto; flex:none; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.1em; color:var(--ink); background:var(--lime); padding:4px 9px; border-radius:999px; }
.dash-body{ padding:var(--s-3); display:grid; gap:var(--s-3); }
.kpis{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s-3); }
.kpi{ background:var(--panel-2); border:1px solid var(--line); border-radius:12px; padding:12px; }
.kpi-l{ font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.kpi-v{ margin-top:6px; font-family:var(--ff-head); font-weight:700; font-size:1.5rem; line-height:1; letter-spacing:-.03em; color:var(--white); white-space:nowrap; }
.kpi-v small{ font-size:.6em; color:var(--muted); font-weight:600; }
.kpi-f{ margin-top:6px; font-size:11.5px; color:var(--lime); }
.dash-row{ display:grid; gap:var(--s-3); }
.dcard{ background:var(--panel-2); border:1px solid var(--line); border-radius:12px; padding:12px; }
.dcard-h{ display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:12px; font-weight:600; color:var(--soft); }
.dcard-h em{ font-style:normal; font-weight:500; color:var(--muted); }
.mini-bars{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; align-items:end; height:96px; margin-top:12px; }
.mini-bars div{ display:flex; flex-direction:column; justify-content:flex-end; align-items:center; height:100%; font-size:11px; color:var(--muted); }
.mini-bars i{ display:block; width:100%; border-radius:6px 6px 2px 2px; background:var(--lime); margin-bottom:6px; }
.mini-bars b{ font-family:var(--ff-head); color:var(--white); font-size:13px; margin-bottom:4px; }
.rgrid{ display:grid; grid-template-columns:minmax(0,1.25fr) repeat(3, minmax(0,1fr)); gap:5px; margin-top:12px; font-size:11px; }
.rgrid .h{ color:var(--muted); font-weight:600; line-height:1.2; align-self:end; padding-bottom:2px; }
.rgrid .t{ color:var(--soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; align-self:center; }
.rgrid .c{ height:22px; border-radius:5px; }
.c.top{ background:var(--lime); }
.c.p1{ background:rgba(198,244,50,.38); }
.c.no{ background:#2A3550; }
.legend{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:10px; font-size:11px; color:var(--muted); }
.legend span{ display:inline-flex; align-items:center; gap:6px; }
.legend i{ width:10px; height:10px; border-radius:3px; display:inline-block; }
.feed li{ display:flex; align-items:center; gap:10px; padding:10px 0; border-top:1px solid var(--line); }
.feed li:first-child{ border-top:0; }
.feed .fd{ width:8px; height:8px; border-radius:50%; background:var(--muted); flex:none; }
.feed .fd.new{ background:var(--lime); animation:pulse 2s infinite; }
.feed .fm{ min-width:0; }
.feed .fm b{ display:block; font-size:13px; font-weight:600; color:var(--white); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.feed .fm small{ display:block; font-size:11.5px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.feed .st{ margin-left:auto; flex:none; font-size:11px; font-weight:600; padding:4px 8px; border-radius:999px; border:1px solid var(--line-strong); color:var(--soft); white-space:nowrap; }
.feed .st.go{ background:var(--lime); color:var(--ink); border-color:var(--lime); }
.feed .st.nw{ border-color:rgba(198,244,50,.5); color:var(--lime); }
.dash-cap{ margin-top:var(--s-3); font-size:var(--fs-xs); color:var(--muted); text-align:center; }
@media (min-width:600px){ .kpis{ grid-template-columns:repeat(4,1fr); } .dash-row{ grid-template-columns:1fr 1.5fr; } .dash-body{ padding:var(--s-4); } }
@media (min-width:1080px){ .dash-grid{ grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:var(--s-8); } }

/* ---------- Pricing ---------- */
.principle{ margin-top:var(--s-5); padding-left:var(--s-4); border-left:3px solid var(--lime); }
.principle p{ font-family:var(--ff-head); font-weight:600; font-size:var(--fs-lg); line-height:1.3; letter-spacing:-.02em; }
.principle cite{ display:block; margin-top:var(--s-2); font-style:normal; font-size:var(--fs-sm); color:var(--muted-on-light); }
.plans{ display:grid; gap:var(--s-5); max-width:600px; margin-inline:auto; }
.plan{ position:relative; display:flex; flex-direction:column; background:var(--white); border:1px solid var(--border-light); border-radius:var(--r-lg); padding:var(--s-6) var(--s-5) var(--s-5); }
.plan.feat{ background:var(--ink); color:var(--white); border-color:var(--ink); box-shadow:var(--shadow-lg); --focus:var(--lime); }
.plan-tag{ position:absolute; top:-13px; left:var(--s-5); font-family:var(--ff-head); font-weight:700; font-size:12px; text-transform:uppercase; letter-spacing:.1em; padding:6px 12px; border-radius:999px; background:var(--ink); color:var(--lime); }
.plan.feat .plan-tag{ background:var(--lime); color:var(--ink); }
.plan-tag.soft{ background:var(--white); color:var(--ink); border:1px solid var(--border-light); }
.plan-kicker{ font-size:var(--fs-xs); font-weight:600; text-transform:uppercase; letter-spacing:.12em; color:var(--muted-on-light); }
.plan.feat .plan-kicker{ color:var(--muted); }
.plan h3{ margin-top:var(--s-2); font-size:var(--fs-h3); }
.plan-for{ margin-top:var(--s-2); font-size:var(--fs-sm); color:var(--muted-on-light); min-height:3em; }
.plan.feat .plan-for{ color:var(--soft); }
.price{ margin-top:var(--s-5); padding-block:var(--s-4); border-block:1px solid var(--border-light); }
.plan.feat .price{ border-color:var(--line-strong); }
.price-big{ font-family:var(--ff-head); font-weight:700; font-size:3.5rem; line-height:1; letter-spacing:-.05em; }
.price-big sup{ font-size:.45em; vertical-align:.95em; margin-right:2px; letter-spacing:0; }
.price-big small{ font-size:.32em; font-weight:600; letter-spacing:-.01em; color:var(--muted-on-light); margin-left:6px; }
.price-word{ font-family:var(--ff-head); font-weight:700; font-size:1.625rem; line-height:1.1; letter-spacing:-.03em; }
.price-sub{ margin-top:6px; font-size:var(--fs-sm); color:var(--muted-on-light); }
.plan.feat .price-sub{ color:var(--muted); }
.plan-list{ display:grid; gap:var(--s-3); margin-top:var(--s-5); }
.plan-list li{ display:flex; gap:10px; align-items:flex-start; font-size:var(--fs-base); line-height:1.45; }
.plan-list svg{ width:18px; height:18px; flex:none; margin-top:3px; stroke-width:2.5; color:#6E8F12; }
.plan.feat .plan-list svg{ color:var(--lime); }
.guarantee{ margin-top:var(--s-5); padding:var(--s-4); border-radius:var(--r-md); background:rgba(198,244,50,.1); border:1px solid rgba(198,244,50,.45); }
.guarantee b{ display:block; font-family:var(--ff-head); font-size:var(--fs-xs); text-transform:uppercase; letter-spacing:.12em; color:var(--lime); }
.guarantee p{ margin-top:6px; font-family:var(--ff-head); font-weight:600; font-size:1.125rem; line-height:1.3; letter-spacing:-.015em; }
.guarantee a{ display:inline-block; margin-top:8px; font-size:var(--fs-sm); color:var(--soft); }
.plan .btn{ margin-top:var(--s-6); }
.plan-spacer{ flex:1; }
.risk{ margin-top:var(--s-7); display:flex; gap:var(--s-4); align-items:flex-start; padding:var(--s-5); border-radius:var(--r-lg); background:var(--white); border:1px dashed #C9CED8; }
.risk-ico{ width:44px; height:44px; flex:none; border-radius:12px; background:var(--lime); color:var(--ink); display:grid; place-items:center; }
.risk p{ font-family:var(--ff-head); font-weight:600; font-size:var(--fs-lg); line-height:1.3; letter-spacing:-.02em; }
.risk p span{ display:block; margin-top:6px; font-family:var(--ff-body); font-weight:400; font-size:var(--fs-sm); color:var(--muted-on-light); letter-spacing:0; }
@media (min-width:1080px){
  .plans{ grid-template-columns:repeat(3,1fr); max-width:none; align-items:stretch; gap:var(--s-5); }
  .plan{ padding:var(--s-7) var(--s-6) var(--s-6); }
  .plan.feat{ transform:translateY(-12px); }
  .plan-tag{ left:var(--s-6); }
}

/* ---------- Why ---------- */
.why-grid{ display:grid; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.why-item{ background:var(--ink); padding:var(--s-5); transition:background .25s; }
.why-item:hover{ background:#0E1527; }
.why-ico{ width:44px; height:44px; border-radius:12px; display:grid; place-items:center; background:rgba(198,244,50,.12); color:var(--lime); }
.why-item h3{ margin-top:var(--s-4); font-size:1.1875rem; letter-spacing:-.02em; line-height:1.2; }
.why-item p{ margin-top:var(--s-2); font-size:var(--fs-base); color:var(--soft); line-height:1.55; }
@media (min-width:720px){ .why-grid{ grid-template-columns:1fr 1fr; } .why-item{ padding:var(--s-6); } }
@media (min-width:1080px){ .why-grid{ grid-template-columns:repeat(4,1fr); } }

/* ---------- Other trades ---------- */
.trades{ display:grid; gap:var(--s-4); }
.trade{ display:flex; flex-direction:column; background:var(--light); border:1px solid var(--border-light); border-radius:var(--r-lg); padding:var(--s-5); }
.trade-tag{ display:flex; justify-content:space-between; gap:var(--s-2); font-size:var(--fs-xs); font-weight:600; text-transform:uppercase; letter-spacing:.1em; color:var(--muted-on-light); }
.trade-big{ margin-top:var(--s-5); font-family:var(--ff-head); font-weight:700; font-size:clamp(1.875rem, 1.5rem + 1.4vw, 2.5rem); line-height:1; letter-spacing:-.04em; }
.trade-big .mark{ padding-inline:.04em; }
.trade-res{ margin-top:var(--s-3); font-size:var(--fs-base); color:#283044; line-height:1.5; }
.trade-before{ margin-top:auto; padding-top:var(--s-4); }
.trade-before p{ padding-top:var(--s-3); border-top:1px solid #D7DBE3; font-size:var(--fs-sm); color:var(--muted-on-light); line-height:1.45; }
.trade-before b{ color:var(--ink); font-weight:600; }
.trades-note{ margin-top:var(--s-4); font-size:var(--fs-sm); color:var(--muted-on-light); }
@media (min-width:720px){ .trades{ grid-template-columns:1fr 1fr; } }
@media (min-width:1080px){ .trades{ grid-template-columns:repeat(4,1fr); } }

.ba{ margin-top:var(--s-8); display:grid; gap:var(--s-6); align-items:center; background:var(--ink); color:var(--white); border-radius:var(--r-lg); padding:var(--s-5); --focus:var(--lime); position:relative; overflow:hidden; }
.ba::before{ content:""; position:absolute; width:520px; height:520px; left:-200px; bottom:-280px; background:radial-gradient(closest-side, rgba(198,244,50,.16), transparent); pointer-events:none; }
.ba-copy{ position:relative; }
.ba-copy h3{ margin-top:var(--s-4); font-size:var(--fs-h3); }
.ba-copy p.desc{ margin-top:var(--s-3); color:var(--soft); }
.ba-query{ display:inline-flex; align-items:center; gap:8px; margin-top:var(--s-4); padding:8px 14px; border-radius:999px; background:var(--panel-2); border:1px solid var(--line-strong); font-size:var(--fs-sm); color:var(--white); }
.ba-query svg{ width:16px; height:16px; color:var(--muted); }
.ba-readout{ margin-top:var(--s-5); display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.ba-readout .n{ font-family:var(--ff-head); font-weight:700; font-size:clamp(2.75rem, 2rem + 3vw, 4rem); line-height:1; letter-spacing:-.05em; color:var(--lime); transition:color .3s; }
.ba[data-state="before"] .ba-readout .n{ color:var(--white); }
.ba-readout .of{ font-family:var(--ff-head); font-weight:600; font-size:var(--fs-lg); color:var(--soft); }
.ba-readout small{ flex-basis:100%; font-size:var(--fs-sm); color:var(--muted); }
.ba-toggle{ position:relative; display:inline-grid; grid-template-columns:1fr 1fr; margin-top:var(--s-5); padding:4px; border-radius:999px; background:var(--panel-2); border:1px solid var(--line-strong); }
.ba-thumb{ position:absolute; top:4px; bottom:4px; left:4px; width:calc(50% - 4px); border-radius:999px; background:var(--lime); transition:transform .35s var(--ease); }
.ba[data-state="after"] .ba-thumb{ transform:translateX(100%); }
.ba-toggle button{ position:relative; z-index:1; min-height:46px; min-width:120px; padding:0 18px; border:0; background:none; border-radius:999px; cursor:pointer; font-family:var(--ff-head); font-weight:700; font-size:var(--fs-sm); color:var(--white); transition:color .25s; }
.ba-toggle button small{ font-weight:600; opacity:.75; margin-left:4px; }
.ba-toggle button[aria-pressed="true"]{ color:var(--ink); }
.ba-fig{ position:relative; }
.ba-frame{ position:relative; aspect-ratio:900 / 630; border-radius:var(--r-md); overflow:hidden; background:#1A2338; border:1px solid var(--line-strong); }
.ba-frame img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:opacity .45s ease; }
.ba-frame .img-after{ opacity:0; }
.ba[data-state="after"] .ba-frame .img-after{ opacity:1; }
.ba-label{ position:absolute; top:10px; left:10px; z-index:1; font-family:var(--ff-head); font-weight:700; font-size:12px; text-transform:uppercase; letter-spacing:.1em; padding:6px 10px; border-radius:999px; background:var(--ink); color:var(--white); }
.ba[data-state="after"] .ba-label{ background:var(--lime); color:var(--ink); }
.ba-fig figcaption{ margin-top:var(--s-3); font-size:var(--fs-xs); color:var(--muted); }
@media (min-width:720px){ .ba{ padding:var(--s-6); } }
@media (min-width:1080px){ .ba{ grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:var(--s-7); padding:var(--s-7); } }

/* ---------- Founder ---------- */
.founder{ display:grid; gap:var(--s-7); align-items:center; }
.founder-photo{ position:relative; max-width:400px; width:100%; }
.founder-photo::before{ content:""; position:absolute; inset:12px -12px -12px 12px; border-radius:var(--r-lg); border:2px solid var(--lime); }
.founder-photo img{ position:relative; width:100%; border-radius:var(--r-lg); aspect-ratio:480 / 493; object-fit:cover; }
.founder-badge{ position:absolute; left:16px; bottom:16px; z-index:1; display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:14px; background:rgba(10,15,30,.86); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); border:1px solid var(--line-strong); }
.founder-badge b{ display:block; font-family:var(--ff-head); font-size:15px; }
.founder-badge small{ display:block; font-size:12.5px; color:var(--soft); }
.founder-badge i{ width:9px; height:9px; border-radius:50%; background:var(--lime); flex:none; }
.founder-copy h2{ font-size:var(--fs-h2); margin-top:var(--s-4); }
.founder-copy .letter{ margin-top:var(--s-5); display:grid; gap:var(--s-4); font-size:var(--fs-md); color:var(--soft); max-width:36em; }
.founder-copy .letter strong{ color:var(--white); font-weight:600; }
.founder-sign{ margin-top:var(--s-6); display:flex; flex-wrap:wrap; align-items:center; gap:var(--s-4) var(--s-5); }
.founder-sign .who{ font-family:var(--ff-head); }
.founder-sign .who b{ display:block; font-size:1.25rem; letter-spacing:-.02em; }
.founder-sign .who small{ display:block; font-family:var(--ff-body); font-size:var(--fs-sm); color:var(--muted); }
@media (min-width:1080px){ .founder{ grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:var(--s-9); } }

/* ---------- FAQ ---------- */
.faq-grid{ display:grid; gap:var(--s-7); }
.faq-side .btn{ margin-top:var(--s-6); }
.faq-list{ border-top:1px solid #D7DBE3; }
.faq-list details{ border-bottom:1px solid #D7DBE3; }
.faq-list summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:var(--s-4);
  min-height:64px; padding-block:var(--s-4); font-family:var(--ff-head); font-weight:600; font-size:1.125rem; line-height:1.3; letter-spacing:-.015em;
}
.faq-list summary::-webkit-details-marker{ display:none; }
.faq-list summary:hover{ color:#2C3A12; }
.pm{ position:relative; width:32px; height:32px; flex:none; border-radius:50%; background:var(--white); border:1px solid var(--border-light); transition:background .2s, border-color .2s; }
.pm::before,.pm::after{ content:""; position:absolute; left:50%; top:50%; width:12px; height:2px; margin:-1px 0 0 -6px; background:var(--ink); border-radius:2px; transition:transform .25s var(--ease); }
.pm::after{ transform:rotate(90deg); }
details[open] .pm{ background:var(--lime); border-color:var(--lime); }
details[open] .pm::after{ transform:rotate(0); }
.faq-list .ans{ padding:0 var(--s-7) var(--s-5) 0; color:#3A4256; font-size:var(--fs-base); line-height:1.65; }
@media (min-width:1080px){ .faq-grid{ grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:var(--s-9); } .faq-side{ position:sticky; top:112px; align-self:start; } }

/* ---------- Final CTA / form ---------- */
.final{ overflow:hidden; }
.final .hero-bg::before{ -webkit-mask-image:radial-gradient(ellipse 80% 70% at 20% 30%, #000 20%, transparent 70%); mask-image:radial-gradient(ellipse 80% 70% at 20% 30%, #000 20%, transparent 70%); }
.final .hero-bg::after{ left:-280px; right:auto; top:auto; bottom:-320px; }
.final-grid{ position:relative; display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-7); }
.final-copy h2{ font-size:var(--fs-h2); margin-top:var(--s-4); }
.final-copy .lede{ margin-top:var(--s-4); font-size:var(--fs-md); color:var(--soft); max-width:32em; }
.map-list{ display:grid; gap:var(--s-3); margin-top:var(--s-6); }
.map-list li{ display:flex; gap:var(--s-3); align-items:flex-start; color:#DCE1EA; }
.map-list .chk{ width:24px; height:24px; flex:none; border-radius:50%; background:rgba(198,244,50,.14); color:var(--lime); display:grid; place-items:center; margin-top:1px; }
.map-list .chk svg{ width:14px; height:14px; stroke-width:2.5; }
.or-call{ margin-top:var(--s-7); padding-top:var(--s-5); border-top:1px solid var(--line); }
.or-call p{ font-size:var(--fs-sm); color:var(--muted); margin-bottom:var(--s-3); }

.form-card{ background:var(--white); color:var(--ink); border-radius:var(--r-lg); padding:var(--s-5); box-shadow:var(--shadow-lg); --focus:var(--ink); }
.form-card h3{ font-size:var(--fs-h3); }
.form-card .fc-sub{ margin-top:6px; font-size:var(--fs-sm); color:var(--muted-on-light); }
.fields{ display:grid; gap:var(--s-4); margin-top:var(--s-5); }
.field label{ display:block; font-size:var(--fs-sm); font-weight:600; margin-bottom:6px; }
.field label .req{ color:#6E8F12; font-weight:700; }
.field label .opt{ font-weight:400; color:var(--muted-on-light); }
.field input,.field select{
  width:100%; min-height:52px; padding:0 14px; border-radius:12px; border:1.5px solid #CDD2DB; background:#FBFBFC;
  font-family:var(--ff-body); font-size:1rem; color:var(--ink); transition:border-color .2s, box-shadow .2s, background .2s;
  -webkit-appearance:none; appearance:none;
}
.field select{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A0F1E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; background-size:18px; padding-right:44px; }
.field input:hover,.field select:hover{ border-color:#AEB5C2; }
.field input:focus,.field select:focus{ outline:none; border-color:var(--ink); background:#fff; box-shadow:0 0 0 4px rgba(198,244,50,.6); }
.form-card .btn{ margin-top:var(--s-5); width:100%; }
.btn[aria-busy="true"]{ pointer-events:none; opacity:.85; }
.spin{ width:18px; height:18px; border-radius:50%; border:2.5px solid rgba(10,15,30,.25); border-top-color:var(--ink); animation:spin .8s linear infinite; display:none; }
.btn[aria-busy="true"] .spin{ display:block; }
.btn[aria-busy="true"] .arrow{ display:none; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.form-fine{ margin-top:var(--s-3); font-size:var(--fs-xs); color:var(--muted-on-light); text-align:center; }
.form-status{ margin-top:var(--s-4); }
.form-status:empty{ display:none; }
.form-status .msg{ display:flex; gap:var(--s-3); align-items:flex-start; padding:var(--s-4); border-radius:var(--r-md); font-size:var(--fs-base); line-height:1.5; }
.form-status .ok{ background:rgba(198,244,50,.25); border:1px solid #9CC81C; }
.form-status .err{ background:#FDECEC; border:1px solid #E7A3A3; color:#7A1F1F; }
.form-status svg{ width:20px; height:20px; flex:none; margin-top:2px; }
.form-done .fields,.form-done > .btn,.form-done .form-fine{ display:none; }
@media (min-width:720px){ .fields{ grid-template-columns:1fr 1fr; } .field.full{ grid-column:1 / -1; } .form-card{ padding:var(--s-6); } }
@media (min-width:1080px){ .final-grid{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--s-9); align-items:start; } }

/* ---------- Footer ---------- */
.site-footer{ background:var(--ink-deep); color:var(--soft); padding:var(--s-8) 0 calc(var(--s-9) + env(safe-area-inset-bottom)); border-top:1px solid var(--line); --focus:var(--lime); }
.foot-grid{ display:grid; gap:var(--s-6); }
.foot-brand p{ margin-top:var(--s-4); font-size:var(--fs-sm); max-width:26em; color:var(--muted); }
.foot-col h2{ font-family:var(--ff-head); font-size:var(--fs-xs); text-transform:uppercase; letter-spacing:.14em; color:var(--white); font-weight:600; }
.foot-col ul{ margin-top:var(--s-3); display:grid; }
.foot-col a,.foot-col li{ display:flex; align-items:center; min-height:40px; font-size:var(--fs-sm); text-decoration:none; color:var(--soft); }
.foot-col a:hover{ color:var(--lime); }
.foot-bottom{ margin-top:var(--s-7); padding-top:var(--s-5); border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:var(--s-3) var(--s-5); justify-content:space-between; font-size:var(--fs-xs); color:var(--muted); }
.foot-bottom nav{ display:flex; gap:var(--s-5); }
.foot-bottom a{ color:var(--muted); text-decoration:none; display:inline-flex; align-items:center; min-height:44px; }
.foot-bottom a:hover{ color:var(--white); }
@media (min-width:720px){ .foot-grid{ grid-template-columns:1.6fr 1fr 1fr; } .site-footer{ padding-bottom:var(--s-6); } .foot-bottom{ align-items:center; } }

/* ---------- Mobile sticky CTA ---------- */
.mbar{
  position:fixed; left:0; right:0; bottom:0; z-index:60; display:flex; align-items:center; gap:var(--s-3);
  padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));
  background:rgba(10,15,30,.94); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border-top:1px solid var(--line-strong);
  transform:translateY(110%); transition:transform .35s var(--ease); --focus:var(--lime);
}
.mbar.show{ transform:none; }
.mbar-txt{ font-family:var(--ff-head); font-weight:700; font-size:13px; line-height:1.2; color:var(--white); }
.mbar-txt span{ display:block; color:var(--lime); }
.mbar .btn{ margin-left:auto; min-height:48px; padding:0 18px; font-size:1rem; }
@media (max-width:359px){ .mbar-txt{ display:none; } .mbar .btn{ width:100%; } }
@media (min-width:720px){ .mbar{ display:none; } }

/* ---------- Reveal ---------- */
.js .reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .8s var(--ease); }
.js .reveal.in{ opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; }
  .js .reveal{ opacity:1; transform:none; }
  .js .bar-fill{ transform:none; }
  .marquee-row{ animation:none; width:auto; flex-wrap:wrap; }
  .marquee-list[aria-hidden="true"]{ display:none; }
  .marquee-list{ flex-wrap:wrap; padding-inline:var(--gutter); row-gap:8px; }
}
@media print{ .js .reveal{ opacity:1; transform:none; } .mbar,.site-header{ position:static; } }

/* =====================================================================
   Multi-page additions (site build, 22 Oct 2026)
   ===================================================================== */

/* Wordmark: "The" kept small so the full brand reads The TradeFlow System */
.wm-text .wm-the{ color:var(--muted); font-weight:500; font-size:.78em; margin-right:.28em; letter-spacing:-.01em; }
@media (max-width:339px){ .wm-text .wm-the{ display:none; } }

/* Current page in the nav */
.nav a.nav-link[aria-current="page"]{ color:var(--lime); }
@media (min-width:1080px){
  .nav a.nav-link[aria-current="page"]{ color:var(--white); box-shadow:inset 0 -2px 0 var(--lime); }
}
[id]{ scroll-margin-top:88px; }

/* Inner page hero */
.page-hero{ position:relative; overflow:hidden; padding:var(--s-6) 0 var(--s-8); }
.page-hero .wrap{ position:relative; }
.page-hero h1{ font-size:clamp(2.125rem, 1.4rem + 3.4vw, 3.75rem); margin-top:var(--s-4); letter-spacing:-.035em; line-height:1.04; max-width:18ch; }
.page-hero .lede{ margin-top:var(--s-5); font-size:var(--fs-md); color:var(--soft); max-width:40em; }
.page-hero .hero-ctas{ margin-top:var(--s-6); }
@media (min-width:720px){ .page-hero{ padding:var(--s-8) 0 var(--s-9); } }

/* Breadcrumbs */
.crumbs ol{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:var(--fs-xs); color:var(--muted); }
.crumbs li{ display:inline-flex; align-items:center; gap:6px; }
.crumbs li + li::before{ content:"/"; color:var(--line-strong); }
.crumbs a{ color:var(--soft); text-decoration:none; display:inline-flex; align-items:center; min-height:32px; }
.crumbs a:hover{ color:var(--lime); }
.crumbs [aria-current="page"]{ color:var(--white); }

/* Founder chip (home hero) */
.founder-chip{ display:flex; align-items:center; gap:var(--s-3); margin-top:var(--s-5); }
.founder-chip img{ width:52px; height:52px; border-radius:50%; object-fit:cover; border:2px solid var(--lime); flex:none; }
.founder-chip p{ font-size:var(--fs-sm); color:var(--soft); line-height:1.4; }
.founder-chip b{ display:block; color:var(--white); font-family:var(--ff-head); font-weight:600; font-size:1rem; letter-spacing:-.01em; }

/* Chat bubbles: what installers tell us */
.bubbles{ display:grid; gap:var(--s-3); max-width:640px; }
.bubble{
  position:relative; justify-self:start; max-width:92%;
  background:var(--white); color:#283044; border:1px solid var(--border-light);
  border-radius:20px 20px 20px 6px; padding:12px 16px; font-size:var(--fs-base); line-height:1.45;
  box-shadow:0 6px 18px -12px rgba(10,15,30,.35);
}
.bubble small{ display:block; margin-top:4px; font-size:12px; color:var(--muted-on-light); }
.bubble.us{
  justify-self:end; background:var(--ink); color:var(--white); border-color:var(--ink);
  border-radius:20px 20px 6px 20px; font-family:var(--ff-head); font-weight:600; letter-spacing:-.01em;
}
.bubble.us small{ color:var(--lime); }
.bubbles-label{ font-size:var(--fs-xs); font-weight:600; text-transform:uppercase; letter-spacing:.12em; color:var(--muted-on-light); margin-bottom:var(--s-2); }
.chat-grid{ display:grid; gap:var(--s-7); }
@media (min-width:1080px){ .chat-grid{ grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr); gap:var(--s-7); align-items:start; } }

/* Comparison table: bought leads vs Google searchers */
.compare{ width:100%; border-collapse:separate; border-spacing:0; font-size:var(--fs-base); line-height:1.45; }
.compare caption{ text-align:left; font-family:var(--ff-head); font-weight:700; font-size:var(--fs-h3); letter-spacing:-.02em; padding-bottom:var(--s-4); }
.compare thead tr, .compare tbody tr{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:8px; }
.compare thead th:first-child{ display:none; }
.compare thead th{ text-align:left; font-family:var(--ff-head); font-size:var(--fs-sm); font-weight:700; padding:0 12px var(--s-2); }
.compare thead .c-bad{ color:var(--muted-on-light); }
.compare thead .c-good{ color:var(--ink); }
.compare tbody th{
  grid-column:1 / -1; text-align:left; font-size:var(--fs-xs); font-weight:600; text-transform:uppercase; letter-spacing:.1em;
  color:var(--muted-on-light); padding:var(--s-4) 0 var(--s-2); border-top:1px solid #D7DBE3;
}
.compare tbody tr:first-child th{ border-top:0; }
.compare td{ padding:10px 12px; vertical-align:top; overflow-wrap:anywhere; }
.compare td.bad{ color:#4A5266; }
.compare td.good{ background:var(--ink); color:var(--white); border-radius:12px; font-weight:500; }
.compare td.good::before{ content:""; display:block; width:16px; height:16px; margin-bottom:6px; border-radius:50%; background:var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4L18 8' fill='none' stroke='%230A0F1E' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }
.compare td.bad::before{ content:""; display:block; width:16px; height:16px; margin-bottom:6px; border-radius:50%; background:#E3E6EC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 8l8 8M16 8l-8 8' fill='none' stroke='%23525B6E' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center/10px no-repeat; }
@media (min-width:720px){
  .compare thead tr, .compare tbody tr{ grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(0,1fr); column-gap:12px; align-items:stretch; }
  .compare thead th:first-child{ display:block; }
  .compare tbody th{ grid-column:auto; padding:var(--s-4) 0; border-top:1px solid #D7DBE3; align-self:stretch; }
  .compare td{ margin-block:8px; }
}

/* Signed note from Callum */
.note{ position:relative; background:var(--panel); color:var(--soft); border:1px solid var(--line-strong); border-radius:var(--r-lg); padding:var(--s-5); max-width:720px; }
.note-head{ display:flex; align-items:center; gap:var(--s-3); margin-bottom:var(--s-4); }
.note-head img{ width:56px; height:56px; border-radius:50%; object-fit:cover; border:2px solid var(--lime); flex:none; }
.note-head b{ display:block; font-family:var(--ff-head); color:var(--white); font-size:1.0625rem; letter-spacing:-.01em; }
.note-head small{ display:block; font-size:var(--fs-sm); color:var(--muted); }
.note-body{ display:grid; gap:var(--s-4); font-size:var(--fs-md); line-height:1.6; }
.note-body strong{ color:var(--white); font-weight:600; }
.note-sign{ margin-top:var(--s-5); font-family:var(--ff-head); font-weight:700; font-size:1.75rem; letter-spacing:-.03em; color:var(--lime); display:inline-block; position:relative; }
.note-sign svg{ position:absolute; left:-2px; right:-6px; bottom:-8px; width:calc(100% + 8px); height:10px; color:var(--lime); opacity:.7; }
@media (min-width:720px){ .note{ padding:var(--s-7); } }

/* Contact ways */
.ways{ display:grid; gap:var(--s-3); }
.way{ display:flex; align-items:center; gap:var(--s-4); min-height:72px; padding:var(--s-4); border-radius:var(--r-md); background:var(--panel); border:1px solid var(--line-strong); color:var(--white); text-decoration:none; transition:border-color .2s, background .2s; }
.way:hover{ border-color:var(--lime); background:var(--panel-2); }
.way-ico{ width:44px; height:44px; border-radius:12px; display:grid; place-items:center; flex:none; background:rgba(198,244,50,.14); color:var(--lime); }
.way-ico svg{ width:22px; height:22px; }
.way.primary .way-ico{ background:var(--lime); color:var(--ink); }
.way b{ display:block; font-family:var(--ff-head); font-size:1.0625rem; letter-spacing:-.01em; }
.way small{ display:block; font-size:var(--fs-sm); color:var(--muted); }
.way .go{ margin-left:auto; width:18px; height:18px; color:var(--muted); flex:none; }
.light .way, .white .way{ background:var(--white); color:var(--ink); border-color:var(--border-light); }
.light .way:hover, .white .way:hover{ border-color:var(--ink); background:var(--white); }
.light .way small, .white .way small{ color:var(--muted-on-light); }
.light .way-ico, .white .way-ico{ background:var(--light); color:var(--ink); }
@media (min-width:720px){ .ways.two{ grid-template-columns:1fr 1fr; } }
.quick-contact{ display:flex; flex-wrap:wrap; gap:var(--s-2) var(--s-4); margin-top:var(--s-4); font-size:var(--fs-sm); color:var(--muted); }
.quick-contact a{ color:var(--soft); display:inline-flex; align-items:center; gap:6px; min-height:44px; text-decoration:underline; text-decoration-color:rgba(198,244,50,.5); text-underline-offset:3px; }
.quick-contact a:hover{ color:var(--lime); }
.quick-contact svg{ width:16px; height:16px; }

/* Risk / reward meters on the pricing models */
.rr{ display:grid; gap:var(--s-3); margin-top:var(--s-5); }
.rr-row{ display:grid; grid-template-columns:7.5em minmax(0,1fr); align-items:center; gap:var(--s-3); font-size:var(--fs-sm); }
.rr-row span{ color:var(--muted-on-light); font-weight:500; }
.plan.feat .rr-row span{ color:var(--muted); }
.rr-track{ height:10px; border-radius:999px; background:#E6E9EF; overflow:hidden; }
.plan.feat .rr-track{ background:var(--panel-3); }
.rr-fill{ display:block; height:100%; border-radius:999px; background:var(--ink); }
.plan.feat .rr-fill{ background:var(--lime); }
.rr-fill.keep{ background:#8DB51A; }
.plan.feat .rr-fill.keep{ background:var(--lime); }

/* Generic table that scrolls inside its own box on phones */
.table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:var(--r-lg); border:1px solid var(--border-light); background:var(--white); }
.grid-table{ width:100%; min-width:620px; border-collapse:collapse; font-size:var(--fs-base); }
.grid-table th, .grid-table td{ padding:14px 16px; text-align:left; vertical-align:top; border-bottom:1px solid var(--border-light); }
.grid-table thead th{ font-family:var(--ff-head); font-size:var(--fs-sm); background:var(--light); }
.grid-table tbody th{ font-weight:600; color:var(--muted-on-light); font-size:var(--fs-sm); width:26%; }
.grid-table tr:last-child th, .grid-table tr:last-child td{ border-bottom:0; }

/* Ticked list */
.ticks{ display:grid; gap:var(--s-3); }
.ticks li{ display:flex; gap:var(--s-3); align-items:flex-start; line-height:1.5; }
.ticks .chk{ width:24px; height:24px; flex:none; border-radius:50%; background:rgba(198,244,50,.18); color:#4F6B0B; display:grid; place-items:center; margin-top:1px; }
.dark .ticks .chk, .dark-panel .ticks .chk{ color:var(--lime); }
.ticks .chk svg{ width:14px; height:14px; stroke-width:2.5; }

/* Two-column feature row (how it works detail) */
.split{ display:grid; gap:var(--s-6); align-items:start; }
.split + .split{ margin-top:var(--s-8); padding-top:var(--s-8); border-top:1px solid var(--border-light); }
.dark .split + .split{ border-color:var(--line); }
.split h2, .split h3{ font-size:var(--fs-h3); }
.split .big-num{ font-family:var(--ff-head); font-weight:700; font-size:clamp(3rem, 2.4rem + 3vw, 5rem); line-height:.9; letter-spacing:-.05em; color:var(--lime); -webkit-text-stroke:1.5px var(--ink); }
.white .split .big-num, .light .split .big-num{ color:var(--lime); }
.split p + p, .split p + .ticks, .split .ticks + p{ margin-top:var(--s-4); }
.split p{ color:#3A4256; }
.dark .split p{ color:var(--soft); }
@media (min-width:900px){ .split{ grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:var(--s-8); } }

/* CTA band (inner pages) */
.cta-band{ position:relative; overflow:hidden; }
.cta-band .wrap{ position:relative; }
.cta-box{ display:grid; gap:var(--s-6); align-items:center; }
.cta-box h2{ font-size:var(--fs-h2); margin-top:var(--s-4); max-width:16ch; }
.cta-box .lede{ margin-top:var(--s-4); font-size:var(--fs-md); color:var(--soft); max-width:34em; }
@media (min-width:1080px){ .cta-box{ grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:var(--s-8); } }

/* Long-form text (privacy, terms) */
.prose{ max-width:72ch; color:#283044; font-size:1.0625rem; line-height:1.7; }
.prose h2{ font-size:var(--fs-h3); margin-top:var(--s-7); color:var(--ink); }
.prose h3{ font-size:1.1875rem; margin-top:var(--s-5); color:var(--ink); letter-spacing:-.015em; }
.prose p, .prose ul, .prose ol{ margin-top:var(--s-4); }
.prose ul{ list-style:disc; padding-left:1.25em; }
.prose ol{ list-style:decimal; padding-left:1.4em; }
.prose li + li{ margin-top:6px; }
.prose a{ color:var(--ink); text-decoration-color:#8DB51A; text-underline-offset:3px; text-decoration-thickness:2px; }
.prose .updated{ font-size:var(--fs-sm); color:var(--muted-on-light); }

/* Mobile bar: WhatsApp button beside the booking CTA */
.mbar .mbar-wa{ width:48px; height:48px; flex:none; display:grid; place-items:center; border-radius:50%; border:1px solid var(--line-strong); color:var(--white); }
.mbar .mbar-wa svg{ width:22px; height:22px; }
.mbar .btn{ margin-left:0; }
.mbar .mbar-txt{ margin-right:auto; }
@media (max-width:359px){ .mbar .btn{ width:auto; flex:1; } }

/* Footer contact icons */
.foot-col a svg{ width:16px; height:16px; margin-right:8px; flex:none; color:var(--lime); }

/* Single-column grids must be allowed to shrink below their content's min width (320px phones) */
@media (max-width:1079px){ .hero-grid, .case, .dash-grid, .founder, .faq-grid, .cta-box, .chat-grid, .final-grid, .ba{ grid-template-columns:minmax(0,1fr); } }
@media (max-width:899px){ .split{ grid-template-columns:minmax(0,1fr); } }
@media (max-width:719px){ .foot-grid{ grid-template-columns:minmax(0,1fr); } }
@media (max-width:379px){ .btn{ white-space:normal; text-align:center; line-height:1.25; padding-block:10px; } }
/* Without JavaScript the menu button can't open, so show the call button instead (all pages are linked in the footer) */
html:not(.js) .menu-btn{ display:none; }
html:not(.js) .hdr-cta{ display:inline-flex; }
/* Two pricing options side by side */
@media (min-width:860px){ .plans.two{ grid-template-columns:repeat(2,minmax(0,1fr)); max-width:980px; gap:var(--s-5); align-items:stretch; } .plans.two .plan.feat{ transform:none; } }
/* Labelled big numbers in split rows */
.split .big-num small{ display:block; margin-top:8px; font-family:var(--ff-body); font-size:.95rem; font-weight:600; letter-spacing:0; line-height:1.3; -webkit-text-stroke:0; color:var(--muted-on-light); }
.dark .split .big-num small{ color:var(--soft); }
