*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#ffffff;
  --bg2:#f4f5f8;
  --bg3:#eaecf1;
  --border:#dfe2e8;
  --border2:#c8cdd6;
  --ink:#0d1016;
  --ink2:#2c313a;
  --ink3:#555c67;
  --ink4:#929aa6;
  --red:#e01d12;
  --red-s:#b8150c;
  --red-bg:rgba(224,29,18,.06);
  --red-border:rgba(224,29,18,.22);
  --salmon:#e8735a;
  --green:#15924a;
  --green-bg:rgba(21,146,74,.07);
  --blue:#2563eb;
  --shadow-sm:0 1px 2px rgba(13,16,23,.06);
  --shadow:0 1px 3px rgba(13,16,23,.10),0 1px 2px rgba(13,16,23,.05);
  --shadow-md:0 4px 8px -2px rgba(13,16,23,.10),0 2px 4px -2px rgba(13,16,23,.06);
  --shadow-lg:0 12px 24px -6px rgba(13,16,23,.13),0 4px 8px -4px rgba(13,16,23,.07);
  --shadow-xl:0 28px 60px -14px rgba(13,16,23,.22),0 10px 22px -10px rgba(13,16,23,.10);
  --sans:'Plus Jakarta Sans',sans-serif;
  --display:'Fraunces',Georgia,serif;
  --mono:'DM Mono',monospace;
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-out:cubic-bezier(0,0,.2,1);
}
html{scroll-behavior:smooth;font-size:16px;overflow-x:hidden}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);overflow-x:hidden;position:relative;-webkit-font-smoothing:antialiased;min-width:320px}
::selection{background:var(--red);color:#fff}

/* PROGRESS */
#progress{position:fixed;top:0;left:0;right:0;height:2px;background:var(--red);z-index:1000;transform:scaleX(0);transform-origin:left;transition:opacity .3s}

/* NAV */
#nav{position:fixed;left:0;right:0;top:0;z-index:500;transition:all .3s;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
#nav.scrolled{box-shadow:0 2px 20px rgba(180,40,40,.08)}
/* Hamburger — always visible */
.nav-ham{display:none;flex-direction:column;justify-content:center;gap:5px;width:38px;height:38px;background:none;border:1px solid rgba(220,38,38,.2);border-radius:8px;cursor:pointer;padding:8px;transition:background .15s}
.nav-ham:hover{background:var(--bg3)}
.nav-ham span{display:block;height:1.5px;background:var(--ink);border-radius:2px;transition:transform .25s var(--ease),opacity .2s,width .2s}
.nav-ham.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav-ham.open span:nth-child(2){opacity:0;width:0}
.nav-ham.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
/* Mobile drawer */
.nav-drawer{display:flex;position:fixed;top:61px;left:0;right:0;background:rgba(255,255,255,.98);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);padding:12px 20px 20px;z-index:499;flex-direction:column;gap:4px;transform:translateY(-8px);opacity:0;pointer-events:none;visibility:hidden;transition:transform .2s var(--ease),opacity .2s,visibility .2s}
.nav-drawer.open{transform:translateY(0);opacity:1;pointer-events:all;visibility:visible}
.nav-drawer a{font-size:15px;font-weight:500;color:var(--ink2);padding:10px 12px;border-radius:8px;text-decoration:none;display:block;transition:background .12s,color .12s}
.nav-drawer a:hover,.nav-drawer a.active{background:var(--bg3);color:var(--ink)}
.nav-drawer-cta{margin-top:8px;padding-top:12px;border-top:1px solid var(--border)}
.nav-drawer-cta button{width:100%;justify-content:center;font-size:15px;padding:12px}
.nav-i{display:flex;align-items:center;justify-content:space-between;height:68px;max-width:1200px;margin:0 auto;padding:0 40px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo-mark{display:flex;align-items:center;justify-content:center;transition:transform .3s var(--ease);flex-shrink:0}
.logo:hover .logo-mark{transform:scale(1.04)}
.logo-mark svg{display:block}
.logo-name{font-family:'Playfair Display',Georgia,serif;font-size:18px;font-weight:500;color:var(--ink);letter-spacing:-.01em}
.nav-links{display:flex;gap:4px;list-style:none}
.nav-links a{font-size:14px;font-weight:500;color:var(--ink3);padding:6px 12px;border-radius:6px;text-decoration:none;transition:color .15s,background .15s;cursor:pointer}
.nav-links a:hover{color:var(--ink);background:var(--bg3)}
.nav-cta{font-size:14px;font-weight:600;color:#fff;background:var(--ink);border:none;padding:9px 20px;border-radius:10px;cursor:pointer;transition:background .2s,transform .2s,box-shadow .2s;letter-spacing:-.01em}
.nav-cta:hover{background:#000;transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.2)}
/* Brand mode toggle — Intelligence (red) ⇄ Marketing (blue) */
/* Marketing not offered yet — toggle hidden. Re-enable by setting display:inline-flex. */
.brand-toggle{display:none;align-items:center;gap:2px;background:var(--bg3);border:1px solid var(--border);border-radius:100px;padding:3px;margin-left:14px;flex-shrink:0}
.bt-opt{font-family:inherit;border:0;background:transparent;cursor:pointer;font-size:12.5px;font-weight:600;color:var(--ink3);padding:5px 13px;border-radius:100px;text-decoration:none;letter-spacing:-.01em;line-height:1;transition:color .18s,background .18s,box-shadow .18s;white-space:nowrap}
/* Theme color-sweep transition (Intelligence ⇄ Marketing) */
.theme-sweep{position:fixed;width:12px;height:12px;border-radius:50%;transform:translate(-50%,-50%) scale(0);z-index:3000;pointer-events:none;will-change:transform,opacity}
.theme-sweep.go{transform:translate(-50%,-50%) scale(340);transition:transform .55s cubic-bezier(.4,0,.2,1)}
.theme-sweep.out{opacity:0;transition:opacity .45s ease}
.bt-opt:hover{color:var(--ink)}
.bt-opt.bt-mkt:hover{color:var(--mkt,#2563eb)}
.bt-opt.active{background:var(--red);color:#fff;box-shadow:var(--shadow-sm)}
.bt-opt.bt-mkt.active{background:#2563eb}
@media(max-width:768px){.brand-toggle{margin-left:8px;padding:2px}.bt-opt{font-size:11px;padding:5px 9px}}
@media(max-width:440px){.logo-name{display:none}}
@media(max-width:360px){.nav-cta{display:none}}

/* ── MODE CONTENT SWITCH — both content sets live on the page; toggle shows one ── */
.mode-mkt{display:none}
body.theme-marketing .mode-intel{display:none}
body.theme-marketing .mode-mkt{display:block}

/* ── MARKETING THEME (blue) — applied via body.theme-marketing ── */
body.theme-marketing{
  --red:#2563eb;
  --red-s:#1d4ed8;
  --red-bg:rgba(37,99,235,.06);
  --red-border:rgba(37,99,235,.22);
  --salmon:#22d3ee;
}
body.theme-marketing .logo-name{color:var(--ink)}
.logo-mark .lg-a{fill:#C8201A;transition:fill .35s}
.logo-mark .lg-b{fill:#E8735A;transition:fill .35s}
body.theme-marketing .logo-mark .lg-a{fill:#2563eb}
body.theme-marketing .logo-mark .lg-b{fill:#22d3ee}
body.theme-marketing::before{background:radial-gradient(ellipse 50% 32% at 88% 6%,rgba(37,99,235,.03),transparent)}
body.theme-marketing .hero-blob.b1{background:radial-gradient(circle,rgba(37,99,235,.13) 0%,rgba(37,99,235,.04) 45%,transparent 70%)}
body.theme-marketing .hero-blob.b2{background:radial-gradient(circle,rgba(34,211,238,.12) 0%,rgba(34,211,238,.03) 45%,transparent 70%)}
body.theme-marketing .hero-blob.b3{background:radial-gradient(circle,rgba(99,102,241,.10) 0%,transparent 65%)}
/* Marketing hero — animated Lottie orb */
.mkt-visual{position:relative;display:flex;flex-direction:column;align-items:center;gap:18px}
.mkt-orb-glow{position:absolute;top:-6%;left:50%;transform:translateX(-50%);width:min(420px,90%);aspect-ratio:1;background:radial-gradient(circle,rgba(37,99,235,.18),rgba(34,211,238,.10) 45%,transparent 70%);filter:blur(28px);z-index:0;pointer-events:none}
.mkt-orb{position:relative;z-index:1;width:100%;max-width:440px;aspect-ratio:1}
.mkt-move{position:relative;z-index:1;width:100%;max-width:380px;border:1px solid var(--red-border);background:var(--red-bg);border-radius:14px;padding:14px 16px;backdrop-filter:blur(4px)}
.mkt-move-h{font-family:var(--mono);font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--red);margin-bottom:6px}
.mkt-move-p{font-size:13px;color:var(--ink2);line-height:1.5}
.mkt-move-foot{display:flex;align-items:center;gap:8px;margin-top:10px;font-family:var(--mono);font-size:11px;color:var(--ink4)}
.mkt-move-dot{width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 0 3px var(--red-bg)}
/* Intelligence hero — voice orb + talk button */
.hero-orb-wrap{position:relative;display:flex;flex-direction:column;align-items:center;gap:20px}
.hero-orb-glow{position:absolute;top:-6%;left:50%;transform:translateX(-50%);width:min(440px,92%);aspect-ratio:1;background:radial-gradient(circle,var(--red-bg),rgba(232,115,90,.06) 45%,transparent 70%);filter:blur(32px);z-index:0;pointer-events:none}
.hero-orb-wrap .mkt-orb,.hero-orb-wrap .ow-voice-demo-btn,.hero-orb-cap{position:relative;z-index:1}
.hero-orb-cap{font-family:var(--mono);font-size:11.5px;color:var(--ink4);letter-spacing:.01em}
/* Voice agent embedded modal */
#voice-embed-overlay{position:fixed;inset:0;z-index:960;background:rgba(13,16,23,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:opacity .3s;display:flex;align-items:center;justify-content:center;padding:20px}
#voice-embed-overlay.open{opacity:1;pointer-events:auto}
#voice-embed-modal{position:relative;width:100%;max-width:460px;height:min(640px,calc(100dvh - 40px));background:#fff;border-radius:24px;overflow:hidden;box-shadow:var(--shadow-xl);transform:translateY(20px) scale(.97);transition:transform .4s var(--ease)}
#voice-embed-overlay.open #voice-embed-modal{transform:none}
#voice-embed-close{position:absolute;top:12px;right:12px;z-index:2;width:32px;height:32px;border-radius:50%;border:0;background:rgba(13,16,23,.06);color:var(--ink);cursor:pointer;font-size:14px;line-height:1;transition:background .15s}
#voice-embed-close:hover{background:rgba(13,16,23,.12)}
#voice-embed-frame{width:100%;height:100%}
#voice-embed-frame iframe{width:100%;height:100%;border:0;display:block}
/* Marketing hero — ads playing in the background */
.mkt-ads-bg{position:absolute;inset:0;z-index:0;display:flex;justify-content:flex-end;gap:24px;padding-right:4%;overflow:hidden;opacity:.5;pointer-events:none;transition:opacity .4s;-webkit-mask-image:radial-gradient(ellipse 62% 80% at 24% 50%,transparent 36%,#000 80%);mask-image:radial-gradient(ellipse 62% 80% at 24% 50%,transparent 36%,#000 80%)}
/* Meta ads are a Marketing-mode visual only — hide in Intelligence mode */
body:not(.theme-marketing) .mkt-ads-bg{opacity:0;visibility:hidden}
/* Orb + stat badges are an Intelligence-mode visual only — hide in Marketing mode */
body.theme-marketing .hero-orb-wrap,body.theme-marketing .hero-float{opacity:0;visibility:hidden;transition:opacity .4s}
.ads-col{display:flex;flex-direction:column;gap:18px;width:196px;flex-shrink:0;animation:adsScroll 34s linear infinite}
.ads-col-1{animation-duration:44s;margin-top:-70px}
.ads-col-2{animation-duration:52s;margin-top:-140px}
@keyframes adsScroll{from{transform:translateY(0)}to{transform:translateY(-50%)}}
.ad-card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px;box-shadow:var(--shadow-sm)}
.ad-hd{font-family:var(--mono);font-size:9px;color:var(--ink4);text-transform:uppercase;letter-spacing:.04em;display:flex;align-items:center;gap:6px;margin-bottom:8px}
.ad-dot{width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#2563eb,#22d3ee);flex-shrink:0}
.ad-cr{height:88px;border-radius:8px;margin-bottom:8px}
.ad-bd{font-size:12px;font-weight:600;color:var(--ink);margin-bottom:8px;letter-spacing:-.01em}
.ad-mt{display:flex;gap:10px;font-family:var(--mono);font-size:9px;color:var(--ink3)}
@media(max-width:640px){.mkt-ads-bg{opacity:.08}}

/* HERO */
#hero{padding:104px 40px 60px;position:relative;overflow:hidden;min-height:100vh;display:flex;align-items:center;background:var(--bg)}
.hero-mesh{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.hero-blob{position:absolute;border-radius:50%;will-change:transform}
.hero-blob.b1{width:720px;height:720px;background:radial-gradient(circle,rgba(216,38,29,.13) 0%,rgba(216,38,29,.04) 45%,transparent 70%);top:-220px;right:-180px}
.hero-blob.b2{width:620px;height:620px;background:radial-gradient(circle,rgba(232,115,90,.12) 0%,rgba(232,115,90,.03) 45%,transparent 70%);bottom:-180px;left:22%}
.hero-blob.b3{width:440px;height:440px;background:radial-gradient(circle,rgba(243,178,120,.10) 0%,transparent 65%);top:18%;left:0}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(24,20,16,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(24,20,16,.045) 1px,transparent 1px);background-size:58px 58px;-webkit-mask-image:radial-gradient(ellipse 82% 78% at 52% 48%,#000 28%,transparent 100%);mask-image:radial-gradient(ellipse 82% 78% at 52% 48%,#000 28%,transparent 100%)}
.hero-inner{position:relative;z-index:1;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;width:100%}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:100px;padding:5px 14px 5px 5px;font-size:12px;font-weight:500;color:var(--ink2);margin-bottom:24px;cursor:default}
.hero-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px var(--green-bg);animation:pulse 2.5s ease infinite}
.hero-badge-pill{background:var(--red);color:#fff;font-size:11px;font-weight:600;padding:2px 8px;border-radius:100px;letter-spacing:.02em}
.hero-h{font-family:var(--display);font-optical-sizing:auto;font-size:clamp(38px,4.4vw,66px);font-weight:620;line-height:1.05;letter-spacing:-.025em;color:var(--ink);margin-bottom:26px}
.hero-h em{font-style:normal;color:var(--red)}
.hero-h .muted{color:var(--ink3);font-weight:400}
/* word cycle — italic serif accent that fades on swap, with a gradient underline */
.word-cycle{display:inline-block;position:relative;white-space:nowrap;vertical-align:baseline;padding-bottom:.06em}
.cycle-word{display:inline-block;font-family:var(--display);font-style:italic;font-weight:500;color:var(--red);transition:opacity .26s var(--ease),transform .26s var(--ease)}
.cycle-word.out{opacity:0;transform:translateY(-.16em)}
.cycle-bar{position:absolute;left:0;right:0;bottom:-.02em;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--red),var(--salmon));opacity:.9;pointer-events:none}
.hero-p{font-size:18px;color:var(--ink2);line-height:1.7;max-width:480px;margin-bottom:36px;font-weight:400}
.hero-ctas{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:48px}
.btn-primary{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;color:#fff;background:var(--red);border:none;padding:13px 26px;border-radius:12px;cursor:pointer;text-decoration:none;transition:background .2s,transform .2s,box-shadow .2s;letter-spacing:-.01em}
.btn-primary:hover{background:var(--red-s);transform:translateY(-1px);box-shadow:0 8px 24px rgba(220,38,38,.38)}
.btn-primary .arr{transition:transform .25s var(--ease)}
.btn-primary:hover .arr{transform:translateX(3px)}
.btn-ghost{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:500;color:var(--ink2);background:var(--bg);border:1.5px solid var(--border2);padding:12px 24px;border-radius:12px;cursor:pointer;text-decoration:none;transition:border-color .2s,background .2s,transform .2s;letter-spacing:-.01em}
.btn-ghost:hover{border-color:var(--ink2);background:var(--bg2);transform:translateY(-1px)}
.hero-trust{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--ink3);font-weight:500}
.trust-item svg{color:var(--green);flex-shrink:0}
.hero-visual{position:relative}
.hero-card{background:#fff;border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow-xl);overflow:hidden}
.hc-header{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;background:var(--bg2)}
.hc-dots{display:flex;gap:6px}
.hc-dot{width:10px;height:10px;border-radius:50%}
.hc-dot.r{background:#ff5f57}
.hc-dot.y{background:#febc2e}
.hc-dot.g{background:#28c840}
.hc-title{font-size:12px;font-weight:500;color:var(--ink3);margin-left:4px;font-family:var(--mono)}
.hc-body{padding:20px}
.msg-row{display:flex;gap:10px;margin-bottom:14px;align-items:flex-end}
.msg-row.right{flex-direction:row-reverse}
.msg-av{width:28px;height:28px;border-radius:50%;font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-family:var(--mono)}
.msg-av.p{background:var(--bg3);color:var(--ink3)}
.msg-av.a{background:var(--red);color:#fff}
.msg-bub{max-width:78%;padding:9px 13px;font-size:13px;line-height:1.5;border-radius:12px}
.msg-bub.in{background:var(--bg3);color:var(--ink);border-bottom-left-radius:3px}
.msg-bub.out{background:var(--red);color:#fff;border-bottom-right-radius:3px}
.msg-meta{font-size:11px;color:var(--ink4);margin-top:4px;padding:0 38px;font-family:var(--mono)}
.msg-meta.right{text-align:right}
.hc-result{margin:8px 0 4px;padding:12px 14px;background:var(--green-bg);border:1px solid rgba(22,163,74,.15);border-radius:8px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--green);font-family:var(--mono)}
.hc-result::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--green);flex-shrink:0}
.hero-float{position:absolute;background:var(--bg);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-lg);padding:12px 16px;display:flex;align-items:center;gap:10px}
.hero-float.f1{top:-24px;right:-24px;min-width:180px}
.hero-float.f2{bottom:-16px;left:-24px;min-width:160px}
.hf-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.hf-icon.red{background:var(--red-bg)}
.hf-icon.green{background:var(--green-bg)}
.hf-n{font-size:14px;font-weight:700;color:var(--ink);line-height:1}
.hf-l{font-size:11px;color:var(--ink3);margin-top:2px}

/* TICKER */
#ticker{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:0;overflow:hidden;display:flex;align-items:center}
.ticker-label{background:var(--ink);padding:14px 22px;font-family:var(--mono);font-size:11px;font-weight:500;color:#fff;white-space:nowrap;flex-shrink:0;letter-spacing:.05em}
.ticker-rail{overflow:hidden;flex:1;position:relative}
.ticker-rail::before,.ticker-rail::after{content:'';position:absolute;top:0;bottom:0;width:60px;z-index:2;pointer-events:none}
.ticker-rail::before{left:0;background:linear-gradient(90deg,var(--bg2),transparent)}
.ticker-rail::after{right:0;background:linear-gradient(270deg,var(--bg2),transparent)}
.tw{display:inline-flex;animation:tick 40s linear infinite;white-space:nowrap;will-change:transform}
.tw:hover{animation-play-state:paused}
.ti{font-family:var(--mono);font-size:12px;color:var(--ink3);padding:14px 36px;display:inline-flex;align-items:center;gap:10px;border-right:1px solid var(--border)}
.ti-n{color:var(--ink);font-weight:600;font-size:13px}
@keyframes tick{to{transform:translateX(-50%)}}

/* SECTION PRIMITIVES */
.sec{padding:120px 40px}
.sec-w{max-width:1200px;margin:0 auto}
.sec-w.narrow{max-width:800px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-size:12px;font-weight:700;color:var(--red);letter-spacing:.06em;text-transform:uppercase;margin-bottom:20px}
.eyebrow::before{content:'';width:20px;height:2px;background:var(--red);border-radius:2px;flex-shrink:0}
.sec-h{font-family:var(--display);font-optical-sizing:auto;font-size:clamp(34px,4.4vw,60px);font-weight:600;line-height:1.03;letter-spacing:-.022em;color:var(--ink);margin-bottom:16px}
.sec-h .muted{color:var(--ink3);font-weight:400;font-style:italic}
.sec-p{font-size:17px;color:var(--ink2);line-height:1.7;max-width:520px}
.rv{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:translateY(0)}

/* PROBLEM */
#problem{background:var(--bg)}
.prob-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.prob-items{margin-top:40px;display:flex;flex-direction:column;gap:4px}
.pi{padding:20px;border-radius:10px;display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:start;transition:background .2s,box-shadow .2s;cursor:default}
.pi:hover{background:var(--bg2);box-shadow:var(--shadow)}
.pi-num{font-family:var(--mono);font-size:13px;font-weight:500;color:var(--ink3);padding-top:2px}
.pi-h{font-size:15px;font-weight:600;color:var(--ink);margin-bottom:5px;letter-spacing:-.01em}
.pi-p{font-size:14px;color:var(--ink2);line-height:1.6}
.prob-stats{padding:32px;background:var(--bg2);border:1px solid var(--border);border-radius:16px;margin-top:16px}
.stat-item{padding:24px 0;border-bottom:1px solid var(--border)}
.stat-item:last-child{border-bottom:none;padding-bottom:0}
.stat-item:first-child{padding-top:0}
.stat-n{font-size:52px;font-weight:700;color:var(--ink);line-height:1;letter-spacing:-.03em}
.stat-n sub{font-size:.48em;color:var(--ink3);font-weight:500;vertical-align:baseline}
.stat-l{font-size:14px;color:var(--ink2);margin-top:6px;line-height:1.5}
.prob-callout{margin-top:20px;padding:16px;background:var(--red-bg);border:1px solid var(--red-border);border-radius:10px;font-size:13px;font-weight:500;color:var(--red);font-family:var(--mono);letter-spacing:.03em;line-height:1.7}

/* SYSTEMS */
#systems{background:var(--bg2)}
.sys-hdr{max-width:640px;margin-bottom:56px}
.sys-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sc{background:var(--bg);padding:36px 30px;position:relative;overflow:hidden;border-radius:18px;border:1.5px solid var(--border);transition:border-color .25s,box-shadow .25s,transform .25s var(--ease);cursor:default}
.sc:hover{border-color:var(--red);box-shadow:0 8px 32px rgba(220,38,38,.1),0 0 0 3px rgba(220,38,38,.06);transform:translateY(-3px)}
.sc.featured{background:var(--ink);border-color:transparent}
.sc.featured:hover{border-color:rgba(220,38,38,.5);box-shadow:0 12px 40px rgba(0,0,0,.3),0 0 0 3px rgba(220,38,38,.15);transform:translateY(-3px)}
.sc-num{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;margin-bottom:18px;display:flex;align-items:center;gap:10px}
.sc .sc-num{color:var(--ink4)}
.sc.featured .sc-num{color:rgba(255,255,255,.4)}
.sc-num-badge{font-family:var(--mono);font-size:10px;font-weight:600;padding:3px 9px;border-radius:100px;letter-spacing:.06em}
.sc .sc-num-badge{background:var(--bg3);color:var(--ink3)}
.sc.featured .sc-num-badge{background:rgba(220,38,38,.2);color:#f87171}
.sc-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;flex-shrink:0}
.sc .sc-icon{background:var(--red-bg);border:1px solid var(--red-border)}
.sc.featured .sc-icon{background:rgba(220,38,38,.15);border:1px solid rgba(220,38,38,.3)}
.sc-h{font-size:21px;font-weight:700;letter-spacing:-.025em;margin-bottom:10px;line-height:1.2}
.sc .sc-h{color:var(--ink)}
.sc.featured .sc-h{color:#fff}
.sc-explainer{font-size:13px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;margin-bottom:12px;font-family:var(--mono)}
.sc .sc-explainer{color:var(--red)}
.sc.featured .sc-explainer{color:#f87171}
.sc-p{font-size:14px;line-height:1.7;margin-bottom:22px}
.sc .sc-p{color:var(--ink2)}
.sc.featured .sc-p{color:rgba(255,255,255,.75)}
.sc-list{list-style:none;display:flex;flex-direction:column;gap:9px;margin-bottom:26px}
.sc-list li{font-size:13.5px;display:flex;align-items:flex-start;gap:10px;line-height:1.5}
.sc .sc-list li{color:var(--ink2)}
.sc.featured .sc-list li{color:rgba(255,255,255,.85)}
.sc-list li::before{content:'';width:5px;height:5px;border-radius:50%;flex-shrink:0;margin-top:6px}
.sc .sc-list li::before{background:var(--red)}
.sc.featured .sc-list li::before{background:#f87171}
.sc-result{margin-top:auto;padding:14px 16px;border-radius:10px;font-size:12px;font-weight:600;font-family:var(--mono);letter-spacing:.03em;display:flex;align-items:center;gap:8px}
.sc .sc-result{background:var(--red-bg);color:var(--red);border:1px solid var(--red-border)}
.sc.featured .sc-result{background:rgba(74,222,128,.08);color:#4ade80;border:1px solid rgba(74,222,128,.2)}
.sc-result::before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}
.sys-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:40px;padding-top:32px;border-top:1px solid var(--border);flex-wrap:wrap}
.sys-bottom-t{font-size:18px;font-weight:600;color:var(--ink);letter-spacing:-.02em}
.sys-bottom-s{font-size:14px;color:var(--ink2);margin-top:4px}

/* DEMO */
#demo-section{background:var(--ink);position:relative;padding:120px 40px}
.demo-content{position:relative;z-index:2;width:100%;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.demo-eyebrow{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.65);margin-bottom:20px;display:flex;align-items:center;gap:8px}
.demo-eyebrow::before{content:'';width:16px;height:1.5px;background:rgba(255,255,255,.4);border-radius:2px}
.demo-h{font-size:clamp(32px,4vw,52px);font-weight:700;line-height:1.08;letter-spacing:-.03em;color:#fff;margin-bottom:16px}
.demo-h .accent{color:#f87171}
.demo-p{font-size:16px;color:rgba(255,255,255,.75);line-height:1.7;margin-bottom:36px}
#demo-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:28px}
.demo-tab{font-family:var(--sans);font-size:13px;font-weight:500;color:rgba(255,255,255,.4);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);padding:7px 16px;border-radius:100px;cursor:pointer;transition:all .2s;letter-spacing:-.01em;-webkit-font-smoothing:antialiased}
.demo-tab:hover{color:rgba(255,255,255,.8);background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.2)}
.demo-tab.on{color:#fff;background:rgba(220,38,38,.2);border-color:rgba(220,38,38,.5);font-weight:600}
.ds{display:flex;gap:16px;padding:16px;border-radius:10px;opacity:.3;transition:opacity .4s,background .3s;cursor:default}
.ds.active{opacity:1;background:rgba(255,255,255,.05)}
.ds-n{font-family:var(--mono);font-size:11px;color:rgba(255,255,255,.45);width:24px;flex-shrink:0;padding-top:2px;font-weight:500}
.ds.active .ds-n{color:#f87171}
.ds-h{font-size:14px;font-weight:600;color:#fff;margin-bottom:3px;letter-spacing:-.01em}
.ds-p{font-size:13px;color:rgba(255,255,255,.7);line-height:1.5}
.conv-window{border-radius:14px;overflow:hidden;background:#1c1c1e;border:1px solid rgba(255,255,255,.08);box-shadow:0 40px 80px rgba(0,0,0,.5);min-width:0;width:100%}
.conv-hdr{padding:14px 18px;background:#2c2c2e;display:flex;align-items:center;gap:8px;border-bottom:1px solid rgba(255,255,255,.06)}
.cv-dot{width:10px;height:10px;border-radius:50%}
.cv-dot.r{background:#ff5f57}
.cv-dot.y{background:#febc2e}
.cv-dot.g{background:#28c840;animation:pulse 2s ease infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.conv-title{font-family:var(--mono);font-size:11px;color:rgba(255,255,255,.65);margin-left:6px}
.conv-body{padding:20px;overflow:hidden}
.dmsg{margin-bottom:14px;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s;width:100%;box-sizing:border-box}
.dmsg.show{opacity:1;transform:translateY(0)}
.dmsg-row{display:flex;align-items:flex-end;gap:8px;width:100%;min-width:0}
.dmsg-row.right{flex-direction:row-reverse}
.dmsg-av{width:26px;height:26px;border-radius:50%;font-size:10px;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-family:var(--mono)}
.dmsg-av.p{background:rgba(255,255,255,.1);color:rgba(255,255,255,.6)}
.dmsg-av.a{background:var(--red);color:#fff}
.dmsg-bub{max-width:72%;padding:9px 13px;font-size:13px;line-height:1.5;border-radius:12px;word-break:break-word;min-width:0}
.dmsg-bub.in{background:rgba(255,255,255,.08);color:#fff;border-bottom-left-radius:3px}
.dmsg-bub.out{background:#dc2626;color:#fff;border-bottom-right-radius:3px}
.dmsg-meta{font-family:var(--mono);font-size:10px;color:rgba(255,255,255,.25);margin-top:4px;padding:0 34px;word-break:break-word}
.dmsg-meta.right{text-align:right;margin-right:34px;padding:0}
.conv-result{padding:12px 18px;background:rgba(22,163,74,.1);border-top:1px solid rgba(22,163,74,.15);display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;color:#4ade80;opacity:0;transition:opacity .5s}
.conv-result.show{opacity:1}
.conv-result::before{content:'';width:6px;height:6px;border-radius:50%;background:#4ade80;flex-shrink:0}

/* WHO WE SERVE */
#serve{background:var(--bg)}
.serve-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.serve-list{margin-top:8px}
.sr{display:grid;grid-template-columns:48px 1fr;gap:12px;align-items:center;padding:18px 14px;border-radius:10px;transition:background .2s;cursor:default}
.sr:hover{background:var(--bg2)}
.sr-badge{font-size:18px;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:var(--bg3);flex-shrink:0}
.sr-badge.t1{background:var(--red-bg)}
.sr-n{font-size:15px;font-weight:600;color:var(--ink);margin-bottom:3px;letter-spacing:-.01em}
.sr-d{font-size:13px;color:var(--ink2)}
.serve-aside{padding:32px;background:var(--bg2);border:1px solid var(--border);border-radius:16px;margin-top:16px}
.sa-label{font-family:var(--mono);font-size:11px;font-weight:500;color:var(--ink3);letter-spacing:.06em;text-transform:uppercase;margin-bottom:16px}
.sa-rule{font-size:14px;color:var(--ink2);line-height:1.7;margin-bottom:0}
.sa-rule strong{color:var(--ink);font-weight:600}

/* CASE STUDY */
#case{background:var(--bg2);padding:120px 0}
.case-w{max-width:1200px;margin:0 auto;padding:0 40px}
.case-kicker{display:flex;align-items:center;gap:10px;margin-bottom:20px}
.case-tag{background:var(--red);color:#fff;font-family:var(--mono);font-size:11px;font-weight:600;padding:4px 12px;border-radius:6px;letter-spacing:.04em}
.case-ver{font-family:var(--mono);font-size:11px;color:var(--ink3)}
.case-h{font-size:clamp(40px,5.5vw,72px);font-weight:700;letter-spacing:-.04em;line-height:1;color:var(--ink);margin-bottom:4px}
.case-h .accent{color:var(--red)}
.case-co-block{margin-bottom:48px}
.case-co-name{font-family:'Playfair Display',Georgia,serif;font-size:15px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.case-co-loc{font-family:var(--mono);font-size:11px;color:var(--ink3);margin-top:2px;letter-spacing:.04em}
.case-body{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.case-q{font-family:'Playfair Display',Georgia,serif;font-size:20px;font-weight:400;color:var(--ink);line-height:1.6;padding:20px 24px;border-left:3px solid var(--red);margin-bottom:32px;font-style:italic;background:var(--bg);border-radius:0 10px 10px 0}
.case-narrative{margin-bottom:32px}
.case-pull{display:flex;align-items:baseline;gap:14px;padding:20px 0;border-bottom:1px solid var(--border);margin-bottom:20px}
.case-pull-num{font-family:var(--mono);font-size:36px;font-weight:700;color:var(--ink);letter-spacing:-.04em;line-height:1;white-space:nowrap}
.case-pull-label{font-size:13px;color:var(--ink3);line-height:1.5}
.case-pull-label strong{display:block;font-size:14px;font-weight:600;color:var(--ink2);margin-bottom:2px}
.case-body-p{font-family:'Playfair Display',Georgia,serif;font-size:15px;color:var(--ink2);line-height:1.8;margin-bottom:16px;font-weight:400}
.case-result-strip{background:var(--ink);border-radius:12px;padding:18px 20px;margin-top:24px}
.case-result-label{font-family:var(--mono);font-size:10px;font-weight:600;color:rgba(255,255,255,.4);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
.case-milestones{display:flex;flex-direction:column;gap:10px}
.case-milestone{display:flex;align-items:center;gap:12px}
.cm-day{font-family:var(--mono);font-size:11px;font-weight:600;color:rgba(255,255,255,.4);width:48px;flex-shrink:0}
.cm-dot{width:6px;height:6px;border-radius:50%;background:var(--red);flex-shrink:0}
.cm-text{font-size:13px;color:rgba(255,255,255,.85);line-height:1.4}
.cm-text strong{color:#fff;font-weight:600}
.timeline{margin-top:0}
.tl-item{display:grid;grid-template-columns:64px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid var(--border);position:relative}
.tl-item:last-child{border-bottom:none}
.tl-phase{font-family:var(--mono);font-size:10px;font-weight:600;color:var(--ink3);padding-top:3px;letter-spacing:.04em}
.tl-h{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:3px;letter-spacing:-.01em}
.tl-p{font-size:13px;color:var(--ink2);line-height:1.55}
.case-metrics{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.cm{padding:20px 22px;background:var(--bg);border:1px solid var(--border);border-radius:12px;position:relative;transition:box-shadow .2s,border-color .2s}
.cm:hover{box-shadow:var(--shadow-md);border-color:var(--border2)}
.cm-label{font-family:var(--mono);font-size:10px;color:var(--ink3);text-transform:uppercase;letter-spacing:.06em;position:absolute;top:14px;right:16px}
.cm-n{font-size:44px;font-weight:700;color:var(--ink);line-height:1;letter-spacing:-.03em}
.cm-n sub{font-size:.44em;color:var(--ink3);font-weight:500;vertical-align:baseline}
.cm-l{font-size:13px;color:var(--ink2);margin-top:5px}
.case-breakdown{padding:20px 22px;background:var(--bg);border:1px solid var(--border);border-radius:12px;margin-bottom:16px}
.cb-title{font-family:var(--mono);font-size:11px;color:var(--ink3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:16px}
.cb-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--border)}
.cb-row:last-child{border-bottom:none}
.cb-k{font-size:13px;color:var(--ink2)}
.cb-v{font-family:var(--mono);font-size:12px;color:var(--ink);font-weight:500}
.cb-v.pos{color:var(--green)}
.case-auth{display:flex;align-items:center;gap:12px;padding:16px;background:var(--bg);border:1px solid var(--border);border-radius:12px}
.ca-av{width:40px;height:40px;border-radius:10px;background:var(--red);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#fff;flex-shrink:0}
.ca-n{font-size:14px;font-weight:600;color:var(--ink)}
.ca-t{font-size:12px;color:var(--ink3);margin-top:2px;font-family:var(--mono)}
.case-cta-strip{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:48px;padding:28px 32px;background:var(--bg);border:1px solid var(--border);border-radius:16px;flex-wrap:wrap}
.ccs-t{font-size:18px;font-weight:600;color:var(--ink);letter-spacing:-.02em}
.ccs-s{font-size:13px;color:var(--ink2);margin-top:4px}

/* RESULTS */
#results{background:var(--bg)}
.results-hdr{text-align:center;margin-bottom:60px}
.results-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;border-radius:16px;overflow:hidden;background:var(--border)}
.rg{background:var(--bg2);padding:48px 24px;text-align:center;cursor:default;transition:background .25s}
.rg:hover{background:var(--bg)}
.rg-n{font-size:clamp(44px,5vw,64px);font-weight:700;color:var(--ink);line-height:1;margin-bottom:10px;letter-spacing:-.03em}
.rg-n sub{font-size:.44em;color:var(--ink3);font-weight:500;vertical-align:baseline}
.rg-l{font-size:14px;font-weight:500;color:var(--ink2)}

/* ROI CALCULATOR */
#roi{background:var(--bg2)}
.roi-hdr{text-align:center;margin-bottom:52px}
.roi-wrap{display:grid;grid-template-columns:1fr 1fr;gap:2px;border-radius:16px;overflow:hidden;background:var(--border)}
.roi-in{background:var(--bg);padding:48px 44px}
.roi-out{background:var(--ink);padding:48px 44px}
.roi-in-title,.roi-out-title{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:32px}
.roi-in-title{color:var(--ink2)}
.roi-out-title{color:rgba(255,255,255,.55)}
.ri-g{margin-bottom:28px}
.ri-g:last-child{margin-bottom:0}
.ri-label{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:12px;display:flex;justify-content:space-between;align-items:center}
.ri-val{font-family:var(--mono);font-size:13px;color:var(--red);font-weight:700}
input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:5px;background:var(--border2);outline:none;cursor:pointer;border-radius:4px;margin:4px 0}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;background:var(--ink);border-radius:50%;cursor:pointer;border:3px solid #fff;box-shadow:0 1px 6px rgba(0,0,0,.22)}
input[type=range]::-moz-range-thumb{width:20px;height:20px;background:var(--ink);border-radius:50%;cursor:pointer;border:3px solid #fff;box-shadow:0 1px 6px rgba(0,0,0,.22)}
input[type=range]:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.ri-ends{display:flex;justify-content:space-between;margin-top:7px}
.ri-ends span{font-family:var(--mono);font-size:11px;font-weight:500;color:var(--ink3)}
.ro-lost-label{font-size:13px;color:rgba(255,255,255,.7);margin-bottom:8px}
.ro-big{font-size:clamp(44px,5vw,64px);font-weight:700;color:#fff;line-height:1;letter-spacing:-.03em;margin-bottom:28px}
.ro-big .unit{font-size:.32em;color:rgba(255,255,255,.4);font-weight:400}
.ro-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:24px}
.ro-stat{padding:14px 16px;background:rgba(255,255,255,.06);border-radius:10px}
.ro-stat-n{font-size:24px;font-weight:700;color:#fff;letter-spacing:-.02em;line-height:1}
.ro-stat-n sub{font-size:.44em;color:rgba(255,255,255,.6);font-weight:500;vertical-align:baseline}
.ro-stat-l{font-size:12px;color:rgba(255,255,255,.65);margin-top:4px}
.ro-bars{margin-bottom:24px}
.ro-bar-row{margin-bottom:10px}
.ro-bar-labels{display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;color:rgba(255,255,255,.6);margin-bottom:6px}
.ro-track{height:4px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden}
.ro-fill{height:100%;border-radius:2px;transition:width .9s var(--ease)}
.ro-fill.now{background:rgba(255,255,255,.3)}
.ro-fill.ai{background:#4ade80}
.ro-payback{padding:14px;background:rgba(22,163,74,.12);border:1px solid rgba(22,163,74,.2);border-radius:10px;font-family:var(--mono);font-size:12px;color:#4ade80;display:flex;align-items:center;gap:8px;margin-bottom:20px}
.ro-payback::before{content:'';width:6px;height:6px;border-radius:50%;background:#4ade80;flex-shrink:0}
.ro-note{font-size:12px;color:rgba(255,255,255,.55);line-height:1.6;margin-bottom:20px}

/* CLARITY */
#clarity{background:var(--bg)}
.clarity-hdr{text-align:center;margin-bottom:52px}
.clarity-layout{display:grid;grid-template-columns:1fr 1fr;gap:2px;border-radius:16px;overflow:hidden;background:var(--border)}
.cc{padding:48px 40px}
.cc.no{background:var(--bg2)}
.cc.yes{background:var(--bg)}
.cc-header{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin-bottom:28px;display:flex;align-items:center;gap:8px}
.cc.no .cc-header{color:var(--red)}
.cc.yes .cc-header{color:var(--green)}
.cc.no .cc-header::before{content:'✕';font-size:12px}
.cc.yes .cc-header::before{content:'✓';font-size:12px}
.ci{padding:14px 0;border-bottom:1px solid var(--border);display:flex;gap:12px;align-items:flex-start}
.ci:last-child{border-bottom:none}
.ci-mark{width:18px;height:18px;border-radius:5px;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.cc.no .ci-mark{background:var(--red-bg);color:var(--red)}
.cc.yes .ci-mark{background:var(--green-bg);color:var(--green)}
.ci-h{font-size:14px;font-weight:600;color:var(--ink);margin-bottom:4px;letter-spacing:-.01em}
.ci-p{font-size:13px;color:var(--ink3);line-height:1.6}

/* PROOF */
#proof{background:var(--bg2)}
.proof-hdr{text-align:center;margin-bottom:40px}
.pf-filters{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-bottom:40px}
.pf-btn{font-family:var(--sans);font-size:13px;font-weight:500;color:var(--ink3);background:var(--bg);border:1.5px solid var(--border);padding:7px 18px;border-radius:100px;cursor:pointer;transition:all .2s;letter-spacing:-.01em}
.pf-btn:hover{color:var(--ink);border-color:var(--ink2)}
.pf-btn.on{color:#fff;background:var(--ink);border-color:var(--ink)}
.pg{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.pc{background:var(--bg);padding:24px 20px;border-radius:14px;border:1.5px solid var(--border);transition:border-color .2s,box-shadow .2s,transform .2s var(--ease);cursor:pointer;position:relative}
.pc:hover{border-color:var(--ink2);box-shadow:var(--shadow-md);transform:translateY(-2px)}
.pc-i{font-family:var(--mono);font-size:10px;color:var(--ink3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px}
.pc-n{font-size:40px;font-weight:700;color:var(--ink);line-height:1;margin-bottom:4px;letter-spacing:-.03em}
.pc-n sub{font-size:.44em;color:var(--ink3);font-weight:500;vertical-align:baseline}
.pc-l{font-size:13px;color:var(--ink2);line-height:1.5;margin-bottom:10px}
.pc-m{font-family:var(--mono);font-size:10px;color:var(--ink3);padding-top:10px;border-top:1px solid var(--border)}
.pc-arrow{position:absolute;bottom:16px;right:16px;width:24px;height:24px;border-radius:6px;background:var(--bg3);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:11px;transition:all .2s}
.pc:hover .pc-arrow{background:var(--ink);border-color:var(--ink);color:#fff}
.pc.hidden{display:none}
.proof-ft{text-align:center;margin-top:44px}
.proof-ft p{font-family:var(--mono);font-size:12px;color:var(--ink4);margin-bottom:22px}

/* DETAIL PANEL */
#detail-overlay{position:fixed;inset:0;z-index:800;background:rgba(0,0,0,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .3s;display:flex;align-items:center;justify-content:center;padding:24px}
#detail-overlay.open{opacity:1;pointer-events:auto}
.detail-panel{background:#fff;border-radius:20px;box-shadow:0 32px 80px rgba(0,0,0,.25);width:100%;max-width:720px;max-height:92vh;overflow-y:auto;transform:translateY(20px) scale(.97);transition:transform .4s var(--ease)}
#detail-overlay.open .detail-panel{transform:translateY(0) scale(1)}
.dp-hdr{background:var(--ink);padding:28px 28px 24px;border-radius:20px 20px 0 0;position:relative;overflow:hidden}
.dp-hdr::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 100% 0%,rgba(220,38,38,.2),transparent)}
.dp-tag{font-family:var(--mono);font-size:10px;font-weight:600;color:rgba(255,255,255,.5);letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px}
.dp-metric{font-size:68px;font-weight:800;color:#fff;line-height:1;letter-spacing:-.04em;margin-bottom:6px}
.dp-metric-label{font-size:16px;color:rgba(255,255,255,.7)}
.dp-close{position:absolute;top:20px;right:20px;width:32px;height:32px;border-radius:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.7);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.dp-close:hover{background:rgba(255,255,255,.2);color:#fff}
.dp-body{padding:24px 28px 28px}
.dp-meta{display:flex;align-items:center;gap:10px;margin-bottom:22px;flex-wrap:wrap}
.dp-tag-pill{font-family:var(--mono);font-size:10px;font-weight:600;padding:3px 10px;border-radius:100px;letter-spacing:.05em}
.dp-tag-pill.tl{background:var(--bg3);color:var(--ink2)}
.dp-tag-pill.sys{background:var(--red-bg);color:var(--red);border:1px solid var(--red-border)}
.dp-compare{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:22px}
.dp-col{padding:14px 16px;border-radius:10px}
.dp-col.before{background:var(--bg2);border:1px solid var(--border)}
.dp-col.after{background:var(--ink);border:1px solid var(--ink)}
.dp-col-label{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}
.dp-col.before .dp-col-label{color:var(--ink4)}
.dp-col.after .dp-col-label{color:rgba(255,255,255,.4)}
.dp-stat{margin-bottom:8px}
.dp-stat:last-child{margin-bottom:0}
.dp-stat-k{font-family:var(--mono);font-size:10px;margin-bottom:2px}
.dp-col.before .dp-stat-k{color:var(--ink4)}
.dp-col.after .dp-stat-k{color:rgba(255,255,255,.4)}
.dp-stat-v{font-size:16px;font-weight:600}
.dp-col.before .dp-stat-v{color:var(--ink)}
.dp-col.after .dp-stat-v{color:#fff}
.dp-bars-title{font-family:var(--mono);font-size:10px;font-weight:600;color:var(--ink4);letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px}
.dp-bar-row{margin-bottom:14px}
.dp-bar-labels{display:flex;justify-content:space-between;font-size:12px;margin-bottom:6px}
.dp-bar-labels span:first-child{color:var(--ink2);font-weight:500}
.dp-bar-labels span:last-child{font-family:var(--mono);font-size:11px;font-weight:600}
.dp-bar-before-lbl{color:var(--ink4)!important;font-size:10px!important}
.dp-bar-track{height:6px;background:var(--bg3);border-radius:3px;overflow:visible;position:relative;margin-bottom:3px}
.dp-bar-ghost{height:6px;background:var(--border2);border-radius:3px;position:absolute;top:0;left:0;width:0;transition:width 1s var(--ease)}
.dp-bar-fill{height:6px;border-radius:3px;position:absolute;top:0;left:0;width:0;transition:width 1s .15s var(--ease);background:var(--red)}
.dp-bottom{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:22px;padding-top:20px;border-top:1px solid var(--border)}
.dp-kpi{text-align:center;padding:12px;background:var(--bg2);border-radius:10px;border:1px solid var(--border)}
.dp-kpi-n{font-size:20px;font-weight:700;color:var(--ink);letter-spacing:-.02em;line-height:1}
.dp-kpi-l{font-family:var(--mono);font-size:10px;color:var(--ink3);margin-top:4px;text-transform:uppercase;letter-spacing:.05em}

/* TESTIMONIAL */
#testi{background:var(--ink);padding:120px 40px;position:relative;overflow:hidden}
.testi-bg{position:absolute;inset:0;background:radial-gradient(ellipse 60% 60% at 50% 50%,rgba(220,38,38,.08),transparent)}
.testi-inner{position:relative;z-index:1;max-width:760px;margin:0 auto;text-align:center}
.testi-stars{display:flex;justify-content:center;gap:4px;margin-bottom:28px}
.testi-star{color:#fbbf24;font-size:18px}
.testi-q{font-size:clamp(20px,2.8vw,30px);font-weight:500;color:#fff;line-height:1.5;margin-bottom:36px;letter-spacing:-.02em;font-style:italic}
.testi-meta{display:flex;align-items:center;justify-content:center;gap:14px}
.testi-av{width:44px;height:44px;border-radius:12px;background:var(--red);display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:700;color:#fff}
.testi-name{font-size:15px;font-weight:600;color:#fff;text-align:left}
.testi-role{font-size:13px;color:rgba(255,255,255,.65);font-family:var(--mono);margin-top:2px}

/* PRICING */
#pricing{background:var(--bg)}
.pricing-hdr{text-align:center;margin-bottom:52px}
.pricing-card{max-width:900px;margin:0 auto;border:1px solid var(--border);border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg)}
.pricing-nums{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--border)}
.pn{padding:36px 36px}
.pn.featured{background:var(--ink);color:#fff}
.pn-l{font-family:var(--mono);font-size:11px;color:var(--ink3);letter-spacing:.06em;text-transform:uppercase;margin-bottom:12px}
.pn.featured .pn-l{color:rgba(255,255,255,.65)}
.pn-n{font-size:38px;font-weight:700;color:var(--ink);letter-spacing:-.03em;line-height:1;margin-bottom:8px}
.pn-n sub{font-size:.4em;color:var(--ink3);font-weight:500;vertical-align:baseline}
.pn.featured .pn-n{color:#fff}
.pn.featured .pn-n sub{color:rgba(255,255,255,.4)}
.pn-d{font-size:13px;color:var(--ink3);line-height:1.55}
.pn.featured .pn-d{color:rgba(255,255,255,.5)}
.pricing-footer{padding:28px 36px;background:var(--bg2);display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.pf-note{font-size:14px;color:var(--ink3);line-height:1.65;max-width:440px}
.pf-note strong{color:var(--ink);font-weight:600}

/* CTA */
#cta{padding:140px 40px;background:var(--bg2);position:relative;overflow:hidden}
#cta::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 50%,rgba(220,38,38,.05),transparent);pointer-events:none}
.cta-inner{position:relative;z-index:1;max-width:640px;margin:0 auto;text-align:center}
.cta-badge{display:inline-flex;align-items:center;gap:8px;background:var(--green-bg);border:1px solid rgba(22,163,74,.2);border-radius:100px;padding:5px 16px 5px 5px;font-size:12px;font-weight:600;color:var(--green);margin-bottom:28px;font-family:var(--mono)}
.cta-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--green)}
.cta-h{font-size:clamp(40px,5.5vw,68px);font-weight:700;line-height:1.04;letter-spacing:-.04em;color:var(--ink);margin-bottom:16px}
.cta-h em{color:var(--red);font-style:normal}
.cta-p{font-size:17px;color:var(--ink3);line-height:1.7;max-width:460px;margin:0 auto 40px}
.cta-btns{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:28px}
.cta-note{font-family:var(--mono);font-size:12px;color:var(--ink4);letter-spacing:.04em}

/* FOOTER */
footer{background:var(--ink);padding:72px 40px 40px}
.footer-inner{max-width:1200px;margin:0 auto}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:56px;margin-bottom:52px}
.footer-logo{margin-bottom:16px}
.footer-tagline{font-size:13px;color:rgba(255,255,255,.65);line-height:1.7;max-width:240px}
.fc h4{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.1em;color:rgba(255,255,255,.5);text-transform:uppercase;margin-bottom:16px}
.fc ul{list-style:none;display:flex;flex-direction:column;gap:8px}
.fc ul li a,.fc ul li button{font-size:13px;color:rgba(255,255,255,.7);text-decoration:none;transition:color .2s;cursor:pointer;background:none;border:none;padding:0;text-align:left;font-family:var(--sans)}
.fc ul li a:hover,.fc ul li button:hover{color:#fff}
.footer-bot{display:flex;align-items:center;justify-content:space-between;padding-top:24px;border-top:1px solid rgba(255,255,255,.08);flex-wrap:wrap;gap:12px}
.footer-copy{font-family:var(--mono);font-size:11px;color:rgba(255,255,255,.5)}
.footer-tl{font-size:13px;color:rgba(255,255,255,.45);font-style:italic}
.footer-logo-mark{width:28px;height:28px;background:var(--red);border-radius:6px;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;margin-right:8px}
.footer-logo-text{font-size:15px;font-weight:600;color:rgba(255,255,255,.85);vertical-align:middle;letter-spacing:-.01em}

/* MODAL */
#modal-overlay{position:fixed;inset:0;z-index:900;background:rgba(0,0,0,.65);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;pointer-events:none;transition:opacity .3s;display:flex;align-items:center;justify-content:center;padding:20px;overflow:hidden}
#modal-overlay.open{opacity:1;pointer-events:auto}
.modal{background:#fff;border-radius:20px;box-shadow:0 48px 120px rgba(0,0,0,.3),0 0 0 1px rgba(0,0,0,.06);width:100%;max-width:560px;height:calc(100dvh - 40px);max-height:780px;overflow:hidden;transform:translateY(32px) scale(.97);transition:transform .45s var(--ease);position:relative;overflow-y:auto;margin:auto;flex-shrink:0;display:flex;flex-direction:column}
#modal-overlay.open .modal{transform:translateY(0) scale(1)}
/* modal header */
.modal-hdr{background:var(--ink);padding:20px 24px;display:flex;align-items:center;justify-content:space-between}
.modal-hdr-left{display:flex;align-items:center;gap:12px}
.modal-hdr-mark{width:32px;height:32px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.modal-hdr-info{}
.modal-hdr-name{font-size:12px;font-weight:700;color:#fff;letter-spacing:.02em;text-transform:uppercase;font-family:var(--mono)}
.modal-hdr-step{font-family:var(--mono);font-size:10px;color:rgba(255,255,255,.4);margin-top:2px;letter-spacing:.02em}
.modal-progress-close{width:28px;height:28px;border-radius:7px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);cursor:pointer;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.55);transition:background .15s,color .15s;flex-shrink:0}
.modal-progress-close:hover{background:rgba(255,255,255,.14);color:#fff}
/* progress bar */
.modal-pbar{height:2px;background:rgba(255,255,255,.08)}
.modal-pbar-fill{height:100%;background:var(--red);transition:width .5s var(--ease);border-radius:0 2px 2px 0}
/* step panels */
.modal-steps-wrap{overflow-y:auto;flex:1}
.modal-step{display:none;padding:28px 28px 32px;animation:stepIn .3s var(--ease)}
.modal-step.active{display:block}
@keyframes stepIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}
.modal-step-title{font-size:22px;font-weight:700;color:var(--ink);letter-spacing:-.04em;margin-bottom:4px;line-height:1.1}
.modal-step-sub{font-size:13px;color:var(--ink3);margin-bottom:24px;line-height:1.5}
.form-row{margin-bottom:14px}
.form-row label{display:block;font-size:12px;font-weight:600;color:var(--ink2);margin-bottom:6px;letter-spacing:.01em;text-transform:uppercase;font-family:var(--mono)}
.form-row input,.form-row select,.form-row textarea{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:11px 14px;font-size:14px;font-family:var(--sans);color:var(--ink);background:var(--bg);outline:none;transition:border-color .2s,box-shadow .2s,background .2s;-webkit-appearance:none;appearance:none}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(220,38,38,.08);background:#fff}
.form-row textarea{resize:none;height:80px;line-height:1.55}
.form-row select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236b7280' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;padding-right:36px;cursor:pointer}
.form-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.opt-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:2px}
.opt-grid.opt-cols-1{grid-template-columns:1fr}
.opt-grid.opt-cols-4{grid-template-columns:repeat(4,1fr)}
.opt-btn{padding:9px 12px;border:1.5px solid var(--border);border-radius:9px;background:var(--bg);color:var(--ink2);font-size:13px;font-weight:500;cursor:pointer;transition:border-color .15s,background .15s,color .15s;text-align:left;line-height:1.35;font-family:var(--sans)}
.opt-btn:hover{border-color:var(--ink3);color:var(--ink);background:var(--bg2)}
.opt-btn.active{border-color:var(--red);background:rgba(220,38,38,.06);color:var(--red);font-weight:600}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
.shake{animation:shake .45s ease}
.modal-step-btns{display:flex;gap:8px;margin-top:24px}
.modal-btn-next{flex:1;padding:13px;background:var(--ink);color:#fff;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s,transform .15s;letter-spacing:-.01em}
.modal-btn-next:hover{background:#000;transform:translateY(-1px)}
.modal-btn-next:disabled{opacity:.5;cursor:default;transform:none}
.modal-btn-back{padding:13px 16px;background:transparent;border:1.5px solid var(--border);color:var(--ink3);border-radius:10px;font-size:14px;font-weight:500;cursor:pointer;transition:border-color .2s,color .2s;letter-spacing:-.01em}
.modal-btn-back:hover{border-color:var(--ink2);color:var(--ink)}
.modal-note{text-align:center;font-size:11px;color:var(--ink4);margin-top:12px;line-height:1.6;font-family:var(--mono)}
/* success */
.modal-success{padding:0;text-align:left;overflow:hidden}
.ms-top{background:var(--ink);padding:36px 32px 32px;position:relative;overflow:hidden}
.ms-top::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 100%,rgba(220,38,38,.18),transparent);pointer-events:none}
.ms-check{width:48px;height:48px;border-radius:12px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.ms-check svg{display:block}
.ms-top h3{font-size:26px;font-weight:800;color:#fff;letter-spacing:-.04em;line-height:1.1;margin-bottom:8px}
.ms-top p{font-size:14px;color:rgba(255,255,255,.65);line-height:1.6;max-width:340px}
.ms-bottom{padding:24px 32px 32px;background:#fff}
.ms-steps{display:flex;flex-direction:column;gap:0}
.ms-step{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--border)}
.ms-step:last-child{border-bottom:none}
.ms-step-num{width:24px;height:24px;border-radius:6px;background:var(--bg3);font-family:var(--mono);font-size:11px;font-weight:600;color:var(--ink3);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.ms-step-h{font-size:14px;font-weight:600;color:var(--ink);margin-bottom:2px;letter-spacing:-.01em}
.ms-step-p{font-size:13px;color:var(--ink2);line-height:1.5}
.ms-close{width:100%;padding:13px;background:var(--ink);color:#fff;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;margin-top:20px;letter-spacing:-.01em;transition:background .2s}
.ms-close:hover{background:#000}

/* HERO PLAY BUTTON */
.hc-header{position:relative}
.hc-play-btn{margin-left:auto;display:flex;align-items:center;gap:5px;font-family:var(--mono);font-size:10px;font-weight:600;color:var(--ink3);background:var(--bg3);border:1px solid var(--border2);border-radius:100px;padding:4px 10px 4px 8px;cursor:pointer;transition:all .2s;letter-spacing:.04em}
.hc-play-btn:hover{color:var(--red);border-color:var(--red-border);background:var(--red-bg)}
.hc-msg{transition:opacity .35s,transform .35s}
.hc-msg.hidden{opacity:0;transform:translateY(6px);pointer-events:none}
/* typing dots */
.hc-dots-anim{display:flex;align-items:center;gap:4px;padding:10px 16px!important}
.hc-dots-anim span{width:5px;height:5px;border-radius:50%;background:var(--ink3);display:inline-block;animation:typDot 1.2s ease infinite}
.hc-dots-anim span:nth-child(2){animation-delay:.2s}
.hc-dots-anim span:nth-child(3){animation-delay:.4s}
@keyframes typDot{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}

/* HERO HEADLINE HOVER */
.hero-word{display:inline-block;transition:color .2s,transform .2s var(--ease)}
.hero-h:hover .hero-word{color:var(--ink2)}
.hero-h:hover .hero-word:hover{color:var(--ink);transform:translateY(-1px)}

/* LOGO HOVER — squares drift apart */
.logo-mark svg rect{transition:transform .4s var(--ease)}
.logo:hover .logo-mark svg rect:nth-child(1){transform:translate(2px,-2px)}
.logo:hover .logo-mark svg rect:nth-child(2){transform:translate(-2px,2px)}
.logo:hover .logo-mark svg rect:nth-child(3){transform:scale(1.15);transform-origin:center}

/* MAGNETIC BUTTON */
.mag{display:inline-flex;transition:transform .2s var(--ease)}

/* TILT CARD */
.tilt{transform-style:preserve-3d;transition:transform .1s}

/* SCROLL REVEAL */
.rv{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.delay-1{transition-delay:.1s}
.rv.delay-2{transition-delay:.2s}
.rv.delay-3{transition-delay:.3s}

/* VIDEO MODAL */
#video-overlay{position:fixed;inset:0;z-index:950;background:rgba(0,0,0,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;pointer-events:none;transition:opacity .3s;display:flex;align-items:center;justify-content:center;padding:24px}
#video-overlay.open{opacity:1;pointer-events:auto}
.video-modal{width:100%;max-width:360px;border-radius:20px;overflow:hidden;position:relative;transform:scale(.95);transition:transform .4s var(--ease);box-shadow:0 40px 80px rgba(0,0,0,.5)}
#video-overlay.open .video-modal{transform:scale(1)}
.video-modal video{width:100%;display:block;aspect-ratio:9/16;object-fit:cover;border-radius:20px}
.video-close{position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.2);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;transition:background .2s}
.video-close:hover{background:rgba(220,38,38,.7)}
.video-label{position:absolute;bottom:0;left:0;right:0;padding:14px 18px;background:linear-gradient(transparent,rgba(0,0,0,.7));font-family:var(--mono);font-size:11px;color:rgba(255,255,255,.7);letter-spacing:.04em;pointer-events:none}
/* play trigger buttons */
.btn-play{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--ink2);background:transparent;border:1.5px solid var(--border2);padding:10px 18px;border-radius:9px;cursor:pointer;transition:all .2s;letter-spacing:-.01em}
.btn-play:hover{border-color:var(--ink);color:var(--ink);background:var(--bg2)}
.btn-play-icon{width:22px;height:22px;border-radius:50%;background:var(--ink);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s}
.btn-play:hover .btn-play-icon{background:var(--red)}
.demo-watch-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-size:13px;font-weight:500;color:rgba(255,255,255,.65);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);padding:8px 16px;border-radius:100px;cursor:pointer;transition:all .2s;margin-top:16px}
.demo-watch-btn:hover{color:#fff;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.3)}
.demo-watch-btn-dot{width:7px;height:7px;border-radius:50%;background:var(--red)}

/* STICKY CTA BAR */
#sticky-bar{position:fixed;bottom:0;left:0;right:0;z-index:400;transform:translateY(100%);transition:transform .4s var(--ease);pointer-events:none}
#sticky-bar.show{transform:translateY(0);pointer-events:auto}
/* WhatsApp float removed — replaced by Botpress AI chat bubble (bottom-right). WhatsApp links remain in footer. */
.sticky-inner{max-width:1200px;margin:0 auto;padding:12px 40px;display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--ink);border-top:1px solid rgba(255,255,255,.08)}
.sticky-text{font-size:14px;font-weight:500;color:rgba(255,255,255,.8);letter-spacing:-.01em}
.sticky-text strong{color:#fff}
.sticky-right{display:flex;align-items:center;gap:10px}
.sticky-dismiss{width:28px;height:28px;border-radius:6px;background:rgba(255,255,255,.08);border:none;color:rgba(255,255,255,.4);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.sticky-dismiss:hover{background:rgba(255,255,255,.15);color:#fff}
@media(max-width:768px){.sticky-inner{padding:12px 20px;flex-wrap:wrap;gap:10px}.sticky-text{font-size:13px}}

/* EXIT INTENT */
#exit-overlay{position:fixed;inset:0;z-index:850;background:rgba(0,0,0,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .3s;display:flex;align-items:center;justify-content:center;padding:24px}
#exit-overlay.open{opacity:1;pointer-events:auto}
.exit-card{background:#fff;border-radius:20px;padding:36px 40px;max-width:460px;width:100%;box-shadow:0 32px 80px rgba(0,0,0,.2);text-align:center;transform:translateY(-16px) scale(.97);transition:transform .4s var(--ease);position:relative}
#exit-overlay.open .exit-card{transform:translateY(0) scale(1)}
.exit-close{position:absolute;top:14px;right:14px;width:28px;height:28px;border-radius:6px;background:var(--bg3);border:none;cursor:pointer;color:var(--ink3);display:flex;align-items:center;justify-content:center;transition:all .2s}
.exit-close:hover{background:var(--border2);color:var(--ink)}
.exit-eyebrow{font-family:var(--mono);font-size:11px;font-weight:600;color:var(--red);letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}
.exit-h{font-size:26px;font-weight:800;color:var(--ink);letter-spacing:-.04em;line-height:1.1;margin-bottom:8px}
.exit-p{font-size:14px;color:var(--ink2);line-height:1.65;margin-bottom:24px}
.exit-stat{display:flex;align-items:stretch;gap:0;background:var(--bg);border:1.5px solid var(--border2);border-radius:12px;overflow:hidden;margin-bottom:24px}
.exit-stat-free{background:var(--red);color:#fff;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.06em;padding:12px 16px;display:flex;align-items:center;justify-content:center;text-transform:uppercase;flex-shrink:0}
.exit-stat-items{display:flex;align-items:center;justify-content:center;gap:0;flex:1;padding:0 4px}
.exit-stat-item{font-family:var(--mono);font-size:11px;font-weight:600;color:var(--ink);padding:12px 14px;display:flex;align-items:center;gap:6px;white-space:nowrap}
.exit-stat-item svg{color:var(--red);flex-shrink:0}
.exit-stat-sep{width:1px;background:var(--border2);align-self:stretch;flex-shrink:0}

/* GLOBAL INTERACTIVE HOVER GLOW */
@keyframes ringPulse{0%{box-shadow:0 0 0 0 rgba(220,38,38,.35)}100%{box-shadow:0 0 0 6px rgba(220,38,38,0)}}
.btn-primary:hover{box-shadow:0 6px 20px rgba(220,38,38,.35),0 0 0 3px rgba(220,38,38,.1)!important}
.btn-primary:active{animation:ringPulse .4s ease forwards}
.btn-ghost:hover{box-shadow:0 0 0 3px rgba(55,65,81,.1),var(--shadow-sm)!important}
.nav-cta:hover{box-shadow:0 0 0 3px rgba(17,24,39,.12),0 4px 12px rgba(0,0,0,.2)!important}
.pf-btn:hover{box-shadow:0 0 0 3px rgba(55,65,81,.08)}
.pf-btn.on{box-shadow:0 0 0 3px rgba(17,24,39,.1)}
.demo-tab:hover{box-shadow:0 0 0 2px rgba(255,255,255,.12)}
.demo-tab.on{box-shadow:0 0 0 2px rgba(220,38,38,.4)}
.sc:hover{box-shadow:inset 0 0 0 1.5px var(--red),0 0 0 3px rgba(220,38,38,.06)!important}
.cm:hover{box-shadow:var(--shadow-md),0 0 0 2px rgba(220,38,38,.08)!important}
.pc:hover{box-shadow:inset 0 0 0 1.5px var(--border2),0 0 0 3px rgba(55,65,81,.05)!important}
.pi:hover{box-shadow:var(--shadow),0 0 0 2px rgba(55,65,81,.05)!important}
.sr:hover{background:var(--bg2);box-shadow:0 0 0 1.5px var(--border)}
.hc-play-btn:hover{box-shadow:0 0 0 3px rgba(220,38,38,.12)}

/* HOW WE BUILD */
#how-we-build{background:var(--bg)}
.hwb-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:80px;align-items:start}
.hwb-steps{margin-top:8px;display:flex;flex-direction:column;gap:0}
.hwb-step{display:grid;grid-template-columns:48px 1fr;gap:16px;align-items:start;padding:24px 0;border-bottom:1px solid var(--border);position:relative}
.hwb-step:last-child{border-bottom:none}
.hwb-step-num{width:36px;height:36px;border-radius:10px;background:var(--bg3);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:12px;font-weight:600;color:var(--ink3);flex-shrink:0;transition:background .2s,border-color .2s,color .2s}
.hwb-step:hover .hwb-step-num{background:var(--red-bg);border-color:var(--red-border);color:var(--red)}
.hwb-step-h{font-size:15px;font-weight:700;color:var(--ink);margin-bottom:4px;letter-spacing:-.01em}
.hwb-step-time{font-family:var(--mono);font-size:11px;color:var(--red);font-weight:600;margin-bottom:5px;letter-spacing:.04em}
.hwb-step-p{font-size:14px;color:var(--ink2);line-height:1.6}
.hwb-panel{background:var(--ink);border-radius:20px;padding:40px;position:relative;overflow:hidden}
.hwb-panel::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 50% at 100% 0%,rgba(220,38,38,.15),transparent);pointer-events:none}
.hwb-panel-eyebrow{font-family:var(--mono);font-size:10px;font-weight:600;color:rgba(255,255,255,.45);letter-spacing:.1em;text-transform:uppercase;margin-bottom:24px}
.hwb-compare{display:flex;flex-direction:column;gap:10px;margin-bottom:28px}
.hwb-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hwb-col-label{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px;color:rgba(255,255,255,.35)}
.hwb-item{padding:14px 16px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.hwb-item.accent{background:rgba(220,38,38,.12);border-color:rgba(220,38,38,.25)}
.hwb-item-k{font-family:var(--mono);font-size:10px;color:rgba(255,255,255,.4);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.hwb-item-v{font-size:15px;font-weight:700;color:#fff;line-height:1.2}
.hwb-item.accent .hwb-item-v{color:#f87171}
.hwb-divider{height:1px;background:rgba(255,255,255,.08);margin:20px 0}
.hwb-advantage{padding:16px;background:rgba(74,222,128,.08);border:1px solid rgba(74,222,128,.2);border-radius:12px;font-size:13px;color:#4ade80;line-height:1.6;font-weight:500}
.hwb-advantage strong{color:#fff;display:block;margin-bottom:4px;font-size:14px}

/* RESPONSIVE */
@media(max-width:1100px){
  .hero-inner{grid-template-columns:1fr;gap:60px}
  .hero-visual{display:none}
  .prob-layout,.serve-layout,.case-body,.roi-wrap,.clarity-layout,.hwb-grid{grid-template-columns:1fr}
  .sys-grid{grid-template-columns:1fr;gap:16px}
  .results-grid{grid-template-columns:1fr 1fr}
  .footer-top{grid-template-columns:1fr 1fr}
  .demo-content{grid-template-columns:1fr;gap:48px}
  .pricing-nums{grid-template-columns:1fr}
  .hwb-grid{gap:40px}
}
@media(max-width:768px){
  /* NAV */
  #nav .nav-i{padding:0 20px;height:60px}
  .nav-links{display:none}
  .nav-cta{font-size:13px;padding:8px 16px}

  /* HERO - spacious, premium */
  #hero{padding:110px 24px 64px;min-height:auto}
  .hero-inner{gap:48px}
  .hero-badge{font-size:11.5px}
  .hero-h{font-size:clamp(34px,11vw,52px);letter-spacing:-.035em;line-height:1.05;margin-bottom:20px}
  .hero-p{font-size:17px;max-width:100%;margin-bottom:32px;line-height:1.65}
  .hero-ctas{flex-direction:column;align-items:stretch;gap:10px;margin-bottom:36px}
  .hero-ctas .btn-primary{justify-content:center;padding:16px 24px;font-size:16px;border-radius:14px}
  .hero-ctas .btn-ghost{display:none}
  .hero-ctas .btn-play{justify-content:center;padding:13px 20px;border-radius:14px}
  .hero-trust{gap:10px;flex-wrap:wrap}
  .trust-item{font-size:12.5px}
  .word-cycle{display:inline-block}

  /* SECTIONS */
  .sec{padding:80px 24px}
  .sec-h{font-size:clamp(28px,9vw,44px);letter-spacing:-.03em}
  .sec-p{font-size:16px;line-height:1.65}
  .eyebrow{font-size:10.5px}
  #case{padding:80px 24px}
  #testi{padding:80px 24px}
  #cta{padding:96px 24px}

  /* SYSTEMS */
  .sys-hdr{margin-bottom:36px}
  .sc{padding:30px 24px;border-radius:20px}
  .sc-h{font-size:19px}
  .sys-grid{grid-template-columns:1fr;gap:14px}
  .sys-bottom{flex-direction:column;align-items:flex-start;gap:16px;padding-top:24px}
  .sys-bottom a,.sys-bottom button{width:100%;justify-content:center;border-radius:14px}

  /* HOW WE BUILD */
  .hwb-grid{gap:40px}
  .hwb-panel{padding:28px 22px;border-radius:20px}
  .hwb-row{grid-template-columns:1fr 1fr;gap:8px}
  .hwb-item{padding:12px;border-radius:10px}
  .hwb-item-v{font-size:14px}

  /* DEMO */
  #demo-section{padding:80px 24px}
  .demo-content{padding:0;gap:40px}
  .demo-h{font-size:clamp(28px,9vw,44px)}
  .demo-p{font-size:16px;margin-bottom:28px}
  #demo-tabs{gap:6px;margin-bottom:20px}
  .demo-tab{font-size:12px;padding:6px 14px}
  .wa-phone{max-width:100%;border-radius:24px}
  .demo-voice-row{margin-bottom:10px}
  #demo-steps{display:none}

  /* WHO WE SERVE */
  .serve-layout{gap:40px}
  .serve-aside{padding:22px 24px;border-radius:16px}
  .sr{padding:14px 12px;gap:12px}
  .sr-badge{width:38px;height:38px;font-size:17px;border-radius:10px}
  .sr-n{font-size:14.5px}

  /* CASE STUDY */
  .case-h{font-size:clamp(28px,9vw,44px)}
  .case-cta-strip{flex-direction:column;gap:16px}
  .case-cta-strip .btn-primary{width:100%;justify-content:center;border-radius:14px}
  .cm{padding:20px 18px;border-radius:16px}

  /* RESULTS */
  .results-grid{grid-template-columns:1fr 1fr;gap:12px}
  .rg{padding:24px 18px;border-radius:16px}
  .rg-n{font-size:clamp(32px,9vw,48px)}

  /* ROI CALCULATOR */
  .roi-wrap{gap:24px}
  .roi-in,.roi-out{padding:28px 22px;border-radius:20px}
  .roi-big{font-size:clamp(36px,10vw,52px)}
  .ro-stats{grid-template-columns:1fr 1fr;gap:10px}
  .ro-stat{padding:14px;border-radius:12px}

  /* CLARITY */
  .clarity-layout{gap:12px;border-radius:20px}
  .cc{padding:28px 22px}

  /* PROOF GRID */
  .pg{grid-template-columns:1fr;gap:10px}
  .pf-filters{flex-wrap:wrap;gap:6px}
  .pf-btn{font-size:12px;padding:6px 14px}
  .pc{padding:20px 18px;border-radius:16px}

  /* TESTIMONIAL */
  .testi-inner{padding:60px 24px}
  .testi-q{font-size:clamp(18px,5.5vw,26px);line-height:1.5}

  /* PRICING */
  .pricing-card{padding:28px 22px;border-radius:24px}
  .pricing-nums{gap:20px}
  .pn-n{font-size:clamp(24px,7vw,32px)}
  .pricing-footer{flex-direction:column;gap:16px;padding-top:20px}
  .pricing-footer .btn-primary{width:100%;justify-content:center;border-radius:14px}

  /* CTA */
  .cta-btns{flex-direction:column;align-items:stretch;gap:12px}
  .cta-btns .btn-primary{justify-content:center;width:100%;border-radius:14px;padding:16px 24px;font-size:16px}
  .cta-btns .btn-ghost{justify-content:center;width:100%;border-radius:14px}
  .cta-h{font-size:clamp(30px,9vw,48px)}
  .cta-p{font-size:16px}

  /* FOOTER */
  .footer-top{grid-template-columns:1fr;gap:36px}
  .footer-inner{padding:0}
  .footer-bot{flex-direction:column;gap:8px;text-align:center}

  /* MODAL */
  .modal{border-radius:20px;margin:12px}
  .modal-hdr{padding:16px 20px}
  .modal-step{padding:22px 20px 28px}
  .modal-step-title{font-size:18px}
  .form-2col{grid-template-columns:1fr}
  .modal-btn-next,.modal-btn-back{border-radius:12px;padding:13px}

  /* MISC */
  .ro-stats{grid-template-columns:1fr 1fr}
  .form-2col{grid-template-columns:1fr}
  .exit-card{padding:28px 22px;border-radius:20px}
  .exit-stat-items{flex-direction:column;gap:0}
  .exit-stat-sep{display:none}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .rv{opacity:1;transform:none}
}
@media(hover:none),(max-width:768px){
  .hero-blob{display:none}
  .hero-grid{-webkit-mask-image:none;mask-image:none;opacity:.4}
  #nav{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(255,255,255,.97)}
  .hero-badge{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff}
}

/* ─── PAGE LOAD ─── */
@keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes bodyIn{from{opacity:0}to{opacity:1}}
/* body uses opacity-only intro — a transform on body would make it the containing block
   for position:fixed overlays, pinning them to page height instead of the viewport */
body{animation:bodyIn .55s var(--ease) both}
#nav{animation:pageIn .45s .04s var(--ease) both}
#hero .hero-left>*{animation:pageIn .6s var(--ease) both}
#hero .hero-left>*:nth-child(2){animation-delay:.08s}
#hero .hero-left>*:nth-child(3){animation-delay:.14s}
#hero .hero-left>*:nth-child(4){animation-delay:.18s}

/* ─── GLOBAL AMBIENT BACKGROUND ─── */
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 50% 32% at 88% 6%,rgba(224,29,18,.025),transparent);opacity:.7}

/* ─── VISUAL ENHANCEMENTS ─── */

/* Hero grid — sharper, fades at bottom */
.hero-grid{
  background-image:linear-gradient(rgba(17,24,39,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(17,24,39,.09) 1px,transparent 1px);
  background-size:52px 52px;
  opacity:1;
  -webkit-mask-image:radial-gradient(ellipse 100% 80% at 50% 0%,#000 40%,transparent 100%);
  mask-image:radial-gradient(ellipse 100% 80% at 50% 0%,#000 40%,transparent 100%);
}

/* Featured system card — static red glow (animation removed for perf) */
.sc.featured{position:relative;isolation:isolate;box-shadow:0 0 0 1.5px rgba(220,38,38,.4),0 10px 40px rgba(220,38,38,.14)}

/* Hero aurora — static color wash (rotation removed for perf) */
.hero-aurora{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 60% 50% at 65% 35%,rgba(220,38,38,.07),transparent 70%),
             radial-gradient(ellipse 40% 40% at 20% 70%,rgba(99,102,241,.05),transparent 70%);
  will-change:auto
}

/* Card shine sweep on hover */
.sc,.pc,.cm{overflow:hidden}
.sc::after,.pc::after{
  content:'';position:absolute;top:0;left:-80%;width:50%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);
  transform:skewX(-20deg);transition:left .7s var(--ease);pointer-events:none
}
.sc:hover::after,.pc:hover::after{left:160%}

/* Dark section noise texture — removed SVG filter for perf */
#demo-section,#testi,footer{position:relative}
#demo-section .demo-content,#testi .testi-inner,#testi .testi-bg,.footer-inner{position:relative;z-index:1}

/* Hero badge pulse ring */
.hero-badge-dot{animation:badgePulse 2.4s ease infinite}
@keyframes badgePulse{
  0%,100%{box-shadow:0 0 0 3px rgba(22,163,74,.15)}
  50%{box-shadow:0 0 0 6px rgba(22,163,74,0)}
}

/* Floating hero badges — glass effect */
.hero-float{
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  background:rgba(255,255,255,.92)!important;
  border:1px solid rgba(255,255,255,.8)!important;
  box-shadow:0 8px 32px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.6)!important
}

/* Ticker — stronger contrast */
.ti-n{color:var(--ink);font-weight:700}
.ti{border-right:1px solid var(--border2)}

/* System result tag — animated dot */
.sc-result::before{animation:resultBlink 2s ease infinite}
@keyframes resultBlink{0%,100%{opacity:1}50%{opacity:.4}}

/* Section number badges — tighter mono */
.pi-num,.ds-n,.hwb-step-num{font-feature-settings:'tnum'}

/* CTA section — stronger gradient */
#cta::before{background:radial-gradient(ellipse 80% 70% at 50% 100%,rgba(220,38,38,.08),transparent)!important}

/* Eyebrow line accent */
.eyebrow::before{background:linear-gradient(90deg,var(--red),#f87171);border-radius:2px}

/* Calendly booking styles — modal success */
.ms-cal{margin-top:20px;padding:20px;background:var(--red-bg);border:1px solid var(--red-border);border-radius:12px;text-align:center}
.ms-cal-label{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:12px;letter-spacing:-.01em}
.ms-cal-btn{
  display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;
  color:#fff;background:var(--red);border:none;padding:11px 22px;border-radius:9px;
  cursor:pointer;transition:background .2s,transform .2s,box-shadow .2s;letter-spacing:-.01em;width:100%;justify-content:center
}
.ms-cal-btn:hover{background:var(--red-s);transform:translateY(-1px);box-shadow:0 6px 20px rgba(220,38,38,.35)}
.ms-cal-note{font-family:var(--mono);font-size:11px;color:var(--ink3);margin-top:10px;letter-spacing:.04em}

/* CTA "or" divider and Calendly */
.cta-divider{display:flex;align-items:center;gap:16px;margin:8px auto;max-width:280px}
.cta-divider::before,.cta-divider::after{content:'';flex:1;height:1px;background:var(--border2)}
.cta-divider span{font-family:var(--mono);font-size:11px;color:var(--ink4);letter-spacing:.06em;flex-shrink:0}

/* Improved proof card arrow */
.pc-arrow{transition:background .2s,border-color .2s,color .2s,transform .2s}
.pc:hover .pc-arrow{transform:translateX(2px)}

/* Stats grid — staggered entrance */
.results-grid .rg:nth-child(1){transition-delay:.0s}
.results-grid .rg:nth-child(2){transition-delay:.08s}
.results-grid .rg:nth-child(3){transition-delay:.16s}
.results-grid .rg:nth-child(4){transition-delay:.24s}

/* Proof grid entrance stagger */
.pg .pc:nth-child(1){transition-delay:.0s}
.pg .pc:nth-child(2){transition-delay:.05s}
.pg .pc:nth-child(3){transition-delay:.1s}
.pg .pc:nth-child(4){transition-delay:.15s}
.pg .pc:nth-child(5){transition-delay:.2s}
.pg .pc:nth-child(6){transition-delay:.25s}

/* Nav CTA — slight gradient */
.nav-cta{background:linear-gradient(135deg,#1f2937,var(--ink))}
.nav-cta:hover{background:linear-gradient(135deg,#000,#111)!important}

/* Ticker number highlight */
.ti-n{
  font-size:14px!important;
  background:linear-gradient(135deg,var(--ink),#374151);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text
}

/* ROI output panel — glow on hover */
.roi-wrap:hover .roi-out{box-shadow:inset 0 0 40px rgba(220,38,38,.06)}
.roi-out{transition:box-shadow .4s}

/* Case study metrics — shimmer on hover */
.cm::after{
  content:'';position:absolute;inset:0;border-radius:12px;
  background:linear-gradient(135deg,transparent 40%,rgba(255,255,255,.04) 50%,transparent 60%);
  transform:translateX(-100%);transition:transform .6s var(--ease);pointer-events:none
}
.cm:hover::after{transform:translateX(100%)}

/* Improved scroll progress bar */
#progress{background:linear-gradient(90deg,var(--red),#f87171);box-shadow:0 0 8px rgba(220,38,38,.4)}

/* Smooth scrollbar */
html{scrollbar-width:thin;scrollbar-color:var(--border2) transparent}
::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border2);border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:var(--ink4)}

/* Footer slight gradient top */
footer{background:linear-gradient(180deg,#0d1117 0%,var(--ink) 100%)}

/* Pricing card glow on hover */
.pricing-card:hover{box-shadow:0 20px 60px rgba(0,0,0,.12),0 0 0 1px rgba(220,38,38,.08)!important;transform:translateY(-2px);transition:transform .3s var(--ease),box-shadow .3s}
.pricing-card{transition:transform .3s var(--ease),box-shadow .3s}

/* ─── WHATSAPP INTERACTIVE DEMO ─── */
.demo-hint{display:flex;align-items:flex-start;gap:8px;margin-top:20px;padding:12px 16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:12px;font-size:13px;color:rgba(255,255,255,.55);line-height:1.55}
.demo-hint svg{flex-shrink:0;margin-top:1px}
.wa-phone{background:#efeae2;border-radius:24px!important;overflow:hidden;width:100%;max-width:360px;height:540px;display:flex;flex-direction:column;box-shadow:0 32px 80px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.08);margin:0 auto}
.wa-hdr{background:#128C7E;padding:10px 14px;display:flex;align-items:center;gap:10px;flex-shrink:0}
.wa-hdr-left{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
.wa-av-wrap{position:relative;flex-shrink:0}
.wa-av{width:38px;height:38px;border-radius:50%!important;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;letter-spacing:-.01em}
.wa-online-dot{position:absolute;bottom:1px;right:1px;width:9px;height:9px;border-radius:50%;background:#25d366;border:2px solid #128C7E}
.wa-info{min-width:0}
.wa-name-line{font-size:14.5px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-status-line{font-size:11.5px;color:rgba(255,255,255,.8)}
.wa-hdr-actions{display:flex;gap:18px;flex-shrink:0}
.wa-hdr-icon{color:rgba(255,255,255,.8);cursor:pointer;display:flex;align-items:center}
.wa-body{flex:1;overflow-y:auto;padding:10px 10px 6px;display:flex;flex-direction:column;gap:3px;background:#efeae2}
.wa-body::-webkit-scrollbar{width:3px}
.wa-body::-webkit-scrollbar-thumb{background:rgba(0,0,0,.15);border-radius:3px}
.wa-date-div{text-align:center;margin:6px 0}
.wa-date-div span{background:rgba(255,255,255,.9);font-size:11px;color:#667781;font-weight:500;padding:3px 10px;border-radius:8px;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.wa-msg{display:flex;flex-direction:column;max-width:80%;animation:waMsgIn .18s ease}
.wa-msg.in{align-self:flex-start}
.wa-msg.out{align-self:flex-end}
@keyframes waMsgIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.wa-bubble{padding:7px 10px;border-radius:8px;font-size:13.5px;line-height:1.5;word-break:break-word}
.wa-msg.in .wa-bubble{background:#fff;color:#111;border-radius:0 8px 8px 8px;box-shadow:0 1px 2px rgba(0,0,0,.1)}
.wa-msg.out .wa-bubble{background:#d9fdd3;color:#111;border-radius:8px 0 8px 8px;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.wa-time-line{display:flex;align-items:center;gap:3px;font-size:11px;color:#667781;margin-top:2px}
.wa-msg.in .wa-time-line{padding-left:4px}
.wa-msg.out .wa-time-line{justify-content:flex-end;padding-right:4px}
.wa-typing-row{align-self:flex-start;animation:waMsgIn .18s ease}
.wa-typing-bub{background:#fff;padding:10px 14px;border-radius:0 12px 12px 12px;box-shadow:0 1px 2px rgba(0,0,0,.1);display:flex;align-items:center;gap:4px}
.wa-typing-bub span{width:6px;height:6px;border-radius:50%;background:#aab7b8;display:inline-block;animation:waTyp 1.2s ease infinite}
.wa-typing-bub span:nth-child(2){animation-delay:.15s}
.wa-typing-bub span:nth-child(3){animation-delay:.3s}
@keyframes waTyp{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.wa-bar{background:#f0f2f5;padding:8px 10px;display:flex;align-items:center;gap:8px;flex-shrink:0;border-top:1px solid rgba(0,0,0,.07)}
.wa-input{flex:1;background:#fff;border:none;border-radius:24px!important;padding:9px 16px;font-size:14px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#111;outline:none;box-shadow:0 1px 2px rgba(0,0,0,.09)}
.wa-input::placeholder{color:#aab7b8}
.wa-input:disabled{opacity:.6}
.wa-send-btn{width:44px;height:44px;border-radius:50%!important;background:#00a884;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s,transform .1s;box-shadow:0 2px 8px rgba(0,168,132,.3)}
.wa-send-btn:hover{background:#009975;transform:scale(1.05)!important}
.wa-send-btn:active{transform:scale(.95)!important}
.wa-send-btn:disabled{background:#aab7b8!important;box-shadow:none;cursor:default;transform:none!important}
.wa-mic-btn{width:34px;height:34px;border-radius:50%!important;background:transparent;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#aab7b8;flex-shrink:0;transition:color .15s,background .15s,transform .15s}
.wa-mic-btn:hover{color:#667781;background:rgba(0,0,0,.07)}
.wa-mic-btn.recording{color:#fff;background:#dc2626;transform:scale(1.08)}
.wa-rec-ui{display:none;flex:1;align-items:center;gap:8px;padding:0 4px;min-width:0}
.wa-rec-ui.active{display:flex}
.wa-wave-canvas{flex:1;min-width:0;height:36px;display:block}
.wa-rec-timer{font-family:var(--mono);font-size:11px;color:#dc2626;font-weight:600;flex-shrink:0;min-width:28px}
.wa-bar.recording .wa-input{display:none}
.wa-bar.recording .wa-rec-ui{display:flex}
.demo-voice-row{display:flex;justify-content:flex-end;margin-bottom:10px;max-width:360px;margin-left:auto;margin-right:auto}
.wa-voice-btn{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:8px!important;padding:6px 12px;font-size:11px;font-weight:600;color:rgba(255,255,255,.6);cursor:pointer;display:flex;align-items:center;gap:5px;letter-spacing:.02em;transition:background .15s,color .15s,border-color .15s;white-space:nowrap}
.wa-voice-btn:hover{background:rgba(255,255,255,.14);color:rgba(255,255,255,.9)}
.wa-voice-btn.on{background:rgba(37,211,102,.15);border-color:rgba(37,211,102,.4);color:#25d366}
.demo-voice-row{gap:8px}
.demo-ai-badge{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:rgba(37,211,102,.9);letter-spacing:.02em;white-space:nowrap}
.demo-ai-dot-live{width:7px;height:7px;border-radius:50%;background:rgba(37,211,102,.9);flex-shrink:0;animation:aiPulse 1.8s ease-in-out infinite}
@keyframes aiPulse{0%,100%{opacity:1}50%{opacity:.6}}

/* ─── GLOBAL RADIUS SOFTENING ─── */
/* Buttons */
.btn-primary,.btn-ghost,.btn-play,.modal-btn-next,.modal-btn-back,.ms-cal-btn,.ms-close,.nav-cta{border-radius:12px!important}
/* Large cards */
.sc{border-radius:24px!important}
.sc.featured::before{border-radius:25.5px!important}
.hero-card,.pricing-card{border-radius:24px!important}
.modal,.exit-card,.detail-panel{border-radius:28px!important}
.dp-hdr{border-radius:28px 28px 0 0!important}
.hwb-panel{border-radius:28px!important}
.conv-window{border-radius:20px!important}
/* Medium cards */
.pc{border-radius:20px!important}
.prob-stats,.serve-aside,.case-cta-strip,.results-grid,.roi-wrap,.clarity-layout{border-radius:20px!important}
.cm,.case-breakdown,.case-auth,.case-result-strip{border-radius:16px!important}
.prob-callout,.pi{border-radius:14px!important}
.ms-cal{border-radius:16px!important}
/* Small elements */
.form-row input,.form-row select,.form-row textarea{border-radius:12px!important}
.hc-result,.ro-stat,.ro-payback,.hwb-advantage{border-radius:14px!important}
.hwb-item{border-radius:14px!important}
.hwb-step-num{border-radius:12px!important}
.sc-icon,.hf-icon{border-radius:14px!important}
.ca-av,.testi-av{border-radius:14px!important}
.ms-check{border-radius:16px!important}
.dp-col,.dp-kpi{border-radius:14px!important}
.dp-close,.modal-progress-close,.exit-close,.sticky-dismiss{border-radius:10px!important}
.ms-step-num{border-radius:8px!important}
.sr-badge,.case-tag{border-radius:8px!important}
.hero-float{border-radius:18px!important}
.pc-arrow{border-radius:8px!important}

/* OUR WORK */
.ow-hdr{margin-bottom:72px}
.ow-tier{display:flex;align-items:center;gap:16px;margin-bottom:32px}
.ow-tier::after{content:'';flex:1;height:1px;background:var(--border)}
.ow-tier-label{font-family:var(--mono);font-size:11px;font-weight:500;color:var(--ink4);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.ow-hero{display:grid;grid-template-columns:340px 1fr;background:var(--bg);border:1px solid var(--border);border-radius:20px;overflow:hidden;margin-bottom:32px;box-shadow:var(--shadow-lg)}
.ow-hero-left{background:var(--ink);padding:40px;display:flex;flex-direction:column;gap:20px}
.ow-hero-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(22,163,74,.15);color:#4ade80;font-size:11px;font-weight:600;padding:4px 10px;border-radius:100px;letter-spacing:.04em;text-transform:uppercase;width:fit-content}
.ow-hero-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:#4ade80;flex-shrink:0}
.ow-hero-name{font-size:26px;font-weight:800;color:#fff;letter-spacing:-.03em;line-height:1.1}
.ow-hero-type{font-size:12px;color:rgba(255,255,255,.4);font-family:var(--mono);line-height:1.5}
.ow-hero-metrics{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.ow-hero-metric{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;background:rgba(255,255,255,.06);border-radius:12px;border:1px solid rgba(255,255,255,.08)}
.ow-m-num{font-size:28px;font-weight:800;color:#fff;letter-spacing:-.04em;line-height:1;flex-shrink:0}
.ow-m-label{font-size:12px;color:rgba(255,255,255,.5);line-height:1.4;padding-top:4px}
.ow-hero-right{padding:0;background:var(--bg);overflow:hidden}
/* Thumbnail browser window (screenshot, no iframe) */
.ow-thumb-browser{border-radius:12px;overflow:hidden;border:1px solid var(--border);box-shadow:0 8px 32px rgba(0,0,0,.08)}
.ow-thumb-browser.mini{border-radius:10px;margin-bottom:0}
.ow-bw-bar{background:#f0f0f0;padding:9px 12px;display:flex;align-items:center;gap:8px;border-bottom:1px solid #e0e0e0}
.ow-bw-dots{display:flex;gap:5px;flex-shrink:0}
.ow-bw-dots span{width:10px;height:10px;border-radius:50%;display:block}
.ow-bw-dots span:nth-child(1){background:#ff5f57}
.ow-bw-dots span:nth-child(2){background:#febc2e}
.ow-bw-dots span:nth-child(3){background:#28c840}
.ow-bw-url{flex:1;background:#fff;border-radius:5px;padding:3px 10px;font-size:10px;font-family:var(--mono);color:var(--ink3);border:1px solid #e0e0e0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ow-thumb-img-wrap{position:relative;overflow:hidden;background:#f0f0f0;height:340px}
.ow-thumb-img-wrap.mini{height:170px}
.ow-thumb-img-wrap img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;transition:transform .4s ease}
.ow-thumb-overlay{position:absolute;inset:0;background:rgba(0,0,0,0);display:flex;align-items:center;justify-content:center;transition:background .25s}
.ow-thumb-overlay span{background:rgba(0,0,0,.75);color:#fff;font-size:13px;font-weight:600;padding:8px 18px;border-radius:100px;opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s;font-family:var(--mono);letter-spacing:.02em}
.ow-thumb-overlay.mini span{font-size:11px;padding:6px 14px}
[data-proj-preview]:hover .ow-thumb-overlay{background:rgba(0,0,0,.3)}
[data-proj-preview]:hover .ow-thumb-overlay span{opacity:1;transform:translateY(0)}
[data-proj-preview]:hover .ow-thumb-img-wrap img{transform:scale(1.03)}
[data-proj-preview]{cursor:pointer}
.ow-psr{display:flex;flex-direction:column}
.ow-psr-item{padding:18px 0}
.ow-psr-item:not(:last-child){border-bottom:1px solid var(--border)}
.ow-psr.compact .ow-psr-item{padding:14px 0}
.ow-psr-label{font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;margin-bottom:6px;font-family:var(--mono)}
.ow-psr-label.problem{color:#ef4444}
.ow-psr-label.solution{color:var(--blue)}
.ow-psr-label.result{color:var(--green)}
.ow-psr-item p{font-size:14px;color:var(--ink2);line-height:1.65;margin:0}
.ow-mid-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:0}
.ow-card{background:var(--bg);border:1px solid var(--border);border-radius:20px;padding:32px;display:flex;flex-direction:column;gap:20px;box-shadow:var(--shadow)}
.ow-card.dark{background:var(--ink);border-color:transparent}
.ow-card-head{display:flex;flex-direction:column;gap:6px}
.ow-card-tag{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;font-family:var(--mono);color:var(--red)}
.ow-card.dark .ow-card-tag{color:#f87171}
.ow-card-name{font-size:22px;font-weight:800;letter-spacing:-.03em;color:var(--ink);line-height:1.1}
.ow-card.dark .ow-card-name{color:#fff}
.ow-card-type{font-size:12px;color:var(--ink4);font-family:var(--mono)}
.ow-card.dark .ow-card-type{color:rgba(255,255,255,.32)}
.ow-card.dark .ow-psr-item p{color:rgba(255,255,255,.58)}
.ow-card.dark .ow-psr-item{border-color:rgba(255,255,255,.08)}
.ow-card.dark .ow-psr-label.problem{color:#fca5a5}
.ow-card.dark .ow-psr-label.solution{color:#93c5fd}
.ow-card.dark .ow-psr-label.result{color:#86efac}
.ow-card-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:4px}
.ow-chip{font-size:11px;font-weight:500;color:var(--ink3);background:var(--bg3);border:1px solid var(--border);padding:3px 9px;border-radius:100px;font-family:var(--mono)}
.ow-card.dark .ow-chip{color:rgba(255,255,255,.48);background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.1)}
.ow-voice-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.ow-voice-card{background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:14px}
.ow-voice-icon{width:40px;height:40px;background:var(--red-bg);border:1px solid var(--red-border);border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--red);flex-shrink:0}
.ow-voice-name{font-size:18px;font-weight:700;letter-spacing:-.02em;color:var(--ink);line-height:1.2}
.ow-voice-desc{font-size:13px;color:var(--ink3);line-height:1.65;flex:1}
.ow-voice-demo-btn{margin-top:4px;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;padding:11px 18px;background:var(--ink);color:#fff;border-radius:10px;font-size:13.5px;font-weight:600;letter-spacing:-.01em;text-decoration:none;transition:background .2s,transform .15s,box-shadow .2s}
.ow-voice-demo-btn:hover{background:#000;transform:translateY(-1px);box-shadow:0 6px 20px rgba(220,38,38,.22)}
.ow-voice-demo-pulse{width:8px;height:8px;border-radius:50%;background:#34d399;box-shadow:0 0 0 0 rgba(52,211,153,.7);animation:voicePulse 1.8s infinite}
@keyframes voicePulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.6)}70%{box-shadow:0 0 0 7px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
/* Live chatbot demo modal */
#chat-demo-overlay{position:fixed;inset:0;z-index:950;background:rgba(24,20,16,.6);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:opacity .3s;display:flex;align-items:center;justify-content:center;padding:20px}
#chat-demo-overlay.open{opacity:1;pointer-events:auto}
#chat-demo-modal{background:#fff;border-radius:20px;width:100%;max-width:440px;height:min(680px,calc(100dvh - 40px));box-shadow:var(--shadow-xl);overflow:hidden;display:flex;flex-direction:column;transform:translateY(24px) scale(.97);transition:transform .4s var(--ease)}
#chat-demo-overlay.open #chat-demo-modal{transform:none}
#chat-demo-bar{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:var(--ink);flex-shrink:0}
#chat-demo-title{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;font-weight:500;color:#fff;letter-spacing:.01em}
#chat-demo-close{width:28px;height:28px;border-radius:7px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.6);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
#chat-demo-close:hover{background:rgba(255,255,255,.16);color:#fff}
#chat-demo-frame-wrap{flex:1;position:relative;background:var(--bg2)}
#chat-demo-frame-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ow-web-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ow-web-card{background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:0;overflow:hidden;display:flex;flex-direction:column;gap:0;transition:border-color .2s,box-shadow .2s}
.ow-web-card:hover{border-color:var(--border2);box-shadow:var(--shadow-md)}
.ow-web-card .ow-web-name,.ow-web-card .ow-web-type,.ow-web-card .ow-web-link,.ow-web-card .ow-own-pill{padding-left:16px;padding-right:16px}
.ow-web-card .ow-web-name{padding-top:14px}
.ow-web-card .ow-web-link{padding-bottom:14px;margin-top:auto}
.ow-web-card.own .ow-own-pill{padding-bottom:14px}
.ow-web-card .ow-thumb-browser{border-radius:0;border:none;border-bottom:1px solid var(--border)}
.ow-web-card:hover{border-color:var(--border2);box-shadow:var(--shadow-md)}
.ow-web-name{font-size:16px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.ow-web-type{font-size:12px;color:var(--ink4);font-family:var(--mono)}
.ow-web-card.own{background:var(--red-bg);border-color:var(--red-border)}
.ow-web-card.own .ow-web-name{color:var(--red)}
.ow-own-pill{font-size:10px;font-weight:600;color:var(--red);background:rgba(220,38,38,.1);padding:2px 8px;border-radius:100px;font-family:var(--mono);letter-spacing:.04em;width:fit-content;margin-top:4px}
.ow-web-link{font-family:var(--mono);font-size:11px;color:var(--red);margin-top:auto;padding-top:8px;font-weight:600;letter-spacing:.02em}
a.ow-web-card{color:inherit}
a.ow-web-card:hover{border-color:var(--red);box-shadow:0 4px 20px rgba(220,38,38,.12)}
.ow-work-footer{display:flex;flex-direction:column;align-items:center;gap:14px;padding-top:48px;border-top:1px solid var(--border);margin-top:64px}
.ow-work-footer p{font-size:15px;color:var(--ink3)}
@media(max-width:900px){
  .ow-hero{grid-template-columns:1fr}
  .ow-mid-grid,.ow-voice-grid{grid-template-columns:1fr}
  .ow-web-grid{grid-template-columns:1fr 1fr}
  .ow-hero-left{padding:28px}
  .ow-hero-right{padding:28px}
  .ow-card{padding:24px}
}
@media(max-width:540px){
  .ow-web-grid{grid-template-columns:1fr}
}
/* PAGE HERO (sub-page banners) */
.page-hero{padding:120px 40px 80px;position:relative;overflow:hidden;border-bottom:1px solid var(--border)}
.page-hero-inner{max-width:1200px;margin:0 auto;position:relative;z-index:1}
.page-hero .eyebrow{margin-bottom:20px}
.page-hero .sec-h{margin-bottom:12px}
.page-hero .sec-p{max-width:560px}

/* How It Works — clean light with indigo tint */
.page-hero.hiw{background:var(--bg)}
.page-hero.hiw::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 90% 50%,rgba(99,102,241,.06),transparent);pointer-events:none}

/* Case Study — dark */
.page-hero.dark-hero{background:var(--ink);border-bottom:none}
.page-hero.dark-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 60% at 50% 100%,rgba(220,38,38,.1),transparent);pointer-events:none}
.page-hero.dark-hero .eyebrow{color:#f87171}
.page-hero.dark-hero .eyebrow::before{background:#f87171}
.page-hero.dark-hero .sec-h{color:#fff}
.page-hero.dark-hero .muted{color:rgba(255,255,255,.45)}
.page-hero.dark-hero .sec-p{color:rgba(255,255,255,.6)}

/* Our Work — dark dot-grid */
.page-hero.ow-hero-pg{background:var(--ink);border-bottom:none;background-image:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1px);background-size:28px 28px}
.page-hero.ow-hero-pg::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 50% 60% at 20% 50%,rgba(220,38,38,.08),transparent);pointer-events:none}
.page-hero.ow-hero-pg .eyebrow{color:#f87171}
.page-hero.ow-hero-pg .eyebrow::before{background:#f87171}
.page-hero.ow-hero-pg .sec-h{color:#fff}
.page-hero.ow-hero-pg .muted{color:rgba(255,255,255,.45)}
.page-hero.ow-hero-pg .sec-p{color:rgba(255,255,255,.6)}

/* Pricing — light with red top accent */
.page-hero.pricing-pg{background:var(--bg2);border-top:4px solid var(--red)}
.page-hero.pricing-pg::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 70% at 50% 0%,rgba(220,38,38,.05),transparent);pointer-events:none}

@media(max-width:768px){
  .page-hero{padding:100px 24px 60px}
}

/* About page hero */
.page-hero.about-pg{background:var(--bg);border-bottom:1px solid var(--border)}
.page-hero.about-pg::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 60% at 80% 50%,rgba(220,38,38,.05),transparent);pointer-events:none}

/* PERF CHART — animated before/after bars (case study) */
.perf-chart{background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:28px;margin:28px 0}
.perf-chart-title{font-family:var(--mono);font-size:11px;color:var(--ink4);text-transform:uppercase;letter-spacing:.07em;margin-bottom:22px}
.perf-row{display:grid;grid-template-columns:140px 1fr;align-items:center;gap:16px;margin-bottom:14px}
.perf-row:last-child{margin-bottom:0}
.perf-label{font-size:12px;font-weight:600;color:var(--ink3)}
.perf-tracks{display:flex;flex-direction:column;gap:6px}
.perf-bar{height:28px;border-radius:7px;display:flex;align-items:center;padding:0 12px;font-family:var(--mono);font-size:11px;font-weight:500;width:0;transition:width 1.5s cubic-bezier(.16,1,.3,1);overflow:hidden;white-space:nowrap;min-width:0}
.perf-bar.before{background:var(--bg3);color:var(--ink4);border:1px solid var(--border)}
.perf-bar.after{background:var(--red);color:#fff}
.rv.in .perf-bar{width:var(--w)}
@media(max-width:600px){.perf-row{grid-template-columns:1fr;gap:8px}.perf-label{margin-bottom:4px}}

/* OUR WORK compact text */
.ow-psr-text{font-family:var(--mono);font-size:12px;color:var(--ink4);line-height:1.6;margin:2px 0 0}
.ow-card.dark .ow-psr-text{color:rgba(255,255,255,.4)}

/* ABOUT PAGE */
.about-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--border);border-radius:16px;overflow:hidden;margin:56px 0}
.as-item{text-align:center;padding:40px 24px;border-right:1px solid var(--border)}
.as-item:last-child{border-right:none}
.as-n{font-size:clamp(32px,3.5vw,50px);font-weight:800;letter-spacing:-.04em;color:var(--ink);line-height:1}
.as-l{font-size:12px;color:var(--ink4);font-family:var(--mono);margin-top:8px}
.about-caps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:48px}
.about-cap{background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:24px;transition:border-color .2s,box-shadow .2s}
.about-cap:hover{border-color:var(--border2);box-shadow:var(--shadow-md)}
.about-cap-icon{width:40px;height:40px;border-radius:10px;background:var(--red-bg);border:1px solid var(--red-border);display:flex;align-items:center;justify-content:center;margin-bottom:14px;color:var(--red)}
.about-cap-h{font-size:14px;font-weight:700;color:var(--ink);line-height:1.3}
.about-cap-sub{font-size:11px;color:var(--ink4);font-family:var(--mono);margin-top:6px}
.about-why{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
.about-why-card{border:1px solid var(--border);border-radius:14px;padding:32px;background:var(--bg)}
.about-why-num{font-family:var(--mono);font-size:11px;color:var(--red);margin-bottom:14px;letter-spacing:.04em;text-transform:uppercase}
.about-why-h{font-size:18px;font-weight:700;color:var(--ink);line-height:1.3}
.about-why-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.about-tag{font-size:11px;font-family:var(--mono);color:var(--ink4);background:var(--bg3);border:1px solid var(--border);border-radius:100px;padding:3px 10px}
@media(max-width:900px){
  .about-stats{grid-template-columns:repeat(2,1fr)}
  .as-item:nth-child(2){border-right:none}
  .as-item:nth-child(3){border-right:1px solid var(--border)}
  .as-item:nth-child(1),.as-item:nth-child(2){border-bottom:1px solid var(--border)}
  .about-caps{grid-template-columns:repeat(2,1fr)}
  .about-why{grid-template-columns:1fr}
}

/* VIEW TOGGLE */
.view-toggle{display:flex;position:relative;background:var(--bg3);border:1px solid var(--border);border-radius:12px;padding:4px;gap:4px;width:fit-content;margin:32px auto 0}
.vt-pill{position:absolute;top:4px;bottom:4px;border-radius:8px;background:var(--bg);box-shadow:var(--shadow);transition:transform .4s cubic-bezier(.16,1,.3,1),width .4s cubic-bezier(.16,1,.3,1);pointer-events:none;z-index:0;will-change:transform,width}
.vt-btn{position:relative;z-index:1;font-family:var(--sans);font-size:13px;font-weight:600;color:var(--ink4);background:none;border:none;padding:9px 24px;border-radius:8px;cursor:pointer;transition:color .3s;white-space:nowrap}
.vt-btn.on{color:var(--ink)}
.vt-panel{margin-top:48px;opacity:0;transition:opacity .25s ease;pointer-events:none;display:none}
.vt-panel.active{opacity:1;pointer-events:auto;display:block}
.vt-panel.fade-in{animation:vtFadeIn .38s cubic-bezier(.16,1,.3,1) both}
@keyframes vtFadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.view-panel{margin-top:48px}

/* SIMPLE FLOW */
.simple-flow{display:flex;align-items:flex-start;gap:0;margin-top:40px}
.sf-step{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;flex:1;padding:0 8px}
.sf-icon{width:56px;height:56px;border-radius:16px;border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--ink3);background:var(--bg)}
.sf-icon.red{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 6px 20px rgba(220,38,38,.3)}
.sf-label{font-size:13px;font-weight:700;color:var(--ink)}
.sf-sub{font-size:11px;color:var(--ink4);font-family:var(--mono)}
.sf-time{font-family:var(--mono);font-size:10px;color:var(--red);font-weight:600;background:var(--red-bg);border:1px solid var(--red-border);padding:2px 10px;border-radius:100px}
.simple-fact-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.sfs-item{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:24px;text-align:center}
.sfs-n{font-size:32px;font-weight:800;letter-spacing:-.04em;color:var(--ink)}
.sfs-l{font-size:11px;color:var(--ink4);font-family:var(--mono);margin-top:6px}

/* TECH VIEW */
.tech-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tech-card{background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:24px}
.tech-card-tag{font-family:var(--mono);font-size:10px;color:var(--red);text-transform:uppercase;letter-spacing:.07em;margin-bottom:10px}
.tech-card-h{font-size:15px;font-weight:700;color:var(--ink);margin-bottom:16px}
.tech-bar-row{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.tech-bar-key{font-size:11px;font-family:var(--mono);color:var(--ink4);width:130px;flex-shrink:0}
.tech-bar-track{flex:1;height:5px;background:var(--bg3);border-radius:3px;overflow:hidden}
.tech-bar-fill{height:100%;border-radius:3px;background:var(--red);width:0;transition:width 1.4s var(--ease)}
.rv.in .tech-bar-fill{width:var(--w)}
.tech-bar-val{font-family:var(--mono);font-size:10px;color:var(--ink3);width:32px;text-align:right;flex-shrink:0}
.tech-stack-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.tech-pill{font-family:var(--mono);font-size:11px;color:var(--ink3);background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:4px 10px}
.tech-full{grid-column:span 2}
.tech-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;gap:0;align-items:center;margin-top:16px}
.tf-box{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:10px 8px;font-family:var(--mono);font-size:10px;color:var(--ink3);line-height:1.5;text-align:center}
.tf-box.hl{border-color:var(--red);color:var(--red);background:var(--red-bg)}
.tf-arrow{text-align:center;color:var(--ink4);font-size:11px;padding:0 4px;font-family:var(--mono)}
@media(max-width:768px){
  .tech-grid{grid-template-columns:1fr}
  .tech-full{grid-column:span 1}
  .simple-flow{grid-template-columns:1fr 1fr;gap:28px}
  .simple-flow::before{display:none}
  .tech-flow{grid-template-columns:1fr;gap:6px}
  .tf-arrow{transform:rotate(90deg);display:flex;justify-content:center}
}

/* DEMO PIPELINE */
.demo-pipeline{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:16px;margin-top:16px;display:none}
.demo-pipeline.active{display:block}
.pipeline-hdr{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-family:var(--mono);font-size:10px;color:var(--ink4);text-transform:uppercase;letter-spacing:.07em}
.pipeline-hdr-dot{width:6px;height:6px;border-radius:50%;background:var(--red);flex-shrink:0}
.dp-stages{display:flex;flex-direction:column;gap:3px}
.dp-stage{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:7px;transition:background .15s}
.dp-dot{width:7px;height:7px;border-radius:50%;background:var(--border2);flex-shrink:0;transition:background .2s,box-shadow .2s}
.dp-stage-label{font-family:var(--mono);font-size:11px;color:var(--ink4);transition:color .2s;flex:1}
.dp-check{font-size:10px;color:var(--green);opacity:0;transition:opacity .2s;font-weight:700}
.dp-stage.active{background:var(--red-bg)}
.dp-stage.active .dp-dot{background:var(--red);box-shadow:0 0 0 3px rgba(220,38,38,.15);animation:pulseD .9s ease infinite}
.dp-stage.active .dp-stage-label{color:var(--ink2)}
.dp-stage.done .dp-dot{background:var(--green);animation:none;box-shadow:none}
.dp-stage.done .dp-stage-label{color:var(--ink4)}
.dp-stage.done .dp-check{opacity:1}
@keyframes pulseD{0%,100%{box-shadow:0 0 0 2px rgba(220,38,38,.2)}50%{box-shadow:0 0 0 5px rgba(220,38,38,.35)}}

/* FIX: class aliases so HTML and CSS match */
.tech-bar-label{font-size:11px;font-family:var(--mono);color:var(--ink4);width:130px;flex-shrink:0}
.tech-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.tech-full-h{font-size:15px;font-weight:700;color:var(--ink);margin-bottom:10px;letter-spacing:-.02em}
.tech-full-p{font-size:13px;color:var(--ink3);line-height:1.65;margin:0 0 16px}
.sf-arrow{display:flex;align-items:center;justify-content:center;color:var(--ink4);font-size:18px;padding-bottom:28px;align-self:flex-start;padding-top:18px;font-weight:300;flex-shrink:0;width:24px}
.simple-fact-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
.sfs-n{display:block;font-size:32px;font-weight:800;letter-spacing:-.04em;color:var(--ink)}
.sfs-l{display:block;font-size:11px;color:var(--ink4);font-family:var(--mono);margin-top:6px}
@media(max-width:768px){.simple-fact-strip{grid-template-columns:repeat(2,1fr)}.simple-flow{flex-wrap:wrap;gap:24px}.sf-step{flex:1 1 calc(50% - 48px)}.sf-arrow{display:none}}

/* ─── BUTTON ANIMATIONS ─── */
/* Ripple */
.btn-primary,.btn-ghost,.nav-cta,.modal-btn-next,.modal-btn-back{position:relative;overflow:hidden}
.btn-ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.28);transform:scale(0);width:90px;height:90px;margin:-45px 0 0 -45px;animation:rippleOut .6s ease-out forwards;pointer-events:none}
@keyframes rippleOut{to{transform:scale(3.5);opacity:0}}

/* Hover lifts */
.btn-primary{transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s}
.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 28px rgba(220,38,38,.35)}
.btn-primary:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 8px rgba(220,38,38,.2)}
.btn-ghost{transition:transform .18s var(--ease),border-color .18s,color .18s}
.btn-ghost:hover:not(:disabled){transform:translateY(-2px)}
.btn-ghost:active:not(:disabled){transform:translateY(0)}
.nav-cta{transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s}
.nav-cta:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(220,38,38,.25)}

/* Demo tabs pulse on first render */
.demo-tab{transition:background .15s,color .15s,transform .15s,box-shadow .15s}
.demo-tab:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.07)}
.demo-tab:active{transform:scale(.97)}

/* Tilt cards hover lift */
.tilt{transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.tilt:hover{box-shadow:var(--shadow-lg)}

/* WA send button pulse */
.wa-send-btn{transition:transform .15s,box-shadow .15s}
.wa-send-btn:hover{transform:scale(1.08);box-shadow:0 4px 16px rgba(37,211,102,.35)}
.wa-send-btn:active{transform:scale(.95)}

/* Modal buttons */
.modal-btn-next,.modal-btn-back{transition:transform .15s var(--ease),box-shadow .15s,opacity .15s}
.modal-btn-next:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 16px rgba(220,38,38,.25)}
.modal-btn-next:active:not(:disabled){transform:translateY(0)}

/* View toggle animated switch */
.vt-btn{transition:color .25s}
.vt-btn:active{transform:scale(.97)}

/* Sticky bar button */
#sticky-bar .btn-primary{animation:none}

/* Nav links underline slide */
.nav-links a{position:relative}
.nav-links a::after{content:'';position:absolute;left:0;bottom:-2px;width:0;height:1.5px;background:var(--ink);border-radius:2px;transition:width .22s var(--ease)}
.nav-links a:hover::after{width:100%}

/* ─── MOBILE OPTIMIZATION ─── */
@media(max-width:768px){
  /* Nav */
  .nav-links{display:none}
  .nav-drawer{display:flex}
  .nav-ham{display:flex}
  .nav-cta{font-size:12px;padding:8px 14px}
  /* Page hero */
  .page-hero{padding:90px 20px 56px}
  /* Sections */
  .sec{padding:56px 20px}
  /* About stats */
  .about-stats{margin:32px 0}
  .as-item{padding:24px 16px}
  .as-n{font-size:36px}
  /* About caps 2 cols on mobile */
  .about-caps{grid-template-columns:1fr 1fr;gap:12px}
  .about-cap{padding:18px}
  /* About why full width */
  .about-why{grid-template-columns:1fr}
  /* Toggle */
  .view-toggle{width:100%;max-width:260px}
  /* Perf bars */
  .perf-row{grid-template-columns:1fr;gap:6px}
  /* Systems grid */
  .sys-grid{grid-template-columns:1fr}
  /* HWB grid */
  .hwb-grid{grid-template-columns:1fr}
  /* Prob grid */
  .prob-2col{grid-template-columns:1fr}
  /* Serve layout */
  .serve-layout{grid-template-columns:1fr}
  /* Demo */
  .demo-content{grid-template-columns:1fr;gap:32px}
  .demo-right{display:flex;justify-content:center}
  .demo-left{order:2}
  .demo-right{order:1}
  /* WA phone */
  .wa-phone{width:100%;max-width:100%;border-radius:16px;height:460px}
  /* ROI */
  .roi-wrap{grid-template-columns:1fr}
  /* Clarity */
  .clarity-layout{grid-template-columns:1fr}
  /* Results */
  .results-grid{grid-template-columns:repeat(2,1fr)}
  /* Footer */
  .footer-top{grid-template-columns:1fr;gap:32px}
  /* Proof grid */
  .proof-grid{grid-template-columns:1fr}
  /* Our work */
  .ow-hero{grid-template-columns:1fr}
  .ow-mid-grid,.ow-voice-grid{grid-template-columns:1fr}
  .ow-web-grid{grid-template-columns:1fr 1fr}
  /* CTA */
  .cta-btns{flex-direction:column;align-items:center;gap:12px}
  .cta-btns .btn-primary,.cta-btns .btn-ghost{width:100%;max-width:280px;justify-content:center}
  /* Sticky bar */
  .sticky-inner{flex-direction:column;gap:10px;text-align:center}
  .sticky-text{font-size:12px}
}

@media(max-width:480px){
  /* Nav */
  .logo-name{display:none}
  /* Hero */
  .hero-2col{grid-template-columns:1fr}
  .hero-right{display:none}
  /* Stats */
  .results-grid{grid-template-columns:1fr 1fr}
  /* Our work web grid */
  .ow-web-grid{grid-template-columns:1fr}
  /* About caps */
  .about-caps{grid-template-columns:1fr}
  /* Hamburger menu — show icon hint */
  .nav-i{gap:12px}
}

/* ─── ABOUT PLAY DEMO MODAL ─── */
#play-overlay{position:fixed;inset:0;background:rgba(10,10,10,.75);backdrop-filter:blur(12px);z-index:900;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s}
#play-overlay.open{opacity:1;pointer-events:all}
.play-modal{background:#fff;border-radius:24px;padding:40px;max-width:540px;width:calc(100% - 48px);position:relative;box-shadow:0 40px 100px rgba(0,0,0,.25)}
.play-modal-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border:none;background:var(--bg3);border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--ink3);transition:background .15s}
.play-modal-close:hover{background:var(--border)}
.play-modal-eyebrow{font-family:var(--mono);font-size:11px;color:var(--red);text-transform:uppercase;letter-spacing:.07em;margin-bottom:12px}
.play-modal-h{font-size:22px;font-weight:800;color:var(--ink);letter-spacing:-.03em;margin-bottom:24px;line-height:1.2}
/* Animated chat preview inside play modal */
.play-chat{background:var(--bg2);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:10px;min-height:180px}
.play-msg{display:flex;flex-direction:column;gap:4px;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s}
.play-msg.show{opacity:1;transform:translateY(0)}
.pm-bubble{padding:10px 14px;border-radius:12px;font-size:14px;line-height:1.5;max-width:80%}
.pm-bubble.out{background:var(--ink);color:#fff;border-bottom-right-radius:4px;align-self:flex-end}
.pm-bubble.in{background:#fff;color:var(--ink);border:1px solid var(--border);border-bottom-left-radius:4px}
.pm-label{font-family:var(--mono);font-size:10px;color:var(--ink4)}
.pm-label.right{text-align:right}
.play-typing{display:flex;align-items:center;gap:6px;padding:10px 14px;background:#fff;border:1px solid var(--border);border-radius:12px;border-bottom-left-radius:4px;width:fit-content;opacity:0;transition:opacity .3s}
.play-typing.show{opacity:1}
.play-typing span{width:6px;height:6px;border-radius:50%;background:var(--ink3);animation:typDot 1.2s ease infinite}
.play-typing span:nth-child(2){animation-delay:.2s}
.play-typing span:nth-child(3){animation-delay:.4s}
@keyframes typDot{0%,80%,100%{transform:scale(.8);opacity:.5}40%{transform:scale(1.1);opacity:1}}
.play-pipeline-strip{display:flex;align-items:center;gap:6px;margin-top:16px;flex-wrap:wrap}
.pps-step{display:flex;align-items:center;gap:5px;font-family:var(--mono);font-size:10px;color:var(--ink4);background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:4px 8px;opacity:.4;transition:opacity .3s,border-color .3s,color .3s}
.pps-step.active{opacity:1;color:var(--red);border-color:var(--red-border);background:var(--red-bg)}
.pps-step.done{opacity:1;color:var(--green);border-color:rgba(22,163,74,.2);background:rgba(22,163,74,.06)}
.play-foot{display:flex;align-items:center;gap:8px;margin-top:18px;font-family:var(--mono);font-size:12px;color:var(--green);background:var(--green-bg);border:1px solid rgba(21,146,74,.18);border-radius:10px;padding:10px 14px;opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s}
.play-foot.show{opacity:1;transform:translateY(0)}
.play-foot-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px var(--green-bg);flex-shrink:0}
.pps-dot{width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}

/* ─── ENHANCED SECTION ANIMATIONS ─── */
/* Stagger children of rv grids */
.rv .about-cap:nth-child(1),.rv .sc:nth-child(1),.rv .pc:nth-child(1){transition-delay:.05s}
.rv .about-cap:nth-child(2),.rv .sc:nth-child(2),.rv .pc:nth-child(2){transition-delay:.12s}
.rv .about-cap:nth-child(3),.rv .sc:nth-child(3),.rv .pc:nth-child(3){transition-delay:.19s}
.rv .about-cap:nth-child(4),.rv .pc:nth-child(4){transition-delay:.26s}
/* Reveal with more movement */
.rv{transform:translateY(28px);opacity:0;transition:opacity .65s var(--ease),transform .65s var(--ease)}
.rv.in{opacity:1;transform:none}
/* Delay variants */
.delay-1{transition-delay:.1s}
.delay-2{transition-delay:.2s}
.delay-3{transition-delay:.3s}
/* Float animation on key stats */
@keyframes floatBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.hero-float{animation:floatBob 3.5s ease-in-out infinite;will-change:transform}
/* Shimmer on counter numbers */
@keyframes shimmerNum{0%{opacity:.7}50%{opacity:1}100%{opacity:.7}}
.res-n{animation:shimmerNum 2.5s ease infinite}
/* Glow pulse on red elements */
@keyframes glowPulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}50%{box-shadow:0 0 20px 4px rgba(220,38,38,.15)}}
.btn-primary:focus-visible{animation:glowPulse 1.5s ease infinite}
/* Card hover glow */
.about-cap:hover,.about-why-card:hover,.sc:hover,.tech-card:hover{box-shadow:0 8px 40px rgba(220,38,38,.1),0 2px 8px rgba(0,0,0,.06);border-color:rgba(220,38,38,.2);transition:box-shadow .3s,border-color .3s,transform .25s}
/* Section eyebrow animate in */
.eyebrow{transition:opacity .5s,transform .5s}
body{background:var(--bg)}

/* ─── ABOUT PLAY BUTTON ─── */
.about-play-wrap{display:flex;flex-direction:column;align-items:center;gap:16px;padding:48px 0 0}
.about-play-btn{display:inline-flex;align-items:center;gap:12px;font-size:16px;font-weight:600;color:var(--ink);background:var(--bg);border:1.5px solid var(--border2);padding:14px 28px;border-radius:100px;cursor:pointer;transition:all .25s var(--ease);position:relative;overflow:hidden}
.about-play-btn:hover{border-color:var(--red);color:var(--red);box-shadow:0 8px 32px rgba(220,38,38,.15);transform:translateY(-2px)}
.about-play-icon{width:40px;height:40px;border-radius:50%;background:var(--red);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .25s,box-shadow .25s}
.about-play-btn:hover .about-play-icon{transform:scale(1.1);box-shadow:0 4px 16px rgba(220,38,38,.4)}
.about-play-ring{position:absolute;width:40px;height:40px;border-radius:50%;border:2px solid rgba(220,38,38,.3);animation:playRing 2s ease-out infinite;pointer-events:none}
@keyframes playRing{0%{transform:scale(1);opacity:.8}100%{transform:scale(2.2);opacity:0}}

/* ─── PROOF GRID CHARTS ─── */
.pc{cursor:pointer;display:flex;flex-direction:column;gap:0}
.pc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:4px}
.pc-proj-badge{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#b45309;background:#fef3c7;border:1px solid #fde68a;border-radius:100px;padding:2px 8px;flex-shrink:0;margin-top:2px}
/* Mini before/after bars inside proof cards */
.pc-chart{margin:10px 0 8px;display:flex;flex-direction:column;gap:5px}
.pcb-row{display:flex;align-items:center;gap:6px}
.pcb-lbl{font-family:var(--mono);font-size:9px;color:var(--ink4);width:32px;flex-shrink:0;text-transform:uppercase;letter-spacing:.04em}
.pcb-track{flex:1;height:6px;background:var(--bg3);border-radius:3px;overflow:hidden}
.pcb-fill{height:100%;border-radius:3px;width:0;transition:width 1.2s cubic-bezier(.16,1,.3,1)}
.pcb-fill.pcb-before{background:var(--border2)}
.pcb-fill.pcb-after{background:var(--red)}
.pcb-val{font-family:var(--mono);font-size:9px;color:var(--ink3);width:44px;text-align:right;flex-shrink:0}
/* Trigger bar animation when card enters view */
.rv.in .pcb-fill{width:var(--w)}

/* Disclaimer strip */
.pf-disclaimer{display:flex;align-items:center;gap:8px;background:#fef9ec;border:1px solid #fde68a;border-radius:10px;padding:10px 16px;font-family:var(--mono);font-size:12px;color:#92400e;margin:16px 0;max-width:600px;margin-left:auto;margin-right:auto}

/* ─── PROOF CARD CLICK → DETAIL PANEL ─── */
/* Make detail panel way more readable */
.dp-body{padding:28px 32px 32px}
.dp-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:20px}
.dp-col{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:12px 16px}
.dp-col-label{font-family:var(--mono);font-size:10px;color:var(--ink4);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.dp-col-val{font-size:15px;font-weight:700;color:var(--ink)}
/* Bar rows inside detail panel */
.dp-bar-row{margin-bottom:16px}
.dp-bar-label{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:6px}
.dp-bar-pair{display:flex;flex-direction:column;gap:4px}
.dp-bar-item{display:flex;align-items:center;gap:8px}
.dp-bar-tag{font-family:var(--mono);font-size:10px;color:var(--ink4);width:36px;flex-shrink:0}
.dp-bar-track{flex:1;height:10px;background:var(--bg3);border-radius:5px;overflow:hidden}
.dp-bar-fill{height:100%;border-radius:5px;transition:width 1s cubic-bezier(.16,1,.3,1)}
.dp-bar-fill.before-fill{background:var(--border2)}
.dp-bar-fill.after-fill{background:var(--red)}
.dp-bar-val{font-family:var(--mono);font-size:11px;color:var(--ink3);min-width:52px;text-align:right}
.dp-bottom{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px;padding-top:20px;border-top:1px solid var(--border)}
.dp-kpi{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:14px 16px;text-align:center}
.dp-kpi-n{font-size:22px;font-weight:800;color:var(--ink);letter-spacing:-.03em}
.dp-kpi-l{font-size:11px;color:var(--ink4);font-family:var(--mono);margin-top:4px}

/* ─── TEXT CONTRAST FIXES ─── */
/* PSR text in our-work cards — was too faint */
.ow-psr-text{font-family:var(--mono);font-size:13px;color:var(--ink2);line-height:1.6;margin:2px 0 0}
.ow-card.dark .ow-psr-text{color:rgba(255,255,255,.65)}
/* Proof card industry label */
.pc-i{font-size:11px;font-weight:700;color:var(--ink3);letter-spacing:.04em;text-transform:uppercase;font-family:var(--mono)}
/* Proof card number */
.pc-n{font-size:clamp(32px,4vw,44px);font-weight:800;letter-spacing:-.04em;color:var(--ink);line-height:1;margin:4px 0}
/* Proof card label */
.pc-l{font-size:13px;color:var(--ink2);font-weight:500;line-height:1.4}
/* Proof card meta */
.pc-m{font-family:var(--mono);font-size:10px;color:var(--ink4);margin-top:8px}
/* Click hint */
.pc::after{content:'Click for breakdown →';font-family:var(--mono);font-size:9px;color:var(--red);opacity:0;transition:opacity .2s;margin-top:6px;letter-spacing:.04em;font-weight:600;display:block}
.pc:hover::after{opacity:1}
/* Sparkline */
.pc-spark{margin:10px 0 12px}
.pc-spark svg{width:100%;height:26px;display:block;overflow:visible}
.pc-spark-foot{display:flex;justify-content:space-between;margin-top:3px}
.pc-spark-lbl{font-family:var(--mono);font-size:9px;color:var(--ink4);letter-spacing:.02em}
.pc-spark-trend{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.02em}
.pc-spark-trend.up{color:var(--red)}
.pc-spark-trend.dn{color:var(--green)}
/* Mini KPIs */
.pc-kpis{display:flex;border-top:1px solid var(--border);margin-top:10px;padding-top:10px}
.pc-kpi{flex:1;text-align:center}
.pc-kpi+.pc-kpi{border-left:1px solid var(--border)}
.pc-kpi-n{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.pc-kpi-l{font-family:var(--mono);font-size:9px;color:var(--ink4);letter-spacing:.02em;margin-top:1px;text-transform:uppercase}

/* Detail panel compare grid */
.dp-compare-grid{background:var(--bg2);border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-bottom:20px}
.dp-compare-hdr{display:grid;grid-template-columns:1fr 1fr 1fr;padding:10px 16px;background:var(--bg3);border-bottom:1px solid var(--border);font-family:var(--mono);font-size:10px;font-weight:700;color:var(--ink4);text-transform:uppercase;letter-spacing:.06em}
.dp-compare-row{display:grid;grid-template-columns:1fr 1fr 1fr;padding:12px 16px;border-bottom:1px solid var(--border);align-items:center}
.dp-compare-row:last-child{border-bottom:none}
.dcr-k{font-size:13px;font-weight:600;color:var(--ink)}
.dcr-b{font-family:var(--mono);font-size:12px;color:var(--ink4)}
.dcr-a{font-family:var(--mono);font-size:12px;color:var(--red);font-weight:700}
.dp-proj-notice{grid-column:span 1;font-family:var(--mono);font-size:10px;color:#92400e;background:#fef9ec;border:1px solid #fde68a;border-radius:8px;padding:6px 12px;margin-top:4px;width:100%;grid-column:span 3}
/* Redefine dp-meta to accept the new col layout */
.dp-meta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px;align-items:flex-start}
.dp-proj-notice{font-family:var(--mono);font-size:10px;color:#92400e;background:#fef9ec;border:1px solid #fde68a;border-radius:8px;padding:6px 12px;width:100%}
/* Bar section */
.dp-bar-section{margin-bottom:16px}
.dp-bars-title{font-family:var(--mono);font-size:10px;font-weight:700;color:var(--ink4);text-transform:uppercase;letter-spacing:.07em;margin-bottom:14px}
@media(max-width:540px){
  .dp-compare-hdr,.dp-compare-row{grid-template-columns:1fr 80px 80px}
  .dp-bottom{grid-template-columns:1fr 1fr}
  .detail-panel{border-radius:16px!important}
}

/* ─── DETAIL PANEL WHY SECTION ─── */
#dp-why{margin-top:20px;padding-top:18px;border-top:1px solid var(--border)}
.dp-why-title{font-family:var(--mono);font-size:10px;font-weight:700;color:var(--ink4);text-transform:uppercase;letter-spacing:.07em;margin-bottom:10px}
.dp-why-item{display:flex;gap:10px;font-size:13px;color:var(--ink2);line-height:1.6;margin-bottom:8px;align-items:flex-start}
.dp-why-dot{color:var(--red);font-weight:700;flex-shrink:0;margin-top:1px}

/* ─── ANALYTICS CHARTS ─── */
.analytics-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:8px}
.analytics-card-wide{grid-column:span 2}
.analytics-card{background:var(--bg);border:1px solid var(--border);border-radius:16px;padding:20px 22px;overflow:hidden}
.ac-hdr{margin-bottom:14px}
.ac-title{font-size:13px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.ac-formula{font-family:var(--mono);font-size:10px;color:var(--red);margin-top:3px;opacity:.85}
.ac-svg{width:100%;height:auto;display:block}
.ac-footer{font-family:var(--mono);font-size:9.5px;color:var(--ink4);margin-top:10px;line-height:1.5}
@media(max-width:768px){
  .analytics-grid{grid-template-columns:1fr}
  .analytics-card-wide{grid-column:span 1}
}

/* ─── CERTIFICATIONS ─── */
.cert-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:8px}
.cert-card{background:var(--bg);border:1px solid var(--border);border-radius:16px;padding:20px 18px;display:flex;flex-direction:column;gap:10px;position:relative;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.cert-card:hover{border-color:rgba(220,38,38,.25);box-shadow:0 8px 32px rgba(220,38,38,.06)}
.cert-card-featured{border-color:rgba(140,21,21,.2);background:linear-gradient(135deg,rgba(140,21,21,.04),var(--bg))}
.cert-phase{font-family:var(--mono);font-size:9.5px;color:var(--ink4);letter-spacing:.05em;text-transform:uppercase}
.cert-badge{display:inline-block;font-family:var(--mono);font-size:9px;font-weight:700;padding:2px 8px;border-radius:100px;letter-spacing:.05em;text-transform:uppercase}
.cert-badge.pending{background:rgba(245,158,11,.12);color:#92400e;border:1px solid rgba(245,158,11,.3)}
.cert-logo{width:36px;height:36px;border-radius:8px;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;background:var(--bg2)}
.cert-name{font-size:14px;font-weight:700;color:var(--ink);line-height:1.4;letter-spacing:-.01em}
.cert-skills{display:flex;flex-wrap:wrap;gap:5px}
.cert-skill{font-family:var(--mono);font-size:9px;padding:2px 7px;border-radius:100px;background:var(--bg2);border:1px solid var(--border);color:var(--ink3)}
.cert-why{font-size:12px;color:var(--ink3);line-height:1.6;margin-top:4px}
.cert-note{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;color:var(--ink4);margin-top:28px;padding:12px 16px;background:var(--bg2);border:1px solid var(--border);border-radius:10px}
@media(max-width:1024px){.cert-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.cert-grid{grid-template-columns:1fr}}

/* ─── ML MATH GRID ─── */
.tech-math-grid{margin-top:32px}
.tmg-hdr{font-family:var(--mono);font-size:10px;font-weight:700;color:var(--ink4);text-transform:uppercase;letter-spacing:.07em;margin-bottom:16px}
.tech-math-grid .tmg-card{background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:16px 18px;margin-bottom:12px}
.tmg-title{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:6px}
.tmg-desc{font-size:12px;color:var(--ink3);line-height:1.65;margin-bottom:10px}
.tmg-formula{font-family:var(--mono);font-size:12px;color:var(--red);background:var(--red-bg);border:1px solid var(--red-border);border-radius:6px;padding:5px 10px;display:inline-block;margin-bottom:10px;letter-spacing:.02em}
.tmg-chips{display:flex;flex-wrap:wrap;gap:6px}

/* ─── ABOUT FOUNDER ─── */
.about-founder-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;margin-top:40px}
.about-founder-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.about-founder-right{height:100%}
.about-founder-build{margin-top:26px}
.afb-label{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--red);margin-bottom:8px}
.afb-list{font-size:14px;line-height:1.75;color:var(--ink3)}
.about-founder-photo{width:100%;max-width:340px;aspect-ratio:4/5;object-fit:cover;object-position:center 18%;border-radius:20px;border:1px solid var(--border);box-shadow:var(--shadow-lg);display:block;background:var(--bg3);margin:0 auto}
@media(max-width:768px){
  .about-founder-grid{grid-template-columns:1fr;gap:28px}
  .about-founder-right{max-width:300px;margin:0 auto}
}


/* ─── PROBLEM SECTION ─── */
.prob-list{display:flex;flex-direction:column;gap:16px}
.prob-item{display:flex;align-items:flex-start;gap:14px;padding:20px;background:var(--bg2);border:1px solid var(--border);border-radius:12px;font-size:15px;color:var(--ink2);line-height:1.6}
.prob-icon{flex-shrink:0;margin-top:2px}
.prob-closer{font-size:15px;font-weight:500;color:#991b1b;line-height:1.6}

/* ─── DEPLOY GRID ─── */
.deploy-card{background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:28px 24px;transition:border-color .2s,box-shadow .2s}
.deploy-card:hover{border-color:rgba(220,38,38,.2);box-shadow:0 8px 24px rgba(220,38,38,.05)}
.deploy-num{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--red);letter-spacing:.06em;margin-bottom:10px}
.deploy-h{font-size:16px;font-weight:700;color:var(--ink);letter-spacing:-.01em;margin-bottom:8px}
.deploy-p{font-size:13px;color:var(--ink3);line-height:1.65}

/* ─── WHAT WE ARE NOT ─── */
.not-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.not-item{display:flex;align-items:center;gap:12px;padding:16px 18px;background:var(--bg);border:1px solid var(--border);border-radius:10px;font-size:14px;color:var(--ink2)}
.not-item.not-no .not-icon{color:#dc2626;font-weight:700;font-size:13px;flex-shrink:0}
.not-yes{border-radius:12px}
@media(max-width:640px){
  .not-grid{grid-template-columns:1fr}
  .about-founder-grid{grid-template-columns:1fr;gap:32px}
}

/* ─── DATA VISUALIZATIONS ─── */
.dv-grid{}
.dv-card{background:var(--bg);border:1px solid var(--border);border-radius:16px;padding:28px 28px 24px}
.dv-card-hdr{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.dv-label{font-family:var(--mono);font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink4);margin-bottom:6px}
.dv-title{font-size:15px;font-weight:600;color:var(--ink);letter-spacing:-.01em;line-height:1.4}
.dv-badge{font-family:var(--mono);font-size:10px;color:var(--ink4);background:var(--bg2);border:1px solid var(--border);padding:3px 10px;border-radius:100px;white-space:nowrap;flex-shrink:0;margin-top:2px}

/* bar chart */
.dv-bar-row{display:grid;grid-template-columns:160px 1fr 90px;align-items:center;gap:12px}
.dv-bar-label{font-size:13px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dv-bar-track{height:10px;background:var(--bg2);border-radius:100px;overflow:hidden}
.dv-bar-fill{height:100%;border-radius:100px;width:0;transition:width 1.2s cubic-bezier(.16,1,.3,1)}
.dv-bar-fill.animate{width:var(--w)}
.dv-bar-fill.dv-bad{background:#fca5a5}
.dv-bar-fill.dv-mid{background:#fbbf24}
.dv-bar-fill.dv-good{background:#dc2626}
.dv-bar-stat{font-family:var(--mono);font-size:12px;font-weight:700;text-align:right}
.dv-bar-stat.bad{color:#dc2626}
.dv-bar-stat.mid{color:#d97706}
.dv-bar-stat.good{color:#dc2626}

/* insight callout */
.dv-insight{display:flex;gap:8px;align-items:flex-start;font-size:12px;color:var(--ink3);line-height:1.6;background:#fef2f2;border-radius:8px;padding:10px 12px}

/* funnel */
.dv-funnel{display:flex;flex-direction:column;gap:10px}
.dv-funnel-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px}
.dv-funnel-bar{height:10px;background:var(--bg2);border-radius:100px;overflow:hidden}
.dv-funnel-fill{height:100%;width:0;border-radius:100px;background:var(--col);transition:width 1.2s cubic-bezier(.16,1,.3,1)}
.dv-funnel-fill.animate{width:var(--pct)}
.dv-funnel-meta{display:flex;align-items:center;gap:8px;min-width:260px}
.dv-funnel-n{font-family:var(--mono);font-size:13px;font-weight:700;color:var(--ink);min-width:30px;text-align:right}
.dv-funnel-n.bad{color:#dc2626}
.dv-funnel-l{font-size:12px;color:var(--ink3);line-height:1.4}

/* grouped bar chart */
.dv-industry-chart{}
.dv-col{display:flex;flex-direction:column;gap:8px}
.dv-col-bars{display:flex;gap:4px;align-items:flex-end;height:120px}
.dv-col-bar{width:100%;border-radius:4px 4px 0 0;height:0;transition:height 1.2s cubic-bezier(.16,1,.3,1)}
.dv-col-bar.animate{height:var(--h)}
.dv-col-bar.manual{background:#e5e7eb}
.dv-col-bar.ai{background:#dc2626}
.dv-col-labels{}
.dv-col-vals{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;font-weight:700;margin-bottom:4px}
.manual-val{color:var(--ink4)}
.ai-val{color:#dc2626}
.dv-col-name{font-size:11px;color:var(--ink3);text-align:center;line-height:1.4}

@media(max-width:900px){
  .dv-grid{grid-template-columns:1fr!important}
  .dv-card[style*="grid-column:span 2"]{grid-column:span 1}
  .dv-bar-row{grid-template-columns:120px 1fr 70px}
  .dv-industry-chart{grid-template-columns:repeat(3,1fr)!important}
  .dv-funnel-meta{min-width:180px}
}
@media(max-width:600px){
  .dv-bar-row{grid-template-columns:1fr 60px;gap:8px}
  .dv-bar-label{display:none}
  .dv-industry-chart{grid-template-columns:repeat(2,1fr)!important}
}

/* PROCESS STEPS */
.process-row{display:flex;align-items:flex-start;justify-content:center;gap:0}
.process-step{flex:1;max-width:260px;text-align:center;padding:0 16px;position:relative}
.process-step.ps-featured .ps-icon{background:#dc2626;border-color:#dc2626;color:#fff}
.process-step.ps-featured .ps-icon svg path,.process-step.ps-featured .ps-icon svg circle{stroke:#fff}
.ps-icon{width:64px;height:64px;border-radius:50%;border:2px solid var(--border2);background:var(--bg);display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.ps-num{font-family:var(--mono);font-size:12px;color:var(--red);letter-spacing:.08em;margin-bottom:10px;font-weight:600}
.ps-title{font-size:18px;font-weight:700;color:var(--ink);margin-bottom:10px}
.ps-body{font-size:14px;color:var(--ink3);line-height:1.7}
.ps-connector{flex:0 0 80px;height:2px;background:linear-gradient(90deg,var(--border),var(--border2));margin-top:32px;position:relative}
.ps-connector::after{content:'';position:absolute;right:-4px;top:50%;transform:translateY(-50%);width:6px;height:6px;border-top:1.5px solid var(--border2);border-right:1.5px solid var(--border2);transform:translateY(-50%) rotate(45deg)}
@media(max-width:768px){
  .process-row{flex-direction:column;align-items:center;gap:0}
  .process-step{max-width:100%;width:100%;text-align:left;display:flex;gap:16px;align-items:flex-start;padding:20px 0;border-bottom:1px solid var(--border)}
  .process-step:last-child{border-bottom:none}
  .ps-icon{flex-shrink:0;margin:0}
  .ps-connector{display:none}
  .ps-num{margin-bottom:4px}
}

/* BUILT WITH / PLATFORM LOGOS */
.bw-stats{}
.bw-stat{background:#0f1628;padding:40px 28px;text-align:center}
.bw-stat-n{font-size:clamp(36px,5vw,60px);font-weight:800;color:#f4f4f5;letter-spacing:-0.03em;line-height:1}
.bw-stat-l{font-family:var(--mono);font-size:11px;color:rgba(244,244,245,.4);margin-top:8px;letter-spacing:.04em}
.bw-marquee-wrap{overflow:hidden;position:relative}
.bw-marquee-wrap::before,.bw-marquee-wrap::after{content:'';position:absolute;top:0;bottom:0;width:80px;z-index:2}
.bw-marquee-wrap::before{left:0;background:linear-gradient(90deg,#0a0e1a,transparent)}
.bw-marquee-wrap::after{right:0;background:linear-gradient(-90deg,#0a0e1a,transparent)}
.bw-marquee{display:flex;width:max-content}
.bw-track{display:flex;gap:16px;animation:bwScroll 28s linear infinite}
.bw-right .bw-track{animation-direction:reverse;animation-duration:22s}
.bw-logo{display:flex;align-items:center;gap:10px;padding:14px 24px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.04);font-family:var(--mono);font-size:13px;color:rgba(244,244,245,.6);white-space:nowrap;flex-shrink:0;transition:border-color .2s,color .2s}
.bw-logo:hover{border-color:rgba(220,38,38,.4);color:#f4f4f5}
@keyframes bwScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@media(max-width:768px){
  .bw-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .bw-stat{padding:28px 16px}
}