/* ============================================================
   SeatLayer — shared design system. Linked by every page.
   Cream = the house · dark panels = the stage · mono = anything measured/live.
============================================================ */

/* ---------- fonts (url() resolves relative to this file, in assets/) ---------- */
@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;src:url("fonts/inter-latin.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;src:url("fonts/inter-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA,U+1E00-1E9F,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/jbmono-latin.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,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/jbmono-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA,U+1E00-1E9F,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}


/* ---------- metric-matched fallbacks: no reflow when the webfont swaps in ---------- */
@font-face{font-family:'Inter Fallback';src:local('Arial'),local('Helvetica Neue'),local('Liberation Sans');ascent-override:92.46%;descent-override:22.88%;line-gap-override:0%;size-adjust:104.91%}
@font-face{font-family:'JBMono Fallback';src:local('Courier New'),local('Liberation Mono');ascent-override:102.02%;descent-override:30.00%;line-gap-override:0%;size-adjust:99.98%}

:root{
  --paper:#fcf7ee; --paper-warm:#fdf1dd;
  --ink:#0c1220; --muted:#56607a; --faint:#666e85;
  --amber:#f4b740; --amber-deep:#eaa92c; --on-amber:#1a1200;
  /* Amber is a fill, not a text colour: #f4b740 reads 1.68:1 on cream. Use
     --amber-text wherever amber carries words. It flips back to plain amber
     inside the dark scope below, where #f4b740 already clears 10:1. */
  --amber-text:#8a6510;
  --panel:#10151f; --panel-2:#141b29; --panel-line:#212a3d; --panel-ink:#e7ecf7; --panel-mut:#8b94ac;
  /* Emphasis ink and the ghost button also flip by surface. --ink on a panel is
     near-invisible (1.02:1), and the cream ghost button — a 50%-white fill with
     a sand border — was rendering under light text on five dark heroes. */
  --ink-strong:var(--ink);
  --ghost-border:#d8cdb6; --ghost-bg:rgba(255,255,255,.5); --ghost-ink:var(--ink);
  --live:#22a06b; --hold:#e2573d;
  --seat-open:#5b6d96; --seat-dim:#333e58; --seat-sold:#20293c;
  --line:#e6dcc8; --card:#fffdf8;
  --r-s:8px; --r-m:12px; --r-l:18px;
  --mono:'JetBrains Mono','JBMono Fallback',ui-monospace,monospace;
  --sans:'Inter','Inter Fallback',system-ui,sans-serif;
  /* rem preserves user font preferences; vw makes display type respond to the viewport. */
  --sl-title-page:clamp(2.125rem,calc(1.71rem + 2.08vw),3.375rem);
  --sl-title-long:clamp(2rem,calc(1.5rem + 2.4vw),3.75rem);
  --sl-title-hero:clamp(2.25rem,calc(1.67rem + 2.9vw),4.375rem);
  --sl-title-xl:clamp(2.75rem,calc(2.07rem + 3.4vw),5.125rem);
  --sl-title-section:clamp(1.75rem,calc(1.45rem + 1.5vw),2.625rem);
  --sl-title-final:clamp(1.875rem,calc(1.5rem + 1.6vw),2.875rem);
  --shadow-card:0 2px 0 rgba(12,18,32,.06),0 18px 44px -22px rgba(12,18,32,.22);
  --shadow-panel:0 28px 70px -28px rgba(12,18,32,.5);
}
/* ---------- surface-scoped text tokens (GENERATED — do not hand-edit) ----------
   --muted, --faint and --amber-text each only clear WCAG AA on one kind of
   surface. --muted reads 5.87:1 on cream but 2.9:1 on a panel; --faint is the
   mirror image; amber is a fill on cream (1.68:1) and fine as text on a panel
   (10.18:1). So each surface declares the tokens its own background can carry,
   and every consumer corrects at once.

   BOTH lists are required. Binding only the dark surfaces looks right until a
   light card nested inside a dark section inherits the dark values and drops to
   2.86:1 — which is exactly what happened on /developers/ and /vs/seats-io/.

   These are plain selector lists, deliberately NOT :is(). :is() collapses to the
   specificity of its most specific argument, so .flag-card.dark could not beat
   .flag-card and dark cards took the light tokens. A comma list keeps each
   selector at its own specificity, which is what makes the two blocks compose.

   Regenerate after adding or restyling any section:
     node sites/marketing/scripts/gen-dark-surfaces.mjs --write
*/
    .arch-node.dark, .arena-authority-grid article, .arena-boundary-section, .arena-build,
    .arena-build-grid article, .arena-final, .arena-hero, .arena-host-authority, .arena-map-proof,
    .arena-product-window, .arena-window-body, .arts-authority-grid article, .arts-boundary-section,
    .arts-confidence, .arts-confidence-grid article, .arts-confidence-link, .arts-final, .arts-hero,
    .arts-host-authority, .arts-poster, .arts-product-window, .arts-window-body, .box-authority,
    .box-authority-grid .box-host-authority, .box-authority-grid article, .box-final, .box-hero,
    .box-product-window, .box-state-blocked, .box-steps li, .box-window-body, .box-workflow,
    .con-map, .confidence-card.dark, .cr-map, .cr-modes, .cr-rail, .cr-stats, .cr-top, .crr-seat,
    .crr-sec, .crr-tile, .cx-field input, .cx-field textarea, .cx-panel, .d3-boundary article,
    .d3-code, .d3-code-top, .d3-dark, .d3-dark .d3-mode, .d3-final, .d3-final .btn-ghost,
    .d3-flow-card, .d3-hero, .d3-mode:before, .d3-stat-band, .dark, .dark-group .scard,
    .designer-btn-dark, .designer-final, .designer-hero, .designer-hero-proof,
    .designer-import-cards article, .designer-imports, .designer-platform,
    .designer-platform-contract, .designer-step-icon, .designer-steps li, .designer-tool-mark,
    .designer-workflow, .dev-final-link, .dev-hero, .dev-lab-head, .dev-lab-status, .dg-meter,
    .dg-meter .tr, .dg-pills button, .dgf-node, .dgl-chip, .dgl-secret, .dgp-bar, .dgp-tip, .dgw,
    .dgw-top, .dgz-cat, .dgz-rail, .dgz-side, .dgz-stage, .dgz-tabs, .dgz-tabs b.on, .eba-final,
    .eba-hero, .eba-product, .eba-product-window, .eba-product-window figcaption, .eba-switch,
    .eba-switch-steps li, .eba-window-body, .eba-window-head, .ebs-final-link, .ebs-hero,
    .enterprise-callout, .eptable .get, .eptable .post, .eptable .ws, .feat-boundary, .feat-final,
    .feat-hero, .feat-product-section-dark, .feat-product-shot, .feat-product-shot figcaption,
    .feat-proof-section, .feat-truth-note, .final, .flag-card.dark, .flag-dark, .flag-final,
    .flag-hero, .flag-proof, .flag-window, .footer, .fw-top, .home-final, .home-final-routes a,
    .home-flow-step b, .home-route-3d, .home-surface, .home-surface-media, .home-surface-section,
    .home-trust-link, .home-trust-section, .home-venue-feature, .honest, .honest-item,
    .incident-band, .incident-contact, .journey, .journey-fallback, .journey-fallback article,
    .journey-stage, .journey-tabs, .journey-tabs a.on, .journey-tabs a[aria-current="step"],
    .journey-tabs button.on, .npm-cmd, .npm-strip, .ops-action, .ops-head, .ops-map, .ops-shell,
    .ops-tabs button.on, .panel, .panorama:before, .phead, .platform-hero-fallback, .price-estimator,
    .pricing-billable, .pricing-boundary-grid .pricing-boundary-billable,
    .pricing-boundary-grid article, .pricing-final, .pricing-hero, .pricing-ledger li,
    .probe-console, .probe-head, .probe-metric, .round-card, .round-card.lead, .sa-final-link,
    .sa-hero, .sa-teaser, .scm-3d-close, .scm-3d-shade, .scm-3d-stage, .scm-final,
    .scm-format strong, .scm-launch, .scm-launch-note, .scm-proof-label, .scm-start, .scm-start-icon,
    .scm-step, .scm-ui-shot, .security-group.dark-group, .security-hero, .sl3d-guide, .sl3d-proof,
    .sl3d-proof-guides, .sl3d-proof-head, .sl3d-proof-link, .sl3d-proof-meta, .sl3d-proof-mount,
    .sl3d-proof-note, .sl3d-proof-poster:after, .sl3d-proof-stage,
    .sl3d-proof[data-state="failed"] .sl3d-proof-poster:after, .split-col, .split-col li:before,
    .split-col.us, .status-hero, .status-meta div, .tc-node, .tc-tabs, .tc-tabs button.on, .tc-top,
    .template-cluster-card, .template-decision, .template-hero, .template-hero-note,
    .template-hero-visual figcaption, .trust-console, .venue-final-link, .venue-inspect,
    .venue-journey, .venue-tools, .venues-final, .venues-hero, .venues-product-shot,
    .venues-product-shot figcaption, .venues-proof-panel figcaption, .venues-proof-selector,
    .venues-proof-tabs, .venues-responsibility, .venues-scope-board, .venues-scope-board article,
    .venues-scope-note, .venues-window-bar, .vj-event, .vj-stage, .vj-tabs, .vj-tabs button.on,
    .why-final, .why-final-link, .why-fit, .why-hero, .why-journey, .why-not-fit,
    .why-product-window, .why-product-window figcaption, .why-window-body, .why-window-head
{
  --muted:#8b94ac;             /* 6.03:1 on --panel */
  --faint:#98a1b8;             /* 7.07:1 on --panel */
  --amber-text:var(--amber);   /* 10.18:1 on --panel */
  --ink-strong:var(--panel-ink);
  --ghost-border:#33405c;
  --ghost-bg:rgba(255,255,255,.04);
  --ghost-ink:var(--panel-ink);
}
    .answer, .arch-node, .arena-continuity, .arena-faq-section, .arena-ops-grid article,
    .arena-ops-link, .arena-proof-strip, .arena-rungs, .arena-scale-note, .arts-faq-section,
    .arts-house-grid article, .arts-proof-strip, .arts-secret, .arts-sightlines, .b-amber, .badge,
    .badge-soon, .box-control-grid article, .box-economics, .box-economics-board, .box-faq-section,
    .box-proof-strip, .box-state-held, .box-state-rail, .btn-amber, .cmp, .concede, .confidence-card,
    .crow, .cx-card, .cx-route, .d3-faq details, .d3-matrix, .d3-mode, .d3-section.alt, .d3-truth,
    .dcard, .dcard code, .dep-node, .depth-list li:before, .designer-continuity, .designer-faq,
    .designer-proof-card, .designer-templates, .designer-tool-groups article,
    .designer-tool-groups li:before, .designer-toolkit, .dev-nav, .dev-run, .dgf-dot, .dgp-cta,
    .dgz-rail i.on, .eba-info-route, .eba-proof-strip, .eba-seatlayer-fit, .eba-source-links a,
    .eba-source-panel, .eba-table-wrap, .feat-architecture li,
    .feat-architecture li:not(:last-child):after, .feat-architecture-section, .feat-checks li:before,
    .feat-faq-section, .feat-index-grid article, .feat-index-section, .feat-journey a,
    .feat-journey a:after, .feat-journey-section, .feat-product-section,
    .feat-product-section:nth-of-type(even), .flag-card, .flow-step,
    .home-final-routes a:first-child, .home-flow, .home-flow-aside, .home-flow-section, .home-hero,
    .home-kicker, .home-quick-routes, .home-quick-routes a, .home-route, .home-route-maker,
    .home-venue-card, .howto-step, .mig-list li:before, .nav, .ops-card, .panorama, .pc-card,
    .pc-card li:before, .pc-card.us, .pc-card.us li:before, .phero, .pricing-entitlement-note,
    .pricing-faq-section, .pricing-included, .pricing-pack-grid .pricing-pack-featured,
    .pricing-pack-grid article, .pricing-proof, .probe-bar, .proofbar, .quote-band,
    .quote-points div, .review-card, .sa-card, .sa-depth li:before, .sa-mini, .scan-line:before,
    .scard, .scm-action.secondary, .scm-output-visual, .scm-pro-node, .scm-proofbar, .scm-save-card,
    .scm-section.soft, .scm-section.white, .scm-skip, .scm-start:first-child, .scm-use,
    .security-nav, .skip-link, .split-col.us li:before, .status-nav, .template-page, .tldr .card,
    .tldr .card.us, .tmpl-band, .tmpl-card, .tmpl-cats a, .tmpl-search, .tmpl-tag, .tmpl-thumb,
    .tmpl-toolbar, .venue-field i:after, .venue-nav, .venue-tools i.on, .venue-type,
    .venues-economics, .venues-faq-section, .venues-lifecycle, .venues-route-grid a,
    .venues-route-section, .venues-window-dots i:nth-child(2), .why-compare, .why-host-authority,
    .why-proof-strip, .why-trust-line
{
  --muted:#56607a;             /* 5.87:1 on --paper */
  --faint:#666e85;             /* 4.76:1 on --paper */
  --amber-text:#8a6510;        /* 4.98:1 on --paper */
  --ink-strong:var(--ink);
  --ghost-border:#d8cdb6;
  --ghost-bg:rgba(255,255,255,.5);
  --ghost-ink:var(--ink);
}
/* GENERATED:surface-tokens:end */
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:100%;scroll-behavior:smooth}
body{font-family:var(--sans);font-size:1rem;background:var(--paper);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font:inherit;border:0;background:none;cursor:pointer;color:inherit}
::selection{background:var(--amber);color:var(--on-amber)}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}
:is(.dark,.flag-hero,.flag-dark,.flag-final,.scm-hero,.board,.dgw,.features-hero,.feature-console,.cr) :focus-visible{outline:2px solid var(--amber);outline-offset:3px}

/* Lives here because every page loads site.css. It was previously defined only
   in page stylesheets, so the five pages that load neither (developers, privacy,
   security, status, terms) would have rendered the link permanently on screen. */
.skip-link{position:fixed;top:12px;left:16px;z-index:1000;padding:10px 14px;border-radius:8px;color:var(--ink);background:#fff;box-shadow:var(--shadow-card);font-weight:750;transform:translateY(-160%)}
.skip-link:focus{transform:none}

.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.mono{font-family:var(--mono)}

.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--muted);display:flex;align-items:center;gap:8px;text-transform:uppercase}
.eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--live);animation:blinkdot 2s infinite}
.dark .eyebrow{color:var(--panel-mut)}
h2.sec{font-size:var(--sl-title-section);font-weight:800;letter-spacing:-.03em;line-height:1.12;margin-top:14px;text-wrap:balance}
p.lede{font-size:17px;color:var(--muted);margin-top:14px;max-width:620px;text-wrap:pretty}
.dark p.lede{color:var(--panel-mut)}
section{padding:96px 0}
.dark{background:var(--panel);color:var(--panel-ink)}
.dark .sec{color:var(--panel-ink)}
.sec-link{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:15px;margin-top:36px;color:var(--ink);border-bottom:2px solid var(--amber);padding-bottom:2px}
.sec-link:hover{color:var(--amber-text)}
.dark .sec-link{color:var(--panel-ink)}
.badge-soon{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;background:var(--paper-warm);border:1px solid var(--line);color:var(--muted);border-radius:5px;padding:2px 7px;vertical-align:2px;margin-left:6px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;padding:14px 24px;border-radius:var(--r-m);transition:transform .15s,background .15s,border-color .15s}
.btn:active{transform:translateY(1px)}
.btn-amber{background:var(--amber);color:var(--on-amber);box-shadow:0 2px 0 rgba(12,18,32,.2)}
.btn-amber:hover{background:var(--amber-deep)}
/* Driven by the surface tokens above. The old `.dark .btn-ghost` override only
   matched sections carrying the literal .dark class, so on .d3-hero, .why-hero,
   .security-hero, .status-hero and .sa-hero the cream ghost button kept its
   50%-white fill under light text and rendered at 3.17:1. */
.btn-ghost{border:1.5px solid var(--ghost-border);background:var(--ghost-bg);color:var(--ghost-ink);font-weight:600}
.btn-ghost:hover{border-color:var(--ink)}
.dark .btn-ghost:hover{border-color:var(--amber);color:var(--amber-text)}
.flag-hero .btn-ghost,.scm-hero .btn-ghost{border-color:#58677f;background:rgba(255,255,255,.035);color:#edf2fb}
.flag-hero .btn-ghost:hover,.scm-hero .btn-ghost:hover{border-color:var(--amber);color:var(--amber-text)}

/* ---------- privacy consent ---------- */
.sl-privacy-consent{position:fixed;z-index:1200;right:16px;bottom:16px;display:grid;grid-template-columns:auto minmax(0,1fr) 126px;align-items:center;gap:12px;width:min(680px,calc(100vw - 32px));padding:12px;color:var(--ink);background:rgba(255,253,248,.97);border:1px solid #d8cdb6;border-radius:var(--r-m);box-shadow:0 24px 70px -26px rgba(12,18,32,.48);backdrop-filter:blur(18px)}
.sl-privacy-mark{display:grid;grid-template-columns:repeat(3,5px);align-items:end;gap:3px;width:28px;height:28px;padding:6px;background:var(--panel);border-radius:var(--r-s)}
.sl-privacy-mark i{display:block;height:10px;background:var(--amber);border-radius:2px}.sl-privacy-mark i:nth-child(2){height:15px}.sl-privacy-mark i:nth-child(3){height:8px}
.sl-privacy-copy{min-width:0}.sl-privacy-copy small{color:var(--amber-text);font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.12em}.sl-privacy-copy h2{margin-top:2px;font-size:14px;line-height:1.25}.sl-privacy-copy p{max-width:430px;margin-top:3px;color:var(--muted);font-size:12px;line-height:1.35}.sl-privacy-copy a{color:var(--amber-text);font-size:inherit;font-weight:650;text-decoration:underline;text-underline-offset:3px}
.sl-privacy-actions{display:grid;gap:6px;width:126px}.sl-privacy-actions button{display:inline-flex;align-items:center;justify-content:center;width:100%;min-height:34px;padding:6px 10px;color:var(--ink);background:var(--paper);border:1px solid #c8bda7;border-radius:var(--r-s);font-size:12px;font-weight:700;white-space:nowrap}.sl-privacy-actions button:hover{border-color:var(--ink)}.sl-privacy-actions button.accept{color:var(--on-amber);background:var(--amber);border-color:var(--amber)}.sl-privacy-actions button.accept:hover{background:var(--amber-deep);border-color:var(--amber-deep)}
.sl-privacy-settings{position:fixed;z-index:1100;right:14px;bottom:12px;padding:7px 10px;color:var(--muted);background:rgba(255,253,248,.95);border:1px solid var(--line);border-radius:6px;box-shadow:var(--shadow-card);font:600 11px/1.2 var(--mono);backdrop-filter:blur(12px)}.sl-privacy-settings:hover{color:var(--ink);border-color:#c8bda7}
@media(max-width:700px){.sl-privacy-consent{right:12px;left:12px;width:auto;grid-template-columns:auto minmax(0,1fr);align-items:start}.sl-privacy-actions{grid-column:1/-1;grid-template-columns:1fr 1fr;width:auto}}
@media(max-width:480px){.sl-privacy-consent{right:8px;bottom:8px;left:8px;grid-template-columns:1fr;padding:11px}.sl-privacy-mark,.sl-privacy-copy small{display:none}}
@media(prefers-reduced-motion:reduce){.sl-privacy-consent *,.sl-privacy-settings{transition:none!important}}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(252,247,238,.86);backdrop-filter:blur(12px);border-bottom:1px solid rgba(230,220,200,.6)}
.nav-in{display:flex;align-items:center;justify-content:space-between;max-width:1160px;margin:0 auto;padding:16px 24px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;letter-spacing:-.02em}
.logo-mark{display:inline-block;width:26px;height:26px;flex:none;background:url("/assets/brand/seatlayer-mark-contained-midnight.svg") center/contain no-repeat}
.nav-links{display:flex;gap:28px;font-size:14px;font-weight:500}
.nav-links a{color:var(--muted)}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--ink)}
.nav-links a[aria-current]{font-weight:600}
.nav-cta{display:flex;align-items:center;gap:12px}
.nav-cta .signin{font-size:14px;font-weight:600;padding:9px 14px}
.nav-cta .btn{padding:10px 18px;font-size:14px;border-radius:10px}

/* ---------- page hero (sub-pages: a compact heading band) ---------- */
.phero{position:relative;overflow:hidden;background:radial-gradient(70% 150% at 88% 20%,rgba(244,183,64,.13),transparent 65%),linear-gradient(165deg,var(--paper-warm) 0%,var(--paper) 70%);border-bottom:1px solid var(--line)}
.phero::after{content:"";position:absolute;width:380px;height:380px;border:1px solid rgba(12,18,32,.05);border-radius:50%;right:-170px;top:-190px;box-shadow:0 0 0 48px rgba(12,18,32,.018),0 0 0 96px rgba(12,18,32,.012);pointer-events:none}
.phero .wrap{position:relative;z-index:1;padding-top:82px;padding-bottom:76px}
.phero h1{font-size:var(--sl-title-page);line-height:1.05;font-weight:800;letter-spacing:-.035em;margin-top:14px;text-wrap:balance;max-width:780px}
.phero p{font-size:19px;color:var(--muted);margin-top:20px;max-width:600px;text-wrap:pretty}
.phero .phero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.proofbar{border-bottom:1px solid var(--line);background:var(--card)}
.proofbar .wrap{display:grid;grid-template-columns:repeat(4,1fr);padding-top:22px;padding-bottom:22px}
.proofitem{padding:0 22px;border-right:1px solid var(--line)}.proofitem:first-child{padding-left:0}.proofitem:last-child{border-right:0}
.proofitem b{display:block;font:700 16px var(--mono);color:var(--ink)}.proofitem span{display:block;font-size:11.5px;color:var(--muted);margin-top:3px}
.enterprise-callout{border:1px solid var(--panel-line);background:linear-gradient(145deg,#111927,#0c121d);border-radius:var(--r-l);box-shadow:var(--shadow-panel);color:var(--panel-ink);padding:28px}
.enterprise-callout .tag{font:10px var(--mono);letter-spacing:.12em;color:var(--amber-text)}.enterprise-callout h3{font-size:22px;line-height:1.15;margin-top:10px}.enterprise-callout p{font-size:13.5px;color:var(--panel-mut);margin-top:9px}.enterprise-callout .chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}.enterprise-callout .chips span{font:9.5px var(--mono);border:1px solid #2d3850;border-radius:6px;padding:5px 8px;color:#aab5ca}

/* ---------- faq (shared) ---------- */
.faq{max-width:760px;margin:44px auto 0}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 4px;font-size:16.5px;font-weight:600;cursor:pointer;list-style:none;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono);font-size:20px;color:var(--faint);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg);color:var(--amber-text)}
.faq .a{padding:0 4px 22px;color:var(--muted);font-size:15px;max-width:640px;text-wrap:pretty}

/* ---------- final cta + footer (shared) ---------- */
.final{background:var(--panel);text-align:center}
.final h2{font-size:var(--sl-title-final);font-weight:800;letter-spacing:-.03em;color:var(--panel-ink);text-wrap:balance}
.final p{color:var(--panel-mut);margin-top:14px;font-size:17px}
.footer{background:var(--panel);border-top:1px solid var(--panel-line);color:var(--panel-mut)}
.footer-in{max-width:1160px;margin:0 auto;padding:34px 24px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;font-size:13.5px}
.footer .logo{color:var(--panel-ink);font-size:15px}
.footer nav{display:flex;gap:22px;flex-wrap:wrap}
.footer a:hover{color:var(--amber-text)}

/* ---------- reveal-on-scroll (content stays visible without JavaScript) ---------- */
.reveal{opacity:1;transform:none;transition:opacity .6s ease,transform .6s ease}
.sl-reveal-ready .reveal{opacity:0;transform:translateY(18px)}
.sl-reveal-ready .reveal.in{opacity:1;transform:none}

@keyframes blinkdot{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes floatin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s!important;transition-duration:.001s!important}
  /* Must out-specify .sl-reveal-ready .reveal (0,2,0) above, or reduced-motion
     readers keep the opacity:0 gate and see blank blocks until the observer fires. */
  .reveal,.sl-reveal-ready .reveal{opacity:1;transform:none}
  html{scroll-behavior:auto}
}
@media (max-width:900px){
  .nav-in{flex-wrap:wrap}
  .nav-links{order:3;flex-basis:100%;gap:8px 20px;flex-wrap:wrap;white-space:normal;padding-top:8px}
  .sl-nav-ready .nav-in{flex-wrap:nowrap}
  .sl-nav-ready .nav-links{display:none}
  .proofbar .wrap{grid-template-columns:1fr 1fr;gap:18px}.proofitem{border-right:0;padding:0}
  /* Touch targets. These are standalone navigation links, not links inside a
     sentence, so the 44px minimum applies to them. Padding rather than height
     keeps the text baseline where the type scale put it. */
  .nav-links a{display:inline-flex;align-items:center;min-height:44px}
}
@media (max-width:640px){
  section{padding:72px 0}
  .nav-in{min-height:64px;padding:10px 16px;justify-content:flex-start;gap:12px}
  .nav .logo{flex:none;white-space:nowrap}
  .nav-cta{display:none}
  .nav-in>.sl-burger{width:44px;height:44px;padding:10px;margin-left:auto}
}

/* ---------- tiny shared JS-driven helper for reveal (progressive) ---------- */

/* grouped footer (2026-07-19 redesign) */
.footer-grid{max-width:1160px;margin:0 auto;padding:52px 24px 42px;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:36px;font-size:13.5px}
.footer-brand p{margin-top:14px;max-width:270px;font-size:13px;line-height:1.65;color:var(--panel-mut)}
.footer-copy{display:block;margin-top:20px;font-family:var(--mono);font-size:11px;color:var(--faint)}
.footer-col{display:flex;flex-direction:column;gap:10px}
.footer-col b{font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:4px;font-weight:600}
.footer-col a{color:var(--panel-mut)}
.footer-col a:hover{color:var(--amber-text)}
.footer-col a[aria-current]{color:var(--panel-ink)}
.footer-bottom{max-width:1160px;margin:0 auto;padding:16px 24px 20px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;font-family:var(--mono);font-size:11px;color:var(--faint)}
.footer-bottom nav{display:flex;gap:18px}
.footer-bottom a{color:var(--faint)}
.footer-bottom a:hover{color:var(--panel-ink)}
@media(max-width:860px){.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1}}
@media(max-width:640px){
  /* Footer links rendered at 17.6px tall — ~40% of the 44px minimum. */
  .footer-col a,.footer nav a,.footer-bottom nav a{display:inline-flex;align-items:center;min-height:44px}
  .footer-col{gap:0}
  .footer-bottom nav{gap:18px;flex-wrap:wrap}
}
