/* ── LANDING HELPMEET v2 — stylesheet ── */
:root {
  --green: #34C78A;
  --green-soft: #6FE3B5;
  --green-deep: #1a7a54;
  --green-glow: rgba(52,199,138,.22);
  --bg: #0a0f0c;
  --bg-2: #10171300;
  --panel: #111814;
  --panel-2: #151e19;
  --panel-3: #1b2721;
  --line: rgba(111,227,181,.10);
  --line-strong: rgba(111,227,181,.22);
  --text: #eaf3ee;
  --text-dim: #b6c8bd;
  --muted: #7a9486;
  --muted-2: #55685e;
  --danger: #ff6b6b;
  --amber: #febc2e;
  --font-head: 'Syne', sans-serif;
  --font-body: 'DM Sans', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --ease-out: cubic-bezier(.22,1,.36,1);
  --ease-inout: cubic-bezier(.65,0,.35,1);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body);
  background: var(--bg);
  color: var(--text);
  overflow-x: hidden;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ── NOISE ── */
body::before {
  content: '';
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  opacity: .55;
}

/* ── SPOTLIGHT ── */
.spotlight {
  position: fixed; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(520px circle at var(--mx, 50%) var(--my, -200px), rgba(52,199,138,.08), transparent 55%);
  transition: background .12s ease-out;
  mix-blend-mode: screen;
}

/* ── CURSOR RING ── */
.cursor-ring {
  position: fixed; top: 0; left: 0; width: 38px; height: 38px;
  border-radius: 50%; border: 1.5px solid rgba(52,199,138,.8);
  background: rgba(52,199,138,.04); pointer-events: none; z-index: 9998;
  transform: translate3d(-100px, -100px, 0);
  transition: width .28s var(--ease-out), height .28s var(--ease-out),
              border-color .28s var(--ease-out), background .28s var(--ease-out), opacity .3s ease;
  will-change: transform, width, height; opacity: 0; mix-blend-mode: screen;
}
.cursor-ring.visible { opacity: 1; }
.cursor-ring.grow { width: 72px; height: 72px; background: rgba(52,199,138,.1); border-color: rgba(52,199,138,1); }
.cursor-ring.click { width: 26px; height: 26px; background: rgba(52,199,138,.3); }
@media (pointer: coarse), (prefers-reduced-motion: reduce) { .spotlight, .cursor-ring { display: none; } }

a { text-decoration: none; color: inherit; }
img, svg { display: block; max-width: 100%; }
button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; }
::selection { background: var(--green); color: var(--bg); }
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; border-radius: 6px; }
.skip-link { position: absolute; top: -100px; left: 12px; z-index: 10001; background: var(--green); color: #0a0f0c; font-family: var(--font-head); font-weight: 700; font-size: 13px; padding: 10px 16px; border-radius: 8px; transition: top .2s var(--ease-out); }
.skip-link:focus { top: 12px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

/* ── LOADER ── */
.loader { position: fixed; inset: 0; z-index: 10000; background: var(--bg); display: flex; align-items: center; justify-content: center; transition: opacity .6s var(--ease-out), visibility .6s; }
.loader.hide { opacity: 0; visibility: hidden; }
.loader-mark { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; animation: pulse 1.4s ease-in-out infinite; }
@keyframes pulse { 0%,100% { transform: scale(1); opacity:1; } 50% { transform: scale(.88); opacity:.6; } }

/* ── NAV ── */
header { position: relative; z-index: 100; }
nav { position: fixed; top:0; left:0; right:0; z-index:100; height:68px; display:flex; align-items:center; justify-content:space-between; padding:0 32px; background:rgba(10,15,12,.75); backdrop-filter:blur(18px) saturate(140%); -webkit-backdrop-filter:blur(18px) saturate(140%); border-bottom:1px solid transparent; transition:height .3s var(--ease-out), background .3s var(--ease-out), border-color .3s var(--ease-out); }
nav.scrolled { height:60px; background:rgba(10,15,12,.92); border-bottom-color:var(--line-strong); }
.nav-logo { display:inline-flex; align-items:center; gap:10px; font-family:var(--font-head); font-size:18px; font-weight:700; letter-spacing:-.01em; color:var(--text); padding:8px; margin-left:-8px; border-radius:8px; }
.nav-logo-dot { width:32px; height:32px; border-radius:8px; background:var(--panel); display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); flex-shrink:0; }
.nav-logo-dot svg { width:20px; height:20px; }
.nav-links { display:flex; align-items:center; gap:6px; list-style:none; }
.nav-link { display:inline-flex; align-items:center; font-family:var(--font-body); font-size:14px; font-weight:500; color:var(--text-dim); padding:10px 14px; min-height:44px; border-radius:8px; transition:color .2s, background .2s; }
.nav-link:hover { color:var(--text); background:rgba(255,255,255,.04); }
.nav-link:active { background:rgba(255,255,255,.06); }
@media (max-width:900px) { .nav-links { display:none; } }
.nav-cta { display:inline-flex; align-items:center; gap:8px; background:var(--green); color:#0a0f0c; font-family:var(--font-head); font-size:13.5px; font-weight:700; padding:10px 18px; min-height:44px; border-radius:10px; transition:transform .2s var(--ease-out), box-shadow .25s var(--ease-out), background .2s; position:relative; border:1px solid var(--green); }
.nav-cta:hover { transform:translateY(-1px); box-shadow:0 8px 24px -8px rgba(52,199,138,.6); background:var(--green-soft); }
.nav-cta:active { transform:translateY(0); }

/* ── SECTIONS ── */
section, .band { position:relative; z-index:2; }
.wrap { max-width:1180px; margin:0 auto; padding:0 24px; }
.section { padding:160px 0; }
.section + .section { padding-top:80px; }
.section-label { display:inline-flex; align-items:center; gap:10px; font-family:var(--font-mono); font-size:11px; font-weight:500; letter-spacing:1.5px; text-transform:uppercase; color:var(--green); margin-bottom:20px; }
.section-label::before { content:''; width:20px; height:1px; background:var(--green); }
.section-title { font-family:var(--font-head); font-size:clamp(32px,5vw,60px); font-weight:800; line-height:1.02; letter-spacing:-.025em; margin-bottom:20px; }
.section-title em { font-style:normal; color:var(--green); }
.section-sub { font-size:clamp(15px,1.6vw,18px); color:var(--text-dim); max-width:620px; line-height:1.55; font-weight:300; }
@media (max-width:640px) { .section { padding:100px 0; } .section + .section { padding-top:60px; } }

/* ── HERO ── */
.hero { min-height:100vh; padding:calc(68px + clamp(48px,8vh,92px)) 24px 0; display:flex; flex-direction:column; align-items:center; text-align:center; position:relative; overflow:hidden; }
.hero-bg { position:absolute; inset:0; overflow:hidden; z-index:0; pointer-events:none; }
.hero-orb { position:absolute; top:38%; left:50%; translate:-50% -50%; width:min(820px,95vw); aspect-ratio:1; pointer-events:none; will-change:transform; }
.hero-orb::before { content:''; position:absolute; inset:0; border-radius:50%; background:radial-gradient(circle, rgba(52,199,138,.20) 0%, transparent 62%); filter:blur(24px); animation:orbBreathe 7s ease-in-out infinite, orbFloat 14s ease-in-out infinite; will-change:transform, opacity; }
@keyframes orbBreathe { 0%,100% { transform:scale(1); opacity:1; } 50% { transform:scale(1.18); opacity:.72; } }
@keyframes orbFloat { 0% { translate:0 0; } 25% { translate:46px -22px; } 50% { translate:20px 34px; } 75% { translate:-36px 12px; } 100% { translate:0 0; } }
.hero-orb-satellite { position:absolute; top:42%; left:50%; width:min(300px,34vw); aspect-ratio:1; pointer-events:none; translate:-50% -50%; will-change:transform; }
.hero-orb-satellite::before { content:''; position:absolute; inset:0; border-radius:50%; background:radial-gradient(circle, rgba(111,227,181,.14) 0%, transparent 60%); filter:blur(30px); animation:orbOrbit 22s linear infinite; transform-origin:center; will-change:transform; }
@keyframes orbOrbit { from { transform:rotate(0deg) translateX(200px) rotate(0deg); } to { transform:rotate(360deg) translateX(200px) rotate(-360deg); } }
.hero-orb-satellite.s2 { top:34%; width:min(220px,26vw); }
.hero-orb-satellite.s2::before { background:radial-gradient(circle, rgba(52,199,138,.09) 0%, transparent 60%); animation:orbOrbit2 30s linear infinite; }
@keyframes orbOrbit2 { from { transform:rotate(0deg) translateX(260px) rotate(0deg); } to { transform:rotate(-360deg) translateX(260px) rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .hero-orb::before, .hero-orb-satellite::before { animation:none; } }
.hero-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(111,227,181,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(111,227,181,.045) 1px, transparent 1px); background-size:64px 64px; mask-image:radial-gradient(ellipse at center, black 18%, transparent 70%); -webkit-mask-image:radial-gradient(ellipse at center, black 18%, transparent 70%); }
.hero-ring { position:absolute; top:46%; left:50%; translate:-50% -50%; width:min(760px,92vw); aspect-ratio:1; border-radius:50%; border:1px solid rgba(111,227,181,.08); will-change:transform; }
.hero-ring::before { content:''; position:absolute; inset:0; border-radius:50%; border:1.5px solid rgba(52,199,138,.55); box-shadow:0 0 12px rgba(52,199,138,.35); clip-path:polygon(50% 50%, 100% 0%, 100% 100%, 50% 50%); animation:ringSpin 22s linear infinite; transform-origin:center; will-change:transform; }
.hero-ring.r2::before { border-color:rgba(52,199,138,.35); border-width:1px; animation-duration:34s; animation-direction:reverse; box-shadow:0 0 10px rgba(52,199,138,.22); }
.hero-ring.r3::before { border-color:rgba(52,199,138,.22); border-width:1px; animation-duration:46s; box-shadow:0 0 8px rgba(52,199,138,.15); }
@keyframes ringSpin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .hero-ring::before { animation:none; } }
.hero-ring.r2 { width:min(1020px,115vw); border-color:rgba(111,227,181,.055); }
.hero-ring.r3 { width:min(1300px,140vw); border-color:rgba(111,227,181,.035); }
.hero-content { position:relative; z-index:2; width:100%; max-width:820px; display:flex; flex-direction:column; align-items:center; }
.hero-eyebrow { display:inline-flex; align-items:center; gap:10px; background:rgba(52,199,138,.08); border:1px solid rgba(52,199,138,.28); border-radius:999px; padding:7px 16px 7px 12px; font-family:var(--font-mono); font-size:11.5px; font-weight:500; letter-spacing:.7px; color:var(--green); margin-bottom:clamp(26px,3.5vh,38px); text-transform:uppercase; line-height:1.2; max-width:100%; }
.hero-eyebrow .dot { width:6px; height:6px; border-radius:50%; background:var(--green); box-shadow:0 0 0 0 var(--green); animation:ripple 1.8s ease-out infinite; flex-shrink:0; }
@keyframes ripple { 0% { box-shadow:0 0 0 0 rgba(52,199,138,.55); } 100% { box-shadow:0 0 0 8px rgba(52,199,138,0); } }
.hero-title { font-family:var(--font-head); font-size:clamp(48px,8.4vw,96px); font-weight:800; line-height:.98; letter-spacing:-.035em; margin:0 0 clamp(22px,3vh,32px); max-width:12ch; text-wrap:balance; }
.hero-title em { font-style:normal; color:var(--green); position:relative; }
.hero-title em::after { content:''; position:absolute; left:4%; right:4%; bottom:-4%; height:8px; background:var(--green); opacity:.22; border-radius:4px; }
.hero-lead { font-family:var(--font-head); font-size:clamp(22px,2.8vw,32px); font-weight:600; line-height:1.15; letter-spacing:-.015em; color:var(--text); margin:0 0 clamp(20px,2.8vh,28px); max-width:22ch; }
.hero-lead .lead-em { color:var(--green); }
.hero-desc { font-family:var(--font-body); font-size:clamp(15px,1.5vw,17.5px); color:var(--text-dim); max-width:600px; margin:0 auto clamp(28px,3.6vh,38px); font-weight:400; line-height:1.6; text-wrap:pretty; }
.hero-actions { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-bottom:clamp(20px,2.6vh,28px); }
.btn { position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px; font-family:var(--font-head); font-weight:700; padding:14px 24px; min-height:48px; border-radius:12px; transition:transform .2s var(--ease-out), box-shadow .25s var(--ease-out), background .2s, border-color .2s; cursor:pointer; line-height:1.15; white-space:nowrap; }
.btn.primary { background:var(--green); color:#0a0f0c; font-size:15px; border:1px solid var(--green); box-shadow:0 12px 32px -14px rgba(52,199,138,.55); }
.btn.primary:hover { transform:translateY(-2px); background:var(--green-soft); box-shadow:0 18px 40px -12px rgba(52,199,138,.7); }
.btn.primary:active { transform:translateY(0); }
.btn.ghost { background:transparent; color:var(--text); font-size:15px; border:1px solid var(--line-strong); }
.btn.ghost:hover { border-color:var(--green); background:rgba(52,199,138,.06); color:var(--green); }
.btn.ghost:active { background:rgba(52,199,138,.1); }
.hero-micro { font-family:var(--font-mono); font-size:11.5px; color:var(--muted); letter-spacing:.3px; line-height:1.5; max-width:640px; margin:0 auto; }
.hero-app { margin:clamp(32px,5vh,56px) auto 0; max-width:1080px; width:100%; position:relative; z-index:2; perspective:1600px; padding-bottom:60px; }
.hero-app::after { content:''; position:absolute; left:0; right:0; bottom:0; height:120px; pointer-events:none; background:linear-gradient(to bottom, transparent, var(--bg)); }
.app-wrap { position:relative; transform:rotateX(4deg); transform-origin:center bottom; }
.app-window { background:var(--panel); border:1px solid var(--line-strong); border-radius:16px; box-shadow:0 60px 140px -30px rgba(0,0,0,.7), 0 0 100px -20px rgba(52,199,138,.14), inset 0 1px 0 rgba(255,255,255,.03); overflow:hidden; }
.app-tb { height:40px; background:rgba(0,0,0,.35); display:flex; align-items:center; padding:0 16px; gap:8px; border-bottom:1px solid var(--line); }
.app-dot { width:11px; height:11px; border-radius:50%; }
.app-dot.r { background:#ff5f57; } .app-dot.y { background:#febc2e; } .app-dot.g { background:var(--green); }
.app-title { margin:0 auto; font-family:var(--font-mono); font-size:11px; color:var(--text-dim); display:flex; align-items:center; gap:8px; }
.app-body { display:grid; grid-template-columns:220px 1fr 260px; min-height:460px; }
.app-side { background:rgba(0,0,0,.25); padding:20px 14px; border-right:1px solid var(--line); display:flex; flex-direction:column; gap:4px; }
.app-side-label { font-family:var(--font-mono); font-size:10px; letter-spacing:1px; color:var(--muted-2); text-transform:uppercase; padding:4px 10px; margin-bottom:6px; }
.app-side-item { padding:8px 10px; border-radius:8px; font-size:12.5px; color:var(--text-dim); display:flex; align-items:center; gap:10px; transition:background .2s, color .2s; }
.app-side-item:hover { background:rgba(255,255,255,.02); color:var(--text); }
.app-side-item.on { background:rgba(52,199,138,.10); color:var(--green); border:1px solid rgba(52,199,138,.2); }
.app-side-item .pd { width:6px; height:6px; border-radius:50%; flex-shrink:0; }
.app-side-item .count { margin-left:auto; font-family:var(--font-mono); font-size:10px; color:var(--muted); }
.app-main { padding:24px 28px; display:flex; flex-direction:column; gap:18px; overflow:hidden; }
.app-meet-head { display:flex; align-items:center; gap:12px; }
.app-meet-title { font-family:var(--font-head); font-size:20px; font-weight:700; color:var(--text); }
.app-meet-time { font-family:var(--font-mono); font-size:11px; color:var(--muted); padding:3px 9px; border:1px solid var(--line); border-radius:4px; }
.done-indicator { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; background:rgba(52,199,138,.10); border:1px solid rgba(52,199,138,.32); font-family:var(--font-mono); font-size:10.5px; letter-spacing:.5px; color:var(--green); text-transform:uppercase; margin-left:auto; font-weight:600; }
.app-tabs { display:flex; gap:22px; border-bottom:1px solid var(--line); }
.app-tab { font-size:12.5px; color:var(--muted); padding:0 0 10px; border-bottom:2px solid transparent; margin-bottom:-1px; font-weight:500; }
.app-tab.on { color:var(--green); border-color:var(--green); }
.app-utterances { display:flex; flex-direction:column; gap:14px; }
.utt { display:flex; gap:12px; align-items:flex-start; }
.utt-av { width:30px; height:30px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:10.5px; font-weight:700; }
.utt-body { flex:1; font-size:13px; line-height:1.55; color:var(--text-dim); }
.utt-body .who { color:var(--text); font-size:11px; font-weight:600; margin-bottom:3px; font-family:var(--font-mono); }
.utt-body .who span { color:var(--muted); margin-left:6px; font-weight:400; }
.app-right { background:rgba(0,0,0,.25); border-left:1px solid var(--line); padding:20px 18px; display:flex; flex-direction:column; gap:18px; }
.mini-card { background:var(--panel-2); border:1px solid var(--line); border-radius:10px; padding:14px; }
.mini-card-title { font-family:var(--font-mono); font-size:10px; letter-spacing:1px; color:var(--muted); text-transform:uppercase; margin-bottom:10px; display:flex; align-items:center; justify-content:space-between; gap:8px; }
.mini-card-meta { display:inline-flex; align-items:center; gap:5px; color:var(--green); text-transform:uppercase; font-size:9.5px; }
.wave { position:relative; display:flex; align-items:center; justify-content:space-between; gap:3px; height:46px; overflow:visible; }
.wave span { flex:1; background:var(--green); border-radius:2px; height:20%; opacity:.28; transition:opacity .35s ease-out; }
.wave-play span { animation:barPlay 2.8s ease-in-out infinite; will-change:opacity; }
.wave-play span:nth-child(1){animation-delay:.05s} .wave-play span:nth-child(2){animation-delay:.15s} .wave-play span:nth-child(3){animation-delay:.26s} .wave-play span:nth-child(4){animation-delay:.37s} .wave-play span:nth-child(5){animation-delay:.47s} .wave-play span:nth-child(6){animation-delay:.58s} .wave-play span:nth-child(7){animation-delay:.68s} .wave-play span:nth-child(8){animation-delay:.79s} .wave-play span:nth-child(9){animation-delay:.90s} .wave-play span:nth-child(10){animation-delay:1.00s} .wave-play span:nth-child(11){animation-delay:1.11s} .wave-play span:nth-child(12){animation-delay:1.22s} .wave-play span:nth-child(13){animation-delay:1.32s} .wave-play span:nth-child(14){animation-delay:1.43s} .wave-play span:nth-child(15){animation-delay:1.54s} .wave-play span:nth-child(16){animation-delay:1.64s} .wave-play span:nth-child(17){animation-delay:1.75s} .wave-play span:nth-child(18){animation-delay:1.86s} .wave-play span:nth-child(19){animation-delay:1.96s} .wave-play span:nth-child(20){animation-delay:2.07s}
@keyframes barPlay { 0%,80%,100% { opacity:.28; } 4%,10% { opacity:1; } }
.wave-playhead { position:absolute; top:-3px; bottom:-3px; left:0; width:1.5px; background:var(--green); box-shadow:0 0 10px rgba(52,199,138,.75), 0 0 3px rgba(52,199,138,.9); animation:playhead 2.8s linear infinite; border-radius:1px; z-index:2; will-change:transform, opacity; }
@keyframes playhead { 0% { left:0%; opacity:0; } 2% { opacity:1; } 82% { opacity:1; left:100%; } 90%,100% { left:100%; opacity:0; } }
@media (prefers-reduced-motion:reduce) { .wave-play span { animation:none; opacity:.85; } .wave-playhead { animation:none; display:none; } }
.stat-mini { display:flex; justify-content:space-between; align-items:baseline; }
.stat-mini .n { font-family:var(--font-head); font-size:22px; font-weight:800; color:var(--green); }
.stat-mini .l { font-size:11px; color:var(--muted); }
.chip-list { display:flex; flex-wrap:wrap; gap:5px; }
.chip { background:rgba(52,199,138,.08); border:1px solid rgba(52,199,138,.2); color:var(--green); font-size:10.5px; padding:3px 8px; border-radius:4px; font-family:var(--font-mono); }
@media (max-width:900px) { .app-body { grid-template-columns:1fr; min-height:0; } .app-side, .app-right { display:none; } .app-wrap { transform:none; } }

/* ── TICKER ── */
.ticker-wrap { padding:18px 0; overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(52,199,138,.02); position:relative; }
.ticker-wrap::before, .ticker-wrap::after { content:''; position:absolute; top:0; bottom:0; width:120px; z-index:2; pointer-events:none; }
.ticker-wrap::before { left:0; background:linear-gradient(to right, var(--bg), transparent); }
.ticker-wrap::after { right:0; background:linear-gradient(to left, var(--bg), transparent); }
.ticker-inner { display:flex; gap:56px; width:max-content; animation:tk 32s linear infinite; }
@keyframes tk { from { transform:translateX(0); } to { transform:translateX(-50%); } }
.ticker-item { white-space:nowrap; font-family:var(--font-mono); font-size:12.5px; color:var(--text-dim); font-weight:500; letter-spacing:.3px; display:flex; align-items:center; gap:12px; }
.ticker-item::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--green); flex-shrink:0; }
.ticker-wrap:hover .ticker-inner { animation-play-state:paused; }

/* ── STATS ── */
.stats-wrap { border-bottom:1px solid var(--line); }
.stats-row { display:grid; grid-template-columns:repeat(4, 1fr); max-width:1180px; margin:0 auto; }
.stat-cell { padding:48px 28px; border-left:1px solid var(--line); }
.stat-cell:first-child { border-left:none; }
.stat-num { font-family:var(--font-head); font-size:clamp(38px,5vw,56px); font-weight:800; color:var(--green); line-height:1; letter-spacing:-.03em; display:flex; align-items:baseline; gap:4px; }
.stat-num .suffix { font-size:.5em; color:var(--green); opacity:.7; }
.stat-lbl { font-family:var(--font-mono); font-size:11.5px; color:var(--muted); margin-top:10px; text-transform:uppercase; letter-spacing:.5px; }
@media (max-width:780px) { .stats-row { grid-template-columns:repeat(2, 1fr); } .stat-cell:nth-child(2) { border-left:1px solid var(--line); } .stat-cell:nth-child(3) { border-left:none; border-top:1px solid var(--line); } .stat-cell:nth-child(4) { border-top:1px solid var(--line); } }

/* ── HEADER GRID ── */
.sec-head { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:end; margin-bottom:60px; }
@media (max-width:780px) { .sec-head { grid-template-columns:1fr; gap:20px; } }

/* ── HOW IT WORKS ── */
.how-wrap { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; margin-top:40px; }
.how-left { position:sticky; top:120px; }
.how-visual { aspect-ratio:1/1; border-radius:20px; background:var(--panel); border:1px solid var(--line-strong); position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.how-visual svg { width:60%; height:60%; color:var(--green); }
.how-visual::before { content:''; position:absolute; inset:0; background:radial-gradient(circle at 50% 50%, rgba(52,199,138,.14), transparent 60%); }
.how-viz-frame { position:absolute; inset:0; display:none; align-items:center; justify-content:center; padding:40px; }
.how-viz-frame.on { display:flex; }
.how-viz-frame svg { width:65%; height:65%; color:var(--green); }
.how-steps { display:flex; flex-direction:column; gap:4px; }
.how-step { padding:28px 0; border-bottom:1px solid var(--line); cursor:pointer; transition:opacity .3s; opacity:.4; }
@media (max-width:900px) { .how-step { opacity:1; } }
.how-step:last-child { border-bottom:none; }
.how-step.active { opacity:1; }
.how-step-head { display:flex; align-items:center; gap:16px; margin-bottom:12px; }
.how-step-n { width:42px; height:42px; border-radius:50%; border:1px solid var(--line-strong); display:flex; align-items:center; justify-content:center; font-family:var(--font-mono); font-size:13px; font-weight:600; color:var(--muted); flex-shrink:0; transition:background .3s, color .3s, border-color .3s; }
.how-step.active .how-step-n { background:var(--green); color:#0a0f0c; border-color:var(--green); }
.how-step h3 { font-family:var(--font-head); font-size:clamp(20px,2.4vw,26px); font-weight:700; letter-spacing:-.01em; }
.how-step p { font-size:15px; color:var(--text-dim); line-height:1.55; margin-left:58px; }
@media (max-width:900px) { .how-wrap { grid-template-columns:1fr; } .how-left { position:static; } .how-visual { display:none; } }

/* ── BENTO FEATURES ── */
.features-section { position: relative; overflow: hidden; isolation: isolate; }
.features-bg {
  position: absolute; inset: -10% -5%; z-index: 0; pointer-events: none;
  opacity: 0; will-change: transform, opacity;
}
.features-bg .fbg-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(111,227,181,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(111,227,181,.06) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 20%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 20%, transparent 75%);
}
.features-bg .fbg-orb {
  position: absolute; width: 620px; height: 620px; border-radius: 50%;
  filter: blur(80px);
  background: radial-gradient(circle, rgba(52,199,138,.18), transparent 60%);
  top: -12%; left: -8%;
  will-change: transform;
}
.features-bg .fbg-orb-2 {
  background: radial-gradient(circle, rgba(111,227,181,.10), transparent 60%);
  top: auto; left: auto; bottom: -20%; right: -10%;
  width: 720px; height: 720px;
}

.features-section .wrap { position: relative; z-index: 1; }

.bento {
  display: grid; grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: minmax(200px, auto);
  gap: 16px; margin-top: 48px;
  perspective: 1400px;
}
.b {
  background: var(--panel); border: 1px solid var(--line);
  border-radius: 20px; padding: 0;
  position: relative; overflow: hidden;
  transition: border-color .35s var(--ease-out), transform .5s var(--ease-out), box-shadow .5s var(--ease-out);
  transform-style: preserve-3d;
  will-change: transform, opacity;
}
.b::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,255,255,.03), transparent 40%);
  opacity: .8;
}
.b:hover {
  border-color: var(--line-strong);
  box-shadow: 0 20px 60px -30px rgba(52,199,138,.35), 0 0 0 1px rgba(52,199,138,.12) inset;
}
.b .b-inner {
  position: relative; z-index: 2; padding: 28px;
  height: 100%; display: flex; flex-direction: column;
}
.b-1 { grid-column: span 3; grid-row: span 2; }
.b-2 { grid-column: span 3; }
.b-3 { grid-column: span 2; }
.b-4 { grid-column: span 2; }
.b-5 { grid-column: span 2; grid-row: span 2; }
.b-6 { grid-column: span 2; }
.b-7 { grid-column: span 2; }
@media (max-width: 900px) {
  .bento { grid-template-columns: 1fr 1fr; }
  .b-1 { grid-column: span 2; grid-row: auto; }
  .b-2, .b-3, .b-4, .b-5, .b-6, .b-7 { grid-column: span 2; grid-row: auto; }
}
@media (max-width: 560px) {
  .bento { grid-template-columns: 1fr; }
  .b-1, .b-2, .b-3, .b-4, .b-5, .b-6, .b-7 { grid-column: auto; }
}

/* Mouse-follow glow */
.b .b-glow {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  border-radius: inherit;
  background: radial-gradient(340px circle at var(--mx, 50%) var(--my, 50%),
              rgba(52,199,138,.14), transparent 55%);
  opacity: 0; transition: opacity .4s var(--ease-out);
}
.b:hover .b-glow { opacity: 1; }

/* Corner number */
.b .b-num {
  position: absolute; top: 18px; right: 22px; z-index: 3;
  font-family: var(--font-mono); font-size: 11px; font-weight: 500;
  letter-spacing: 1.5px; color: var(--muted-2);
  padding: 4px 10px; border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,.25); backdrop-filter: blur(6px);
  transition: color .35s var(--ease-out), border-color .35s var(--ease-out), background .35s var(--ease-out);
}
.b:hover .b-num {
  color: var(--green); border-color: var(--line-strong);
  background: rgba(52,199,138,.08);
}

/* Icon with animated ring */
.b .b-icon {
  position: relative;
  width: 46px; height: 46px; border-radius: 14px;
  background: linear-gradient(140deg, rgba(52,199,138,.14), rgba(52,199,138,.04));
  border: 1px solid rgba(52,199,138,.25);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 20px; color: var(--green);
  transition: transform .5s var(--ease-out), border-color .35s;
  will-change: transform;
}
.b .b-icon svg { position: relative; z-index: 2; }
.b .b-icon-ring {
  position: absolute; inset: -4px; border-radius: 16px;
  border: 1px solid rgba(52,199,138,.35);
  opacity: 0; transform: scale(.85);
  transition: opacity .5s var(--ease-out), transform .6s var(--ease-out);
}
.b:hover .b-icon { transform: translateY(-2px) rotate(-4deg); }
.b:hover .b-icon-ring { opacity: 1; transform: scale(1.08); }

.b h3 {
  font-family: var(--font-head); font-size: 20px; font-weight: 700;
  margin-bottom: 10px; letter-spacing: -.01em;
}
.b p { font-size: 14px; color: var(--text-dim); line-height: 1.55; }
.b .tag {
  display: inline-block; margin-top: 14px; align-self: flex-start;
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .5px;
  padding: 3px 10px; border-radius: 4px;
  background: rgba(52,199,138,.14); color: var(--green);
  text-transform: uppercase;
}
.b.hero-cell {
  background:
    radial-gradient(circle at 110% -20%, rgba(52,199,138,.16), transparent 55%),
    var(--panel-2);
  border-color: var(--line-strong);
}

.b .b-visual {
  margin-top: 22px; padding: 16px;
  background: rgba(0,0,0,.32);
  border-radius: 12px; border: 1px solid var(--line);
  position: relative; z-index: 2;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}
.b-code {
  font-family: var(--font-mono); font-size: 12px; color: var(--text-dim);
  line-height: 1.75;
}
.b-code > div { opacity: 1; will-change: opacity, transform; }
.b-code .k { color: var(--green); }
.b-code .c { color: var(--muted-2); }
.b-code .s { color: var(--amber); }

.b-wave {
  display: flex; align-items: end; gap: 3px; height: 44px;
  margin-top: auto;
}
.b-wave span {
  flex: 1; background: linear-gradient(to top, var(--green), var(--green-soft));
  opacity: .78; border-radius: 2px;
  transform-origin: bottom center; will-change: transform, opacity;
}
.b:hover .b-wave span { opacity: 1; }

.b-tags-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 20px; }
.b-tag {
  font-family: var(--font-mono); font-size: 10.5px;
  padding: 4px 9px; border-radius: 999px;
  background: var(--panel-3); color: var(--text-dim);
  border: 1px solid var(--line);
  will-change: transform, opacity;
  transition: color .3s, border-color .3s, background .3s, transform .3s var(--ease-out);
}
.b-tag:hover { color: var(--green); border-color: var(--line-strong); background: rgba(52,199,138,.08); transform: translateY(-1px); }

/* ── COST / SAVINGS ── */
.cost-section { background:var(--panel); border:1px solid var(--line); border-radius:24px; padding:clamp(40px,5vw,64px); margin-top:72px; position:relative; overflow:hidden; }
.cost-section::before { content:''; position:absolute; top:-30%; right:-20%; width:400px; height:400px; border-radius:50%; background:radial-gradient(circle, rgba(52,199,138,.08), transparent 60%); pointer-events:none; }
.cost-head { text-align:center; margin-bottom:40px; position:relative; z-index:1; }
.cost-label { font-family:var(--font-mono); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--green); margin-bottom:14px; display:inline-flex; align-items:center; gap:10px; }
.cost-label::before, .cost-label::after { content:''; width:24px; height:1px; background:var(--green); opacity:.4; }
.cost-title { font-family:var(--font-head); font-size:clamp(28px,4vw,48px); font-weight:800; line-height:1.05; letter-spacing:-.02em; max-width:18ch; margin:0 auto 12px; text-wrap:balance; }
.cost-title em { font-style:normal; color:var(--green); }
.cost-sub { font-size:16px; color:var(--text-dim); max-width:560px; margin:0 auto; }

.cost-compare { display:grid; grid-template-columns:1fr auto 1fr; gap:clamp(16px,3vw,32px); align-items:center; position:relative; z-index:1; max-width:800px; margin:0 auto 40px; }
.cost-side { text-align:center; }
.cost-side-label { font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:1px; margin-bottom:12px; }
.cost-side-label.cloud { color:#e88a8a; }
.cost-side-label.local { color:var(--green); }
.cost-side-amount { font-family:var(--font-head); font-size:clamp(40px,6vw,72px); font-weight:800; letter-spacing:-.03em; line-height:1; }
.cost-side-amount.cloud { color:#e88a8a; text-decoration:line-through; text-decoration-thickness:3px; text-decoration-color:rgba(232,138,138,.35); }
.cost-side-amount.local { color:var(--green); }
.cost-side-sub { font-size:13px; color:var(--muted); margin-top:6px; }
.cost-vs { display:flex; flex-direction:column; align-items:center; gap:10px; }
.cost-vs-line { width:1px; flex:1; min-height:60px; background:linear-gradient(to bottom, transparent, var(--line-strong), transparent); }
.cost-vs-badge { font-family:var(--font-head); font-size:13px; font-weight:800; letter-spacing:2px; color:var(--muted); padding:10px 14px; border:1px solid var(--line-strong); border-radius:999px; background:var(--bg); }
.cost-result { text-align:center; position:relative; z-index:1; padding:24px; background:rgba(52,199,138,.06); border:1px solid rgba(52,199,138,.2); border-radius:16px; max-width:600px; margin:0 auto; }
.cost-result-label { font-family:var(--font-mono); font-size:12px; color:var(--muted); letter-spacing:.5px; text-transform:uppercase; margin-bottom:6px; }
.cost-result-amount { font-family:var(--font-head); font-size:clamp(28px,3.6vw,42px); font-weight:800; color:var(--green); letter-spacing:-.02em; }
.cost-result-sub { font-size:13px; color:var(--text-dim); margin-top:4px; }

@media (max-width:700px) {
  .cost-compare { grid-template-columns:1fr; gap:24px; }
  .cost-vs { flex-direction:row; }
  .cost-vs-line { width:auto; height:1px; min-height:0; min-width:40px; background:linear-gradient(to right, transparent, var(--line-strong), transparent); }
}

/* ── MODEL COMPARISON ── */
.model-grid { display:grid; grid-template-columns:1fr 60px 1fr; gap:24px; margin-top:56px; align-items:stretch; }
@media (max-width:900px) { .model-grid { grid-template-columns:1fr; gap:18px; } }
.model-card { background:var(--panel); border:1px solid var(--line); border-radius:22px; padding:clamp(28px,3vw,40px); position:relative; overflow:hidden; transition:transform .35s var(--ease-out), border-color .3s; display:flex; flex-direction:column; }
.model-card:hover { transform:translateY(-4px); }
.model-card.model-cloud { opacity:.92; }
.model-card.model-us { border-color:rgba(52,199,138,.4); background:var(--panel-2); box-shadow:0 0 0 1px rgba(52,199,138,.14), 0 40px 110px -35px rgba(52,199,138,.28); }
.model-card.model-us::before { content:''; position:absolute; top:-30%; right:-25%; width:380px; height:380px; border-radius:50%; background:radial-gradient(circle, rgba(52,199,138,.16), transparent 60%); pointer-events:none; }
.model-card-head { display:flex; align-items:center; gap:14px; margin-bottom:22px; position:relative; z-index:1; }
.model-icon { width:56px; height:56px; border-radius:16px; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
.model-icon--muted { background:rgba(255,255,255,.03); color:var(--muted); border:1px solid var(--line); }
.model-icon--brand { background:rgba(52,199,138,.12); color:var(--green); border:1px solid rgba(52,199,138,.3); box-shadow:inset 0 0 20px rgba(52,199,138,.08); }
.model-tag { display:inline-flex; align-items:center; font-family:var(--font-mono); font-size:10.5px; font-weight:500; letter-spacing:1px; text-transform:uppercase; padding:5px 12px; border-radius:999px; background:rgba(255,255,255,.04); color:var(--muted); border:1px solid var(--line); }
.model-tag.on { background:rgba(52,199,138,.14); color:var(--green); border-color:rgba(52,199,138,.32); }
.model-title { font-family:var(--font-head); font-size:clamp(26px,2.8vw,34px); font-weight:800; letter-spacing:-.02em; margin-bottom:8px; line-height:1.1; position:relative; z-index:1; }
.model-card.model-cloud .model-title { color:var(--text-dim); }
.model-sub { font-size:14px; color:var(--muted); margin-bottom:28px; line-height:1.5; position:relative; z-index:1; }
.model-list { list-style:none; display:flex; flex-direction:column; gap:0; margin-bottom:28px; position:relative; z-index:1; flex:1; }
.model-list li { display:flex; align-items:flex-start; gap:14px; font-size:14.5px; line-height:1.5; color:var(--text-dim); padding:12px 0; border-top:1px solid var(--line); }
.model-list li:first-child { border-top:none; padding-top:4px; }
.model-cloud .model-list li { color:var(--muted); }
.model-list li::before { content:''; flex-shrink:0; margin-top:4px; width:16px; height:16px; border-radius:50%; background:rgba(168,106,106,.18); border:1px solid rgba(168,106,106,.35); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23c88888' stroke-width='3' stroke-linecap='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3C/svg%3E"); background-position:center; background-repeat:no-repeat; }
.model-list--check li::before { background:rgba(52,199,138,.14); border-color:rgba(52,199,138,.35); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2334C78A' stroke-width='3' stroke-linecap='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); }
.model-foot { margin-top:auto; padding-top:22px; border-top:1px solid var(--line); display:flex; align-items:baseline; justify-content:space-between; gap:14px; position:relative; z-index:1; }
.model-foot-lbl { font-family:var(--font-mono); font-size:10.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.8px; }
.model-foot-val { font-family:var(--font-head); font-size:clamp(20px,2.2vw,26px); font-weight:800; letter-spacing:-.02em; }
.model-foot-val.cloud { color:#e88a8a; }
.model-foot-val.us { color:var(--green); }
.model-foot-val em { font-style:normal; font-family:var(--font-body); font-size:11px; font-weight:500; color:var(--muted); letter-spacing:.3px; margin-left:4px; }
.model-vs { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; position:relative; padding:20px 0; }
.model-vs-line { flex:1; width:1px; background:linear-gradient(to bottom, transparent, var(--line-strong), transparent); min-height:40px; }
.model-vs-text { font-family:var(--font-head); font-size:12px; font-weight:800; letter-spacing:2px; color:var(--muted); padding:8px 10px; border:1px solid var(--line-strong); border-radius:999px; background:var(--bg); min-width:44px; text-align:center; }
@media (max-width:900px) { .model-vs { flex-direction:row; padding:0; } .model-vs-line { width:auto; height:1px; min-height:0; min-width:40px; background:linear-gradient(to right, transparent, var(--line-strong), transparent); } }

/* ── QUOTE ── */
.quote-band { padding:140px 24px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(52,199,138,.02); }
.quote-inner { max-width:880px; margin:0 auto; text-align:center; position:relative; }
.quote-mark { font-family:var(--font-head); font-size:100px; color:var(--green); line-height:.5; margin-bottom:30px; display:block; opacity:.4; }
.quote-text { font-family:var(--font-head); font-size:clamp(22px,3.4vw,36px); font-weight:700; line-height:1.3; margin-bottom:28px; letter-spacing:-.015em; }
.quote-author { font-size:13px; color:var(--muted); font-family:var(--font-mono); letter-spacing:.5px; text-transform:uppercase; }

/* ── PRICING ── */
.pricing-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; margin-top:56px; }
@media (max-width:900px) { .pricing-grid { grid-template-columns:1fr; } }
.plan { background:var(--panel); border:1px solid var(--line); border-radius:20px; padding:36px 30px; display:flex; flex-direction:column; transition:border-color .3s, transform .3s; position:relative; }
.plan:hover { border-color:var(--line-strong); transform:translateY(-4px); }
.plan.featured { border-color:rgba(52,199,138,.4); background:var(--panel-2); box-shadow:0 0 0 1px rgba(52,199,138,.15), 0 40px 100px -30px rgba(52,199,138,.25); }
.plan.featured::before { content:''; position:absolute; inset:-1px; border-radius:20px; background:linear-gradient(180deg, rgba(52,199,138,.3), transparent 60%); z-index:-1; }
.plan-badge { position:absolute; top:-12px; left:50%; transform:translateX(-50%); background:var(--green); color:#0a0f0c; font-family:var(--font-mono); font-size:10.5px; font-weight:600; letter-spacing:.8px; padding:5px 12px; border-radius:999px; text-transform:uppercase; }
.plan-name { font-family:var(--font-head); font-size:22px; font-weight:800; letter-spacing:-.01em; margin-bottom:8px; }
.plan-desc { font-size:13.5px; color:var(--muted); margin-bottom:26px; line-height:1.5; }
.plan-price { display:flex; align-items:baseline; gap:4px; margin-bottom:6px; }
.plan-currency { font-family:var(--font-head); font-size:22px; color:var(--muted); align-self:flex-start; margin-top:12px; }
.plan-amount { font-family:var(--font-head); font-size:56px; font-weight:800; color:var(--green); line-height:1; letter-spacing:-.03em; }
.plan-once { font-family:var(--font-mono); font-size:11px; color:var(--muted); margin-bottom:30px; letter-spacing:.3px; }
.plan-features { list-style:none; display:flex; flex-direction:column; gap:12px; margin-bottom:30px; flex:1; }
.plan-features li { display:flex; align-items:flex-start; gap:10px; font-size:14px; line-height:1.4; }
.plan-features li svg { flex-shrink:0; margin-top:3px; color:var(--green); }
.plan-features li.off { color:var(--muted); }
.plan-features li.off svg { color:var(--muted-2); }
.plan-btn { display:block; text-align:center; font-family:var(--font-head); font-size:14.5px; font-weight:700; padding:14px 20px; border-radius:12px; transition:transform .25s, box-shadow .25s, background .25s; }
.plan.featured .plan-btn { background:var(--green); color:#0a0f0c; box-shadow:0 10px 30px -8px rgba(52,199,138,.5); }
.plan:not(.featured) .plan-btn { background:transparent; color:var(--green); border:1px solid rgba(52,199,138,.3); }
.plan:not(.featured) .plan-btn:hover { background:rgba(52,199,138,.08); }
.plan-btn:hover { transform:translateY(-2px); }
.pricing-note { text-align:center; margin-top:48px; padding-top:24px; border-top:1px solid var(--line); font-size:13.5px; color:var(--muted); display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; }
.pricing-note strong { color:var(--green); font-weight:700; }

/* ── FAQ ── */
.faq-list { margin-top:48px; display:flex; flex-direction:column; gap:12px; }
.faq { background:var(--panel); border:1px solid var(--line); border-radius:14px; overflow:hidden; transition:border-color .3s; }
.faq.open { border-color:rgba(52,199,138,.35); }
.faq-q { width:100%; padding:22px 26px; text-align:left; display:flex; align-items:center; justify-content:space-between; gap:20px; font-family:var(--font-head); font-size:17px; font-weight:600; color:var(--text); letter-spacing:-.01em; transition:color .2s; }
.faq.open .faq-q { color:var(--green); }
.faq-plus { width:30px; height:30px; border-radius:50%; flex-shrink:0; border:1px solid var(--line-strong); display:flex; align-items:center; justify-content:center; transition:background .25s, border-color .25s, transform .35s var(--ease-out); }
.faq.open .faq-plus { background:var(--green); border-color:var(--green); color:#0a0f0c; transform:rotate(45deg); }
.faq-a { max-height:0; overflow:hidden; padding:0 26px; transition:max-height .5s var(--ease-out), padding .3s; font-size:14.5px; color:var(--text-dim); line-height:1.65; }
.faq.open .faq-a { padding-bottom:24px; }

/* ── FINAL CTA ── */
.final-cta { padding:180px 24px 140px; text-align:center; position:relative; overflow:hidden; }
.final-glow { position:absolute; bottom:-50%; left:50%; transform:translateX(-50%); width:900px; height:900px; border-radius:50%; background:radial-gradient(circle, rgba(52,199,138,.14) 0%, transparent 55%); pointer-events:none; }
.final-cta .wrap { position:relative; z-index:2; }
.final-cta h2 { font-family:var(--font-head); font-size:clamp(40px,7vw,84px); font-weight:800; line-height:1; max-width:800px; margin:0 auto 24px; letter-spacing:-.03em; }
.final-cta h2 em { font-style:normal; color:var(--green); }
.final-cta p { font-size:17px; color:var(--text-dim); max-width:500px; margin:0 auto 44px; }
.cta-mega { display:inline-flex; align-items:center; gap:12px; background:var(--green); color:#0a0f0c; font-family:var(--font-head); font-size:17px; font-weight:800; padding:19px 42px; border-radius:999px; box-shadow:0 20px 60px -15px rgba(52,199,138,.5); transition:transform .3s var(--ease-out); position:relative; }
.cta-mega:hover { transform:translateY(-4px); }
.cta-mega::before { content:''; position:absolute; inset:-6px; border-radius:999px; border:1px solid rgba(52,199,138,.35); opacity:0; transition:opacity .3s, transform .3s; transform:scale(1.1); }
.cta-mega:hover::before { opacity:1; transform:scale(1); }
.cta-sub { margin-top:20px; font-family:var(--font-mono); font-size:12px; color:var(--muted); letter-spacing:.5px; }

/* ── FOOTER ── */
footer { border-top:1px solid var(--line); padding:40px 32px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; position:relative; z-index:2; background:var(--bg); }
.footer-brand { font-family:var(--font-head); font-weight:700; font-size:15px; display:flex; align-items:center; gap:10px; }
.footer-copy { font-size:12px; color:var(--muted); font-family:var(--font-mono); }
.footer-link { font-size:12.5px; color:var(--muted); transition:color .2s; display:inline-flex; align-items:center; gap:6px; font-family:var(--font-mono); }
.footer-link:hover { color:var(--green); }

/* ── RESPONSIVE ── */
@media (min-width:900px) and (max-height:820px) { .hero { padding-top:calc(68px + 44px); } .hero-title { font-size:clamp(44px,5.4vw,68px); } .hero-lead { font-size:clamp(20px,2.2vw,26px); } .hero-desc { font-size:15px; margin-bottom:24px; } .hero-eyebrow { margin-bottom:22px; } .hero-app { margin-top:36px; } }
@media (min-width:900px) and (max-height:720px) { .hero { padding-top:calc(68px + 28px); } .hero-title { font-size:clamp(40px,4.8vw,56px); max-width:16ch; } .hero-lead { font-size:20px; max-width:26ch; margin-bottom:18px; } .hero-desc { max-width:620px; margin-bottom:20px; font-size:14.5px; } .hero-eyebrow { margin-bottom:16px; } .hero-app { margin-top:26px; } .hero-micro { font-size:11px; } }
@media (max-width:900px) { nav { padding:0 22px; } .hero-app { margin-top:40px; } }
@media (max-width:640px) { nav { padding:0 18px; height:60px; } nav.scrolled { height:54px; } .nav-logo { font-size:16px; padding:6px; } .nav-logo-dot { width:28px; height:28px; } .nav-cta { padding:8px 14px; font-size:12.5px; gap:6px; min-height:40px; } .nav-cta svg { width:10px; height:10px; } .hero { padding-top:calc(60px + 32px); padding-left:20px; padding-right:20px; } .hero-title { font-size:clamp(36px,10vw,52px); } .hero-lead { font-size:18px; } .hero-desc { font-size:15px; } .hero-micro { font-size:11px; line-height:1.6; } .hero-app { margin-top:32px; padding-bottom:40px; } .hero-actions { flex-direction:column; align-items:stretch; width:100%; max-width:340px; } .btn { padding:14px 22px; font-size:14.5px; gap:8px; width:100%; white-space:normal; line-height:1.2; } .btn svg { flex-shrink:0; } .cta-mega { padding:16px 26px; font-size:15px; max-width:calc(100% - 24px); text-align:center; line-height:1.25; white-space:normal; } .cta-mega svg { width:15px; height:15px; } .final-cta { padding:90px 18px; } .final-cta p { font-size:15px; } .plan { padding:28px 22px; } .plan-btn { padding:13px 18px; font-size:13.5px; } .pricing-note { font-size:12.5px; padding:20px 8px 0; } .quote-band { padding:90px 18px; } .quote-mark { font-size:70px; margin-bottom:22px; } .stat-cell { padding:32px 18px; } .stat-lbl { font-size:10.5px; } .faq-q { padding:18px 20px; font-size:15px; gap:14px; } .faq-a { padding:0 20px; font-size:14px; } .faq.open .faq-a { padding-bottom:20px; } .faq-plus { width:26px; height:26px; } footer { padding:28px 18px; text-align:center; justify-content:center; } }
@media (max-width:380px) { .btn { font-size:13.5px; padding:13px 16px; } .cta-mega { font-size:14px; padding:15px 20px; gap:8px; } .nav-cta { padding:7px 12px; font-size:12px; } .hero-title { font-size:clamp(32px,9vw,42px); } }
.hidden-mobile { display:initial; }
.only-mobile { display:none; }
@media (max-width:640px) { .hidden-mobile { display:none; } .only-mobile { display:initial; } }
.cta-mega-mini, .btn-text-mini { display:none; }
@media (max-width:560px) { .cta-mega-full, .btn-text-full { display:none; } .cta-mega-mini, .btn-text-mini { display:inline; } }