/* =========================================================
   PIXELGRAVITAS — 2026 design system
   Shared stylesheet for every page. One file, cached once,
   linked from includes/header.php as /assets/css/style.css
   ========================================================= */
:root{
  --ground:#0D0A08; --surface:#161110; --sunk:#120E0C; --veil:rgba(13,10,8,.82);
  --ink:#F2ECE4; --ink-2:#B6A99E; --muted:#8A7D72;
  --line:#2B221C; --hair:#1E1815;
  --panel:#1E1713; --panel-2:#291F19;
  --band:#1B1512; --band-2:#131010;
  --clay:#E58A6A; --clay-soft:#2C1811;
  --brass:#E8B854; --brass-soft:#2C2314; --brass-edge:#5A4826;
  --act:#E8B854; --act-soft:#2C2314; --act-edge:#5A4826;
  --sage:#8FB98A; --sage-soft:#182015;
  --ok:#8FB98A; --warn:#E8B854; --crit:#E58A6A;
  --sh-1:0 1px 2px rgba(0,0,0,.6);
  --sh-2:0 4px 12px rgba(0,0,0,.5),0 18px 48px rgba(0,0,0,.42);
  --sh-3:0 30px 84px rgba(0,0,0,.6);
  --on:#F2ECE4; --on-2:#B6A99E; --on-line:#3A2E26; --on-sunk:#0A0706;
  --on-brass:#E8B854; --on-act:#E58A6A; --on-sage:#8FB98A;
  --r-lg:26px; --r-md:18px; --r-sm:12px;
  --maxw:1220px;
  --t:380ms cubic-bezier(.32,.72,.28,1);
  --spring:640ms cubic-bezier(.22,1.05,.36,1);
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --ground:#F7F3EF; --surface:#FFFFFF; --sunk:#EDE7DF; --veil:rgba(247,243,239,.82);
    --ink:#1A1512; --ink-2:#4C433D; --muted:#6B6058;
    --line:#DFD6CC; --hair:#EBE4DB;
    --panel:#201915; --panel-2:#2C231D;
    --band:#EDE7DF; --band-2:#E4DCD2;
    --clay:#8A4A2B; --clay-soft:#F7E4DA;
    --brass:#8E5D05; --brass-soft:#F7E9CC; --brass-edge:#DCC38A;
    --act:#1A1512; --act-soft:#EDE7DF; --act-edge:#CFC3B7;
    --sage:#4C6B4A; --sage-soft:#E2EADD;
    --ok:#4C6B4A; --warn:#8E5D05; --crit:#8A4A2B;
    --sh-1:0 1px 2px rgba(26,21,18,.05);
    --sh-2:0 4px 10px rgba(26,21,18,.05),0 16px 40px rgba(26,21,18,.07);
    --sh-3:0 24px 70px rgba(26,21,18,.16);
    --on-sunk:#1A1410;
  }
}
:root[data-theme="light"]{
  --ground:#F7F3EF; --surface:#FFFFFF; --sunk:#EDE7DF; --veil:rgba(247,243,239,.82);
  --ink:#1A1512; --ink-2:#4C433D; --muted:#6B6058;
  --line:#DFD6CC; --hair:#EBE4DB;
  --panel:#201915; --panel-2:#2C231D;
  --clay:#8A4A2B; --clay-soft:#F7E4DA;
  --brass:#8E5D05; --brass-soft:#F7E9CC; --brass-edge:#DCC38A;
  --act:#1A1512; --act-soft:#EDE7DF; --act-edge:#CFC3B7;
  --sage:#4C6B4A; --sage-soft:#E2EADD;
  --ok:#4C6B4A; --warn:#8E5D05; --crit:#8A4A2B;
  --sh-1:0 1px 2px rgba(26,21,18,.05);
  --sh-2:0 4px 10px rgba(26,21,18,.05),0 16px 40px rgba(26,21,18,.07);
  --sh-3:0 24px 70px rgba(26,21,18,.16);
  --on-sunk:#1A1410;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--ground);color:var(--ink);overflow-x:clip;
  font-family:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:17px;line-height:1.58;-webkit-font-smoothing:antialiased;
  transition:background var(--t),color var(--t);
}
h1,h2,h3,h4{margin:0;font-family:"Bricolage Grotesque","Instrument Sans",sans-serif;font-weight:700;letter-spacing:-.035em;text-wrap:balance;line-height:1.03}
p{margin:0} ul{margin:0;padding:0;list-style:none} a{color:inherit;text-decoration:none}
svg{display:block}
:focus-visible{outline:3px solid var(--act);outline-offset:3px;border-radius:6px}

.shell{max-width:var(--maxw);margin:0 auto;padding:0 26px}
section{padding:clamp(70px,8.5vw,118px) 0;scroll-margin-top:92px}
section.tight-top{padding-top:0}

.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:500;
  letter-spacing:.15em;text-transform:uppercase;color:var(--clay);
  background:var(--clay-soft);padding:7px 15px;border-radius:999px;
}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brass);flex:none}

h2{font-size:clamp(33px,4.3vw,54px)}
.dek{margin-top:20px;max-width:55ch;font-size:18px;line-height:1.6;color:var(--ink-2)}
.sec-head{display:flex;flex-direction:column;align-items:flex-start;gap:18px;margin-bottom:48px}

.rv{transform:translateY(16px);transition:transform var(--spring)}
.rv.in{transform:none}
@media (prefers-reduced-motion:reduce){.rv{transform:none;transition:none}}

/* ---------- breadcrumb ---------- */
.crumb{display:flex;align-items:center;gap:8px;font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--on-2)}
.hero .crumb{margin-bottom:18px}
.crumb a{color:var(--on-2);transition:color 200ms} .crumb a:hover{color:var(--on-brass)}
.crumb span.sep{opacity:.5}
.crumb span.cur{color:var(--on-brass)}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:70;background:var(--veil);backdrop-filter:saturate(1.6) blur(18px);border-bottom:1px solid var(--hair);transition:background var(--t),border-color var(--t)}
.hdr-in{max-width:var(--maxw);margin:0 auto;padding:0 26px;height:76px;display:flex;align-items:center;gap:24px}
.mark{display:flex;align-items:center;gap:11px;flex:none}
.mark-g{width:28px;height:28px;flex:none}
.mark-t{font-family:"Bricolage Grotesque",sans-serif;font-size:19px;font-weight:800;letter-spacing:-.045em}
.mark-t i{font-style:normal;color:var(--muted);font-weight:600}
.nav{display:flex;align-items:center;gap:2px;margin-left:4px}
.nav a{padding:9px 14px;border-radius:999px;font-size:15px;font-weight:500;color:var(--ink-2);transition:color 200ms,background 200ms}
.nav a:hover{color:var(--clay);background:var(--clay-soft)}
.nav a.ag{color:var(--brass)}
.nav a.ag:hover{background:var(--brass-soft)}
.nav a[aria-current="page"]{color:var(--clay);background:var(--clay-soft)}
.hdr-r{margin-left:auto;display:flex;align-items:center;gap:12px}

/* ---------- mega-menu nav (per Navigation FINAL sheet) ---------- */
.navbtn{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:999px;font-size:15px;font-weight:500;color:var(--ink-2);background:none;border:0;cursor:pointer;font-family:inherit;transition:color 200ms,background 200ms}
.navbtn:hover,.navbtn[aria-expanded="true"]{color:var(--clay);background:var(--clay-soft)}
.navbtn.ag{color:var(--brass)}
.navbtn.ag:hover,.navbtn.ag[aria-expanded="true"]{background:var(--brass-soft)}
.navbtn svg{width:10px;height:10px;transition:transform 220ms}
.navbtn[aria-expanded="true"] svg{transform:rotate(180deg)}
.navlink{padding:9px 14px;border-radius:999px;font-size:15px;font-weight:500;color:var(--ink-2);transition:color 200ms,background 200ms}
.navlink:hover{color:var(--clay);background:var(--clay-soft)}
.navlink[aria-current="page"]{color:var(--clay);background:var(--clay-soft)}

.mega{position:absolute;top:100%;left:0;right:0;z-index:90;
  background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  box-shadow:var(--sh-2);overflow-x:auto}
.mega[hidden]{display:none}
.mega-in{max-width:var(--maxw);margin:0 auto;padding:28px 26px 24px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
.mega-1col .mega-in{grid-template-columns:1fr;max-width:400px;margin:0}
.mega-col{display:flex;flex-direction:column;gap:2px;min-width:0}
.mega-col h5{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--brass);margin-bottom:12px}
.mega-col ul{display:flex;flex-direction:column;gap:2px}
.mega-col li a{display:block;padding:7px 8px;margin:0 -8px;border-radius:8px;font-size:14px;color:var(--ink-2);transition:color 180ms,background 180ms}
.mega-col li a:hover{color:var(--clay);background:var(--clay-soft)}
.mega-col li a.hub{font-weight:600;color:var(--ink)}
.mega-sub{font-family:"IBM Plex Mono",monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:13px 0 3px}
.mega-col .mega-sub:first-child{margin-top:0}
.mega-ai{margin-top:14px;padding-top:12px;border-top:1px solid var(--hair);display:flex;flex-direction:column;gap:6px}
.mega-ai.flush{margin-top:0;padding-top:0;border-top:0}
.soon-pill{align-self:flex-start;font-family:"IBM Plex Mono",monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--warn);background:var(--brass-soft);border:1px dashed var(--brass-edge);padding:3px 9px;border-radius:999px}
.soon-pill.top{margin-top:10px}
.mega-ai .aiitem{font-size:13.5px;color:var(--muted);padding:2px 8px}
.aiitem.mobile{display:block;padding:9px 6px;font-size:15px;color:var(--muted)}

/* ---------- "by platform" rail beneath the Services mega columns ---------- */
.mrail{display:flex;flex-wrap:wrap;align-items:center;gap:9px;max-width:var(--maxw);margin:22px auto 0;padding:18px 26px 0;border-top:1px solid var(--hair)}
.mrail .rk{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-right:4px}
.pf{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--ground);font-size:14px;font-weight:500;color:var(--ink-2);transition:border-color 200ms,color 200ms,background 200ms}
.pf:hover{border-color:var(--clay);color:var(--clay);background:var(--clay-soft)}
.pf u{text-decoration:none;font-family:"IBM Plex Mono",monospace;font-size:9.5px;color:var(--muted)}
.mnote{max-width:var(--maxw);margin:12px auto 24px;padding:0 26px;font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.05em;color:var(--muted);line-height:1.5}

/* ---------- agency mega: inline case-study callout ---------- */
.agcs{display:block;margin-top:15px;padding:13px 14px;border-radius:12px;background:var(--brass-soft);border:1px solid var(--brass-edge)}
.agcs b{display:block;font-size:13.5px;font-weight:600;color:var(--ink);letter-spacing:-.015em}
.agcs span{display:block;font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.45}

@media (max-width:1200px){.mega-in{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:22px}}

/* ---------- hamburger + mobile panel ---------- */
.hbtn{display:none;appearance:none;border:1px solid var(--line);background:var(--surface);border-radius:10px;width:40px;height:40px;align-items:center;justify-content:center;cursor:pointer;flex:none}
.hbtn svg{width:18px;height:18px}
.mnav{display:none}
.mnav[data-open="true"]{display:block;position:fixed;inset:66px 0 0 0;z-index:75;background:var(--ground);overflow-y:auto;padding:20px 18px 100px}
.mnav .mgroup{border-bottom:1px solid var(--hair);padding:6px 0}
.mnav details summary{list-style:none;cursor:pointer;padding:14px 4px;font-size:16.5px;font-weight:600;display:flex;justify-content:space-between;align-items:center}
.mnav details summary::-webkit-details-marker{display:none}
.mnav details summary::after{content:"";width:9px;height:9px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform 240ms}
.mnav details[open] summary::after{transform:rotate(225deg)}
.mnav .msub{padding:0 4px 14px;display:flex;flex-direction:column;gap:2px}
.mnav .msub h6{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass);margin:12px 0 4px}
.mnav .msub a{padding:9px 6px;font-size:15px;color:var(--ink-2)}
.mnav a.mlink{display:block;padding:16px 4px;font-size:16.5px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--hair)}
.mnav .mcta{margin-top:20px;width:100%}

.theme{position:relative;display:flex;align-items:center;padding:3px;border:1px solid var(--line);border-radius:999px;background:var(--surface)}
.theme button{position:relative;z-index:2;appearance:none;border:0;background:none;cursor:pointer;font-family:"IBM Plex Mono",monospace;font-size:9.5px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);padding:7px 12px;border-radius:999px;display:flex;align-items:center;gap:6px;transition:color 240ms}
.theme button svg{width:13px;height:13px}
.theme button[aria-pressed="true"]{color:#140F0C}
.theme-slide{position:absolute;z-index:1;top:3px;left:3px;width:calc(50% - 3px);height:calc(100% - 6px);border-radius:999px;background:var(--brass);transition:transform var(--spring),background var(--t)}
.theme[data-pos="night"] .theme-slide{transform:translateX(100%)}
:root[data-theme="light"] .theme-slide{background:var(--panel)}
:root[data-theme="light"] .theme button[aria-pressed="true"]{color:#F7F3EF}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .theme-slide{background:var(--panel)}
:root:not([data-theme="dark"]) .theme button[aria-pressed="true"]{color:#F7F3EF}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:15.5px;font-weight:600;letter-spacing:-.01em;padding:15px 24px;border-radius:999px;border:1.5px solid transparent;cursor:pointer;transition:transform var(--spring),background 240ms,border-color 240ms,color 240ms,box-shadow 240ms}
.btn:hover{transform:translateY(-2.5px)}
.btn:active{transform:translateY(0)}
.btn .ar{transition:transform 240ms}
.btn:hover .ar{transform:translateX(4px)}
.btn-p{background:var(--act);color:var(--ground);box-shadow:0 3px 14px rgba(26,21,18,.22)}
.btn-p:hover{box-shadow:0 12px 34px rgba(26,21,18,.26)}
.on-panel .btn-p{background:var(--on-brass);color:var(--panel);box-shadow:0 3px 14px rgba(232,184,84,.22)}
.on-panel .btn-p:hover{box-shadow:0 14px 36px rgba(232,184,84,.3)}
.btn-s{background:var(--surface);color:var(--ink);border-color:var(--line)}
.btn-s:hover{border-color:var(--clay);color:var(--clay)}
.btn-sm{padding:11px 19px;font-size:14.5px}
.on-panel .btn-s{background:rgba(255,255,255,.07);color:var(--on);border-color:var(--on-line)}
.on-panel .btn-s:hover{background:rgba(255,255,255,.14);border-color:var(--on-sage);color:var(--on-sage)}

/* ---------- page hero ---------- */
.hero{background:var(--panel);color:var(--on);position:relative;overflow:hidden;transition:background var(--t)}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(880px 520px at 82% 0%, rgba(232,184,84,.16), transparent 60%),
    radial-gradient(660px 480px at 0% 100%, rgba(229,138,106,.12), transparent 62%),
    radial-gradient(circle at 1px 1px, rgba(255,255,255,.05) 1px, transparent 0);
  background-size:auto,auto,24px 24px;
}
.hero-in{position:relative;max-width:var(--maxw);margin:0 auto;padding:clamp(44px,5.5vw,64px) 26px clamp(52px,6vw,76px)}
.hero .eyebrow{color:var(--on-sage);background:rgba(232,184,84,.13)}
.hero .eyebrow::before{background:var(--on-brass)}
h1{font-family:"Bricolage Grotesque",sans-serif;font-size:clamp(38px,5vw,60px);font-weight:800;letter-spacing:-.045em;line-height:1.02;margin-top:22px;color:var(--on);max-width:18ch}
.hero-dek{margin-top:22px;max-width:56ch;font-size:18.5px;line-height:1.58;color:var(--on-2)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.assure{display:flex;flex-wrap:wrap;gap:9px 22px;margin-top:22px;font-size:14px;color:var(--on-2)}
.assure span{display:flex;align-items:center;gap:8px}
.assure svg{width:15px;height:15px;flex:none;color:var(--on-sage)}

/* ---------- proof band ---------- */
.proof{background:var(--sunk);border-bottom:1px solid var(--hair);transition:background var(--t)}
.proof-in{max-width:var(--maxw);margin:0 auto;padding:34px 26px}
.proof-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.pcell{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:20px 22px;display:flex;flex-direction:column;gap:7px;min-height:112px;transition:border-color 260ms,transform 260ms}
.pcell:hover{border-color:var(--clay);transform:translateY(-3px)}
.pcell .pk{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.pcell .pv{font-family:"Bricolage Grotesque",sans-serif;font-size:30px;font-weight:700;letter-spacing:-.038em;line-height:1.06;font-variant-numeric:tabular-nums}
.pcell .ps{font-size:13.5px;color:var(--muted);line-height:1.45}

/* ---------- pricing ---------- */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px 26px;display:flex;flex-direction:column;gap:14px;transition:transform var(--spring),box-shadow 300ms,border-color 300ms}
.plan:hover{transform:translateY(-5px);box-shadow:var(--sh-2)}
.plan.feat{background:var(--panel);color:var(--on);border-color:var(--panel);box-shadow:var(--sh-3)}
.plan.feat h3{color:var(--on)} .plan.feat .pd{color:var(--on-2)} .plan.feat li{color:var(--on-2)}
.plan.feat li::before{background:var(--on-sage)}
.plan .tag{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.11em;text-transform:uppercase;padding:5px 12px;border-radius:999px;align-self:flex-start;color:var(--brass);background:var(--brass-soft)}
.plan.feat .tag{color:var(--panel);background:var(--on-brass)}
.plan h3{font-size:23px;font-weight:700;letter-spacing:-.03em}
.plan .amt{font-family:"Bricolage Grotesque",sans-serif;font-size:40px;font-weight:800;letter-spacing:-.045em;line-height:1}
.plan .amt u{text-decoration:none;font-size:15px;font-weight:600;color:var(--muted);margin-left:5px}
.blank{display:inline-block;width:66px;height:30px;border-bottom:3px dashed var(--brass-edge);margin:0 4px;vertical-align:-2px}
.plan.feat .blank{border-bottom-color:var(--on-brass)}
.plan.feat .amt u{color:var(--on-2)}
.plan .pd{font-size:14.5px;color:var(--ink-2);line-height:1.5}
.plan ul{display:flex;flex-direction:column;gap:9px;margin-top:4px}
.plan li{display:flex;align-items:baseline;gap:10px;font-size:14.5px;color:var(--ink-2)}
.plan li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--sage);flex:none}
.plan .excl{margin-top:6px;padding-top:12px;border-top:1px solid var(--hair)}
.plan .excl .ek{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);display:block;margin-bottom:7px}
.plan.feat .excl{border-top-color:var(--on-line)} .plan.feat .excl .ek{color:var(--on-2)}
.plan .excl li{font-size:13.5px;color:var(--muted);padding:2px 0}
.plan .excl li::before{width:7px;height:1.5px;border-radius:1px;background:var(--muted)}
.plan.feat .excl li{color:var(--on-2)} .plan.feat .excl li::before{background:var(--on-2)}
.plan .btn{margin-top:auto}
.price-note{margin-top:22px;padding:18px 22px;border-radius:var(--r-md);background:var(--brass-soft);border:1px dashed var(--brass-edge);font-size:14.5px;color:var(--ink-2);line-height:1.55}
.price-note b{color:var(--warn)}

/* ---------- factor cards ---------- */
.factors{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px}
.factor{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px 22px;display:flex;flex-direction:column;gap:7px}
.factor b{font-size:15px;font-weight:600;letter-spacing:-.015em}
.factor span{font-size:14px;color:var(--muted);line-height:1.5}

/* ---------- generic pill row (reuses .pf from the nav's platform rail, in body content) ---------- */
.pill-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}

/* ---------- shapes (rows) ---------- */
.else-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:52px 0 16px}
.else-h h3{font-size:21px;font-weight:700;letter-spacing:-.026em}
.else-h a{font-size:14.5px;font-weight:600;color:var(--clay);border-bottom:2px solid var(--clay-soft);padding-bottom:2px;transition:border-color 220ms}
.else-h a:hover{border-color:var(--clay)}
.shapes{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);overflow:hidden;box-shadow:var(--sh-1)}
.shape{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1.35fr) auto;gap:22px;align-items:center;padding:20px 24px;border-bottom:1px solid var(--hair);transition:background 240ms,padding-left 240ms}
.shape:last-child{border-bottom:none}
.shape:hover{background:var(--clay-soft);padding-left:30px}
.shape .sn{font-size:16.5px;font-weight:600;letter-spacing:-.02em;display:block}
.shape .sv{font-size:13.5px;color:var(--muted);margin-top:3px;display:block;line-height:1.5}
.shape .sw{font-size:14px;color:var(--ink-2);line-height:1.55}
.shape .sp{text-align:right;white-space:nowrap}
.shape .sp b{font-family:"Bricolage Grotesque",sans-serif;font-size:20px;font-weight:700;letter-spacing:-.032em;display:block;font-variant-numeric:tabular-nums}
.shape .sp u{text-decoration:none;font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);display:block;margin-top:3px}
.blank-sm{display:inline-block;width:52px;height:22px;border-bottom:3px dashed var(--brass-edge);vertical-align:-3px}
@media (max-width:820px){.shape{grid-template-columns:1fr;gap:8px}.shape .sp{text-align:left}.shape .sp b{font-size:20px}}

/* ---------- FAQ ---------- */
.faq{display:flex;flex-direction:column;gap:10px;max-width:860px}
.qa{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;transition:border-color 260ms}
.qa[open]{border-color:var(--clay)}
.qa summary{list-style:none;cursor:pointer;padding:22px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:17.5px;font-weight:600;letter-spacing:-.018em}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"";width:11px;height:11px;flex:none;border-right:2.2px solid var(--muted);border-bottom:2.2px solid var(--muted);transform:rotate(45deg) translateY(-3px);transition:transform 300ms,border-color 300ms}
.qa[open] summary::after{transform:rotate(225deg) translateY(-3px);border-color:var(--clay)}
.qa .ans{padding:0 24px 24px;font-size:15.5px;line-height:1.62;color:var(--ink-2);max-width:70ch}
.qa summary h3{margin:0;font:inherit;letter-spacing:inherit}

/* ---------- final + form ---------- */
.final{background:var(--panel);color:var(--on);position:relative;overflow:hidden;transition:background var(--t)}
.final::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(700px 460px at 24% 0%, rgba(232,184,84,.15), transparent 64%),radial-gradient(600px 420px at 84% 100%, rgba(229,138,106,.12), transparent 64%),radial-gradient(circle at 1px 1px, rgba(255,255,255,.045) 1px, transparent 0);background-size:auto,auto,24px 24px}
.final-in{position:relative;max-width:var(--maxw);margin:0 auto;padding:clamp(76px,9vw,116px) 26px}
.final-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);gap:56px;align-items:center}
.final .eyebrow{color:var(--on-sage);background:rgba(232,184,84,.13)}
.final .eyebrow::before{background:var(--on-act)}
.final h2{color:var(--on);margin-top:18px;font-size:clamp(34px,4.8vw,54px)}
.final .dek{color:var(--on-2);margin-top:20px}
.next{display:flex;flex-direction:column;gap:12px;margin-top:30px}
.next li{display:flex;align-items:flex-start;gap:12px;font-size:15px;color:var(--on-2)}
.next .nb{width:24px;height:24px;border-radius:50%;flex:none;display:grid;place-items:center;background:rgba(232,184,84,.14);color:var(--on-sage);font-family:"IBM Plex Mono",monospace;font-size:10px;font-weight:500}
.form{background:var(--surface);border-radius:var(--r-lg);padding:30px 28px;box-shadow:var(--sh-3);display:flex;flex-direction:column;gap:15px}
.form h3{font-size:21px;font-weight:700;letter-spacing:-.03em;color:var(--ink)}
.fld{display:flex;flex-direction:column;gap:7px}
.fld label{font-size:13.5px;font-weight:600;color:var(--ink-2)}
.fld input,.fld select,.fld textarea{font-family:inherit;font-size:15.5px;padding:13px 15px;border-radius:var(--r-sm);border:1.5px solid var(--line);background:var(--ground);color:var(--ink);transition:border-color 220ms,background 220ms;width:100%}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--clay);background:var(--surface)}
.form .fine{font-size:12.5px;color:var(--muted);line-height:1.5}
.form .btn{width:100%}

/* ---------- sticky mobile CTA ---------- */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:80;display:none;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--veil);backdrop-filter:blur(18px) saturate(1.6);border-top:1px solid var(--line)}
.dock .btn{width:100%}

/* ---------- footer ---------- */
.ft{background:var(--sunk);border-top:1px solid var(--hair);transition:background var(--t)}
.ft-in{max-width:var(--maxw);margin:0 auto;padding:62px 26px 36px}
.ft-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:40px}
.ft-brand p{margin-top:16px;font-size:14.5px;color:var(--muted);max-width:34ch;line-height:1.6}
.ft-col h4{font-family:"IBM Plex Mono",monospace;font-size:10px;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin-bottom:15px}
.ft-col li{padding:6px 0}
.ft-col a{font-size:14.5px;color:var(--ink-2);transition:color 200ms;overflow-wrap:anywhere}
.ft-col a:hover{color:var(--clay)}
.ft-bot{margin-top:46px;padding-top:24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.ft-bot span,.ft-bot a{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--muted)}
.ft-bot a:hover{color:var(--clay)}
.ft-legal{display:flex;gap:20px;flex-wrap:wrap}

@media (max-width:1040px){
  .ft-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
  .ft-brand{grid-column:1/-1}
  .final-grid{grid-template-columns:1fr;gap:44px}
  .proof-grid{grid-template-columns:repeat(2,1fr)}
  .price-grid,.factors{grid-template-columns:1fr}
}
@media (max-width:880px){
  body{font-size:16.5px;padding-bottom:78px}
  .nav{display:none}
  .hdr-in{height:66px}
  .hdr-r .btn-p{display:none}
  .hbtn{display:flex}
  .dock{display:block}
  .shell,.hdr-in,.ft-in,.hero-in,.final-in,.proof-in{padding-left:18px;padding-right:18px}
  .proof-grid{grid-template-columns:1fr}
  .ft-grid{grid-template-columns:repeat(2,1fr);gap:32px}
  .ft-brand{grid-column:1/-1}
  .form{padding:24px 20px}
  .qa summary{padding:18px 20px;font-size:16.5px}
  .qa .ans{padding:0 20px 20px}
}
@media (max-width:480px){
  .theme button span{display:none}
  .theme button{padding:7px 8px;font-size:9px}
  .mark-t{font-size:17px}
  .hdr-in{gap:14px}
}

/* full-bleed alternating band */
.band{position:relative}
.band::before,.band-2::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:calc(50% - 50vw);width:100vw;background:var(--band);transition:background var(--t)}
.band-2{position:relative}
.band-2::before{background:var(--band-2)}

/* ---------- process ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px 26px 26px;display:flex;flex-direction:column;gap:12px;position:relative;transition:transform var(--spring),box-shadow 300ms,border-color 300ms}
.step:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:var(--clay)}
.step .sn{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-family:"Bricolage Grotesque",sans-serif;font-size:17px;font-weight:700;background:var(--panel);color:var(--on);letter-spacing:-.02em}
.step h3{font-size:22px;font-weight:700;letter-spacing:-.03em}
.step p{font-size:15px;line-height:1.55;color:var(--ink-2)}
.step .when{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--sage);background:var(--sage-soft);padding:5px 11px;border-radius:999px;align-self:flex-start}

/* ---------- founder ---------- */
.founder{display:grid;grid-template-columns:auto minmax(0,1fr);gap:34px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:36px 34px;box-shadow:var(--sh-2)}
.face{width:132px;height:132px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--panel);color:var(--on-brass);font-family:"Bricolage Grotesque",sans-serif;font-size:38px;font-weight:700;letter-spacing:-.04em}
.founder h3{font-size:26px;font-weight:700;letter-spacing:-.032em}
.founder .role{font-size:14.5px;color:var(--muted);margin-top:5px}
.founder .say{margin-top:18px;font-size:17px;line-height:1.6;color:var(--ink-2);max-width:60ch}
.founder .say b{color:var(--ink);font-weight:600}
.sig{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.sig a{max-width:100%;min-width:0;overflow-wrap:anywhere;word-break:break-word}
.founder > div{min-width:0}
.sig a,.sig span{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;padding:9px 15px;border-radius:999px;border:1px solid var(--line);background:var(--ground);transition:border-color 220ms,color 220ms}
.sig a:hover{border-color:var(--clay);color:var(--clay)}
.sig svg{width:15px;height:15px;flex:none}

/* ---------- guarantee ---------- */
.guar{background:var(--panel);color:var(--on);border-radius:var(--r-lg);overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:0}
.guar-l{padding:40px 36px;display:flex;flex-direction:column;gap:16px;justify-content:center}
.guar-l h3{font-size:30px;font-weight:700;letter-spacing:-.035em;color:var(--on)}
.guar-l p:not(.eyebrow){font-size:16px;line-height:1.6;color:var(--on-2)}
.guar-l .eyebrow{color:var(--on-brass);background:rgba(232,184,84,.14)}
.guar-l .eyebrow::before{background:var(--on-act)}
.guar-r{padding:32px 34px;background:rgba(255,255,255,.045);display:flex;flex-direction:column;gap:0}
.gitem{display:grid;grid-template-columns:26px minmax(0,1fr);gap:14px;padding:16px 0;border-bottom:1px solid var(--on-line)}
.gitem:last-child{border-bottom:none}
.gitem .gi{width:26px;height:26px;border-radius:50%;background:rgba(143,185,138,.16);display:grid;place-items:center}
.gitem .gi svg{width:14px;height:14px;color:var(--on-sage)}
.gitem b{display:block;font-size:15.5px;font-weight:600;color:var(--on);letter-spacing:-.015em}
.gitem span{display:block;font-size:13.5px;color:var(--on-2);margin-top:3px;line-height:1.5}

/* ---------- guide components (Sep 2026: cost guide + hub expansion) ---------- */
.hero-dek b{color:var(--on);font-weight:600}
.byline{margin-top:16px;display:flex;flex-wrap:wrap;gap:6px 16px;font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.02em;color:var(--on-2)}
.byline b{color:var(--on);font-weight:500}
.src-note{margin-top:16px;max-width:80ch;font-size:13px;line-height:1.55;color:var(--muted)}
.ctable-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--sh-1)}
.ctable{width:100%;min-width:680px;border-collapse:collapse;font-size:14px}
.ctable th,.ctable td{padding:15px 18px;text-align:left;vertical-align:top;line-height:1.5;border-bottom:1px solid var(--hair)}
.ctable thead th{font-family:"IBM Plex Mono",monospace;font-size:10px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.ctable tbody th{font-weight:600;color:var(--ink);letter-spacing:-.01em;width:20%}
.ctable td{color:var(--ink-2)}
.ctable tbody tr:last-child th,.ctable tbody tr:last-child td{border-bottom:0}
.ctable .us{background:var(--brass-soft)}
.ctable thead .us{color:var(--warn)}
.factor a{color:var(--ink);font-size:14px;font-weight:500;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line)}
.factor a:hover{text-decoration-color:var(--brass)}
.report{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--sh-2);overflow:hidden;max-width:760px}
.report-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;padding:18px 24px;border-bottom:1px solid var(--line);background:var(--sunk)}
.report-h b{font-size:15.5px;font-weight:600;letter-spacing:-.015em}
.report-h span{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.report-row{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:16px;align-items:baseline;padding:13px 24px;border-bottom:1px solid var(--hair);font-size:14px}
.report-row:last-child{border-bottom:0}
.report-row .rk{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.report-row .rv2{color:var(--ink-2);line-height:1.5}
.report-row .rs{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ok)}
.report-row .rs.warn{color:var(--warn)}
@media (max-width:640px){.report-row{grid-template-columns:1fr;gap:4px}}
.dek a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--brass-edge)}
.dek a:hover{text-decoration-color:var(--brass)}
.ctable td.no{color:var(--muted)}
.legal{max-width:72ch}
.legal h2{font-size:clamp(22px,2.4vw,28px);margin:40px 0 12px}
.legal h2:first-child{margin-top:0}
.legal p,.legal li{font-size:16.5px;line-height:1.7;color:var(--ink-2)}
.legal p+p{margin-top:12px}
.legal ul{padding-left:20px;display:flex;flex-direction:column;gap:10px}
.legal a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.legal b{color:var(--ink)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-err{margin:0;padding:10px 14px;border-radius:var(--r-sm);background:var(--clay-soft);color:var(--crit);font-size:14px}
.shape .sw a,.price-note a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--brass-edge)}
.shapes-gap{margin-top:14px}
.pcell .pv.pv-sm{font-size:19px;letter-spacing:-.02em;overflow-wrap:anywhere}
.hero-link{color:var(--on);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--on-brass)}
.factor .soon-pill{margin-bottom:4px}
.steps.four{grid-template-columns:repeat(4,1fr)}
@media (max-width:1100px){.steps.four{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.steps.four{grid-template-columns:1fr}}

/* =========================================================
   HOMEPAGE-ONLY CSS (page sets $body_class = 'pg-home')
   Everything below either scopes an override under .pg-home so it
   never touches other pages sharing this stylesheet, or introduces
   class names no other page uses yet (bento, symptom, modes, relief,
   security stack, agency band, the relay diagram, the lifecycle widget).
   .band/.band-2, .steps/.step, .founder/.face/.sig and .guar/.gitem live
   above this line -- they started as homepage-only but are now shared
   by more than one page (pricing, the website-maintenance hub), so they
   moved up into the general component library.
   ========================================================= */

/* ---------- homepage hero override: two-column grid + lifecycle widget ---------- */
.pg-home .hero::before{
  background:
    radial-gradient(880px 520px at 78% 4%, rgba(232,184,84,.16), transparent 60%),
    radial-gradient(660px 480px at 4% 98%, rgba(229,138,106,.13), transparent 62%),
    radial-gradient(circle at 1px 1px, rgba(255,255,255,.05) 1px, transparent 0);
  background-size:auto,auto,24px 24px;
}
.pg-home .hero-in{padding:clamp(52px,6.5vw,86px) 26px clamp(40px,5vw,60px)}
.pg-home .hero-grid{display:grid;grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);gap:54px;align-items:center}
.pg-home h1{font-size:clamp(40px,5.3vw,68px);line-height:1;margin-top:24px}
.pg-home h1 em{font-style:normal;color:var(--on-brass)}
.pg-home .hero-dek{margin-top:24px;max-width:46ch;font-size:19px}
.pg-home .hero-cta{margin-top:32px}
.pg-home .assure{margin-top:20px}

/* ---------- hero visual: the lifecycle as a live system ---------- */
.lp{border:1px solid var(--on-line);border-radius:var(--r-lg);background:rgba(255,255,255,.05);overflow:hidden;box-shadow:var(--sh-3)}
.lp-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 20px;border-bottom:1px solid var(--on-line);background:var(--on-sunk)}
.lp-top .t{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--on-2)}
.lp-top .r{display:flex;align-items:center;gap:7px;font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.1em;color:var(--on-sage)}
.lp-top .r::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--on-sage);animation:live 2.4s ease-in-out infinite}
@keyframes live{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(143,185,138,.5)}50%{opacity:.5;box-shadow:0 0 0 6px rgba(143,185,138,0)}}
.lp-body{position:relative;padding:16px 14px 18px}
.lp-body::before{content:"";position:absolute;left:80px;top:28px;bottom:28px;width:2px;border-radius:1px;background:linear-gradient(to bottom,transparent,var(--on-line) 12%,var(--on-line) 88%,transparent)}
.stage{position:relative;display:grid;grid-template-columns:32px 32px minmax(0,1fr) auto;align-items:center;gap:0 10px;padding:9px 10px;border-radius:var(--r-sm);transition:background 260ms}
.stage:hover,.stage.on{background:rgba(255,255,255,.08)}
.stage .n{font-family:"IBM Plex Mono",monospace;font-size:10px;color:var(--on-2);text-align:right;font-variant-numeric:tabular-nums;transition:color 260ms}
.stage .node{justify-self:center;width:12px;height:12px;border-radius:50%;border:2px solid var(--on-line);background:var(--panel);transition:border-color 280ms,background 280ms,transform 340ms cubic-bezier(.22,1.05,.36,1),box-shadow 280ms}
.stage .nm{font-size:15.5px;font-weight:600;letter-spacing:-.015em;color:var(--on-2);transition:color 260ms}
.stage .hint{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--on-2);opacity:0;transition:opacity 260ms;white-space:nowrap}
.stage:hover .n,.stage.on .n{color:var(--on-brass)}
.stage:hover .nm,.stage.on .nm{color:var(--on)}
.stage:hover .node,.stage.on .node{border-color:var(--on-brass);background:var(--on-brass);transform:scale(1.3);box-shadow:0 0 0 6px rgba(232,184,84,.18)}
.stage:hover .hint,.stage.on .hint{opacity:1}
.stage.past .node{border-color:var(--on-sage);background:var(--on-sage)}
.stage.past .n{color:var(--on-sage)}
.lp-sig{position:absolute;left:75px;top:28px;width:12px;height:12px;border-radius:50%;background:var(--on-brass);box-shadow:0 0 0 7px rgba(229,138,106,.13);animation:fall 7.6s cubic-bezier(.5,.04,.42,.96) infinite}
@keyframes fall{0%{transform:translateY(0);opacity:0}7%{opacity:1}87%{opacity:1}100%{transform:translateY(var(--drop,392px));opacity:0}}
.lp-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-top:1px solid var(--on-line);background:var(--on-sunk)}
.lp-foot .l{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--on-2)}
.lp-foot .v{font-family:"IBM Plex Mono",monospace;font-size:9.5px;color:var(--on-brass)}

/* ---------- bento ---------- */
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 26px 24px;display:flex;flex-direction:column;gap:13px;position:relative;overflow:hidden;transition:transform var(--spring),box-shadow 300ms,border-color 300ms}
.tile:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:var(--clay)}
.tile.s4{grid-column:span 4} .tile.s6{grid-column:span 6}
.tile.s5{grid-column:span 5} .tile.s7{grid-column:span 7} .tile.s3{grid-column:span 3}
.tile.dark{background:var(--panel);color:var(--on);border-color:var(--panel)}
.tile.dark:hover{border-color:var(--on-sage)}
.tile.dark h3{color:var(--on)} .tile.dark p{color:var(--on-2)}
.tile.dark .go{color:var(--on-2)} .tile.dark:hover .go{color:var(--on-sage)}
.tile.dark .pill.gold{color:var(--on-brass);background:rgba(229,138,106,.13)}
.tile .gl{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.iw{width:50px;height:50px;border-radius:var(--r-sm);display:grid;place-items:center;flex:none;background:var(--clay-soft)}
.iw.g{background:var(--brass-soft)} .iw.c{background:var(--act-soft)} .iw.m{background:var(--sage-soft)}
.tile.dark .iw{background:rgba(95,211,172,.14)}
.iw svg{width:25px;height:25px}
.tile h3{font-size:21px;font-weight:700;letter-spacing:-.03em}
.tile.s6 h3,.tile.s7 h3{font-size:26px}
.tile p{font-size:15px;line-height:1.55;color:var(--ink-2)}
.tile .go{margin-top:auto;display:flex;align-items:center;gap:8px;font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--muted);transition:color 240ms,gap 240ms}
.tile:hover .go{color:var(--clay);gap:12px}
.pill{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:999px;white-space:nowrap}
.pill.gold{color:var(--brass);background:var(--brass-soft)}
.pill.mint{color:var(--sage);background:var(--sage-soft)}
.pill.warn{color:var(--warn);background:var(--brass-soft);border:1px dashed var(--brass-edge)}
.tile.soon{background:var(--sunk);border-style:dashed}
.tile.soon:hover{transform:none;box-shadow:none;border-color:var(--brass-edge)}
.tile.soon .iw{background:var(--sunk)}

/* ---------- symptoms ---------- */
.symp{display:flex;flex-wrap:wrap;gap:10px}
.sy{display:inline-flex;align-items:center;gap:10px;padding:13px 20px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-size:15.5px;font-weight:500;transition:border-color 260ms,background 260ms,transform var(--spring),color 260ms}
.sy:hover{border-color:var(--act);background:var(--act-soft);color:var(--crit);transform:translateY(-3px)}
.sy .d{width:7px;height:7px;border-radius:50%;background:var(--act);flex:none}
.sy.all{border-style:dashed}

/* ---------- security stack ---------- */
.stack-wrap{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:44px;align-items:start}
.stack{display:flex;flex-direction:column;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:var(--surface);box-shadow:var(--sh-2)}
.layer{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:14px;align-items:center;padding:15px 20px;border-bottom:1px solid var(--hair);transition:background 260ms,padding-left 260ms}
.layer:last-child{border-bottom:none}
.layer:hover{background:var(--clay-soft);padding-left:28px}
.layer .lx{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.layer .ln{font-size:15.5px;font-weight:600;letter-spacing:-.015em;display:block}
.layer .lc{font-size:13.5px;color:var(--muted);margin-top:2px;display:block}
.layer .sh2{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--sage);background:var(--sage-soft);padding:4px 10px;border-radius:999px;white-space:nowrap}
.layer.top{background:var(--panel)}
.layer.top:hover{background:var(--panel-2)}
.layer.top .lx{color:var(--on-2)} .layer.top .ln{color:var(--on)} .layer.top .lc{color:var(--on-2)}
.layer.top .sh2{color:var(--panel);background:var(--on-sage)}

/* how we work */
.hww{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:26px}
.hww.flush{margin-top:0}
.hw{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px 20px;display:flex;flex-direction:column;gap:6px}
.hw b{font-size:14.5px;font-weight:600;letter-spacing:-.015em}
.hw span{font-size:13.5px;color:var(--muted);line-height:1.5}

/* agency answers */
.aq{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:26px}
.aqi{border:1px solid var(--on-line);border-radius:16px;background:rgba(255,255,255,.05);padding:18px 20px;display:flex;flex-direction:column;gap:6px}
.aqi b{font-size:14.5px;font-weight:600;letter-spacing:-.015em;color:var(--on)}
.aqi span{font-size:13.5px;color:var(--on-2);line-height:1.5}
.aqi em{font-style:normal;color:var(--on-brass);font-weight:600}

@media (max-width:1040px){.stack-wrap{grid-template-columns:1fr;gap:32px}}
@media (max-width:760px){.hww,.aq{grid-template-columns:1fr}}

/* ---- the offer, stated once, in three modes ---- */
.modes{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line)}
.mode{padding:38px 34px 34px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:14px;transition:background 280ms}
.mode:last-child{border-right:none}
.mode:hover{background:var(--surface)}
.mode .mn{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass)}
.mode h3{font-size:clamp(24px,2.6vw,32px);letter-spacing:-.035em;line-height:1.06}
.mode p{font-size:15.5px;line-height:1.58;color:var(--ink-2)}
.mode .how{margin-top:auto;padding-top:16px;border-top:1px solid var(--hair);font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.06em;color:var(--muted)}
.mode .how b{color:var(--clay);font-weight:500}

/* ---- relief: one sentence, a lot of air, nothing else ---- */
.relief{position:relative;text-align:center}
.relief::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:calc(50% - 50vw);width:100vw;background:var(--on-sunk);transition:background var(--t)}
.relief-in{padding:clamp(80px,9vw,124px) 26px;max-width:860px;margin:0 auto}
.relief p{font-family:"Bricolage Grotesque",sans-serif;font-size:clamp(26px,3.6vw,44px);font-weight:600;letter-spacing:-.038em;line-height:1.14;color:var(--on);text-wrap:balance}
.relief p em{font-style:normal;color:var(--on-brass)}
.relief .attr{margin-top:22px;font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--on-2)}
@media (max-width:860px){.modes{grid-template-columns:1fr}.mode{border-right:none}}

/* ---------- homepage pricing teaser: no dollar figures, see .amt/.blank on the pricing page for those ---------- */
.else-h.center{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;margin:40px 0 0}

/* ---------- agency band ---------- */
.ag-band{background:var(--panel);color:var(--on);position:relative;overflow:hidden;transition:background var(--t)}
.ag-band::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(760px 460px at 90% 46%, rgba(232,184,84,.15), transparent 62%),radial-gradient(circle at 1px 1px, rgba(255,255,255,.045) 1px, transparent 0);background-size:auto,24px 24px}
.ag-in{position:relative;max-width:var(--maxw);margin:0 auto;padding:clamp(70px,8vw,106px) 26px}
.ag-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:54px;align-items:center}
.ag-band .eyebrow{color:var(--on-brass);background:rgba(229,138,106,.12)}
.ag-band .eyebrow::before{background:var(--on-act)}
.ag-band h2{color:var(--on);margin-top:18px}
.ag-band .dek{color:var(--on-2)}
.ag-list{display:grid;grid-template-columns:repeat(2,1fr);gap:0 26px;margin-top:28px}
.ag-list li{display:flex;align-items:baseline;gap:11px;padding:11px 0;border-bottom:1px solid var(--on-line);font-size:15px;color:var(--on-2)}
.ag-list li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--on-brass);flex:none}
.ag-cta{margin-top:30px;display:flex;gap:11px;flex-wrap:wrap}
.relay{display:flex;flex-direction:column}
.rnode{border:1px solid var(--on-line);border-radius:var(--r-md);background:rgba(255,255,255,.05);padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;transition:border-color 280ms,background 280ms,transform var(--spring)}
.rnode:hover{border-color:var(--on-brass);transform:translateX(5px)}
.rnode.mid{border-color:var(--on-brass);background:rgba(232,184,84,.12)}
.rnode .rn{font-family:"Bricolage Grotesque",sans-serif;font-size:19px;font-weight:700;letter-spacing:-.03em;display:block;color:var(--on)}
.rnode .rd{font-size:13.5px;color:var(--on-2);margin-top:4px;display:block}
.rnode .rt{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--on-2);border:1px solid var(--on-line);padding:5px 11px;border-radius:999px;white-space:nowrap}
.rnode.mid .rt{color:var(--on-brass);border-color:var(--on-brass)}
.rjoin{height:26px;width:2px;background:var(--on-line);margin-left:32px;border-radius:1px;position:relative}
.rjoin::after{content:"";position:absolute;bottom:-2px;left:-4px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid var(--on-brass)}

@media (max-width:1040px){
  .pg-home .hero-grid,.ag-grid{grid-template-columns:1fr;gap:44px}
  .tile.s7,.tile.s6,.tile.s5{grid-column:span 6}
  .tile.s4,.tile.s3{grid-column:span 6}
  .steps{grid-template-columns:1fr}
}
@media (max-width:880px){
  .founder{grid-template-columns:1fr;gap:24px;padding:28px 22px}
  .ag-in{padding-left:18px;padding-right:18px}
  .tile.s7,.tile.s6,.tile.s5,.tile.s4,.tile.s3{grid-column:span 12}
  .ag-list{grid-template-columns:1fr}
  .guar,.hww,.aq{grid-template-columns:1fr}
}