/* FaaStr — shared site stylesheet for the brand pages (/, /how-it-works/, /pricing/).
   Flattened from the DesignComposer bundle's helmet styles; tokens are verbatim.
   founder-fitness/ and ideas/ keep their own copies of the token block. */

/* ============ webfonts — self-hosted variable woff2, extracted from the bundle ============ */
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:400 700;font-display:swap;src:url("/fonts/space-grotesk-latin.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:400 700;font-display:swap;src:url("/fonts/space-grotesk-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 700;font-display:swap;src:url("/fonts/jetbrains-mono-latin.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 700;font-display:swap;src:url("/fonts/jetbrains-mono-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Press Start 2P';font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/press-start-2p-latin.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Press Start 2P';font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/press-start-2p-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ============ FaaStr color system — warm brutalist: clay on paper, near-black ink, teal signal ============ */
:root{
  --clay:#E0764E;        /* primary brand — CTAs, marks, accents */
  --clay-d:#B85B38;      /* deeper clay — pixel shadows, pressed, links-on-light */
  --glow:#F2A06E;        /* light clay — highlights, hovers on dark */
  --ink:#27282C;         /* primary dark surface + body text on paper */
  --ink-2:#1B1C1F;       /* deepest ink — terminal bg, footer, feature tier */
  --paper:#F7EFE5;       /* primary light surface (warm off-white) */
  --paper-2:#EDE2D4;     /* secondary paper — alt section bands, light tiles */
  --signal:#7FD8C4;      /* teal accent — "AI" layer, success/ok, active states */
  --signal-d:#4FB9A3;    /* deeper teal — shadow pair for signal */
  --muted:#8A8378;       /* warm grey — eyebrows, meta, captions */

  --ink-line:#34353a;    /* hairline on dark (terminal borders) */
  --ink-chip:#26272b;    /* chip/inset fill on dark */
  --paper-line:rgba(138,131,120,.35); /* hairline on light */
  --body-dim:#5d594f;    /* secondary text on paper */
  --body-dim-d:#a49d92;  /* secondary text on ink */

  --link:var(--clay-d);
  --link-hover:var(--clay);
  --focus-ring:var(--signal);

  /* typography */
  --font-display:'Space Grotesk',system-ui,-apple-system,sans-serif;
  --font-mono:'JetBrains Mono','SF Mono',ui-monospace,monospace;
  --font-pixel:'Press Start 2P','JetBrains Mono',monospace;

  /* spacing & layout */
  --gutter:40px;
  --maxw:1180px;
  --nav-h:70px;

  /* effects — corners SHARP (radius 0), shadows HARD (solid offset, zero blur).
     Only Workspace-native product chrome (the chat mockup) may round + soften. */
  --radius-product:8px;
  --shadow-product:0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.06);
}

/* ============ base ============ */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-display);background:var(--paper);color:var(--ink)}
img,svg{max-width:100%}
a{color:var(--link);text-decoration:none}
a:hover{color:var(--link-hover)}
:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
@keyframes fsblink{0%,48%{opacity:1}49%,100%{opacity:0}}
.blink{color:var(--signal);animation:fsblink 1.05s steps(1) infinite}

/* reveal-on-scroll (site.js). <noscript> pages get an unhide block in each page head. */
[data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1)}
[data-reveal].fs-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none;transition:none}}

/* ============ nav ============ */
.nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 40px;background:rgba(27,28,31,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--ink-line)}
.nav-logo{display:block;line-height:0}
.nav-logo svg{height:30px;width:auto}
.nav-links{display:flex;align-items:center;gap:32px;font:500 13px var(--font-mono);letter-spacing:.5px}
.nav-links a{color:var(--body-dim-d)}
.nav-links a:hover{color:var(--paper)}
.nav-links a[aria-current="page"]{color:var(--paper);border-bottom:2px solid var(--clay);padding-bottom:2px}
.nav-links a.nav-cta{padding:9px 18px;background:var(--clay);color:var(--ink);font-weight:700;letter-spacing:.6px;border:0}
.nav-links a.nav-cta:hover{background:var(--glow);color:var(--ink)}

/* ---- nav dropdowns (site.js). Panels are toggled with the `hidden` attribute,
   so never give .nav-panel a display rule — it would beat [hidden]. ---- */
.nav-drop{position:relative}
.nav-drop::after{content:'';position:absolute;top:100%;left:0;right:0;height:15px}
.nav-drop-t{display:inline-flex;align-items:center;gap:7px;background:none;border:0;padding:0;margin:0;cursor:pointer;font:500 13px var(--font-mono);letter-spacing:.5px;color:var(--body-dim-d)}
.nav-drop-t:hover,.nav-drop-t[aria-expanded="true"]{color:var(--paper)}
.nav-drop-t:focus-visible{outline:2px solid var(--signal);outline-offset:5px}
.nav-drop-t .car{font-size:9px;transition:transform .08s steps(2)}
.nav-drop-t[aria-expanded="true"] .car{transform:rotate(180deg)}
@media (prefers-reduced-motion:reduce){.nav-drop-t .car{transition:none}}

.nav-panel{position:absolute;top:calc(100% + 15px);left:0;z-index:60;min-width:252px;background:var(--ink-2);border:1px solid var(--ink-line);box-shadow:6px 6px 0 rgba(0,0,0,.5);padding:8px}
.nav-panel a{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 12px;font:500 12px var(--font-mono);letter-spacing:.5px;color:var(--body-dim-d);white-space:nowrap}
.nav-panel a:hover{background:var(--ink);color:var(--paper)}
.nav-panel a:focus-visible{background:var(--ink);color:var(--paper);outline:2px solid var(--signal);outline-offset:-2px}
.nav-panel a.feat{background:var(--signal);color:var(--ink);font-weight:700;margin-bottom:7px}
.nav-panel a.feat:hover,.nav-panel a.feat:focus-visible{background:var(--paper);color:var(--ink)}
.nav-panel a.soon{color:var(--muted)}
.nav-panel a.all{margin-top:7px;border-top:1px solid var(--ink-line);color:var(--clay)}
.nav-panel a.all:hover{color:var(--glow)}
.nav-panel .tag{font-size:9px;font-weight:700;letter-spacing:1.2px;border:1px solid currentColor;padding:1px 5px}

.nav-toggle{display:none;background:none;border:2px solid var(--ink-line);color:var(--paper);font:700 15px/1 var(--font-mono);padding:8px 12px;cursor:pointer}
.nav-toggle:hover{border-color:var(--clay);color:var(--clay)}
.nav-toggle:focus-visible{outline:2px solid var(--signal);outline-offset:3px}

/* ============ layout & type ============ */
.wrap{max-width:var(--maxw);margin:0 auto}
.section{padding:104px var(--gutter)}
.section--paper{background:var(--paper)}
.section--paper2{background:var(--paper-2);border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.section--ink{background:var(--ink);color:var(--paper)}
.section--ink2{background:var(--ink-2);color:var(--paper)}
.section--ink2-t{border-top:3px solid var(--ink)}

.eyebrow{font:500 11px var(--font-mono);letter-spacing:2.4px;text-transform:uppercase;margin:0 0 22px;color:var(--clay-d)}
.eyebrow--signal{color:var(--signal)}
h1.hero-h,.h2{font:400 clamp(28px,3.4vw,44px)/1.1 var(--font-display);letter-spacing:-1.4px;margin:0 0 20px}
.h2 .em,.hero-h .em{font-weight:700;color:var(--clay)}
.lede{margin:0 0 52px;font:400 18px/1.7 var(--font-display);color:var(--body-dim);max-width:62ch}
.lede--mono{font:400 16px/1.7 var(--font-mono)}
.section--ink .lede,.section--ink2 .lede{color:var(--body-dim-d)}

/* ============ buttons ============ */
.btn{display:inline-block;padding:14px 24px;font:700 14px var(--font-mono);letter-spacing:.6px;transition:transform .08s steps(2),box-shadow .08s steps(2),background .08s steps(2),border-color .08s steps(2)}
.btn-clay{background:var(--clay);color:var(--ink);box-shadow:4px 4px 0 var(--ink)}
.btn-clay:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink);color:var(--ink)}
.btn-clay--on-dark{box-shadow:4px 4px 0 var(--paper)}
.btn-clay--on-dark:hover{box-shadow:2px 2px 0 var(--paper)}
.btn-ghost-dark{background:transparent;color:var(--paper);border:1px solid var(--ink-line)}
.btn-ghost-dark:hover{border-color:var(--paper);color:var(--paper)}
.btn-ghost-light{background:transparent;color:var(--ink);border:2px solid var(--ink)}
.btn-ghost-light:hover{background:var(--ink);color:var(--paper)}
.meta-note{font:400 13px/1.6 var(--font-mono);color:var(--muted);max-width:62ch}

/* ============ terminal chrome (brand mockups — sharp, hard shadow) ============ */
.term{background:var(--ink-2);border:3px solid var(--ink);box-shadow:8px 8px 0 var(--clay)}
.term-bar{display:flex;align-items:center;gap:8px;padding:13px 16px;border-bottom:1px solid var(--ink-line)}
.term-dot{width:10px;height:10px;border-radius:50%}
.term-dot--r{background:#ef6d5d}.term-dot--y{background:#f5c04e}.term-dot--g{background:#68c96a}
.term-title{margin-left:10px;font:500 11px var(--font-mono);color:var(--body-dim-d)}

/* hero variant */
.hero{padding:104px var(--gutter) 116px}
.hero-inner{display:flex;flex-direction:column;align-items:center;gap:40px}
.hero-eyebrow{font:500 11px var(--font-mono);letter-spacing:2.4px;text-transform:uppercase;color:var(--signal);text-align:center}
.hero-term{width:860px;max-width:100%;background:var(--ink-2);border:1px solid var(--ink-line);box-shadow:8px 8px 0 var(--clay-d)}
.hero-term .term-bar{padding:14px 18px}
.hero-term .term-dot{width:11px;height:11px}
.hero-body{padding:48px 52px 52px}
.hero-boot{font:500 13px var(--font-mono);color:var(--body-dim-d);margin-bottom:24px}
.hero-boot .mark{color:var(--clay)}
.hero-title{margin:0;font:400 clamp(34px,4.6vw,56px)/1.04 var(--font-display);letter-spacing:-1.8px;color:var(--paper)}
.hero-title .em{font-weight:700;color:var(--clay)}
.hero-lede{font:400 16px/1.7 var(--font-mono);color:var(--body-dim-d);margin:26px 0 0;max-width:58ch}
.hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}
.hero-trust{font:500 12px var(--font-mono);letter-spacing:.4px;color:var(--body-dim-d);text-align:center}

/* ============ cards ============ */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{border:3px solid var(--ink);background:var(--paper);padding:30px 28px}
.card-num{font:400 24px var(--font-pixel);color:var(--clay);line-height:1.2}
.card-title{font:700 19px var(--font-display);letter-spacing:-.4px;margin:18px 0 10px}
.card-copy{margin:0;font:400 15px/1.65 var(--font-display);color:var(--body-dim)}
.thesis{margin-top:22px;border-left:6px solid var(--signal);padding:14px 0 14px 22px;font:400 17px/1.6 var(--font-display);color:var(--ink);max-width:64ch}

/* dark bordered feature cards (on ink sections) */
.dark-card{border:3px solid var(--ink-line);background:var(--ink-2);padding:26px 28px}
.dark-card-title{font:700 16px var(--font-mono);letter-spacing:.6px;color:var(--paper)}
.dark-card-title--signal{color:var(--signal)}
.dark-card p{margin:10px 0 0;font:400 15px/1.7 var(--font-mono);color:var(--body-dim-d)}
.dark-card .cmd{color:var(--clay)}

/* two-column feature layouts */
.cols{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;align-items:start}
.cols--center{align-items:center}
.col-stack{display:flex;flex-direction:column;gap:18px}

/* steps (left-accent rail) */
.step{border-left:6px solid var(--clay);padding:8px 0 8px 22px}
.step--signal{border-left-color:var(--signal)}
.step-kicker{font:700 13px var(--font-mono);letter-spacing:.6px;color:var(--muted)}
.step-title{font:700 22px var(--font-display);letter-spacing:-.5px;margin:6px 0}
.step p{margin:0;font:400 15px/1.65 var(--font-display);color:var(--body-dim)}
.step .cmd{font-family:var(--font-mono);color:var(--clay-d)}

/* mini how-it-works strip (on the landing Flow section) */
.subhead{font:700 16px var(--font-mono);letter-spacing:2px;text-transform:uppercase;color:var(--paper);margin:52px 0 18px}
.mini-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:18px 0 22px}
.mini-step{border:1px solid var(--ink-line);background:var(--ink-2);padding:18px 20px}
.mini-step-num{font:400 13px var(--font-pixel);color:var(--clay)}
.mini-step-title{font:700 15px var(--font-display);color:var(--paper);margin:10px 0 6px}
.mini-step p{margin:0;font:400 13px/1.6 var(--font-mono);color:var(--body-dim-d)}
.link-more{font:700 13px var(--font-mono);letter-spacing:.6px;color:var(--signal);border-bottom:2px solid var(--signal);padding-bottom:2px}
.link-more:hover{color:var(--paper);border-color:var(--paper)}
.link-more--on-paper{color:var(--clay-d);border-color:var(--clay-d)}
.link-more--on-paper:hover{color:var(--clay);border-color:var(--clay)}

/* knowledge-graph terminal body */
.graph-body{padding:26px 26px 30px;display:flex;flex-direction:column;gap:10px;font:400 13px var(--font-mono)}
.graph-row{display:grid;gap:10px}
.graph-row--3{grid-template-columns:repeat(3,1fr)}
.graph-row--2{grid-template-columns:repeat(2,1fr)}
.graph-node{border:1px solid var(--ink-line);color:var(--body-dim-d);padding:12px 10px;text-align:center}
.graph-node--clay{border-color:var(--clay);color:var(--clay)}
.graph-node--signal{border-color:var(--signal);color:var(--signal)}
.graph-pipe{color:var(--muted);font-size:12px;line-height:1;text-align:center}
.graph-cli{margin-top:16px;border-top:1px solid var(--ink-line);padding-top:16px;line-height:2;color:var(--body-dim-d)}
.graph-cli .prompt{color:var(--clay)}
.graph-cli .ok{color:var(--signal)}
.graph-cli .live{color:var(--paper)}

/* drive-tree terminal body */
.tree-body{padding:22px 24px;font:400 13px/2.1 var(--font-mono);color:var(--body-dim-d)}
.tree-body .row-live{color:var(--paper)}
.tree-body .caret{color:var(--clay)}
.tree-body .caret--signal,.tree-body .syncing{color:var(--signal)}

/* ============ Google Chat mockup — Workspace product surface (rounded + soft, the ONLY exception) ============ */
.chat{background:#fff;border:1px solid #dadce0;border-radius:var(--radius-product);box-shadow:var(--shadow-product),8px 8px 0 var(--clay);overflow:hidden;font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:#1f1f1f}
.chat-head{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid #e7e8eb;background:#f8f9fa}
.chat-avatar{width:34px;height:34px;border-radius:8px;background:var(--clay);display:flex;align-items:center;justify-content:center;flex:none}
.chat-avatar svg{height:18px;width:auto}
.chat-head-name{font-size:14px;font-weight:600}
.chat-head-name .app{margin-left:6px;font-size:10px;font-weight:600;letter-spacing:.4px;color:#5f6368;background:#e8eaed;border-radius:4px;padding:2px 5px;vertical-align:1px}
.chat-head-sub{font-size:11.5px;color:#5f6368;margin-top:1px}
.chat-body{padding:18px 16px 20px;display:flex;flex-direction:column;gap:16px}
.chat-msg{display:flex;gap:10px}
.chat-msg-avatar{width:28px;height:28px;border-radius:50%;background:#c5ddf8;color:#1a56a8;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:none}
.chat-msg-avatar--app{border-radius:8px;background:var(--clay)}
.chat-msg-avatar--app svg{height:14px;width:auto}
.chat-msg-meta{font-size:12.5px;color:#5f6368;margin-bottom:3px}
.chat-msg-meta b{color:#1f1f1f;font-weight:600;font-size:13px}
.chat-msg-text{font-size:13.5px;line-height:1.55}
.chat-msg-text .cmd{font-family:var(--font-mono);font-size:12.5px;background:#f1f3f4;border-radius:4px;padding:1px 5px;color:#b3400f}
.chat-status{font:400 12px var(--font-mono);color:#5f6368;margin-bottom:8px}
.chat-status .dot{color:var(--signal-d)}
.chat-checks{margin:8px 0 0;padding:0;list-style:none;font-size:13px;line-height:1.7}
.chat-checks li{padding-left:24px;position:relative}
.chat-checks .tick::before{content:"✓";position:absolute;left:2px;color:#188038;font-weight:700}
.chat-checks .todo::before{content:"▸";position:absolute;left:2px;color:#b3400f}
.chat-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.chat-chip{font-size:12.5px;font-weight:600;color:#0b57d0;border:1px solid #dadce0;border-radius:999px;padding:6px 12px;background:#fff}
.chat-input{margin:2px 16px 16px;border:1px solid #dadce0;border-radius:999px;padding:10px 16px;font-size:13px;color:#5f6368;display:flex;justify-content:space-between;align-items:center}

/* ============ operator tiles ============ */
.grid-ops{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.op-tile{border:3px solid var(--ink);background:var(--ink);padding:26px;display:flex;flex-direction:column;gap:16px;transition:transform .08s steps(2)}
.op-tile:hover{transform:translate(2px,2px)}
.op-tile img{height:44px;width:auto;align-self:flex-start}
.op-title{font:700 18px var(--font-display);color:var(--paper)}
.op-tile p{margin:0;font:400 14px/1.6 var(--font-mono);color:var(--body-dim-d)}

/* ============ portfolio cards ============ */
.grid-portfolio{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px}
.pf-card{border:1px solid var(--ink-line);background:var(--ink);padding:26px;display:flex;flex-direction:column;gap:14px;box-shadow:6px 6px 0 var(--clay-d);transition:transform .08s steps(2),box-shadow .08s steps(2)}
.pf-card:hover{transform:translate(2px,2px);box-shadow:4px 4px 0 var(--clay-d)}
.pf-top{display:flex;align-items:center;justify-content:space-between}
.pf-num{font:400 13px var(--font-pixel);color:var(--clay)}
.pf-visit{font:700 10px var(--font-mono);letter-spacing:2px;text-transform:uppercase;color:var(--signal)}
.pf-name{font:700 18px var(--font-display);color:var(--paper)}
.pf-card p{margin:0;font:400 14px/1.6 var(--font-mono);color:var(--body-dim-d)}

/* ============ pricing ============ */
.grid-pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.tier{border:3px solid var(--ink);background:var(--paper);padding:34px 30px;display:flex;flex-direction:column}
.tier-label{font:700 13px var(--font-mono);letter-spacing:1px;color:var(--muted)}
.tier-head{display:flex;justify-content:space-between;align-items:center}
.tier-chip{font:700 9px var(--font-mono);letter-spacing:1px;background:var(--clay);color:var(--ink);padding:3px 7px}
.tier-price{margin:16px 0 4px;font:700 44px var(--font-display);letter-spacing:-1.5px}
.tier-price .per{font:500 14px var(--font-mono);color:var(--muted)}
.tier-sub{margin:8px 0 22px;font:400 14px/1.6 var(--font-display);color:var(--body-dim)}
.tier-features{font:400 14px/2 var(--font-mono);color:var(--ink);border-top:1px solid var(--paper-line);padding-top:16px;flex:1}
.tier-cta{margin-top:22px;text-align:center;padding:13px 20px;background:transparent;color:var(--ink);border:2px solid var(--ink);font:700 13px var(--font-mono);letter-spacing:.6px;transition:background .08s steps(2),color .08s steps(2)}
.tier-cta:hover{background:var(--ink);color:var(--paper)}
.tier--feature{background:var(--ink);color:var(--paper);box-shadow:8px 8px 0 var(--clay)}
.tier--feature .tier-label{color:var(--signal)}
.tier--feature .tier-price{color:var(--paper)}
.tier--feature .tier-price .per,.tier--feature .tier-sub{color:var(--body-dim-d)}
.tier--feature .tier-features{color:var(--paper);border-top-color:var(--ink-line)}
.tier--feature .tier-cta{background:var(--clay);color:var(--ink);border-color:var(--clay)}
.tier--feature .tier-cta:hover{background:var(--glow);border-color:var(--glow);color:var(--ink)}
.tier-chip--live{background:var(--signal);color:var(--ink)}
.tier-alt{font:500 13px var(--font-mono);color:var(--muted);margin:2px 0 0}
.tier--feature .tier-alt{color:var(--body-dim-d)}
.soon-strip{margin-top:24px;border:3px dashed var(--ink);background:var(--paper);padding:26px 30px}
.soon-label{font:700 13px var(--font-mono);letter-spacing:1px;color:var(--muted)}
.soon-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:22px;margin-top:16px}
.soon-name{font:700 15px var(--font-display);letter-spacing:-.3px}
.soon-item p{margin:3px 0 0;font:400 13px/1.6 var(--font-mono);color:var(--body-dim)}
.founders-strip{margin-top:24px;border:3px solid var(--ink);background:var(--paper);padding:26px 30px;display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between;align-items:center}
.founders-strip-title{font:700 16px var(--font-mono);letter-spacing:.6px}
.founders-strip-sub{font:400 14px var(--font-display);color:var(--body-dim);margin-top:4px}
.founders-strip a{font:700 13px var(--font-mono);letter-spacing:.6px;color:var(--clay-d);border-bottom:2px solid var(--clay-d);padding-bottom:2px}
.founders-strip a:hover{color:var(--clay);border-color:var(--clay)}

/* ============ FAQ ============ */
.faq{display:flex;flex-direction:column;gap:14px;max-width:820px}
.faq details{border:3px solid var(--ink);background:var(--paper)}
.faq summary{cursor:pointer;padding:18px 22px;font:700 17px var(--font-display);letter-spacing:-.3px;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"▸ ";color:var(--clay)}
.faq details[open] summary::before{content:"▾ "}
.faq .faq-a{padding:0 22px 20px;font:400 15px/1.7 var(--font-display);color:var(--body-dim);max-width:70ch}
.faq .faq-a a{border-bottom:1px solid var(--clay-d)}

/* ============ page hero band (subpages) ============ */
.page-hero{background:var(--ink);color:var(--paper);padding:88px var(--gutter) 72px}
.page-hero .lede{margin-bottom:0}

/* ============ install CTA band ============ */
.install{padding:112px var(--gutter);text-align:center}
.install-inner{max-width:820px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:12px}
.install-inner img{height:64px;width:auto;margin-bottom:14px}
.install-h{margin:6px 0 8px;font:400 clamp(30px,4vw,52px)/1.06 var(--font-display);letter-spacing:-1.8px;color:var(--paper)}
.install-h .em{font-weight:700;color:var(--clay)}
.install-lede{margin:0 0 32px;font:400 17px/1.7 var(--font-mono);color:var(--body-dim-d);max-width:54ch}
.install-ctas{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.install-ctas .btn{padding:16px 28px}

/* ============ footer ============ */
.footer{background:var(--ink);padding:56px var(--gutter);border-top:1px solid var(--ink-line)}
.footer-inner{max-width:var(--maxw);margin:0 auto;display:flex;flex-wrap:wrap;gap:28px;justify-content:space-between;align-items:center}
.footer-logo svg{height:28px;width:auto;display:block}
.footer-links{display:flex;flex-wrap:wrap;gap:28px;font:500 12px var(--font-mono);letter-spacing:.5px}
.footer-links a{color:var(--body-dim-d)}
.footer-links a:hover{color:var(--paper)}
.footer-legal{font:500 11px var(--font-mono);letter-spacing:1px;color:var(--muted)}

/* ============ responsive (net-new — the source bundle had none) ============ */
@media (max-width:1020px){
  .cols{grid-template-columns:1fr}
  .grid-ops{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .section{padding:72px 22px}
  .hero{padding:72px 22px 84px}
  .install{padding:84px 22px}
  .page-hero{padding:64px 22px 56px}
  .hero-body{padding:32px 26px 36px}
  .grid-3,.grid-pricing,.mini-steps,.soon-grid{grid-template-columns:1fr}
  .grid-ops{grid-template-columns:1fr}
  .footer{padding:44px 22px}
}
/* Mobile nav: hamburger + inline accordion panels. Breakpoint matches the
   hover-capability query in site.js — keep the two in step. */
@media (max-width:860px){
  .nav{flex-wrap:wrap;padding:12px 16px;gap:12px}
  .nav-toggle{display:block}
  .nav-links{display:none;flex-basis:100%;flex-direction:column;align-items:stretch;gap:0;font-size:12px}
  .nav-links.is-open{display:flex}
  .nav-links>a{padding:13px 2px;border-bottom:1px solid var(--ink-line)}
  .nav-drop{border-bottom:1px solid var(--ink-line)}
  .nav-drop-t{width:100%;justify-content:space-between;padding:13px 2px}
  .nav-panel{position:static;min-width:0;padding:0 0 10px 16px;background:none;border:0;box-shadow:none}
  .nav-panel a{padding:9px 0}
  .nav-links a.nav-cta{margin:14px 0 4px;text-align:center;border-bottom:0}
}
