/* ==========================================================================
   MARKETING TITAN — HOMEPAGE v3
   Static. No framework. ~5KB JS. Persona switch is CSS-only so BOTH
   audience variants stay in the DOM and stay crawlable.
   ========================================================================== */
:root{
  --bg:#F4F7FB;--surface:#FFFFFF;--surface-2:#F8FAFD;--navy:#0E1E30;--navy-2:#17334F;
  --border:#DCE5EF;--border-soft:#EBF0F6;--border-strong:#C4D2E1;
  --ink:#0F1E2E;--ink-2:#46586E;--ink-3:#7B8CA2;
  --accent:#1789DC;--accent-dk:#1170B8;--accent-soft:#E7F2FC;--accent-hi:#37A6F0;
  --violet:#6A46DE;--violet-soft:#EFEAFD;--violet-line:#C9BAF6;
  --violet-dk:#5837C4;--violet-hi:#A98CF7;
  --green:#0E9F6E;--green-soft:#E6F7F0;--green-line:#A8E2C8;
  --amber:#B0730A;--amber-soft:#FFF5E3;--amber-line:#EFCE92;
  --red:#D92D36;--red-soft:#FDECED;--red-line:#F5B9BC;
  /* Aliases, not new colours. The homepage calls the violet family "purple"
     and pricing calls the amber family "stack"; both resolve to the same
     values. Kept so this consolidation changes no pixel - renaming them means
     editing markup in the hand-authored templates, which is its own change. */
  --purple:var(--violet);--purple-soft:var(--violet-soft);--purple-line:var(--violet-line);
  --stack:var(--amber);--stack-soft:var(--amber-soft);--stack-line:var(--amber-line);
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --disp:'Plus Jakarta Sans',system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Consolas,Menlo,monospace;
  --r:8px;--r-lg:12px;
  --shadow:0 1px 2px rgba(15,30,46,.04),0 2px 10px rgba(15,30,46,.05);
  --shadow-lg:0 8px 28px rgba(15,30,46,.09);
  --shadow-xl:0 24px 64px rgba(15,30,46,.16);
  --maxw:1240px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15.5px;
  line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--disp);margin:0;letter-spacing:-.02em;line-height:1.15;font-weight:800}
p{margin:0}
a{color:var(--accent);text-decoration:none}
button{font:inherit}
blockquote{margin:0}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-999px;top:0;z-index:100;background:#fff;padding:10px 16px;
  border-radius:0 0 var(--r) 0}
.skip:focus{left:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}

/* ---------------- primitives ---------------- */
.ml{font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-3)}
.ml.acc{color:var(--accent)}
.eyebrow{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;color:var(--accent);display:block;margin-bottom:14px}
.sec-head{display:flex;align-items:center;gap:14px;padding-bottom:10px;
  border-bottom:1px solid var(--border);margin-bottom:26px}
.sec-head h2{position:relative;padding-left:14px;font-size:17px;font-weight:700}
.sec-head h2::before{content:"";position:absolute;left:0;top:.12em;bottom:.12em;width:3px;
  border-radius:2px;background:var(--accent)}
.sec-head .meta{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.sec-head .meta .dot{color:var(--green)}
.pill{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-size:10px;
  font-weight:500;letter-spacing:.09em;text-transform:uppercase;padding:3px 8px;border-radius:5px;
  border:1px solid var(--border-strong);color:var(--ink-2);background:var(--surface-2);
  line-height:1.5;white-space:nowrap}
.pill::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.85}
.pill.plain::before{display:none}
.pill.ok{color:var(--green);border-color:var(--green-line);background:var(--green-soft)}
.pill.bad{color:var(--red);border-color:var(--red-line);background:var(--red-soft)}
.pill.warn{color:var(--amber);border-color:var(--amber-line);background:var(--amber-soft)}
.pill.info{color:var(--accent-dk);border-color:#B9DCF6;background:var(--accent-soft)}
.pill.pur{color:var(--purple);border-color:var(--purple-line);background:var(--purple-soft)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:14px;
  font-weight:600;padding:11px 20px;border-radius:var(--r);border:1px solid transparent;
  cursor:pointer;transition:.16s;white-space:nowrap}
.btn-pri{background:var(--accent);color:#fff;box-shadow:0 1px 2px rgba(23,137,220,.35)}
.btn-pri:hover{background:var(--accent-dk);color:#fff;transform:translateY(-1px)}
.btn-sec{background:var(--surface);color:var(--ink);border-color:var(--border-strong)}
.btn-sec:hover{border-color:var(--accent);color:var(--accent-dk)}
.btn-dk{background:rgba(255,255,255,.07);color:#fff;border-color:rgba(255,255,255,.2)}
.btn-dk:hover{background:rgba(255,255,255,.14);color:#fff}
.btn-lg{padding:14px 26px;font-size:15px}
.btn-sm{padding:7px 13px;font-size:12.5px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:20px;box-shadow:var(--shadow)}
.card h3{font-size:16px;margin:6px 0 5px}
.card .d{font-size:13.5px;color:var(--ink-3);line-height:1.6;flex:1}
/* card grids — same shape as shell.js .grid2/.grid3 so /darwin-ai/ and / match */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.grid2>.card,.grid3>.card{display:flex;flex-direction:column;transition:.18s}
.grid2>.card:hover,.grid3>.card:hover{border-color:var(--accent);transform:translateY(-2px);
  box-shadow:var(--shadow-lg)}
.card-l{border-left:3px solid var(--accent)}
.card-l.g{border-left-color:var(--green)}.card-l.r{border-left-color:var(--red)}
.card-l.a{border-left-color:var(--amber)}.card-l.p{border-left-color:var(--purple)}
.kpis{display:grid;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--shadow)}
.kpi{padding:17px 20px;border-left:1px solid var(--border-soft);position:relative}
.kpi:first-child{border-left:0}
.kpi .k-v{font-family:var(--disp);font-size:29px;letter-spacing:-.03em;margin:7px 0 3px;line-height:1}
.kpi .k-c{font-size:11.5px;color:var(--ink-3);line-height:1.4}
.kpi.hot-g{background:linear-gradient(180deg,#E9F8F1,#fff 70%)}
.kpi.hot-g::after{content:"";position:absolute;inset:auto 0 0 0;height:2px;background:var(--green)}
.kpi.hot-g .k-v{color:var(--green)}
.tblwrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--shadow)}
.tbl{width:100%;border-collapse:collapse}
.tbl caption{text-align:left;padding:14px 18px;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3);border-bottom:1px solid var(--border);
  background:var(--surface-2)}
.tbl th{font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.11em;
  text-transform:uppercase;color:var(--ink-3);text-align:left;padding:12px 18px;
  border-bottom:1px solid var(--border);background:var(--surface-2)}
.tbl td{padding:13px 18px;border-bottom:1px solid var(--border-soft);font-size:14.5px}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl tbody tr:hover{background:#F7FAFD}
.tbl .num{font-family:var(--mono);font-size:13px;font-weight:500}
.tbl .r{text-align:right}
.tbl tr.total td{background:var(--surface-2);font-weight:700;border-top:1px solid var(--border)}
.tbl th[scope=row]{background:transparent;font-family:var(--sans);font-size:14.5px;
  text-transform:none;letter-spacing:0;color:var(--ink);font-weight:600;
  border-bottom:1px solid var(--border-soft)}
.meter{height:4px;border-radius:3px;background:var(--border-soft);overflow:hidden;margin-top:10px}
.meter i{display:block;height:100%;border-radius:3px;background:var(--accent)}
.meter i.g{background:var(--green)}
.banner{display:flex;align-items:center;gap:11px;background:var(--accent-soft);border:1px solid #C9E2F7;
  border-radius:var(--r);padding:13px 16px;color:var(--accent-dk);font-size:13.5px}
.banner .i{width:17px;height:17px;border-radius:50%;border:1.5px solid currentColor;display:grid;
  place-items:center;font-size:11px;font-weight:700;flex:none;font-family:var(--mono)}
.note{border:1px solid var(--amber-line);background:var(--amber-soft);color:#7A5106;
  border-radius:var(--r);padding:11px 15px;font-size:12.5px;line-height:1.55}
.sec{padding:78px 0}
.sec.alt{background:var(--surface);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.sec-intro{max-width:680px;margin-bottom:32px}
.sec-intro h2{font-size:clamp(28px,3.1vw,40px);line-height:1.11}
.sec-intro p{color:var(--ink-2);font-size:16px;margin-top:14px;line-height:1.65}
.two{display:grid;grid-template-columns:1fr 1.08fr;gap:48px;align-items:start}
.rv{opacity:0;transform:translateY(16px);transition:opacity .5s,transform .5s}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}
  *{animation-duration:.001s!important;scroll-behavior:auto}}

/* ================================================================
   PERSONA SWITCH — CSS only. Both variants ship in the DOM.
   ================================================================ */
.p-radio{position:absolute;opacity:0;pointer-events:none}
.persona{display:inline-flex;gap:4px;background:var(--surface);border:1px solid var(--border);
  border-radius:10px;padding:4px;margin-bottom:20px;box-shadow:var(--shadow)}
.persona label{display:flex;align-items:center;gap:8px;padding:8px 15px;border-radius:7px;
  font-size:13px;font-weight:600;color:var(--ink-2);cursor:pointer;transition:.15s;
  border:1px solid transparent}
.persona label .t{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-3)}
.persona label:hover{color:var(--ink)}
body:has(#p-smb:checked) label[for=p-smb],
body:has(#p-ent:checked) label[for=p-ent]{background:var(--accent-soft);border-color:#BEDFF8;
  color:var(--accent-dk)}
body:has(#p-ent:checked) label[for=p-ent]{background:var(--purple-soft);border-color:var(--purple-line);
  color:var(--purple)}
body:has(#p-smb:checked) label[for=p-smb] .t{color:var(--accent)}
body:has(#p-ent:checked) label[for=p-ent] .t{color:var(--purple)}
/* the swap itself */
body:has(#p-smb:checked) .for-ent{display:none}
body:has(#p-ent:checked) .for-smb{display:none}
/* enterprise recolours the primary CTA + accents */
body:has(#p-ent:checked) .cta-persona{background:var(--purple);box-shadow:0 1px 2px rgba(106,70,222,.35)}
body:has(#p-ent:checked) .cta-persona:hover{background:#5837C4}
/* section reorder: the control block rises for the agency view, time-to-value
   for the small-business view. Order is content order, per spec s3.4. */
main{display:flex;flex-direction:column}
main>*{order:99}
#try-darwin{order:0}#switch{order:1}#agents{order:2}#platform{order:3}#modes{order:4}
#autonomy{order:5}#ttv{order:6}#control{order:7}#results{order:8}
#pricing-teaser{order:9}#facts{order:10}#faq{order:11}
#cta{order:12}#more{order:13}
body:has(#p-ent:checked) #control{order:6}
body:has(#p-ent:checked) #ttv{order:7}
/* no :has() support → default (SMB) view still renders correctly */

/* ================================================================ HEADER */
.hdr{position:sticky;top:0;z-index:60;background:rgba(14,30,48,.94);
  backdrop-filter:saturate(160%) blur(10px);border-bottom:1px solid rgba(255,255,255,.08)}
.hdr .wrap{display:flex;align-items:center;gap:28px;height:64px}
.logo{display:inline-flex;align-items:center;text-decoration:none;line-height:0}
.logo img{height:38px;width:auto;display:block}
@media(max-width:960px){.hdr .nav{display:none}}
@media(max-width:560px){.logo img{height:30px}}
.nav{flex:1;display:flex;align-items:center;justify-content:center;gap:4px}
.nav-i{position:relative}
.nav-i>a{display:inline-flex;align-items:center;gap:5px;color:#B9CBDF;font-size:14px;
  font-weight:500;text-decoration:none;padding:10px 12px;border-radius:7px}
.nav-i>a:hover,.nav-i>a[aria-current]{color:#fff;background:rgba(255,255,255,.07)}
.nav-i .caret{font-size:9px;opacity:.65;transition:transform .15s}
.nav-i:hover .caret,.nav-i:focus-within .caret{transform:rotate(180deg)}
.nav-sub{position:absolute;top:100%;left:50%;transform:translateX(-50%);padding-top:10px;
  min-width:224px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .14s}
.nav-i.has-sub:hover .nav-sub,.nav-i.has-sub:focus-within .nav-sub{
  opacity:1;visibility:visible;pointer-events:auto}
.nav-sub>a{display:block;background:var(--surface);color:var(--ink-2);font-size:13.5px;
  text-decoration:none;padding:9px 14px;border-left:1px solid var(--border);
  border-right:1px solid var(--border)}
.nav-sub>a:first-child{border-top:1px solid var(--border);border-radius:10px 10px 0 0;padding-top:11px}
.nav-sub>a:last-child{border-bottom:1px solid var(--border);border-radius:0 0 10px 10px;
  padding-bottom:11px;box-shadow:0 14px 34px rgba(15,30,46,.16)}
.nav-sub>a:hover{background:var(--accent-soft);color:var(--accent-dk)}
.hdr-cta{margin-left:auto;display:flex;align-items:center;gap:11px}
.hdr-live{font-family:var(--mono);font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;
  color:#6FD3A2;display:flex;align-items:center;gap:6px}
.hdr-live::before{content:"";width:6px;height:6px;border-radius:50%;background:#6FD3A2;
  animation:blip 2.2s infinite}
@keyframes blip{0%,100%{opacity:1}50%{opacity:.2}}

/* ================================================================ HERO */
.hero{position:relative;padding:52px 0 60px;overflow:hidden;background:
  radial-gradient(1100px 520px at 78% -14%,rgba(23,137,220,.13),transparent 64%),
  linear-gradient(180deg,#F9FBFD,var(--bg))}
body:has(#p-ent:checked) .hero{background:
  radial-gradient(1100px 520px at 78% -14%,rgba(106,70,222,.12),transparent 64%),
  linear-gradient(180deg,#FAFAFE,var(--bg))}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(15,30,46,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(15,30,46,.045) 1px,transparent 1px);background-size:46px 46px;
  -webkit-mask-image:radial-gradient(720px 420px at 76% 24%,#000,transparent 72%);
  mask-image:radial-gradient(720px 420px at 76% 24%,#000,transparent 72%)}
.hero .wrap{position:relative;z-index:1}
.hero-grid{display:grid;grid-template-columns:1fr 1.12fr;gap:50px;align-items:center}
.hero h1{font-size:clamp(37px,4.3vw,55px);line-height:1.05}
.hero h1 .sub{display:block;color:var(--ink-2);font-weight:700;font-size:.48em;margin-top:14px;
  line-height:1.3}
.hero .lede{color:var(--ink-2);font-size:16.5px;line-height:1.65;margin:22px 0 26px;max-width:54ch}
.hero .lede b{color:var(--ink);font-weight:600}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.trust{display:flex;gap:20px;flex-wrap:wrap;margin-top:20px;list-style:none;padding:0}
.trust li{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-3)}
.trust li::before{content:"✓";color:var(--green);font-weight:700;font-size:12px}
.hero-kpis{margin-top:44px;grid-template-columns:repeat(5,1fr)}

/* ---------- console ---------- */
.console{background:var(--surface);border:1px solid var(--border);border-radius:15px;
  box-shadow:var(--shadow-xl);overflow:hidden}
.c-bar{display:flex;align-items:center;gap:7px;padding:11px 15px;background:var(--navy)}
.c-bar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.18)}
.c-bar .t{margin-left:9px;font-family:var(--mono);font-size:10.5px;letter-spacing:.09em;
  text-transform:uppercase;color:#8FA6BF}
.c-mode{margin-left:auto;font-family:var(--mono);font-size:9px;letter-spacing:.12em;
  text-transform:uppercase;padding:3px 8px;border-radius:5px;
  background:rgba(14,159,110,.18);border:1px solid rgba(127,212,168,.4);color:#7FD4A8}
body:has(#p-ent:checked) .c-mode{background:rgba(106,70,222,.22);
  border-color:rgba(160,132,246,.45);color:#BFA9F8}
.c-body{padding:17px}
.c-cmd{border:1px solid var(--border);border-radius:10px;background:var(--surface-2);
  padding:13px 15px;display:flex;align-items:center;gap:11px;transition:.3s}
.c-cmd.armed{border-color:var(--accent);background:#fff;box-shadow:0 0 0 3px rgba(23,137,220,.13)}
body:has(#p-ent:checked) .c-cmd.armed{border-color:var(--purple);box-shadow:0 0 0 3px rgba(106,70,222,.13)}
.c-cmd .q{font-family:var(--mono);font-size:12px;color:var(--accent);font-weight:700;flex:none}
body:has(#p-ent:checked) .c-cmd .q{color:var(--purple)}
.c-cmd .txt{flex:1;font-size:13.5px;min-height:20px;line-height:1.45}
.c-cmd .cur{display:inline-block;width:1.5px;height:14px;background:var(--accent);vertical-align:-2px;
  animation:blink 1s steps(2) infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
.c-cmd .go{width:28px;height:28px;border-radius:7px;flex:none;display:grid;place-items:center;
  background:var(--accent);color:#fff;font-size:13px}
body:has(#p-ent:checked) .c-cmd .go{background:var(--purple)}
.c-sec{display:flex;align-items:center;gap:11px;margin:16px 0 10px}
.c-sec .h{position:relative;padding-left:12px;font-family:var(--mono);font-size:10px;font-weight:500;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.c-sec .h::before{content:"";position:absolute;left:0;top:1px;bottom:1px;width:3px;border-radius:2px;
  background:var(--accent)}
body:has(#p-ent:checked) .c-sec .h::before{background:var(--purple)}
.c-sec .m{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--ink-3)}
.c-agents{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.ag{border:1px solid var(--border);border-radius:9px;background:var(--surface-2);padding:10px 11px;
  transition:.35s cubic-bezier(.2,.8,.3,1);opacity:.45}
.ag .n{font-size:12px;font-weight:600;display:flex;align-items:center;gap:7px}
.ag .n::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--border-strong);
  flex:none;transition:.35s}
.ag .s{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-3);margin-top:5px}
.ag.on{opacity:1;background:#fff;border-color:#BEDFF8;box-shadow:0 3px 12px rgba(23,137,220,.14);
  transform:translateY(-2px)}
.ag.on .n::before{background:var(--accent);box-shadow:0 0 0 3px rgba(23,137,220,.18)}
.ag.done .n::before{background:var(--green);box-shadow:0 0 0 3px rgba(14,159,110,.16)}
.ag.done{border-color:var(--green-line)}.ag.done .s{color:var(--green)}
.c-log{border:1px solid var(--border);border-radius:9px;overflow:hidden;min-height:158px}
.tk{display:flex;align-items:center;gap:10px;padding:9px 13px;font-size:12.5px;
  border-bottom:1px solid var(--border-soft);opacity:0;transform:translateX(-8px);transition:.4s}
.tk:last-child{border-bottom:0}
.tk.in{opacity:1;transform:none}
.tk .m{width:15px;height:15px;border-radius:50%;flex:none;display:grid;place-items:center;
  font-size:8.5px;font-weight:700;background:var(--green-soft);color:var(--green);
  border:1px solid var(--green-line)}
.tk.run .m{background:var(--accent-soft);color:var(--accent);border-color:#BEDFF8;
  animation:spin 1.1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.tk.hold{background:var(--purple-soft)}
.tk.hold .m{background:#fff;color:var(--purple);border-color:var(--purple-line);animation:none}
.tk.audit{font-family:var(--mono);font-size:10.5px;color:var(--ink-2);background:var(--surface-2)}
.tk.audit .m{background:var(--purple-soft);color:var(--purple);border-color:var(--purple-line)}
.tk .v{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--ink-3)}
/* the artifact the demo ends on: a draft waiting for a human, not an outcome */
.c-apv{border:1px solid var(--purple-line);border-radius:9px;background:#fff;margin-top:11px;
  overflow:hidden;opacity:.45;transition:.4s}
.c-apv.in{opacity:1;box-shadow:0 3px 14px rgba(106,70,222,.14)}
.c-apv-h{display:flex;align-items:center;gap:9px;padding:8px 13px;background:var(--purple-soft);
  border-bottom:1px solid var(--purple-line)}
.c-apv-h .ml{color:var(--purple)}
.c-apv-h .k{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--ink-3)}
.c-apv-b{padding:11px 13px;min-height:74px}
.c-apv-b .sj{font-size:13px;font-weight:600;line-height:1.4}
.c-apv-b .bd{font-size:12px;color:var(--ink-2);line-height:1.5;margin-top:4px}
.c-apv-f{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:9px 13px;
  border-top:1px solid var(--border-soft);background:var(--surface-2)}
.c-apv-f .nb{margin-left:auto;font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;
  color:var(--ink-3)}
.c-apv-f .btn-sm{padding:5px 11px;font-size:12px}
.c-apv-f .btn-ok{background:var(--green);color:#fff}
.c-apv-f .btn-no{background:var(--surface);color:var(--red);border-color:var(--red-line)}

/* ================================================================ PROOF */
.proof{padding:24px 0;background:var(--surface);border-top:1px solid var(--border);
  border-bottom:1px solid var(--border)}
.proof-in{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.logos{display:flex;gap:30px;flex-wrap:wrap;align-items:center;flex:1;list-style:none;padding:0;margin:0}
.logos li{font-family:var(--disp);font-size:15px;font-weight:700;color:#9AAABD;letter-spacing:-.01em}

/* ================================================================ SWITCH */
.sw-intro{max-width:none;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px 44px;align-items:end}
.sw-notes{display:grid;gap:10px}
.sw-notes .note{margin:0}
@media(max-width:900px){.sw-intro{grid-template-columns:1fr}}
.sw-grid{display:grid;grid-template-columns:1fr auto 1fr;border:1px solid var(--border);
  border-radius:var(--r-lg);overflow:hidden;background:var(--surface);box-shadow:var(--shadow)}
.sw-side{padding:24px}
.sw-side.before{background:linear-gradient(180deg,#FEF7F7,#fff 70%)}
.sw-side.after{background:linear-gradient(180deg,#F1FAF6,#fff 70%)}
.sw-div{width:1px;background:var(--border)}
.sw-h{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.sw-h h3{font-size:15px;font-weight:700}
.sw-tools{display:grid;gap:8px;list-style:none;padding:0;margin:0}
.sw-t{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--border);
  border-radius:var(--r);background:#fff;font-size:13px}
.sw-t .lg{width:22px;height:22px;border-radius:6px;flex:none;display:grid;place-items:center;
  font-family:var(--mono);font-size:9px;font-weight:700;color:#fff}
.sw-t .c{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.sw-one{border:1px solid #BEDFF8;border-radius:var(--r);background:linear-gradient(180deg,#F4FAFE,#fff);
  padding:18px;text-align:center}
.sw-one .mk{width:44px;height:44px;border-radius:11px;margin:0 auto 12px;display:grid;place-items:center;
  background:linear-gradient(135deg,#E8501A,#F2761F);color:#fff;font-family:var(--disp);font-size:16px}
.sw-one h3{font-size:17px}
.sw-one .p{font-family:var(--disp);font-size:30px;letter-spacing:-.03em;color:var(--green);margin-top:12px}
.sw-inc{display:grid;gap:6px;margin-top:14px;text-align:left;list-style:none;padding:0}
.sw-inc li{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-2)}
.sw-inc li::before{content:"✓";color:var(--green);font-weight:700;font-size:11px}
.sw-foot{display:flex;align-items:center;gap:12px;padding:14px 18px;border-top:1px solid var(--border);
  background:var(--surface-2);font-size:13px;grid-column:1/-1;flex-wrap:wrap}

/* ================================================================ AGENTS */
.agents-sec{position:relative;overflow:hidden;color:#E6EEF7;padding:78px 0;background:
  radial-gradient(800px 400px at 50% 0%,rgba(23,137,220,.16),transparent 62%),var(--navy)}
.agents-sec::before{content:"";position:absolute;inset:0;opacity:.35;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:52px 52px;
  -webkit-mask-image:radial-gradient(760px 400px at 50% 30%,#000,transparent 74%);
  mask-image:radial-gradient(760px 400px at 50% 30%,#000,transparent 74%)}
.agents-sec .wrap{position:relative;z-index:1}
.agents-sec .sec-head{border-bottom-color:rgba(255,255,255,.13)}
.agents-sec .sec-head h2{color:#fff}
.agents-sec .sec-head h2::before{background:var(--accent-hi)}
.agents-sec .sec-head .meta{color:#8CA3BC}
.ag-hero{text-align:center;margin-bottom:36px}
.ag-hero .big{font-family:var(--disp);font-size:clamp(62px,9vw,118px);letter-spacing:-.05em;
  line-height:.9;background:linear-gradient(180deg,#fff 30%,#6FB6EC);-webkit-background-clip:text;
  background-clip:text;color:transparent}
.ag-hero h3{font-size:clamp(23px,2.6vw,31px);color:#fff;margin-top:12px}
.ag-hero p{color:#A9BFD6;font-size:16px;margin:14px auto 0;max-width:58ch;line-height:1.65}
.ag-cols{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.ag-col{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.11);
  border-radius:var(--r-lg);padding:16px}
.ag-col h4{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent-hi);font-weight:500}
.ag-col .n{font-family:var(--disp);font-size:22px;color:#fff;letter-spacing:-.03em;margin-top:4px}
.ag-col .list{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px;list-style:none;padding:0}
.ag-col .list li{font-family:var(--mono);font-size:9px;padding:3px 6px;border-radius:4px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);color:#B4CBE2}

/* ================================================================ BENTO */
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.bx{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:20px;
  box-shadow:var(--shadow);transition:.2s}
.bx:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.bx h3{font-size:15px;font-weight:700;margin-bottom:5px}
.bx .d{font-size:12.5px;color:var(--ink-3);line-height:1.55}
.bx .ic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font-size:14px;
  background:var(--accent-soft);border:1px solid #CFE6F8;margin-bottom:12px}
.b-darwin{grid-column:span 2;grid-row:span 2;background:linear-gradient(165deg,#0E1E30,#17334F);
  color:#E6EEF7;border-color:#1D3A59;display:flex;flex-direction:column}
.b-darwin h3{color:#fff;font-size:19px}.b-darwin .d{color:#A9BFD6;font-size:13.5px}
.b-darwin .ic{background:linear-gradient(135deg,var(--accent),#38BDF8);border-color:transparent;
  color:#fff;font-family:var(--mono);font-size:11px;font-weight:700}
.b-chat{margin-top:auto;padding-top:16px;display:grid;gap:8px}
.b-chat .b{padding:9px 12px;border-radius:9px;font-size:12.5px;line-height:1.5}
.b-chat .b.me{background:var(--accent);color:#fff;margin-left:auto;max-width:82%;
  border-bottom-right-radius:3px}
.b-chat .b.ai{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#D5E4F2;
  max-width:88%;border-bottom-left-radius:3px}
.b-chat .tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:9px;list-style:none;padding:0}
.b-chat .tags li{font-family:var(--mono);font-size:8.5px;letter-spacing:.07em;text-transform:uppercase;
  padding:3px 6px;border-radius:4px;background:rgba(55,166,240,.16);
  border:1px solid rgba(55,166,240,.32);color:#8ED0F7}
.b-social,.b-analytics{grid-column:span 2}
.mini-rows{margin-top:14px;display:grid;gap:6px}
.mini-rows .r{display:flex;align-items:center;gap:8px;font-size:11.5px;padding:6px 9px;
  border:1px solid var(--border-soft);border-radius:6px;background:var(--surface-2)}
.mini-rows .r .b{width:16px;height:16px;border-radius:4px;flex:none;display:grid;place-items:center;
  font-family:var(--mono);font-size:8px;font-weight:700;color:#fff;background:var(--accent)}
.mini-rows .r .v{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--ink-3)}
.mini-cal{display:grid;grid-template-columns:repeat(14,1fr);gap:4px;margin-top:14px}
.mini-cal i{aspect-ratio:1;border-radius:3px;background:var(--border-soft)}
.mini-cal i.a{background:#BEDFF8}.mini-cal i.b{background:var(--accent)}.mini-cal i.c{background:var(--green)}
.mini-chart{display:flex;align-items:flex-end;gap:5px;height:56px;margin-top:14px}
.mini-chart i{flex:1;border-radius:3px 3px 0 0;background:linear-gradient(180deg,var(--accent-hi),var(--accent))}
.mini-chart i:last-child{background:linear-gradient(180deg,#34D399,var(--green))}

/* ================================================================ MODES */
.modes{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.mode{padding:26px}
.mode h3{font-size:22px;margin-bottom:6px}
.mode .who{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:16px}
.mode p{font-size:14.5px;color:var(--ink-2);line-height:1.65}
.mode ul{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:10px}
.mode ul li{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--ink-2);
  line-height:1.55}
.mode ul li::before{content:"✓";color:var(--green);font-weight:700;font-size:12px;margin-top:2px;flex:none}
.mode.ent ul li::before{color:var(--purple)}
.mode .foot{margin-top:20px;padding-top:16px;border-top:1px solid var(--border-soft);display:flex;
  align-items:center;gap:10px;flex-wrap:wrap}

/* ================================================================ CONTROL */
.ctrl-stack{display:grid;gap:12px}
.ctrl-box{border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;
  background:var(--surface);box-shadow:var(--shadow)}
.ctrl-h{display:flex;align-items:center;gap:10px;padding:11px 15px;background:var(--surface-2);
  border-bottom:1px solid var(--border)}
.ctrl-h .t{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-2);position:relative;padding-left:12px}
.ctrl-h .t::before{content:"";position:absolute;left:0;top:1px;bottom:1px;width:3px;border-radius:2px;
  background:var(--purple)}
.ctrl-h .m{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--ink-3)}
.apv{display:flex;align-items:center;gap:11px;padding:11px 15px;border-bottom:1px solid var(--border-soft);
  font-size:13px}
.apv:last-child{border-bottom:0}
.apv .ic{width:20px;height:20px;border-radius:5px;flex:none;display:grid;place-items:center;
  font-family:var(--mono);font-size:8.5px;font-weight:700;color:#fff;background:var(--purple)}
.apv .act{margin-left:auto;display:flex;gap:6px}
.log{padding:11px 15px;font-family:var(--mono);font-size:10.5px;line-height:1.9;color:var(--ink-2);
  overflow-x:auto}
.log .t{color:var(--ink-3)}.log .u{color:var(--purple)}.log .ok{color:var(--green)}.log .no{color:var(--red)}
.roles{width:100%;border-collapse:collapse;font-size:12.5px}
.roles th{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-3);font-weight:500;padding:9px 14px;text-align:center;border-bottom:1px solid var(--border)}
.roles th:first-child{text-align:left}
.roles td,.roles th[scope=row]{padding:9px 14px;border-bottom:1px solid var(--border-soft);text-align:center}
.roles th[scope=row]{text-align:left;font-weight:500;font-family:var(--sans);font-size:12.5px;
  text-transform:none;letter-spacing:0;color:var(--ink)}
.roles tr:last-child td,.roles tr:last-child th{border-bottom:0}
.roles .y{color:var(--green);font-weight:700}.roles .n{color:var(--border-strong)}
.kill{display:flex;align-items:center;gap:13px;padding:14px 15px}
.kill .sw{width:38px;height:21px;border-radius:11px;background:var(--red);position:relative;flex:none}
.kill .sw::after{content:"";position:absolute;top:2.5px;right:2.5px;width:16px;height:16px;
  border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.kill .tx b{display:block;font-weight:600;font-size:13px}
.kill .tx span{font-size:11.5px;color:var(--ink-3)}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px;list-style:none;padding:0}
.badge{display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:var(--r);
  background:var(--surface);padding:9px 12px;font-size:12px;font-weight:600;box-shadow:var(--shadow)}
.badge .s{width:18px;height:18px;border-radius:5px;flex:none;display:grid;place-items:center;
  background:var(--purple-soft);color:var(--purple);font-size:9px;font-weight:700;
  border:1px solid var(--purple-line)}

/* ================================================================ TIMELINE */
.tl{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;position:relative}
.tl::before{content:"";position:absolute;left:8%;right:8%;top:19px;height:1px;
  background:linear-gradient(90deg,var(--accent),var(--green));opacity:.35}
.tl-i{text-align:center}
.tl-i .n{width:38px;height:38px;border-radius:11px;margin:0 auto 16px;display:grid;place-items:center;
  background:var(--surface);border:1px solid var(--border-strong);font-family:var(--mono);font-size:11px;
  font-weight:700;color:var(--accent-dk);position:relative;z-index:1;box-shadow:var(--shadow)}
.tl-i.g .n{color:var(--green);border-color:var(--green-line);background:var(--green-soft)}
.tl-i h3{font-size:16px;font-weight:700;margin-bottom:6px}
.tl-i .w{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:10px}
.tl-i p{font-size:13.5px;color:var(--ink-2);line-height:1.6;max-width:34ch;margin:0 auto}

/* ================================================================ RESULTS */
.res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.res{padding:22px}
.res .big{font-family:var(--disp);font-size:42px;letter-spacing:-.035em;line-height:1}
.res .cap{font-size:12.5px;color:var(--ink-3);margin-top:6px}
.res blockquote{font-size:13.5px;color:var(--ink-2);line-height:1.62;margin-top:18px;padding-top:18px;
  border-top:1px solid var(--border-soft)}
.res figcaption{display:flex;align-items:center;gap:10px;margin-top:14px}
/* SWAP: replace with <img class="av" src="…" alt="" width="34" height="34"> for real headshots */
.res .av{width:34px;height:34px;border-radius:9px;flex:none;display:grid;place-items:center;
  background:var(--accent-soft);border:1px solid #CFE6F8;color:var(--accent-dk);font-family:var(--mono);
  font-size:11px;font-weight:700;object-fit:cover}
.res .nm{font-size:13px;font-weight:600}
.res .rl{font-family:var(--mono);font-size:9.5px;letter-spacing:.07em;text-transform:uppercase;
  color:var(--ink-3)}

/* ================================================================ FAQ */
.faq{display:grid;gap:9px;max-width:920px}
.q-item{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--accent);
  border-radius:var(--r);overflow:hidden}
.q-item summary{display:flex;align-items:center;gap:12px;padding:15px 17px;cursor:pointer;
  font-size:14.5px;font-weight:600;list-style:none}
.q-item summary::-webkit-details-marker{display:none}
.q-item summary::before{content:"✓";width:18px;height:18px;border-radius:50%;flex:none;display:grid;
  place-items:center;background:var(--accent-soft);border:1px solid #BEDFF8;color:var(--accent-dk);
  font-size:10px;font-weight:700}
.q-item summary::after{content:"▾";margin-left:auto;color:var(--ink-3);font-size:12px;transition:.2s}
.q-item[open]{border-left-color:var(--green)}
.q-item[open] summary::before{background:var(--green-soft);border-color:var(--green-line);color:var(--green)}
.q-item[open] summary::after{transform:rotate(180deg)}
.q-item .a{padding:0 17px 17px 47px;font-size:14px;color:var(--ink-2);line-height:1.68}

/* ================================================================ FACTS (GEO) */
.facts{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;align-items:start}

/* ================================================================ CTA / FOOT */
.cta{position:relative;overflow:hidden;color:#fff;padding:80px 0;text-align:center;background:
  radial-gradient(760px 340px at 50% 0%,rgba(23,137,220,.26),transparent 64%),var(--navy)}
.cta .wrap{position:relative;z-index:1}
.cta h2{font-size:clamp(29px,3.3vw,42px);max-width:20ch;margin:0 auto;line-height:1.1}
.cta p{color:#A9BFD6;font-size:16px;margin:18px auto 30px;max-width:56ch}
.cta .hero-cta,.cta .trust{justify-content:center}
.cta .trust li{color:#8CA3BC}
.nl{display:flex;align-items:center;gap:28px;flex-wrap:wrap;padding:26px}
.nl form{margin-left:auto;display:flex;gap:9px;flex-wrap:wrap}
.nl input{border:1px solid var(--border-strong);border-radius:var(--r);padding:11px 14px;font-size:14px;
  min-width:262px;background:var(--surface-2);color:var(--ink);font-family:inherit}
.nl input:focus{outline:0;border-color:var(--accent);background:#fff;box-shadow:0 0 0 3px rgba(23,137,220,.14)}
.rel{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;list-style:none;padding:0;margin:0}
.rel a{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;font-size:13.5px;
  font-weight:600;color:var(--ink);transition:.16s}
.rel a:hover{border-color:var(--accent);color:var(--accent-dk);transform:translateY(-2px)}
.rel a span{font-family:var(--mono);color:var(--ink-3)}
.ftr{background:#0A1522;color:#8CA3BC;padding:50px 0 28px;font-size:13.5px}
.ftr-grid{display:grid;grid-template-columns:1.4fr repeat(5,1fr);gap:28px}
.ftr h2{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:#5E7590;margin:0 0 14px;font-weight:500}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.ftr a{color:#A6BBD1}.ftr a:hover{color:#fff}
.ftr-bot{margin-top:34px;padding-top:20px;border-top:1px solid rgba(255,255,255,.09);display:flex;
  gap:16px;flex-wrap:wrap;align-items:center;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.06em;color:#5E7590}
.ftr-bot .r{margin-left:auto}

/* ================================================================ RESPONSIVE */
@media(max-width:1080px){
  .hero-grid,.two,.facts{grid-template-columns:1fr;gap:40px}
  /* 3 over 2 on a 6-track grid, so the second row fills the width */
  .hero-kpis{grid-template-columns:repeat(6,1fr)}
  .hero-kpis .kpi{grid-column:span 2}
  .hero-kpis .kpi:nth-child(n+4){grid-column:span 3;border-top:1px solid var(--border-soft)}
  .hero-kpis .kpi:nth-child(4){border-left:0}
  .grid3{grid-template-columns:repeat(2,1fr)}
  .ag-cols{grid-template-columns:repeat(3,1fr)}
  .bento{grid-template-columns:repeat(2,1fr)}
  .b-darwin{grid-column:span 2;grid-row:auto}
  .rel{grid-template-columns:repeat(3,1fr)}
  .ftr-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
  .nav{display:none}
  .modes,.res-grid,.tl,.grid2{grid-template-columns:1fr}
  .tl::before{display:none}
  .sw-grid{grid-template-columns:1fr}
  .sw-div{width:auto;height:1px}
  .sec{padding:56px 0}
  .hero{padding:36px 0 44px}
  .nl form{margin-left:0;width:100%}.nl input{flex:1;min-width:0}
  .c-agents{grid-template-columns:1fr}
}
@media(max-width:560px){
  /* 2 + 2 + the saving full-width: no orphan cell, no overflowing value */
  .hero-kpis{grid-template-columns:1fr 1fr}
  .hero-kpis .kpi:nth-child(n){grid-column:auto;padding:15px 16px;min-width:0}
  .hero-kpis .kpi:nth-child(even){border-left:1px solid var(--border-soft)}
  .hero-kpis .kpi:nth-child(odd){border-left:0}
  .hero-kpis .kpi:nth-child(n+3){border-top:1px solid var(--border-soft)}
  .hero-kpis .kpi:nth-child(5){grid-column:1/-1}
  .hero-kpis .k-v{font-size:24px}
  .ag-cols,.bento,.rel,.ftr-grid,.grid3{grid-template-columns:1fr}
  .b-darwin,.b-social,.b-analytics{grid-column:span 1}
  .c-apv-f .nb{margin-left:0;width:100%}
  .persona{width:100%}.persona label{flex:1;justify-content:center}
  .hdr-cta .btn-dk,.hdr-live{display:none}
}
@media(max-width:560px){.hdr-cta a:not(.btn-pri){display:none}.hdr .wrap{gap:12px}}

.mnav{display:none;position:static}
.mnav>summary{list-style:none;cursor:pointer;width:40px;height:40px;border-radius:8px;
  display:grid;place-items:center;border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.07)}
.mnav>summary::-webkit-details-marker,.mnav summary::-webkit-details-marker{display:none}
.mnav>summary:focus-visible{outline:2px solid #fff;outline-offset:2px}
.mnav-ico,.mnav-ico::before,.mnav-ico::after{display:block;width:18px;height:2px;
  border-radius:2px;background:#fff;transition:transform .15s,opacity .15s}
.mnav-ico{position:relative}
.mnav-ico::before,.mnav-ico::after{content:"";position:absolute;left:0}
.mnav-ico::before{top:-6px}
.mnav-ico::after{top:6px}
.mnav[open] .mnav-ico{background:transparent}
.mnav[open] .mnav-ico::before{transform:translateY(6px) rotate(45deg)}
.mnav[open] .mnav-ico::after{transform:translateY(-6px) rotate(-45deg)}
.mnav-panel{position:absolute;left:0;right:0;top:100%;background:#0E1E30;
  border-bottom:1px solid rgba(255,255,255,.1);box-shadow:0 18px 40px rgba(0,0,0,.35);
  max-height:calc(100vh - 64px);overflow-y:auto;overscroll-behavior:contain;padding:8px 16px 20px}
.mnav-panel a,.mnav-panel summary{display:block;color:#D6E2EE;text-decoration:none;
  font-size:16px;font-weight:500;padding:13px 4px;border-bottom:1px solid rgba(255,255,255,.08)}
.mnav-panel summary{list-style:none;cursor:pointer;position:relative}
.mnav-panel summary::after{content:"+";position:absolute;right:6px;top:50%;
  transform:translateY(-50%);font-size:20px;font-weight:400;color:#8FA6BE}
.mnav-panel details[open]>summary::after{content:"\2212"}
.mnav-panel [aria-current]{color:#fff}
.mnav-sub{padding:2px 0 8px 14px;border-bottom:1px solid rgba(255,255,255,.08)}
.mnav-sub a{font-size:15px;padding:10px 4px;border-bottom:0;color:#B9CBDF;
  display:flex;align-items:center;gap:10px}
.mnav-ic{flex:none;width:24px;height:24px;border-radius:7px;display:grid;place-items:center;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);font-size:12px;
  color:#8FA6BE}
.mnav-panel a:hover,.mnav-panel summary:hover{color:#fff}
.mnav-cta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.mnav-cta .btn{display:flex;border-bottom:1px solid rgba(255,255,255,.2);color:#fff;padding:12px}
@media(max-width:960px){.mnav{display:block}}
/* Six nav items and three buttons need ~1100px. From 961px to there the header
   ran 58px off the right edge and cut off "Start free" (seen at 1024px, which
   preflight now checks). Below 1120px the menu button takes over instead. */
@media(max-width:1120px){.hdr .nav{display:none}.mnav{display:block}}
.mnav-h{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:#8FA6BE;margin:12px 0 2px 4px}
/* Platform mega menu. .has-mega is position:static so the panel anchors to the
   sticky header and centres on the page, not on the menu item. The panel
   starts 12px above the header's bottom edge so the pointer never crosses a
   gap on its way down from the trigger. */
.nav-i.has-mega{position:static}
.nav-mega{position:absolute;left:50%;top:calc(100% - 12px);transform:translateX(-50%) translateY(-6px);
  padding-top:12px;width:min(1180px,calc(100vw - 28px));opacity:0;visibility:hidden;
  pointer-events:none;transition:opacity .16s,transform .16s}
.nav-i.has-mega:hover .nav-mega,.nav-i.has-mega:focus-within .nav-mega{
  opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.mega-in{display:grid;grid-template-columns:1fr 252px;grid-template-areas:"cols rail" "foot foot";
  gap:18px 22px;background:var(--surface);border:1px solid var(--border);border-radius:16px;
  padding:22px 22px 0;box-shadow:0 26px 60px rgba(15,30,46,.22),0 2px 6px rgba(15,30,46,.06)}
.mega-cols{grid-area:cols;display:grid;grid-template-columns:repeat(4,1fr);gap:4px 14px}
.mega-col{display:flex;flex-direction:column;gap:1px}
.mega-h{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 8px 10px}
.mega-col a{display:flex;gap:10px;align-items:flex-start;text-decoration:none;padding:8px 10px;
  border-radius:10px;transition:background .12s}
.mega-col a:hover,.mega-col a:focus-visible{background:var(--accent-soft)}
/* The tile is what stops four columns of links reading as a wall of text: it
   gives every row the same left edge and one spot of colour on hover. */
/* Each section gets its own hue, so the four columns read as four groups at a
   glance: overview blue, marketing violet, sales green, insight amber. */
.mega-col{--c:var(--accent);--c-soft:var(--accent-soft);--c-line:#B9DCF6}
.mega-col:nth-child(2){--c:var(--violet);--c-soft:var(--violet-soft);--c-line:var(--violet-line)}
.mega-col:nth-child(3){--c:var(--green);--c-soft:var(--green-soft);--c-line:var(--green-line)}
.mega-col:nth-child(4){--c:var(--amber);--c-soft:var(--amber-soft);--c-line:var(--amber-line)}
.mega-ic{flex:none;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;
  background:var(--c-soft);border:1px solid var(--c-line);color:var(--c);
  font-size:13px;line-height:1;transition:background .12s,color .12s,border-color .12s}
.mega-col a:hover .mega-ic{background:var(--c);border-color:var(--c);color:#fff}
.mega-t{display:block;min-width:0}
.mega-l{display:block;color:var(--ink);font-size:14px;font-weight:600;line-height:1.3}
.mega-col a:hover .mega-l{color:var(--accent-dk)}
.mega-n{display:block;color:var(--ink-3);font-size:12px;margin-top:2px;line-height:1.4}
/* Named on the menu, not discovered on the pricing page. */
.mega-pill{display:inline-block;margin-left:7px;padding:1px 6px;border-radius:5px;
  font-family:var(--mono);font-size:8.5px;letter-spacing:.09em;text-transform:uppercase;
  vertical-align:middle;background:var(--amber-soft);color:#7A5107;border:1px solid var(--amber-line)}
.mega-rail{grid-area:rail;display:flex;flex-direction:column}
.mega-feat{display:block;text-decoration:none;border-radius:12px;padding:16px;height:100%;
  background:linear-gradient(160deg,#17334F,#0E1E30);border:1px solid rgba(255,255,255,.08);
  transition:transform .14s,box-shadow .14s}
.mega-feat:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(15,30,46,.24)}
.mega-feat-ic{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;
  background:rgba(23,137,220,.22);color:#5FB2EE;font-size:15px;margin-bottom:12px}
.mega-feat-t{display:block;color:#fff;font-family:var(--disp);font-size:17px;font-weight:800;
  letter-spacing:-.01em}
.mega-feat-n{display:block;color:#A9BFD6;font-size:12.5px;line-height:1.5;margin-top:6px}
.mega-feat-go{display:block;color:#5FB2EE;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.08em;text-transform:uppercase;margin-top:12px}
.mega-foot{grid-area:foot;display:flex;align-items:center;justify-content:space-between;gap:16px;
  border-top:1px solid var(--border);margin:0 -22px;padding:12px 22px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--ink-3);
  background:var(--surface-2);border-radius:0 0 16px 16px}
.mega-foot-go{display:flex;gap:16px}
.mega-foot a{color:var(--accent-dk);text-decoration:none}
.mega-foot a:hover{text-decoration:underline}
@media(max-width:1180px){.mega-in{grid-template-columns:1fr;grid-template-areas:"cols" "rail" "foot"}
  .mega-rail{display:none}}

.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.dp{background:linear-gradient(180deg,var(--surface-2),var(--bg))}
.dp-intro{max-width:720px}
.dp-intro h2{margin-bottom:12px;font-size:clamp(30px,3.6vw,44px);line-height:1.1}
.dp-top{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-bottom:10px}
.dp-top .eyebrow{margin:0}
.dp-live{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--green);
  background:var(--green-soft);border:1px solid var(--green-line);border-radius:999px;padding:4px 11px}
.dp-live i{width:7px;height:7px;border-radius:50%;background:var(--green);animation:dppulse 1.8s ease-out infinite}
@keyframes dppulse{0%{box-shadow:0 0 0 0 rgba(14,159,110,.55)}100%{box-shadow:0 0 0 8px rgba(14,159,110,0)}}
/* The form is the point of the section, so it gets the one dark, glowing panel on the page. */
.dp-panel{max-width:760px;margin:24px 0 18px;padding:24px 26px 18px;border-radius:18px;color:#fff;
  background:radial-gradient(120% 140% at 0% 0%,#17314D 0%,#0E1E30 60%);
  box-shadow:0 0 0 1px rgba(55,166,240,.35),0 18px 50px rgba(23,137,220,.28)}
.dp-panel label.dp-lab{display:block;font-weight:700;font-size:15px;margin:0 0 12px;color:#fff}
.dp-form{display:flex;gap:10px;margin:0 0 12px}
.dp-form input{flex:1;min-width:0;font:inherit;font-size:17px;padding:15px 16px;border:1px solid transparent;
  border-radius:12px;background:#fff;color:var(--ink)}
.dp-form input:focus{outline:3px solid var(--accent-hi);outline-offset:1px}
.dp-fine{font-size:12.5px;color:#9FB3C8;margin:0}
.dp-chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 24px}
.dp-chips span{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-3);align-self:center;margin-right:4px}
.dp-chip{font:inherit;font-size:13px;padding:7px 12px;border-radius:999px;border:1px solid var(--border);
  background:var(--surface);color:var(--ink-2);cursor:pointer}
.dp-chip:hover{border-color:var(--accent);color:var(--accent-dk)}
.dp-chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
.dp-steps{list-style:none;margin:0 0 20px;padding:18px 20px;border:1px solid var(--border);border-radius:14px;
  background:var(--surface);display:grid;gap:9px;max-width:640px}
.dp-steps[hidden],.dp-msg[hidden]{display:none}
.dp-steps li{font-size:14px;color:var(--ink-3);display:flex;gap:10px;align-items:center}
.dp-steps li::before{content:"";width:14px;height:14px;border-radius:50%;border:2px solid var(--border);flex:none}
.dp-steps li.on{color:var(--ink)}
.dp-steps li.on::before{border-color:var(--accent);border-right-color:transparent;animation:dpspin .8s linear infinite}
.dp-steps li.done{color:var(--ink-2)}
.dp-steps li.done::before{border-color:var(--green);background:var(--green);animation:none}
@keyframes dpspin{to{transform:rotate(360deg)}}
.dp-msg{padding:12px 16px;border-radius:12px;background:var(--amber-soft);border:1px solid var(--amber-line);
  color:#7A5107;font-size:14px;margin:0 0 18px;max-width:640px}
.dp-out{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:26px;
  box-shadow:0 18px 44px rgba(15,30,46,.08);scroll-margin-top:84px}
.dp-out:focus{outline:none}
.dp-out.dp-live{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft),0 18px 44px rgba(15,30,46,.08)}
.dp-out.dp-new{animation:dpglow 1.1s ease-out 3}
@keyframes dpglow{0%{box-shadow:0 0 0 0 rgba(23,137,220,.55),0 18px 44px rgba(15,30,46,.08)}
  100%{box-shadow:0 0 0 18px rgba(23,137,220,0),0 18px 44px rgba(15,30,46,.08)}}
.dp-form button[disabled]{opacity:.75;cursor:progress}
.dp-head{display:grid;grid-template-columns:1.4fr 1fr;gap:22px;align-items:start}
.dp-eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin:0 0 6px}
.dp-head h3{font-size:24px;margin:0 0 6px}
.dp-head p{margin:0;color:var(--ink-2)}
.dp-aud{display:block;margin-top:6px;color:var(--ink-3);font-size:14px}
.dp-obs{background:var(--violet-soft);border:1px solid var(--violet-line);border-radius:12px;padding:14px 16px;
  font-size:14px;color:var(--ink-2)}
.dp-obs span,.dp-m span,.dp-wk{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--violet);margin-bottom:4px}
.dp-h{font-size:15px;margin:26px 0 10px}
.dp-pris{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.dp-pri{border:1px solid var(--border);border-radius:12px;padding:16px;position:relative}
.dp-pri h4{font-size:15px;margin:0 0 6px;padding-right:26px}
.dp-pri p{font-size:13.5px;color:var(--ink-2);margin:0 0 8px}
.dp-n{position:absolute;top:14px;right:14px;width:22px;height:22px;border-radius:50%;background:var(--accent-soft);
  color:var(--accent-dk);font-size:12px;font-weight:700;display:grid;place-items:center}
.dp-m{border-top:1px dashed var(--border);padding-top:8px;margin:0!important}
.dp-m span{color:var(--green)}
.dp-phases{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.dp-phases>li{border-left:3px solid var(--accent);background:var(--surface-2);border-radius:0 12px 12px 0;padding:14px 16px}
.dp-phases strong{display:block;font-size:14.5px;margin-bottom:6px}
.dp-phases .dp-wk{color:var(--accent)}
.dp-phases ul{margin:0;padding-left:18px;font-size:13.5px;color:var(--ink-2)}
.dp-phases ul li{margin:4px 0}
.dp-two{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.dp-agents{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.dp-agents li{font-size:13.5px;color:var(--ink-2);border:1px solid var(--border);border-radius:10px;padding:10px 12px}
.dp-agent{display:inline-block;font-weight:700;color:var(--ink);margin-right:8px}
.dp-card{border:1px solid var(--violet-line);border-radius:12px;overflow:hidden;margin-bottom:12px;background:var(--surface)}
.dp-card-h{background:var(--violet-soft);font-family:var(--mono);font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--violet);padding:8px 14px}
.dp-subj{font-weight:700;margin:12px 14px 4px;font-size:14.5px}
.dp-body{margin:0 14px 12px;font-size:13.5px;color:var(--ink-2)}
.dp-acts{display:flex;gap:8px;padding:10px 14px;border-top:1px solid var(--border);font-size:12.5px}
.dp-acts span{padding:5px 12px;border:1px solid var(--border);border-radius:8px;color:var(--ink-2)}
.dp-acts .dp-ok{background:var(--green);border-color:var(--green);color:#fff}
.dp-cta{display:inline-block;margin:0 14px 14px;padding:7px 14px;border-radius:8px;background:var(--accent);
  color:#fff;font-size:13px;font-weight:600}
.dp-as{font-size:12.5px;color:var(--ink-3);margin:20px 0 0}
.dp-note{color:var(--ink-2)}
/* Until someone engages, the sample is a preview so it does not outweigh the form. */
.dp-out.dp-peek{max-height:520px;overflow:hidden}
.dp-out.dp-peek::after{content:"";position:absolute;left:0;right:0;bottom:0;height:180px;
  background:linear-gradient(180deg,rgba(255,255,255,0),var(--surface) 75%);pointer-events:none}
.dp-more{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:1;font:inherit;font-size:14px;
  font-weight:600;padding:10px 18px;border-radius:999px;border:1px solid var(--border);background:var(--surface);
  color:var(--accent-dk);cursor:pointer;box-shadow:0 6px 18px rgba(15,30,46,.1)}
.dp-more:hover{border-color:var(--accent)}
.dp-more[hidden]{display:none}
.dp-foot{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:22px}
.dp-foot small{color:var(--ink-3);font-size:12.5px}
@media(max-width:900px){.dp-head,.dp-two{grid-template-columns:1fr}.dp-pris,.dp-phases{grid-template-columns:1fr}}
@media(max-width:560px){.dp-form{flex-direction:column}.dp-out{padding:18px}.dp-panel{padding:18px}}


.mt-cc{position:fixed;left:16px;right:16px;bottom:16px;z-index:1000;max-width:520px;margin-right:auto;
  background:#0E1E30;color:#fff;border-radius:12px;padding:16px 18px;box-shadow:0 10px 30px rgba(0,0,0,.28);
  font:14px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif}
.mt-cc p{margin:0 0 12px;color:#fff}
.mt-cc a{color:#9CCBF2}
.mt-cc div{display:flex;gap:8px}
.mt-cc button{font:inherit;font-weight:600;flex:1 1 0;padding:9px 14px;border-radius:8px;cursor:pointer;
  border:1px solid #5FB2EE;background:#0E1E30;color:#fff}
.mt-cc button:hover{background:#17314D}
.mt-cc button:focus-visible{outline:2px solid #fff;outline-offset:2px}
.mt-cc .s{display:none}
@media(max-width:600px){
  .mt-cc{left:8px;right:8px;bottom:8px;padding:10px 12px;border-radius:10px;font-size:13px;line-height:1.4}
  .mt-cc p{margin:0 0 8px}
  .mt-cc .l{display:none}.mt-cc .s{display:inline}
  .mt-cc button{padding:7px 10px}
}


.mt-chatbot-container:not(.mt-inline) .mt-chatbot-window{width:400px;height:min(620px,calc(100vh - 110px))}
@media(max-width:480px){.mt-chatbot-container:not(.mt-inline) .mt-chatbot-window{width:calc(100vw - 40px);height:calc(100vh - 120px)}}
/* The cookie banner sits bottom-left; on a phone it spans the width, so lift the launcher over it. */
@media(max-width:600px){body:has(.mt-cc) .mt-chatbot-container:not(.mt-inline){bottom:136px}}

/* Promotional pages share the live Marketing Titan design system. */
main{display:block}main>*{order:initial}.rv{opacity:1;transform:none}.promo-links{display:flex;flex-wrap:wrap;gap:18px;padding:15px 0;font-size:12px}.promo-links a{color:var(--ink-2)}.promo-links a[aria-current]{color:var(--accent);font-weight:700}.promo-links-wrap{border-bottom:1px solid var(--border);background:var(--surface)}.promo-visual .ag{opacity:1}.promo-visual .c-body{padding:24px}.promo-visual h2{font-size:24px;margin:16px 0}.promo-visual p{color:var(--ink-2);font-size:14px}.promo-visual .grid2{margin:20px 0}.promo-visual .card{padding:13px;box-shadow:none}.promo-visual .card h3{font-size:13px}.promo-visual .card p{font-size:12px}.promo-visual .banner{margin-top:18px}.promo-cards .card{padding:25px}.promo-cards .card p{color:var(--ink-2);margin:9px 0 18px;font-size:14px}.promo-cards .card a{margin-top:auto;font-size:13px;font-weight:600}.promo-cards .card h3{font-size:19px}.flow{counter-reset:step}.flow .card:before{counter-increment:step;content:'0' counter(step);font-family:var(--mono);color:var(--accent);font-size:13px;margin-bottom:12px}.cta-prom{background:var(--navy);color:white}.cta-prom p{color:#B9CBDF}.cta-prom .wrap{text-align:center}.cta-prom .sec-intro{margin:0 auto 25px}.cta-prom .hero-cta{justify-content:center}.faq-prom{max-width:880px}.faq-prom details{border-bottom:1px solid var(--border);padding:20px 0}.faq-prom summary{font-weight:600;cursor:pointer}.faq-prom details p{color:var(--ink-2);padding-top:12px}.text-links{display:flex;flex-wrap:wrap;gap:12px 25px;margin-top:25px}.agent-group ul{padding-left:20px;color:var(--ink-2);margin-bottom:20px}.table-scroll{overflow-x:auto}.tbl td{min-width:160px}.disclaimer{color:var(--ink-2);font-size:13px;max-width:850px;margin-top:22px}.section-lead{margin-bottom:25px;color:var(--ink-2);max-width:800px}.promo-visual .pill{white-space:normal}@media(max-width:700px){.promo-links{gap:10px 18px}.promo-visual .c-body{padding:17px}.promo-cards .grid3,.promo-cards .grid2{grid-template-columns:1fr}.hero-grid{gap:28px}.table-scroll{border-radius:12px}.sec{padding:52px 0}}