/* ══════════════════════════════════════════════════════
   Resonate Labs GEO Landing Pages — Shared Stylesheet
   ══════════════════════════════════════════════════════ */

/* ── Reset & Base ──────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  /* Brand colors — replace at bootstrap time */
  --blue-primary: #c8ff00;
  --blue-dark: #09090b;
  --blue-accent: #c8ff00;
  --blue-nav: #09090b;
  --blue-mid: #b0e000;
  --text-color: #fafafa;
  --text-light: #d4d4d8;
  --bg-white: #09090b;
  --bg-light: #15151c;
  --bg-soft: #0c0c10;
  --bg-tinted: #0d130a;
  --bg-blue-gradient: linear-gradient(135deg, #09090b 0%, #c8ff00 100%);
  --border-color: #27272a;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
  --radius: 6px;
  --max-width: 1200px;
  /* Vertical spacing scale — prefer these over ad-hoc margins for consistent rhythm */
  --space-3xs: 0.25rem;
  --space-2xs: 0.375rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 2.75rem;
  --space-3xl: 4rem;
  --font-display: 'Instrument Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: 'Instrument Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
  --bg-card: #1c1c24;
  --bg-card-tinted: #1c2014;

  /* ── Theme-role tokens (multi-theme support; dark values = current design).
     --accent-fill/--accent-ink/--accent-hover: interactive fills that keep the
     lime + dark-ink pairing in EVERY theme. --accent itself may darken per
     theme (it doubles as a text/border color). The *-rgb triplets feed
     rgba() washes/glows/hairlines so themes can retint them. ── */
  --nav-bg: #09090b;
  --nav-text: #fff;
  --accent-fill: #c8ff00;
  --accent-ink: #09090b;
  --accent-hover: #b0e000;
  --accent-rgb: 200, 255, 0;
  --ink-rgb: 255, 255, 255;
  --text-faint: #71717a;
  --danger-bg: #1f0a0a;
  --danger-rgb: 239, 68, 68;
  --danger-text: #fca5a5;
  --warning-rgb: 245, 158, 11;
  --warning-text: #fcd34d;
  --neutral-rgb: 161, 161, 170;
  --success: #22c55e;
  /* aliases for account/booklet.css, which was written against the account
     hub's names — resolving them here themes it wherever main.css is host */
  --card: var(--bg-card);
  --border-strong: var(--border-light);
  /* account-app vocabulary (dark values = the literals the account sheets
     used before tokenization; see DESIGN.md "Themes") */
  --bg-rgb: 9, 9, 11;
  --panel-rgb: 18, 18, 20;
  --tone-950: #18181b;   /* inverse chips/tooltips — stays ink in light */
  --tone-900: #1b1b1f;
  --tone-850: #212127;
  --tone-600: #52525b;
  --tone-500: #6a6a76;
  --accent-dim-solid: #2f3b18;
  --chart-grid: #1d1d20;
  --won: #7a8f00;
  --won-dim: #6b7a2e;
  --ok-text: #6ee7b7;
  --ok-rgb: 52, 211, 153;
  --info: #7dd3fc;
  --info-soft: #bae6fd;
  --l1-ink: #93c5fd;
  --l1-rgb: 96, 165, 250;
  --l2-ink: #c4b5fd;
  --l2-rgb: 167, 139, 250;
  --high-rgb: 251, 146, 60;
  --med-rgb: 251, 191, 36;
  --high-ink: #fb923c;
  --red-ink: #f87171;
  --red-rgb: 248, 113, 113;
  --sky-ink: #38bdf8;
  --sky-rgb: 56, 189, 248;
  --amber-ink: #fbbf24;
  --amber-bright: #facc15;
  --amber-rgb: 250, 204, 21;
  --blue-ink: #60a5fa;
  --green-ink: #4ade80;
  --green-rgb: 74, 222, 128;
  --lime-soft: #b7e36b;
  --lime-soft-rgb: 183, 227, 107;
  --accent-deep: #3f6212;
  --accent-deep-rgb: 63, 98, 18;
}

html {
  font-size: 16px;
  scroll-padding-top: 120px;
}
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

body {
  font-family: var(--font-body);
  color: var(--text-color);
  background: var(--bg-white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: clip;     /* clip (not hidden) so position:sticky on .site-nav still works */
}
html { overflow-x: clip; }   /* same reason — overflow:hidden on html/body breaks sticky descendants */

/* ── Navigation ────────────────────────────────────── */
.site-nav {
  background: var(--blue-nav);
  padding: 0 2rem;
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.site-nav__inner {
  max-width: var(--max-width);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  height: 64px;
}
.site-nav__logo {
  display: inline-flex;
  align-items: center;
  color: var(--nav-text);
  font-size: 1.375rem;
  font-weight: 700;
  text-decoration: none;
  letter-spacing: -0.02em;
  flex-shrink: 0;
  line-height: 0;
}
.site-nav__logo img {
  display: block;
  height: 36px;
  width: auto;
  max-width: 100%;
}
.site-nav__links {
  display: flex;
  gap: 2rem;
  align-items: center;
  flex: 1;
  justify-content: flex-start;
  margin-left: 2.5rem;
}
.site-nav__links a {
  color: var(--text-color);
  text-decoration: none;
  font-size: 0.9375rem;
  font-weight: 600;
  padding: 0.5rem 0;
  transition: color 0.15s, border-color 0.15s;
  border-bottom: 2px solid transparent;
}
.site-nav__links a:hover { color: var(--blue-accent); }
.site-nav__links a[aria-current="page"] {
  color: var(--blue-accent);
  border-bottom-color: var(--blue-accent);
  font-weight: 600;
}
.site-nav__cta {
  background: var(--accent-fill);
  color: var(--accent-ink) !important;
  padding: 0.5rem 1.25rem;
  border-radius: 999px;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em;
  transition: background 0.15s, transform 0.15s, box-shadow 0.15s !important;
  flex-shrink: 0;
  border-bottom: none !important;
  text-decoration: none;
  white-space: nowrap;
}
.site-nav__cta-short { display: none; }
.site-nav__cta:hover {
  background: var(--blue-mid);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(var(--accent-rgb), 0.2);
}
/* Account: a utility link standardized across every page, pulled out of the
   section-links group to sit right beside the CTA. */
.site-nav__account {
  flex-shrink: 0;
  color: var(--text);
  text-decoration: none;
  font-size: 0.9375rem;
  font-weight: 600;
  white-space: nowrap;
  padding: 0.5rem 0;
  transition: color 0.15s;
}
.site-nav__account:hover { color: var(--accent); }
/* Mobile copy of Account that lives inside the hamburger menu; hidden on desktop. */
.site-nav__account-mobile { display: none; }
/* Pages without a section-links group (e.g. /start/) need the account link to
   claim the free space so it groups right, beside the CTA. */
.cart-body .site-nav__account { margin-left: auto; }

/* Hamburger toggle — CSS-only checkbox hack, no JS dependency */
.site-nav__toggle-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}
.site-nav__toggle {
  display: none;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--nav-text);
  flex-shrink: 0;
}
.site-nav__toggle-input:focus-visible + .site-nav__toggle {
  outline: 3px solid var(--blue-accent);
  outline-offset: 2px;
  border-radius: 4px;
}
.site-nav__hamburger,
.site-nav__hamburger::before,
.site-nav__hamburger::after {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--nav-text);
  position: relative;
  transition: transform 0.2s, top 0.2s, bottom 0.2s, opacity 0.2s;
}
.site-nav__hamburger::before,
.site-nav__hamburger::after {
  content: '';
  position: absolute;
  left: 0;
}
.site-nav__hamburger::before { top: -7px; }
.site-nav__hamburger::after  { bottom: -7px; }
.site-nav__toggle-input:checked + .site-nav__toggle .site-nav__hamburger {
  background: transparent;
}
.site-nav__toggle-input:checked + .site-nav__toggle .site-nav__hamburger::before {
  top: 0;
  transform: rotate(45deg);
}
.site-nav__toggle-input:checked + .site-nav__toggle .site-nav__hamburger::after {
  bottom: 0;
  transform: rotate(-45deg);
}

/* ── Hero ──────────────────────────────────────────── */
.hero {
  background: var(--bg-white);
  padding: 5rem 2rem 3.5rem;
  text-align: left;
  border-bottom: 1px solid var(--border-color);
  position: relative;
}
.hero::after {
  content: '';
  position: absolute;
  left: 2rem;
  right: 2rem;
  bottom: -1px;
  height: 1px;
  max-width: var(--max-width);
  margin: 0 auto;
  background: linear-gradient(to right, transparent 0%, var(--blue-accent) 50%, transparent 100%);
  opacity: 0.6;
}
.hero__inner {
  max-width: var(--max-width);
  margin: 0 auto;
}
.hero h1 {
  color: var(--text-color);
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 5vw, 3.5rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin-bottom: 1rem;
  text-wrap: balance;
}
.hero__sub {
  color: var(--text-light);
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  max-width: 680px;
  margin: 0 auto;
  font-weight: 500;
}
.hero__sub time {
  color: var(--blue-accent);
}

/* ── Hero byline (author attribution) ─────────────── */
.hero__byline {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  margin: 0 auto 1.25rem;
  padding: 0.35rem 0.9rem 0.35rem 0.4rem;
  border: 1px solid var(--border-color);
  border-radius: 999px;
  background: var(--bg-light);
}
.hero__byline-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  border: 1px solid var(--border-color);
  flex: none;
}
.hero__byline-text {
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: 0.02em;
  color: var(--text-color);
  margin: 0;
  text-align: left;
}
.hero__byline-text a {
  color: var(--text-color);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid var(--blue-accent);
}
.hero__byline-text a:hover {
  color: var(--blue-accent);
}
.hero__byline-role {
  color: var(--text-light);
}

/* ── Author bio page ──────────────────────────────── */
.author-hero__photo {
  width: 160px;
  height: 160px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid var(--border-color);
  margin: 0 auto 1.5rem;
  display: block;
}
.author-hero__role {
  font-family: var(--mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--blue-accent);
  margin: 0 0 0.75rem;
}

/* ── Section layout ───────────────────────────────── */
.content-section {
  padding: 4rem 2rem;
  position: relative;
  scroll-margin-top: 64px; /* fixed nav height — keeps anchored sections fully visible */
}
.content-section--alt {
  background:
    radial-gradient(ellipse 80% 40% at 50% 0%, rgba(var(--ink-rgb), 0.015), transparent 70%),
    var(--bg-light);
  border-top: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
}
/* Subtle gradient divider between adjacent sections of the same shade */
.content-section + .content-section:not(.content-section--alt)::before,
.content-section + .content-section--alt::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: var(--max-width);
  height: 1px;
  background: linear-gradient(to right, transparent 0%, var(--blue-accent) 50%, transparent 100%);
  opacity: 0.18;
}

.content-section .container {
  max-width: var(--max-width);
  margin: 0 auto;
}

/* ── Typography ────────────────────────────────────── */
h2 {
  font-family: var(--font-display);
  font-size: clamp(1.625rem, 2.5vw, 2rem);
  font-weight: 700;
  color: var(--text-color);
  margin-top: 2rem;
  margin-bottom: 1.25rem;
  line-height: 1.25;
  letter-spacing: -0.01em;
  text-wrap: balance;
}
.content-section > h2:first-child {
  margin-top: 0;
}
h3 {
  font-family: var(--font-body);
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--blue-primary);
  line-height: 1.4;
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
}
p {
  margin-bottom: 1rem;
  color: var(--text-color);
}
.lead-paragraph {
  font-size: 18px;
  line-height: 1.5;
  font-weight: 500;
}

/* ── CTA Banner ────────────────────────────────────── */
.cta-banner {
  background: var(--bg-card);
  border-top: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
  padding: 4rem 2rem;
  text-align: center;
}
.cta-banner__inner {
  max-width: 640px;
  margin: 0 auto;
}
.cta-banner h2 {
  color: var(--text-color);
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0 0 0.75rem;
}
.cta-banner p {
  color: var(--text-light);
  font-size: 1rem;
  line-height: 1.6;
  margin-bottom: 1.75rem;
}
.cta-button {
  display: inline-block;
  background: var(--accent-fill);
  color: var(--accent-ink);
  padding: 0.875rem 1.75rem;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s, transform 0.15s, box-shadow 0.15s;
}
.cta-button:hover {
  background: var(--accent-hover);
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(var(--accent-rgb), 0.25);
}
.cta-button:active {
  transform: translateY(0);
}

/* ── FAQ ──────────────────────────────────────────── */
.faq {
  margin-top: 2rem;
}
.faq h3 {
  font-size: 1.0625rem;
  font-weight: 600;
  color: var(--blue-accent);
  margin-top: 2.25rem;
  margin-bottom: 0.625rem;
  letter-spacing: -0.005em;
}
.faq h3:first-child {
  margin-top: 0;
}
.faq p {
  color: var(--text-light);
  line-height: 1.7;
  margin-bottom: 0;
}

/* ── Internal Links ───────────────────────────────── */
.internal-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.internal-links li {
  padding: 0.875rem 0;
  border-bottom: 1px solid var(--border-color);
  color: var(--text-light);
  font-size: 0.9375rem;
  line-height: 1.5;
}
.internal-links li:last-child {
  border-bottom: 0;
}
.internal-links a {
  color: var(--blue-accent);
  text-decoration: none;
  font-weight: 500;
  transition: color 0.15s;
}
.internal-links a:hover {
  color: var(--text-color);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--blue-accent);
}
/* /for/ role index: give the closing prose room to breathe below the role list */
#roles .internal-links + p {
  margin-top: 1.75rem;
}

/* In-body prose links (FAQ answers + body paragraphs). Without this they inherit
   the a{color:inherit;text-decoration:none} reset and render as invisible plain text. */
.content-section p a,
.faq__answer a,
.direct-answer a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
  transition: opacity 0.15s;
}
.content-section p a:hover,
.faq__answer a:hover,
.direct-answer a:hover {
  opacity: 0.8;
}

/* ── Footer ────────────────────────────────────────── */
.site-footer {
  background: var(--blue-nav);
  color: var(--nav-text);
  padding: 3rem 2rem 1.5rem;
  font-size: 0.875rem;
}
.site-footer__inner {
  max-width: var(--max-width);
  margin: 0 auto;
}
.site-footer__columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 2rem;
  margin-bottom: 2rem;
}
.site-footer__heading {
  color: var(--nav-text);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  margin: 0 0 0.75rem;
}
.site-footer__col ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.site-footer__col li {
  margin-bottom: 0;
}
.site-footer__col li a {
  display: inline-block;
  padding: 0.5rem 0;
}
.site-footer__bottom {
  border-top: 1px solid rgba(var(--ink-rgb), 0.15);
  padding-top: 1.5rem;
  text-align: center;
  font-size: 11px;
}
.site-footer p {
  color: var(--nav-text);
  margin: 0;
}
.site-footer__legal {
  margin-top: 0.5rem !important;
  color: rgba(var(--ink-rgb), 0.6) !important;
}
.site-footer a {
  color: var(--blue-accent);
  text-decoration: none;
}
.site-footer a:hover {
  text-decoration: underline;
}

/* Section rhythm — larger breathing room after hero, tighter before CTA banner */
.hero + .content-section {
  padding-top: 4.5rem;
}
.content-section:has(+ .cta-banner) {
  padding-bottom: 2.5rem;
}

/* ── Direct Answer ────────────────────────────────── */
.direct-answer {
  background: var(--bg-card);
  padding: 1.75rem 1.75rem;
  border-radius: var(--radius);
  border-left: 3px solid var(--blue-accent);
  margin-bottom: var(--space-xl);
}
.direct-answer .lead-paragraph {
  margin: 0;
}

/* ── Page TOC ─────────────────────────────────────── */
.page-toc {
  margin-top: 2rem;
}
.page-toc__title {
  font-family: var(--mono);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-light);
  margin-bottom: 0.75rem;
}
.page-toc__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.5rem;
  counter-reset: toc-counter;
}
.page-toc__list li {
  counter-increment: toc-counter;
  margin: 0;
}
.page-toc__list a {
  display: flex;
  align-items: baseline;
  gap: 0.625rem;
  padding: 0.625rem 0.875rem;
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: var(--radius);
  color: var(--text-color);
  text-decoration: none;
  font-size: 0.9375rem;
  font-weight: 500;
  transition: border-color 0.15s, color 0.15s, transform 0.15s;
}
.page-toc__list a::before {
  content: counter(toc-counter, decimal-leading-zero);
  font-family: var(--mono);
  font-size: 0.6875rem;
  color: var(--blue-accent);
  font-weight: 600;
}
.page-toc__list a:hover {
  border-color: var(--blue-accent);
  color: var(--blue-accent);
  transform: translateY(-1px);
}


/* ── Mid-Content CTA ─────────────────────────────── */
.cta-inline {
  text-align: center;
  padding: 2rem;
  margin: 2rem 0;
  background: var(--bg-light);
  border-radius: var(--radius);
}
.cta-inline p {
  color: var(--text-light);
  font-size: 15px;
  margin-bottom: 1rem;
}
/* Engage walkthrough CTA: left-aligned text, paragraph takes the free space,
   button stays on one line (no orphaned word). */
#engage .cta-inline { text-align: left; }
#engage .cta-inline p { flex: 1; margin-bottom: 0; }
#engage .cta-inline .cta-button { flex-shrink: 0; white-space: nowrap; }

/* ══════════════════════════════════════════════════════
   PARTNER PROGRAM — Operator Dashboard Archetype
   Distinct visual language from the 7 content archetypes:
   dashboard tiles, monitor-style cards, cycle flow.
   ══════════════════════════════════════════════════════ */

/* ── Hero (partners variant) ───────────────────────── */
.hero--partners {
  background:
    radial-gradient(ellipse 80% 60% at 20% 0%, rgba(var(--accent-rgb), 0.07), transparent 60%),
    radial-gradient(ellipse 60% 50% at 90% 100%, rgba(var(--accent-rgb), 0.05), transparent 60%),
    var(--bg-white);
  padding: 5rem 2rem 3rem;
  border-bottom: 1px solid var(--border-color);
}
.hero--partners .hero__inner {
  margin-bottom: 2.5rem;
}
.hero__eyebrow {
  display: inline-block;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--blue-accent);
  padding: 0.375rem 0.75rem;
  border: 1px solid var(--blue-accent);
  border-radius: 999px;
  margin-bottom: 1.5rem;
}
.hero--partners h1 {
  font-size: clamp(2.5rem, 5.5vw, 3.75rem);
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1.02;
  max-width: 1040px;
  margin-bottom: 1.25rem;
}
.hero__lede {
  font-size: 17px;
  line-height: 1.6;
  color: var(--text-light);
  max-width: 720px;
  margin-bottom: 1.25rem;
}
.hero--partners .hero__sub {
  margin-bottom: 2rem;
}
.hero__cta-row {
  display: flex;
  gap: 0.875rem;
  flex-wrap: wrap;
}

/* Ghost CTA variant — outlined */
.cta-button--ghost {
  background: transparent !important;
  color: var(--blue-accent) !important;
  border: 1px solid var(--blue-accent);
}
.cta-button--ghost:hover {
  background: rgba(var(--accent-rgb), 0.08) !important;
  color: var(--blue-accent) !important;
  box-shadow: none;
}

/* ── Friction grid (the problem section) ──────────── */
.friction-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  margin-top: 2rem;
}
.friction-card {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: var(--radius);
  padding: 1.5rem 1.5rem;
  position: relative;
}
.friction-card__head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}
.friction-card__icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: rgba(var(--accent-rgb), 0.1);
  border: 1px solid rgba(var(--accent-rgb), 0.25);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--blue-accent);
  flex-shrink: 0;
}
.friction-card__icon svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  stroke-width: 1.75;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.friction-card__tag {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  color: var(--blue-accent);
  letter-spacing: 0.16em;
  margin: 0;
}
.friction-card__title {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
  color: var(--text-color);
  margin-bottom: 0.5rem;
  line-height: 1.35;
}
.friction-card__body {
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-light);
  margin: 0;
}

/* ── System grid (3-card deliverable trio) ────────── */
.system-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-top: 2rem;
}
.system-card {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: var(--radius);
  padding: 1.75rem 1.5rem;
  display: flex;
  flex-direction: column;
}
.system-card__head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.875rem;
}
.system-card__icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: rgba(var(--accent-rgb), 0.1);
  border: 1px solid rgba(var(--accent-rgb), 0.25);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--blue-accent);
  flex-shrink: 0;
}
.system-card__icon svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  stroke-width: 1.75;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.system-card__label {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin: 0;
}
.system-card__title {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 600;
  color: var(--text-color);
  line-height: 1.3;
  margin-bottom: 0.875rem;
  text-wrap: balance;
}
.system-card__body {
  font-size: 14px;
  line-height: 1.65;
  color: var(--text-light);
  margin-bottom: 1.25rem;
}
.system-card__list {
  list-style: none;
  padding: 0;
  margin: auto 0 0;
  border-top: 1px solid var(--border-color);
  padding-top: 1rem;
}
.system-card__list li {
  position: relative;
  padding-left: 1.25rem;
  font-size: 13px;
  line-height: 1.55;
  color: var(--text-light);
  margin-bottom: 0.625rem;
}
.system-card__list li:last-child { margin-bottom: 0; }
.system-card__list li::before {
  content: '+';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--blue-accent);
  font-weight: 700;
  font-family: var(--mono);
}
.content-section > .container > p.system-sample {
  text-align: center;
  max-width: 620px;
  margin: 3.25rem auto 0;
  font-size: 15px;
  line-height: 1.65;
  color: var(--text-light);
}
.system-sample a {
  display: inline-block;
  margin-top: 0.9rem;
  font-weight: 600;
  white-space: nowrap;
}

/* ── System grid — 4-card (quad) variant ──────────── */
.system-grid--quad {
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

/* ── Deliverable rows ──────────────────────────────── */
.deliverable-grid {
  margin-top: 2rem;
  border-top: 1px solid var(--border-color);
}

/* ── Hero CTA note ─────────────────────────────────── */
.hero__cta-note {
  margin-top: 1rem;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--text-light);
  max-width: 580px;
}
.hero__cta-note a {
  color: var(--accent);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hero__cta-note a:hover {
  text-decoration: none;
}

/* ── Journey stepper ───────────────────────────────── */
.journey {
  list-style: none;
  padding: 0;
  margin: 2rem 0 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: relative;
}
.journey::before {
  content: '';
  position: absolute;
  left: 32px;
  top: 1rem;
  bottom: 1rem;
  width: 2px;
  background: linear-gradient(to bottom, var(--blue-accent) 0%, transparent 100%);
  opacity: 0.35;
  z-index: 0;
}
.journey__step {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 1.5rem;
  align-items: start;
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: var(--radius);
  padding: 1.5rem 1.75rem 1.5rem 1.25rem;
  position: relative;
  z-index: 1;
}
.journey__num {
  font-family: var(--mono);
  font-size: 18px;
  font-weight: 700;
  color: var(--blue-accent);
  letter-spacing: 0.05em;
  background: var(--bg-white);
  border: 2px solid var(--blue-accent);
  border-radius: 50%;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  line-height: 1;
}
.journey__content {
  padding-top: 0.375rem;
}
.journey__phase {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin-bottom: 0.5rem;
}
.journey__title {
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: 600;
  color: var(--text-color);
  line-height: 1.3;
  margin-bottom: 0.625rem;
  text-wrap: balance;
}
.journey__body {
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-light);
  margin: 0;
}

/* ── Engagement model split ────────────────────────── */
.engagement-split {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}
.engagement-card {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: var(--radius);
  padding: 1.75rem 1.5rem;
  position: relative;
  display: flex;
  flex-direction: column;
}
.engagement-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--blue-accent);
  border-radius: var(--radius) var(--radius) 0 0;
  opacity: 0.7;
}
.engagement-card__tag {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin-bottom: 0.875rem;
}
/* Icon + tag on one row. Opt-in wrapper: cards without a __head are unchanged. */
.engagement-card__head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.875rem;
}
.engagement-card__head .engagement-card__tag { margin-bottom: 0; }
.engagement-card__icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: rgba(var(--accent-rgb), 0.1);
  border: 1px solid rgba(var(--accent-rgb), 0.25);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--blue-accent);
  flex-shrink: 0;
}
.engagement-card__icon svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  stroke-width: 1.75;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.engagement-card__title {
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 600;
  color: var(--text-color);
  line-height: 1.3;
  margin-bottom: 0.875rem;
  text-wrap: balance;
}
.engagement-card__body {
  font-size: 14px;
  line-height: 1.65;
  color: var(--text-light);
  margin-bottom: 1.25rem;
}
.engagement-card__divider {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-light);
  margin: 1.25rem 0 0.625rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border-color);
}
.engagement-card__divider:first-of-type {
  margin-top: 0;
}
.engagement-card__list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.25rem;
}
.engagement-card__list li {
  position: relative;
  padding-left: 1.25rem;
  font-size: 13px;
  line-height: 1.5;
  color: var(--text-light);
  margin-bottom: 0.5rem;
}
.engagement-card__list li:last-child { margin-bottom: 0; }
.engagement-card__list li::before {
  content: '→';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--blue-accent);
  font-weight: 700;
}
.engagement-card__list--alt li::before {
  content: '◇';
  color: var(--text-light);
  font-size: 0.75rem;
  top: 0.125rem;
}
.engagement-card__fit {
  margin: 1.25rem 0 0;
  padding: 0.875rem 1rem;
  background: var(--bg-white);
  border-left: 2px solid var(--blue-accent);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--text-color);
  font-style: italic;
  font-weight: 500;
}

/* ── Apply band ────────────────────────────────────── */
.apply-band {
  background:
    radial-gradient(ellipse 60% 50% at 50% 0%, rgba(var(--accent-rgb), 0.08), transparent 70%),
    var(--bg-light);
  border-top: 1px solid var(--border-color);
  text-align: center;
  padding: 4.5rem 2rem;
}
.apply-band .container {
  max-width: 680px;
}
.apply-band__eyebrow {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin-bottom: 1rem;
}
.apply-band__title {
  font-family: var(--font-display);
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--text-color);
  margin-bottom: 1rem;
  text-wrap: balance;
  line-height: 1.15;
}
.apply-band__body {
  font-size: 17px;
  line-height: 1.6;
  color: var(--text-light);
  margin-bottom: 1.75rem;
}
/* Homepage contact: GEO Snapshot offered as the primary action above the form,
   with the contact form demoted to the secondary "or talk to us" path. */
.apply-band__lead-cta { margin-bottom: 2.75rem; }
/* Apply-band CTA row: two equal-width buttons, vertically centered.
   Overrides the flex default (align-items: stretch) which, combined with the
   lead-cta's bottom margin, was stretching the ghost button into a tall box. */
.apply-band .hero__cta-row {
  align-items: center;
  justify-content: center;
  max-width: 38rem;
  margin: 0 auto 2.75rem;
}
.apply-band .hero__cta-row .cta-button {
  flex: 1 1 0;
  margin-bottom: 0;
  text-align: center;
  white-space: nowrap;
}
.apply-band__talk {
  font-size: 20px;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 1.5rem;
  scroll-margin-top: 6rem;
}
/* .apply-band__inclusions rules removed — superseded by the homepage
   design-system rules appended later in this file. The old wrapper
   declared background, full border, and border-radius that weren't
   overridden by the new rule (which only re-sets top/bottom borders),
   so they leaked through as an unintended box. */
.apply-band__reassurance {
  font-size: 13px;
  line-height: 1.5;
  color: var(--text-light);
  margin: 0 0 2rem;
  font-style: italic;
}
.apply-actions {
  list-style: none;
  padding: 0;
  margin: 0 0 2.5rem;
  display: flex;
  justify-content: center;
  gap: 0.875rem;
  flex-wrap: wrap;
}
.apply-actions li {
  margin: 0;
  padding: 0;
  border: none;
}

/* ── Responsive ────────────────────────────────────── */

/* Tablet / mobile — hamburger nav, mobile padding */
@media (max-width: 768px) {
  /* Mobile scroll offset matches smaller sticky headers */
  html { scroll-padding-top: 108px; }

  /* Nav: show hamburger, hide links by default, CTA stays visible */
  .site-nav { padding: 0 1rem; }
  .site-nav__toggle { display: flex; }
  .site-nav__links {
    display: none;
    position: absolute;
    top: 64px;
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: var(--blue-nav);
    padding: 0.5rem 0;
    border-top: 1px solid rgba(var(--ink-rgb), 0.1);
    box-shadow: 0 4px 12px rgba(0,0,0,0.25);
  }
  .site-nav__toggle-input:checked ~ .site-nav__links { display: flex; }
  .site-nav__links a {
    padding: 0.875rem 1.5rem;
    font-size: 0.875rem;
    border-bottom: none;
  }
  .site-nav__links a[aria-current="page"] {
    background: rgba(var(--accent-rgb), 0.08);
    border-bottom: none;
    color: var(--blue-accent);
  }
  .site-nav__cta { font-size: 0.875rem !important; padding: 0.4375rem 0.875rem; }
  .site-nav__cta-full { display: none; }
  .site-nav__cta-short { display: inline; }
  /* Account moves into the hamburger menu on mobile (only on pages that have one,
     so /start/'s menu-less nav keeps its Account visible). */
  .site-nav__toggle-input ~ .site-nav__account { display: none; }
  .site-nav__account-mobile { display: block; }
  .site-nav__inner { gap: 0.5rem; }
  .site-nav__logo img { height: 28px; }

  .content-section { padding: 2.5rem 1.25rem; }
  .hero { padding: 3rem 1.25rem 2.5rem; }
  .hero + .content-section { padding-top: 3rem; }
  .direct-answer { padding: 1rem; }
  .cta-inline { padding: 1.5rem 1rem; margin: 1.5rem 0; }
  h2 { margin-top: 1.5rem; }

  /* Partner program — mobile */
  .hero--partners { padding: 3rem 1.25rem 2rem; }
  .hero--partners h1 { font-size: clamp(2rem, 8vw, 2.5rem); }
  .hero__lede { font-size: 17px; }
  .hero__cta-row { gap: 0.625rem; }
  .friction-grid,
  .system-grid,
  .system-grid--quad,
  .engagement-split {
    grid-template-columns: 1fr;
    gap: 0.875rem;
  }
  /* Journey — collapse to stacked cards, hide connector line */
  .journey::before { display: none; }
  .journey__step {
    grid-template-columns: 48px 1fr;
    gap: 1rem;
    padding: 1.25rem;
  }
  .journey__num {
    width: 44px;
    height: 44px;
    font-size: 18px;
    border-width: 2px;
  }
  .journey__title { font-size: 17px; }
  .engagement-card { padding: 1.25rem; }
  .apply-band__inclusions { padding: 1rem 1.25rem; }
  .friction-card,
  .system-card { padding: 1.25rem 1.25rem; }
  .apply-band { padding: 3rem 1.25rem; }
  .apply-actions { flex-direction: column; align-items: stretch; }
}

/* Small-mobile — tighter padding on iPhone SE and smaller */
@media (max-width: 640px) {
  .site-footer__columns { grid-template-columns: 1fr; gap: 1.5rem; }
}
@media (max-width: 480px) {
  .site-nav { padding: 0 0.75rem; }
  .site-nav__logo img { height: 24px; }
  .site-nav__cta { font-size: 0.875rem !important; padding: 0.375rem 0.75rem; }
  .hero { padding: 2.5rem 1rem 2rem; }
  .content-section { padding: 2rem 1rem; }
  .hero + .content-section { padding-top: 2.5rem; }
  .cta-banner { padding: 2.5rem 1rem; }
}

/* ══════════════════════════════════════════════════════
   PARTNER PROGRAM — Phase 2 Enhancements
   Intro chips · breath bands · cycle diagram · founder strip
   · deliverable groupings · FAQ accordion · mid-page CTA
   ══════════════════════════════════════════════════════ */

/* ── Intro chips (direct-answer split) ─────────────── */
.intro-chips {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
  margin-top: 1.5rem;
}
.intro-chip {
  background: var(--bg-white);
  border: 1px solid var(--border-color);
  border-radius: var(--radius);
  padding: 1rem;
  position: relative;
}
.intro-chip::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 24px;
  height: 2px;
  background: var(--blue-accent);
}
.intro-chip__label {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin: 0.375rem 0 0.5rem;
}
.intro-chip__body {
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-light);
  margin: 0;
}
.intro-models {
  margin: 1.5rem 0 0;
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-light);
}
/* Let the boxed intro-models line span the full container (match the card row)
   instead of inheriting the 680px cap on content-section paragraphs. */
.content-section > .container > p.intro-models { max-width: none; }
/* Match the Method thesis box to the card row + bottom box (full container width). */
#method .direct-answer { max-width: none; }
#method .lead-paragraph { max-width: none; }
.intro-models__tag {
  display: inline-block;
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--blue-accent);
  border: 1px solid rgba(var(--accent-rgb), 0.3);
  font-family: var(--mono);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 0.125rem 0.5rem;
  border-radius: 3px;
}

/* ── Breath bands (between sections) ───────────────── */
.breath-band {
  background: var(--bg-white);
  padding: 3rem 2rem;
  text-align: center;
  position: relative;
  border-top: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
}
.breath-band--alt {
  background: var(--bg-light);
}
.breath-band::before,
.breath-band::after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 1px;
  background: var(--blue-accent);
  opacity: 0.5;
}
.breath-band::before { top: 1.25rem; }
.breath-band::after  { bottom: 1.25rem; }
.breath-band__quote {
  font-family: var(--font-display);
  font-size: clamp(20px, 2.5vw, 28px);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.3;
  color: var(--text-light);
  margin: 0 auto;
  max-width: 720px;
  text-wrap: balance;
}
.breath-band__accent {
  color: var(--blue-accent);
}

/* ── Deliverable groupings ─────────────────────────── */
.deliverable-grid {
  border-top: none;
}
.deliverable-group {
  margin-top: 2rem;
  border-top: 2px solid var(--blue-accent);
  padding-top: 0.75rem;
}
.deliverable-group:first-of-type {
  margin-top: 1.5rem;
}
.deliverable-group__label {
  font-family: var(--mono);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin: 0;
}
.founder-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.5rem 0;
}
.founder-card__avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--bg-white);
  border: 2px solid var(--blue-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}
.founder-card__avatar span {
  font-family: var(--mono);
  font-size: 1rem;
  font-weight: 700;
  color: var(--blue-accent);
  letter-spacing: 0.04em;
}
.founder-card__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.founder-card__content {
  flex: 1;
  min-width: 0;
}
.founder-card__name {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 600;
  color: var(--text-color);
  margin: 0 0 0.125rem;
  line-height: 1.2;
}
.founder-card__role {
  font-size: 10px;
  color: var(--text-light);
  margin: 0 0 0.375rem;
  line-height: 1.4;
  font-family: var(--mono);
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.founder-card__link {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 500;
  color: var(--blue-accent);
  text-decoration: none;
  letter-spacing: 0.1em;
  transition: color 0.15s;
  text-transform: uppercase;
}
.founder-card__link:hover {
  color: var(--text-color);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--blue-accent);
}

/* ── FAQ — accordion + grouping ────────────────────── */
.faq-group {
  margin-top: 2.25rem;
}
.faq-group:first-child {
  margin-top: 1.5rem;
}
.faq-group__label {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin: 0 0 0.75rem;
  padding-bottom: 0.625rem;
  border-bottom: 1px solid var(--border-color);
}
.faq__item {
  border-bottom: 1px solid var(--border-color);
}
.faq__item[open] {
  background: var(--bg-card);
  border-radius: var(--radius);
  border-bottom: 1px solid var(--blue-accent);
  margin-bottom: 0.5rem;
}
.faq__question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.125rem;
  cursor: pointer;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
  color: var(--text-color);
  line-height: 1.4;
  list-style: none;
  transition: color 0.15s;
}
.faq__question::-webkit-details-marker { display: none; }
.faq__question:hover { color: var(--blue-accent); }
.faq__question::after {
  content: '+';
  font-family: var(--mono);
  font-size: 18px;
  font-weight: 400;
  color: var(--blue-accent);
  line-height: 1;
  flex-shrink: 0;
  transition: transform 0.2s;
}
.faq__item[open] .faq__question::after {
  content: '−';
}
.faq__answer {
  padding: 0 1.125rem 1.25rem;
  font-size: 14px;
  line-height: 1.65;
  color: var(--text-light);
  margin: 0;
}

/* ── Mid-page CTA (partners variant) ───────────────── */
.cta-inline--partners {
  margin-top: 2.5rem;
  padding: 1.5rem 1.75rem;
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  text-align: left;
  position: relative;
  overflow: hidden;
}
.cta-inline--partners::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--blue-accent);
  opacity: 0.6;
}
.cta-inline--partners p {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--text-color);
  flex: 1;
}
.cta-inline--partners p strong {
  color: var(--blue-accent);
  font-weight: 600;
}
.cta-inline--partners .cta-button {
  flex-shrink: 0;
}

/* ── Phase 2 — Mobile ──────────────────────────────── */
@media (max-width: 768px) {
  .intro-chips {
    grid-template-columns: 1fr;
    gap: 0.625rem;
    margin-top: 1.25rem;
  }
  .intro-chip { padding: 0.875rem 1rem; }
  .intro-models { margin-top: 1.25rem; font-size: 15px; }

  .breath-band { padding: 2.25rem 1.25rem; }
  .breath-band::before { top: 0.875rem; }
  .breath-band::after  { bottom: 0.875rem; }

  .deliverable-group { margin-top: 1.5rem; }

  .founder-card__avatar { width: 48px; height: 48px; }
  .founder-card__avatar span { font-size: 0.875rem; }

  .faq__question { font-size: 15px; padding: 0.875rem 1rem; }
  .faq__answer { padding: 0 1rem 1.125rem; font-size: 14px; }

  .cta-inline--partners {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
    padding: 1.25rem;
    gap: 1rem;
  }
  .cta-inline--partners .cta-button { align-self: center; }
}

/* ══════════════════════════════════════════════════════
   PARTNER PROGRAM — Phase 4 conversion additions
   Outcomes band · GTM callout · Investment · Case study
   · Founder bios · Selective callout
   ══════════════════════════════════════════════════════ */

.pricing-fineprint {
  margin-top: 1.5rem;
  font-size: 13px;
  color: var(--text-light);
  font-style: italic;
  line-height: 1.6;
}

/* ── Case study (Insynctive) ───────────────────────── */
.case-study {
  margin: 2rem 0 0;
  padding: 0;
}
.case-study__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--border-color);
}
.case-study__client {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 700;
  color: var(--text-color);
  margin: 0 0 0.25rem;
}
.case-study__meta {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text-light);
  letter-spacing: 0.1em;
  margin: 0;
  font-weight: 500;
}
.case-study__note {
  font-size: 11px;
  color: var(--text-light);
  font-style: italic;
  margin: 0.35rem 0 0;
  opacity: 0.8;
}
.case-study__tag {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  padding: 0.375rem 0.75rem;
  border-radius: 999px;
  background: rgba(var(--accent-rgb), 0.12);
  border: 1px solid rgba(var(--accent-rgb), 0.35);
  color: var(--blue-accent);
  flex-shrink: 0;
  white-space: nowrap;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.case-study__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  padding: 1.5rem 0;
}
.case-study__stat {
  text-align: left;
  padding: 0.5rem 0;
}
/* Case-study page runs four stats in one row; homepage keeps its own layout. */
.case-study-page .case-study__stats { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 720px) {
  .case-study-page .case-study__stats { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 460px) {
  .case-study-page .case-study__stats { grid-template-columns: 1fr; }
}
.case-study__stat-label {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
  color: var(--text-color);
  margin: 0 0 0.375rem;
}
.case-study__stat-note {
  font-size: 13px;
  line-height: 1.5;
  color: var(--text-light);
  margin: 0;
}
/* Metric-type marker beside the stat label. Inline (not flex) on purpose:
   .case-study__stat-label is shared with /case-study/, and a layout change
   there would relayout a page this rule has no business touching. Cards
   without the icon render exactly as before. */
.case-study__stat-icon {
  display: inline-block;
  vertical-align: -2px;
  width: 14px;
  height: 14px;
  margin-right: 0.4rem;
  color: var(--text-light);
  opacity: 0.65;
  stroke: currentColor;
  stroke-width: 1.75;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ── Founder credibility bio ───────────────────────── */
.founder-card__bio {
  font-size: 0.8125rem;
  line-height: 1.55;
  color: var(--text-light);
  margin: 0.375rem 0 0.5rem;
}
/* ── Phase 4 — Mobile ──────────────────────────────── */
@media (max-width: 768px) {
  .case-study__header { flex-direction: column; align-items: flex-start; gap: 0.625rem; }
  .case-study__client { font-size: 22px; }
  .case-study__stats {
    grid-template-columns: 1fr;
    gap: 1.25rem;
    padding: 1.25rem 0;
  }
  .case-study__stat { border-bottom: 1px solid var(--border-color); padding-bottom: 1.25rem; }
  .case-study__stat:last-child { border-bottom: none; padding-bottom: 0; }
}

/* ── Accessibility ─────────────────────────────────── */
:focus-visible {
  outline: 3px solid var(--blue-accent);
  outline-offset: 2px;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

/* ══════════════════════════════════════════════════════
   PARTNERS PAGE v2 — Additions for revised structure
   Single-stat hero · Cited callout · featured
   system card · embedded cycle diagram · two-model
   engagement · agency economics callout · sample-report viz
   ══════════════════════════════════════════════════════ */

:root {
  --danger: #ef4444;
  --danger-dim: rgba(var(--danger-rgb), 0.12);
  --warning: #f59e0b;
  --warning-dim: rgba(var(--warning-rgb), 0.12);
  --accent-dim: rgba(var(--accent-rgb), 0.12);
  --accent-glow: rgba(var(--accent-rgb), 0.08);
  --bg-card-hover: #1a1a1d;
  --border-light: #3f3f46;
  --text-muted: #a1a1aa;
}

/* ── Hero: single stat card variant ────────────────── */
.hero-stat-strip {
  display: flex;
  justify-content: center;
  padding: 2rem 0 0;
  max-width: 720px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.hero-stat-card {
  text-align: center;
  padding: 1.75rem 2rem;
  border-top: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
  width: 100%;
  max-width: 560px;
}
.hero-stat-card__val {
  font-family: var(--mono);
  font-size: clamp(48px, 6.5vw, 64px);
  font-weight: 700;
  color: var(--blue-accent);
  letter-spacing: -0.02em;
  line-height: 1;
  margin: 0 0 0.875rem;
}
.hero-stat-card__label {
  font-size: 18px;
  font-weight: 600;
  color: var(--text-color);
  margin: 0 0 0.25rem;
  line-height: 1.3;
}
.hero-stat-card__context {
  font-size: 15px;
  color: var(--text-light);
  margin: 0 auto 0.875rem;
  line-height: 1.5;
  max-width: 420px;
}
.hero-stat-card__source {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 0;
}

/* ── Cited methodology callout ─────────────────────── */
.cited-callout {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 1.75rem;
  padding: 1.75rem 2rem;
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-left: 4px solid var(--blue-accent);
  border-radius: 10px;
  margin: 0 0 2.5rem;
  align-items: center;
}
.cited-callout__eyebrow {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 0 0 0.5rem;
}
.cited-callout__title {
  font-size: 20px;
  font-weight: 600;
  color: var(--text-color);
  margin: 0 0 0.375rem;
  line-height: 1.3;
}
.cited-callout__body {
  font-size: 14px;
  color: var(--text-light);
  margin: 0 0 0.75rem;
  line-height: 1.5;
}
.cited-callout__link {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.12em;
  color: var(--blue-accent);
  text-transform: uppercase;
  text-decoration: none;
  transition: color 0.2s;
}
.cited-callout__link:hover { color: var(--text-color); }

/* ── Embedded cycle diagram inside how-it-works ───── */
.journey-cycle {
  text-align: center;
  padding: 2.5rem 0 0;
  border-top: 1px solid var(--border-color);
  margin-top: 2.5rem;
}
.journey-cycle__label {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 0 0 1.25rem;
}
.journey-cycle__diagram {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.journey-cycle__diagram svg { width: 320px; max-width: 100%; height: auto; }
.journey-cycle__diagram figcaption {
  font-size: 13px;
  color: var(--text-muted);
  margin-top: 1rem;
}

/* ── Pricing: two-SKU split ────────────────────────── */
.pricing-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
  margin-bottom: 1.5rem;
}
.pricing-block {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 2rem;
}
.pricing-block--featured { border-color: var(--blue-accent); }
.pricing-block__label {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin: 0 0 1rem;
}
.pricing-block__value {
  font-family: var(--mono);
  font-size: clamp(28px, 3.5vw, 38px);
  font-weight: 700;
  color: var(--text-color);
  letter-spacing: -0.02em;
  line-height: 1;
  margin: 0 0 1rem;
}
.pricing-block__cadence {
  font-size: 18px;
  font-weight: 500;
  color: var(--text-muted);
  letter-spacing: 0;
}
.pricing-block__body {
  font-size: 14px;
  color: var(--text-light);
  line-height: 1.6;
  margin: 0;
}

/* ── Agency economics callout ──────────────────────── */
.economics-callout {
  margin: 0 0 1.5rem;
  padding: 1.5rem 1.75rem;
  border-left: 3px solid var(--blue-accent);
  background: var(--accent-glow);
  border-radius: 0 8px 8px 0;
}
.economics-callout__label {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin: 0 0 0.75rem;
}
.economics-callout__body {
  font-size: 15px;
  color: var(--text-light);
  line-height: 1.7;
  margin: 0;
}
.economics-callout__body strong { color: var(--text-color); font-weight: 600; }

/* ── Sample report visualization ───────────────────── */
.showcase-note {
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.15em;
  margin: 0 0 1.5rem; display: flex; align-items: center; gap: 0.5rem;
}
.showcase-note::before { content: ''; width: 16px; height: 1px; background: var(--text-muted); }
.whitelabel-flag {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--blue-accent);
  background: var(--accent-dim); border: 1px solid var(--blue-accent);
  padding: 0.5rem 0.75rem; border-radius: 6px; margin: 0 0 1.75rem;
}
.sc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 1.25rem; }
.sc-metric {
  background: var(--bg-card); border: 1px solid var(--border-color);
  border-radius: 10px; padding: 1.375rem 1.125rem; text-align: center;
}
.sc-metric.warning { border-color: var(--warning); background: var(--warning-dim); }
.sc-metric.danger { border-color: var(--danger); background: var(--danger-dim); }
.sc-metric.highlight { border-color: var(--blue-accent); background: var(--accent-dim); }
.sc-val { font-family: var(--mono); font-size: 28px; font-weight: 700; margin-bottom: 4px; }
.sc-metric.warning .sc-val { color: var(--warning); }
.sc-metric.danger .sc-val { color: var(--danger); }
.sc-metric.highlight .sc-val { color: var(--blue-accent); }
.sc-label {
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 6px;
}
.sc-ctx { font-size: 12px; color: var(--text-light); }

.funnel-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
.funnel-card {
  background: var(--bg-card); border: 1px solid var(--border-color);
  border-radius: 10px; padding: 1.5rem;
}
.fc-label {
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 1rem;
}
.fc-label.danger { color: var(--danger); }
.fc-label.success { color: var(--blue-accent); }
.f-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.5rem 0; }
.f-row-label { font-size: 13px; color: var(--text-light); width: 160px; flex-shrink: 0; }
.f-bar-bg { flex: 1; height: 6px; background: rgba(var(--ink-rgb), 0.04); border-radius: 3px; overflow: hidden; }
.f-bar { height: 100%; border-radius: 3px; }
.f-bar.danger { background: var(--danger); }
.f-bar.warning { background: var(--warning); }
.f-bar.accent { background: var(--blue-accent); }
.f-val { font-family: var(--mono); font-size: 12px; font-weight: 500; width: 40px; text-align: right; flex-shrink: 0; }
.f-val.danger { color: var(--danger); }
.f-val.warning { color: var(--warning); }
.f-val.accent { color: var(--blue-accent); }
.f-bar.base { background: var(--border-light, #3f3f46); }
.f-val.base { color: var(--text-muted); }

/* ── Case study — trajectory figure (leading/lagging) ─ */
.traj-fig {
  background: var(--bg-card); border: 1px solid var(--border-color);
  border-radius: 10px; padding: 1.5rem; margin-bottom: 1.25rem;
}
.traj-fig__head { margin-bottom: 1.5rem; }
.traj-fig__klabel {
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 0.1em;
  color: var(--blue-accent); margin: 0 0 0.4rem;
}
.traj-fig__title {
  font-size: 18px; font-weight: 600; color: var(--text-color);
  letter-spacing: -0.01em; margin: 0;
}
.traj-block + .traj-block {
  margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--border-color);
}
.traj-block__lab {
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--text-muted); margin: 0 0 1rem;
}
.traj-block__lab .tl-tag { color: var(--text-light); }
.traj-chart { width: 100%; height: auto; display: block; }
.traj-fig__cap {
  font-size: 12px; line-height: 1.6; color: var(--text-muted);
  margin: 1.25rem 0 0; padding-top: 1rem; border-top: 1px solid var(--border-color);
}
.traj-fig__cap .src {
  font-family: var(--mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.8;
}

.sov-card {
  background: var(--bg-card); border: 1px solid var(--border-color);
  border-radius: 10px; padding: 1.75rem; margin-bottom: 1.25rem;
}
.sov-card h3 {
  font-size: 15px; font-weight: 600; margin: 0 0 1.25rem;
  display: flex; align-items: center; gap: 0.625rem;
}
.sov-card h3::before {
  content: ''; width: 3px; height: 16px;
  background: var(--blue-accent); border-radius: 2px;
}
.sov-table { width: 100%; border-collapse: collapse; }
.sov-table th {
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.1em;
  text-align: left; padding: 0.75rem 1rem; border-bottom: 1px solid var(--border-color);
}
.sov-table td {
  font-size: 14px; padding: 0.875rem 1rem;
  border-bottom: 1px solid rgba(var(--ink-rgb), 0.04); color: var(--text-light);
}
.sov-table tr:hover { background: var(--bg-card-hover); }
.sov-table tr.client { background: var(--accent-dim); }
.sov-table tr.client td { font-weight: 600; color: var(--text-color); }
.sov-bar-cell { display: flex; align-items: center; gap: 0.625rem; }
.sov-track { flex: 1; height: 4px; background: rgba(var(--ink-rgb), 0.04); border-radius: 2px; overflow: hidden; }
.sov-fill { height: 100%; border-radius: 2px; background: var(--text-muted); }
.sov-table tr.client .sov-fill { background: var(--blue-accent); }
.sov-pct { font-family: var(--mono); font-size: 12px; width: 40px; text-align: right; }

.synthesis {
  background: var(--accent-dim); border-left: 3px solid var(--blue-accent);
  padding: 1.25rem 1.5rem; border-radius: 0 8px 8px 0;
}
.synthesis p { font-size: 14px; line-height: 1.7; color: var(--text-light); margin: 0; }
.syn-tag {
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  color: var(--blue-accent); text-transform: uppercase; letter-spacing: 0.1em; margin-right: 0.5rem;
}

/* "Proof loop" growth charts — illustrative up-and-to-the-right area charts that
   visualize the climb (our AI visibility + the Google search demand it drives). */
.growth-lead { font-size: 15px; line-height: 1.6; color: var(--text-secondary); margin: 1.5rem 0 0.9rem; }
.growth-charts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.growth-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; padding: 1rem 1.1rem 0.75rem; }
.growth-card__head { display: flex; align-items: baseline; justify-content: space-between; gap: 0.5rem; margin: 0; }
.growth-card__label { font-size: 14.5px; font-weight: 600; color: var(--text); }
.growth-card__delta { font-family: var(--mono); font-size: 12.5px; font-weight: 600; color: var(--accent); background: var(--accent-dim); border-radius: 999px; padding: 0.12rem 0.55rem; white-space: nowrap; }
.growth-card__src { font-family: var(--mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-muted); margin: 0.25rem 0 0.7rem; }
.growth-svg { width: 100%; height: 84px; display: block; }
.growth-card__axis { display: flex; justify-content: space-between; font-family: var(--mono); font-size: 10px; letter-spacing: 0.04em; color: var(--text-muted); margin-top: 0.35rem; }
.growth-note { font-size: 12.5px; color: var(--text-muted); margin: 0.75rem 0 0; }
.growth-claim { font-size: 15px; line-height: 1.65; color: var(--text-secondary); margin: 1.4rem 0 0; padding-top: 1.2rem; border-top: 1px solid var(--border); max-width: 62ch; }
.growth-claim strong { color: var(--text); font-weight: 600; }
@media (max-width: 760px) {
  .growth-charts { grid-template-columns: 1fr; max-width: 420px; margin-inline: auto; }
}

/* Per-engine win-rate breakdown — ported from the account report viewer
   (account/booklet.css .qx-wins) so the homepage sample shows the real component:
   a "hit rate when visible" header + one bar per engine. */
.qx-wins { background: var(--bg-card, #141416); border: 1px solid var(--border, #27272a); border-radius: 12px; padding: 1rem 1.1rem; margin: 0 0 1.25rem; }
.qx-wins__top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.4rem 1rem; }
.qx-wins__label { display: block; font-size: 0.9rem; font-weight: 600; color: var(--text, #fafafa); }
.qx-wins__frac { display: block; font-size: 0.8rem; color: var(--text-muted, #a1a1aa); margin-top: 0.1rem; }
.qx-wins__big { font-size: 1.7rem; font-weight: 700; color: var(--accent, #c8ff00); font-variant-numeric: tabular-nums; line-height: 1; }
.qx-wins__bars { list-style: none; margin: 0.9rem 0 0; padding: 0; display: grid; gap: 0.5rem; }
.qx-wins__bar { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr) 3rem 3.4rem; align-items: center; gap: 0.6rem; font-size: 0.82rem; }
.qx-wins__eng { color: var(--text-muted, #a1a1aa); }
.qx-wins__track { background: var(--bg, #09090b); border: 1px solid var(--border, #27272a); border-radius: 999px; height: 0.5rem; overflow: hidden; }
.qx-wins__fill { display: block; height: 100%; background: var(--accent, #c8ff00); border-radius: 999px; }
.qx-wins__pct { color: var(--text, #fafafa); font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.qx-wins__n { color: var(--text-faint); font-variant-numeric: tabular-nums; text-align: right; }
.qx-wins__note { margin: 0.8rem 0 0; font-size: 0.78rem; line-height: 1.5; color: var(--text-faint); }
@media (max-width: 520px) {
  .qx-wins__bar { grid-template-columns: 4.6rem minmax(0, 1fr) 2.7rem 3rem; gap: 0.4rem; font-size: 0.74rem; }
  .qx-wins__big { font-size: 1.4rem; }
}

/* ── Mobile: partners v2 additions ─────────────────── */
@media (max-width: 720px) {
  .pricing-split { grid-template-columns: 1fr; }
  .cited-callout { grid-template-columns: 1fr; text-align: left; }
  .sc-grid { grid-template-columns: 1fr 1fr; }
  .funnel-pair { grid-template-columns: 1fr; }
  .f-row-label { width: 120px; font-size: 12px; }
}

/* ── Partners v2 — design-deviation fixes ──────────── */

/* Hero h1 — override default 500 weight to match proposed bold */
.hero--partners h1 { font-weight: 700; }

/* Engagement: space the lone "Book a call" below the agency band, and center it */
#engagement .hero__cta-row { justify-content: center; }

/* Results: center the proof-logos label + logo row, and pull the label
   down off the "Read the case study" button so it groups with the logos */
#results .proof-logos__label { text-align: center; max-width: none; margin: var(--space-3xl) auto 0.75rem; }
#results .proof-logos { justify-content: center; }

/* Engagement: "How the engagement works" as a 4-up numbered step row
   (lighter than the "What we install" system cards, so the two grids don't compete) */
.engagement-steps {
  list-style: none;
  margin: 1.5rem 0 var(--space-xl);
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}
/* 5-up variant for the agencies "loop" step row (falls back to the base
   media queries below: 2-up at <=900px, 1-up at <=560px) */
.engagement-steps--five { grid-template-columns: repeat(5, 1fr); }
.engagement-step {
  background: var(--bg-card, #141416);
  border: 1px solid var(--border, #27272a);
  border-radius: 12px;
  padding: 1.4rem 1.25rem;
}
.engagement-step__num {
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--blue-accent);
}
.engagement-step__title {
  font-size: 1rem;
  font-weight: 600;
  margin: 0.55rem 0 0.4rem;
  color: var(--text, #fafafa);
}
.engagement-step__body {
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
  color: var(--text-muted, #a1a1aa);
}
@media (max-width: 900px) { .engagement-steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .engagement-steps { grid-template-columns: 1fr; } }

/* Engagement card — featured variant (Done-with-you) */
.engagement-card--featured {
  border-color: var(--blue-accent);
  background: linear-gradient(180deg, rgba(var(--accent-rgb), 0.04) 0%, var(--bg-card) 30%);
}
.engagement-card--featured::before { opacity: 1; }

/* Page TOC — boxed variant: single card, 2-col, row dividers, no per-item chip.
   Used site-wide on every page that has an "On this page" nav. */
.page-toc--boxed {
  max-width: 1040px;
  margin: 0 auto;
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 28px 32px;
}
.page-toc--boxed .page-toc__title {
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--text-muted);
  margin-bottom: 18px;
}
.page-toc--boxed .page-toc__list {
  grid-template-columns: repeat(2, 1fr);
  gap: 2px 32px;
}
.page-toc--boxed .page-toc__list li { border-bottom: 1px solid var(--border-color); }
.page-toc--boxed .page-toc__list a {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 11px 0;
}
.page-toc--boxed .page-toc__list a:hover {
  background: transparent;
  border: none;
  color: var(--text-color);
  transform: none;
}
@media (max-width: 640px) {
  .page-toc--boxed { padding: 24px 22px; }
  .page-toc--boxed .page-toc__list { grid-template-columns: 1fr; gap: 0; }
}

/* Deliverable grid — 3-col wrapper. Neither legacy .deliverable-grid rule
   in main.css sets a column layout, so the wrapper would otherwise render
   its three .deliverable-group children stacked vertically. */
.deliverable-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
/* Zero the legacy top margins inside the grid so all three columns
   align at the top. Legacy rules give .deliverable-group 2rem top
   margin and first-of-type 1.5rem — that's vestigial from when groups
   were stacked vertically, and in a grid context it pushes the first
   column 0.5rem higher than the others. */
.deliverable-grid > .deliverable-group,
.deliverable-grid > .deliverable-group:first-of-type {
  margin-top: 0;
}
@media (max-width: 900px) {
  .deliverable-grid { grid-template-columns: 1fr; }
}

/* Deliverable list — partners variant: stacked title/body, no icons */
.deliverable-list { list-style: none; margin: 0; padding: 0; }
.deliverable-list li {
  font-size: 13px;
  color: var(--text-light);
  line-height: 1.55;
  padding: 14px 0;
  border-bottom: 1px solid var(--border-color);
}
.deliverable-list li:last-child { border-bottom: none; padding-bottom: 0; }
.deliverable-list__title {
  display: block;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--text-color);
  margin-bottom: 5px;
  line-height: 1.35;
}

/* ════════════════════════════════════════════════════════════════
   HOMEPAGE DESIGN SYSTEM — migrated from inline <style> (Option B)
   Source: index.html, 2026-05-30 migration.
   Rules below take precedence over equivalents earlier in this file
   via cascade order (same specificity, later wins). Acts as canonical
   for shared classes — homepage, partners, and any page linking
   main.css will render with these rules. Older rules earlier in
   this file are now dead-but-harmless; a separate cleanup PR can
   prune them.
   Var conflicts resolved with homepage values winning (notably
   --bg-card: #141416 overrides earlier #1c1c24).
   ════════════════════════════════════════════════════════════════ */
    :root {
      --bg: #09090b;
      --bg-secondary: #0f0f11;
      --bg-card: #141416;
      --bg-card-hover: #1a1a1d;
      --text: #fafafa;
      --text-secondary: #e4e4e7;
      --text-muted: #a1a1aa;
      --accent: #c8ff00;
      --accent-dim: rgba(var(--accent-rgb), 0.12);
      --accent-glow: rgba(var(--accent-rgb), 0.08);
      --border: #27272a;
      --border-light: #3f3f46;
      --font: 'Instrument Sans', -apple-system, BlinkMacSystemFont, sans-serif;
      --mono: 'JetBrains Mono', ui-monospace, monospace;
    }

    *, *::before, *::after { box-sizing: border-box; }
    html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
    body {
      margin: 0;
      font-family: var(--font);
      background: var(--bg);
      color: var(--text);
      line-height: 1.6;
      font-size: 16px;
    }
    ::selection { background: var(--accent); color: var(--bg); }
    a { color: inherit; text-decoration: none; }

    .container { max-width: 1120px; margin: 0 auto; padding: 0 24px; }

    /* ═════════════ NAV (mirrors main.css — keep in sync) ═════════════ */
    .site-nav {
      background: var(--bg);
      padding: 0 2rem;
      position: -webkit-sticky;  /* iOS Safari fallback prefix */
      position: sticky;
      top: 0;
      z-index: 100;
      box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    }
    .site-nav__inner {
      max-width: 1200px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      height: 64px;
    }
    .site-nav__logo {
      display: inline-flex;
      align-items: center;
      color: #fff;
      font-size: 1.375rem;
      font-weight: 700;
      text-decoration: none;
      letter-spacing: -0.02em;
      flex-shrink: 0;
      line-height: 0;
    }
    .site-nav__logo img { display: block; height: 36px; width: auto; max-width: 100%; }
    .site-nav__links {
      display: flex;
      gap: 2rem;
      align-items: center;
      flex: 1;
      justify-content: flex-start;
      margin-left: 2.5rem;
    }
    .site-nav__links a {
      color: var(--text);
      text-decoration: none;
      font-size: 0.875rem;
      font-weight: 500;
      padding: 0.5rem 0;
      transition: color 0.15s, border-color 0.15s;
      border-bottom: 2px solid transparent;
    }
    .site-nav__links a:hover { color: var(--accent); }
    .site-nav__links a[aria-current="page"] {
      color: var(--accent);
      border-bottom-color: var(--accent);
      font-weight: 600;
    }
    .site-nav__cta {
      background: var(--accent-fill);
      color: var(--accent-ink) !important;
      padding: 0.5rem 1.25rem;
      border-radius: 999px;
      font-size: 0.875rem !important;
      font-weight: 600 !important;
      letter-spacing: -0.005em;
      transition: background 0.15s, transform 0.15s, box-shadow 0.15s !important;
      flex-shrink: 0;
      border-bottom: none !important;
      white-space: nowrap;
    }
    .site-nav__cta-short { display: none; }
    .site-nav__cta:hover {
      background: var(--accent-hover);
      transform: translateY(-1px);
      box-shadow: 0 4px 16px rgba(var(--accent-rgb), 0.2);
    }
    .site-nav__toggle-input {
      position: absolute;
      width: 1px; height: 1px; padding: 0; margin: -1px;
      overflow: hidden; clip: rect(0,0,0,0); border: 0;
    }
    .site-nav__toggle {
      display: none;
      width: 44px; height: 44px;
      align-items: center; justify-content: center;
      cursor: pointer; color: var(--nav-text); flex-shrink: 0;
    }
    .site-nav__toggle-input:focus-visible + .site-nav__toggle {
      outline: 3px solid var(--accent);
      outline-offset: 2px;
      border-radius: 4px;
    }
    .site-nav__hamburger,
    .site-nav__hamburger::before,
    .site-nav__hamburger::after {
      display: block; width: 22px; height: 2px; background: var(--nav-text);
      position: relative;
      transition: transform 0.2s, top 0.2s, bottom 0.2s, opacity 0.2s;
    }
    .site-nav__hamburger::before,
    .site-nav__hamburger::after { content: ''; position: absolute; left: 0; }
    .site-nav__hamburger::before { top: -7px; }
    .site-nav__hamburger::after  { bottom: -7px; }
    .site-nav__toggle-input:checked + .site-nav__toggle .site-nav__hamburger { background: transparent; }
    .site-nav__toggle-input:checked + .site-nav__toggle .site-nav__hamburger::before { top: 0; transform: rotate(45deg); }
    .site-nav__toggle-input:checked + .site-nav__toggle .site-nav__hamburger::after { bottom: 0; transform: rotate(-45deg); }
    @media (max-width: 768px) {
      .site-nav {
        padding: 0 1rem;
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 100;
      }
      .site-nav__toggle { display: flex; }
      .site-nav__links {
        display: none;
        position: absolute;
        top: 64px; left: 0; right: 0;
        flex-direction: column; align-items: stretch; gap: 0;
        background: var(--bg);
        padding: 0.5rem 0;
        border-top: 1px solid rgba(var(--ink-rgb), 0.1);
        box-shadow: 0 4px 12px rgba(0,0,0,0.25);
        margin-left: 0;
      }
      .site-nav__toggle-input:checked ~ .site-nav__links { display: flex; }
      .site-nav__links a {
        padding: 0.875rem 1.5rem;
        font-size: 1rem;
        border-bottom: none;
      }
      .site-nav__links a[aria-current="page"] {
        background: rgba(var(--accent-rgb), 0.08);
        border-bottom: none;
        color: var(--accent);
      }
      .site-nav__cta { font-size: 0.8125rem !important; padding: 0.4375rem 0.875rem; }
      .site-nav__cta-full { display: none; }
      .site-nav__cta-short { display: inline; }
      .site-nav__inner { gap: 0.5rem; }
      .site-nav__logo img { height: 28px; }
    }
    /* Intermediate desktop band: the full "Get Your Free AI Visibility Snapshot"
       label is long enough to overflow the nav and wrap the links between the
       mobile breakpoint (768px) and roomy desktop. Use the compact
       "Free AI Snapshot" label until there's space for the full one. */
    @media (min-width: 769px) and (max-width: 1120px) {
      .site-nav__cta-full { display: none; }
      .site-nav__cta-short { display: inline; }
    }

    /* ═════════════ HERO ═════════════ */
    .hero {
      padding: 80px 24px 40px;
      position: relative;
      overflow: hidden;
    }
    .hero::before {
      content: '';
      position: absolute;
      top: -200px;
      left: 50%;
      transform: translateX(-50%);
      width: 800px;
      height: 600px;
      background: radial-gradient(ellipse at center, var(--accent-dim) 0%, transparent 60%);
      pointer-events: none;
      z-index: 0;
    }
    .hero__inner {
      max-width: 800px;
      margin: 0 auto;
      text-align: center;
      position: relative;
      z-index: 1;
    }
    .hero__eyebrow {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--accent);
      margin: 0 0 20px;
    }
    .hero h1 {
      font-weight: 700;
      line-height: 1.1;
      letter-spacing: -0.03em;
      margin: 0 0 22px;
      color: var(--text);
    }
    .hero h1 .h1-setup {
      display: block;
      font-size: clamp(20px, 3.2vw, 34px);
      margin-bottom: 0.4em;
      text-wrap: balance;
    }
    .hero h1 .h1-payoff {
      display: block;
      font-size: clamp(32px, 5.5vw, 64px);
      text-wrap: balance;
      color: var(--accent);
    }
    .hero__lede {
      font-size: 17px;
      color: var(--text-secondary);
      max-width: 600px;
      margin: 0 auto 14px;
      line-height: 1.6;
    }
    .hero__sub {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin: 0 auto 28px;
    }
    .hero__cta-row {
      display: flex;
      gap: 12px;
      justify-content: center;
      flex-wrap: wrap;
      margin-bottom: 18px;
    }
    .hero__cta-note {
      font-size: 13px;
      color: var(--text-muted);
      margin: 0;
      max-width: 540px;
      margin-left: auto;
      margin-right: auto;
      line-height: 1.5;
    }
    .cta-button {
      display: inline-block;
      padding: 12px 22px;
      background: var(--accent-fill);
      color: var(--accent-ink);
      font-size: 14px;
      font-weight: 600;
      border-radius: 6px;
      transition: all 0.2s;
    }
    .cta-button:hover { transform: translateY(-1px); box-shadow: 0 8px 24px rgba(var(--accent-rgb), 0.25); }
    .cta-button--ghost {
      background: transparent;
      color: var(--text);
      border: 1px solid var(--border-light);
    }
    .cta-button--ghost:hover { background: var(--bg-card); border-color: var(--accent); box-shadow: none; transform: translateY(-1px); }

    .hero-stat-strip {
      display: flex;
      justify-content: center;
      padding: 32px 0 0;
      max-width: 720px;
      margin: 0 auto;
      position: relative;
      z-index: 1;
    }
    .hero-stat-card {
      text-align: center;
      padding: 28px 32px;
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
      width: 100%;
      max-width: 560px;
    }
    .hero-stat-card__val {
      font-family: var(--mono);
      font-size: clamp(48px, 6.5vw, 64px);
      font-weight: 700;
      color: var(--accent);
      letter-spacing: -0.02em;
      line-height: 1;
      margin: 0 0 14px;
    }
    .hero-stat-card__label {
      font-size: 18px;
      font-weight: 600;
      color: var(--text);
      margin: 0 0 4px;
      line-height: 1.3;
    }
    .hero-stat-card__context {
      font-size: 15px;
      color: var(--text-secondary);
      margin: 0 auto 14px;
      line-height: 1.5;
      max-width: 420px;
    }
    .hero-stat-card__source {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin: 0;
    }

    /* ═════════════ CONTENT SECTIONS ═════════════ */
    .content-section { padding: 80px 0; }
    .content-section--alt { background: var(--bg-secondary); }
    .content-section h2 {
      font-size: clamp(24px, 3vw, 34px);
      font-weight: 700;
      letter-spacing: -0.02em;
      line-height: 1.15;
      margin: 0 0 16px;
      max-width: 760px;
    }
    .content-section > .container > p {
      font-size: 17px;
      color: var(--text-secondary);
      max-width: 680px;
      margin: 0 0 40px;
      line-height: 1.6;
    }

    /* ═════════════ INTRO ═════════════ */
    .direct-answer { max-width: 1040px; margin: 0 auto var(--space-xl); }
    .lead-paragraph {
      font-size: 18px;
      color: var(--text);
      font-weight: 500;
      max-width: 720px;
      margin: 0 0 32px;
      line-height: 1.5;
    }
    .intro-chips {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
      margin-bottom: 32px;
    }
    .intro-chip {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 20px;
    }
    .intro-chip__label {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--accent);
      margin: 0 0 10px;
    }
    .intro-chip__body {
      font-size: 14px;
      color: var(--text-secondary);
      line-height: 1.6;
      margin: 0;
    }
    .intro-models {
      font-size: 15px;
      color: var(--text-secondary);
      line-height: 1.7;
      margin: 0;
      padding: 20px;
      border-left: 2px solid var(--accent);
      background: var(--accent-glow);
      border-radius: 4px;
    }
    .intro-models__tag { color: var(--text); font-weight: 600; }
    @media (max-width: 720px) { .intro-chips { grid-template-columns: 1fr; } }

    /* ═════════════ PROBLEM ═════════════ */
    .friction-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 16px;
    }
    .friction-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 24px;
      transition: border-color 0.2s;
    }
    .friction-card:hover { border-color: var(--border-light); }
    .friction-card__head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 16px;
    }
    .friction-card__icon {
      width: 32px;
      height: 32px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: var(--accent);
    }
    .friction-card__icon svg {
      width: 20px;
      height: 20px;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .friction-card__tag {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.16em;
      color: var(--text-muted);
      margin: 0;
    }
    .friction-card__title {
      font-size: 15px;
      font-weight: 600;
      color: var(--text);
      margin: 0 0 8px;
      line-height: 1.35;
    }
    .friction-card__body {
      font-size: 14px;
      color: var(--text-secondary);
      line-height: 1.6;
      margin: 0;
    }
    @media (max-width: 980px) { .friction-grid { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 540px) { .friction-grid { grid-template-columns: 1fr; } }

    /* ═════════════ PRACTITIONERS ═════════════ */
    .cited-callout {
      display: grid;
      grid-template-columns: 140px 1fr;
      gap: 28px;
      padding: 28px 32px;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-left: 4px solid var(--accent);
      border-radius: 10px;
      margin: 0 0 40px;
      align-items: center;
    }
    .cited-callout__cover {
      display: block;
      width: 140px;
      height: auto;
      border-radius: 6px;
      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5);
    }
    .cited-callout__eyebrow {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin: 0 0 8px;
    }
    .cited-callout__title {
      font-size: 20px;
      font-weight: 600;
      color: var(--text);
      margin: 0 0 6px;
      line-height: 1.3;
    }
    .cited-callout__body {
      font-size: 14px;
      color: var(--text-secondary);
      margin: 0 0 12px;
      line-height: 1.5;
    }
    .cited-callout__link {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.12em;
      color: var(--accent);
      text-transform: uppercase;
      transition: color 0.2s;
    }
    .cited-callout__link:hover { color: var(--text); }

    .founders-strip__label {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin: 0 0 16px;
    }
    .founders-strip__cards {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 20px;
    }
    .founder-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 22px;
    }
    .founder-card__name {
      font-size: 16px;
      font-weight: 600;
      color: var(--text);
      margin: 0 0 4px;
    }
    .founder-card__role {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin: 0 0 12px;
    }
    .founder-card__bio {
      font-size: 14px;
      color: var(--text-secondary);
      line-height: 1.55;
      margin: 0 0 12px;
    }
    .founder-card__link {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.1em;
      color: var(--accent);
      text-transform: uppercase;
    }
    .founder-card__link:hover { color: var(--text); }
    @media (max-width: 720px) {
      .cited-callout { grid-template-columns: 1fr; text-align: left; }
      .cited-callout__cover { justify-self: start; }
      .founders-strip__cards { grid-template-columns: 1fr; }
    }

    /* ═════════════ SYSTEM ═════════════ */
    .system-grid { display: grid; gap: 20px; }
    .system-grid--quad { grid-template-columns: repeat(2, 1fr); }
    .system-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 28px;
      transition: border-color 0.2s;
    }
    .system-card:hover { border-color: var(--border-light); }
    .system-card__head {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 14px;
    }
    .system-card__icon {
      width: 36px;
      height: 36px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: var(--accent);
      background: var(--accent-dim);
      border-radius: 8px;
    }
    .system-card__icon svg {
      width: 20px;
      height: 20px;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .system-card__label {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin: 0;
    }
    .system-card__title {
      font-size: 18px;
      font-weight: 600;
      color: var(--text);
      margin: 0 0 10px;
      line-height: 1.3;
    }
    .system-card__body {
      font-size: 14px;
      color: var(--text-secondary);
      line-height: 1.65;
      margin: 0 0 16px;
    }
    .system-card__list {
      list-style: none;
      padding: 0;
      margin: 0;
      border-top: 1px solid var(--border);
      padding-top: 14px;
    }
    .system-card__list li {
      font-size: 13px;
      color: var(--text-secondary);
      line-height: 1.55;
      padding: 4px 0 4px 16px;
      position: relative;
    }
    .system-card__list li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 13px;
      width: 4px;
      height: 4px;
      background: var(--accent);
      border-radius: 50%;
    }
    @media (max-width: 720px) {
      .system-grid--quad { grid-template-columns: 1fr; }
    }

    /* ═════════════ BREATH BAND ═════════════ */
    .breath-band {
      padding: 60px 24px;
      text-align: center;
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
      background: var(--bg-secondary);
    }
    .breath-band--alt { background: var(--bg); }
    .breath-band__quote {
      font-size: clamp(20px, 2.5vw, 28px);
      font-weight: 600;
      color: var(--text);
      max-width: 760px;
      margin: 0 auto;
      letter-spacing: -0.02em;
      line-height: 1.3;
    }
    .breath-band__accent { color: var(--accent); }

    /* ═════════════ JOURNEY ═════════════ */
    .journey {
      list-style: none;
      padding: 0;
      margin: 0 0 48px;
      display: flex;
      flex-direction: column;
      gap: 14px;
    }
    .journey__step {
      display: grid;
      grid-template-columns: 72px 1fr;
      gap: 24px;
      align-items: start;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 24px 28px;
    }
    .journey__num {
      font-family: var(--mono);
      font-size: 18px;
      font-weight: 700;
      color: var(--accent);
      background: var(--bg);
      border: 1px solid var(--accent);
      border-radius: 50%;
      width: 56px;
      height: 56px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0;
      letter-spacing: 0.05em;
    }
    .journey__phase {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin: 0 0 6px;
    }
    .journey__title {
      font-size: 17px;
      font-weight: 600;
      color: var(--text);
      margin: 0 0 10px;
      line-height: 1.3;
    }
    .journey__body {
      font-size: 14px;
      color: var(--text-secondary);
      line-height: 1.6;
      margin: 0;
    }
    .journey__body strong { color: var(--text); font-weight: 600; }

    .journey-cycle {
      text-align: center;
      padding: 40px 0 0;
      border-top: 1px solid var(--border);
    }
    .journey-cycle__label {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin: 0 0 20px;
    }
    .journey-cycle__diagram {
      margin: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .journey-cycle__diagram svg { width: 320px; max-width: 100%; height: auto; }
    .journey-cycle__diagram figcaption {
      font-size: 13px;
      color: var(--text-muted);
      margin-top: 16px;
    }
    @media (max-width: 720px) {
      .journey__step { grid-template-columns: 1fr; gap: 14px; }
    }

    /* ═════════════ ENGAGEMENT MODELS ═════════════ */
    .engagement-split {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px;
      margin-bottom: 32px;
    }
    .engagement-card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 32px;
    }
    .engagement-card--featured {
      border-color: var(--accent);
      background: linear-gradient(180deg, rgba(var(--accent-rgb), 0.04) 0%, var(--bg-card) 30%);
    }
    .engagement-card__tag {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--accent);
      margin: 0 0 16px;
    }
    .engagement-card__title {
      font-size: 19px;
      font-weight: 600;
      color: var(--text);
      margin: 0 0 12px;
      line-height: 1.3;
    }
    .engagement-card__body {
      font-size: 14px;
      color: var(--text-secondary);
      line-height: 1.65;
      margin: 0 0 20px;
    }
    .engagement-card__divider {
      font-family: var(--mono);
      font-size: 9px;
      font-weight: 500;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin: 16px 0 8px;
      padding-top: 14px;
      border-top: 1px solid var(--border);
    }
    .engagement-card__list { list-style: none; padding: 0; margin: 0 0 1.25rem; }
    .engagement-card__list li {
      font-size: 13px;
      color: var(--text-secondary);
      line-height: 1.5;
      padding: 4px 0 4px 16px;
      position: relative;
    }
    .engagement-card__list li::before {
      content: '';
      position: absolute;
      left: 0;
      top: 13px;
      width: 4px;
      height: 4px;
      background: var(--accent);
      border-radius: 50%;
    }
    .engagement-card__list--alt li::before { background: var(--text-muted); }
    .engagement-card__fit {
      font-size: 13px;
      color: var(--text);
      margin: 20px 0 0;
      padding-top: 16px;
      border-top: 1px solid var(--border);
      font-weight: 500;
      line-height: 1.5;
    }

    .cta-inline {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 20px;
      padding: 24px 28px;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 10px;
    }
    .cta-inline p { font-size: 15px; color: var(--text); margin: 0; }
    @media (max-width: 720px) {
      .engagement-split { grid-template-columns: 1fr; }
      .cta-inline { flex-direction: column; align-items: flex-start; }
    }

    /* ═════════════ PRICING ═════════════ */
    .pricing-split {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px;
      margin-bottom: 24px;
    }
    .pricing-block {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 32px;
    }
    .pricing-block--featured { border-color: var(--accent); }
    .pricing-block__label {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--accent);
      margin: 0 0 16px;
    }
    .pricing-block__value {
      font-family: var(--mono);
      font-size: clamp(28px, 3.5vw, 38px);
      font-weight: 700;
      color: var(--text);
      letter-spacing: -0.02em;
      line-height: 1;
      margin: 0 0 16px;
    }
    .pricing-block__cadence {
      font-size: 18px;
      font-weight: 500;
      color: var(--text-muted);
      letter-spacing: 0;
    }
    .pricing-block__body {
      font-size: 14px;
      color: var(--text-secondary);
      line-height: 1.6;
      margin: 0;
    }
    .pricing-fineprint {
      font-size: 13px;
      color: var(--text-muted);
      margin: 0;
      text-align: left;
    }
    @media (max-width: 720px) { .pricing-split { grid-template-columns: 1fr; } }

    /* ═════════════ CASE STUDY ═════════════ */
    .case-study {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 32px;
      margin: 0 0 48px;
    }
    .case-study__header {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      margin-bottom: 28px;
      gap: 16px;
      flex-wrap: wrap;
    }
    .case-study__client {
      font-size: 22px;
      font-weight: 700;
      color: var(--text);
      margin: 0 0 4px;
    }
    .case-study__meta {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.1em;
      color: var(--text-muted);
      margin: 0;
    }
    .case-study__tag {
      font-family: var(--mono);
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--accent);
      background: var(--accent-dim);
      padding: 5px 10px;
      border-radius: 4px;
    }
    .case-study__stats {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 24px;
      padding: 24px 0;
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
      margin-bottom: 24px;
    }
    .case-study__stat-val {
      font-family: var(--mono);
      font-size: clamp(36px, 4.5vw, 48px);
      font-weight: 700;
      color: var(--accent);
      letter-spacing: -0.02em;
      line-height: 1;
      margin: 0 0 8px;
    }
    .case-study__stat-label {
      font-size: 15px;
      font-weight: 600;
      color: var(--text);
      margin: 0 0 6px;
    }
    .case-study__stat-note {
      font-size: 13px;
      color: var(--text-secondary);
      line-height: 1.5;
      margin: 0;
    }
    .case-study__synthesis {
      font-size: 14px;
      color: var(--text-secondary);
      line-height: 1.65;
      margin: 0;
    }
    @media (max-width: 720px) {
      .case-study__stats { grid-template-columns: 1fr; }
    }

    /* ═════════════ OUTCOMES TIMELINE ═════════════ */
    .outcomes-timeline__label {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin: 0 0 20px;
    }
    .outcomes-timeline__grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 16px;
    }
    .outcome-step {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 20px;
      border-top: 3px solid var(--accent);
    }
    .outcome-step__when {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--accent);
      margin: 0 0 10px;
    }
    .outcome-step__title {
      font-size: 15px;
      font-weight: 600;
      color: var(--text);
      margin: 0 0 8px;
      line-height: 1.3;
    }
    .outcome-step__body {
      font-size: 13px;
      color: var(--text-secondary);
      line-height: 1.55;
      margin: 0;
    }
    @media (max-width: 980px) { .outcomes-timeline__grid { grid-template-columns: 1fr 1fr; } }
    @media (max-width: 540px) { .outcomes-timeline__grid { grid-template-columns: 1fr; } }

    /* ═════════════ FAQ ═════════════ */
    .faq {
      display: flex;
      flex-direction: column;
      gap: 32px;
      max-width: 860px;
    }
    .faq-group__label {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--accent);
      margin: 0 0 12px;
    }
    .faq__item {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 10px;
      margin-bottom: 8px;
      overflow: hidden;
    }
    .faq__item[open] { border-color: var(--border-light); }
    .faq__question {
      padding: 18px 22px;
      font-size: 15px;
      font-weight: 600;
      color: var(--text);
      cursor: pointer;
      list-style: none;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
    }
    .faq__question::-webkit-details-marker { display: none; }
    .faq__question::after {
      content: '+';
      font-family: var(--mono);
      font-size: 18px;
      color: var(--accent);
      font-weight: 400;
      flex-shrink: 0;
    }
    .faq__item[open] .faq__question::after { content: '−'; }
    .faq__answer {
      padding: 0 22px 18px;
      font-size: 14px;
      color: var(--text-secondary);
      line-height: 1.65;
      margin: 0;
    }

    /* ═════════════ APPLY ═════════════ */
    .apply-band {
      text-align: center;
      background: var(--bg);
      border-top: 1px solid var(--border);
    }
    .apply-band__eyebrow {
      font-family: var(--mono);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--accent);
      margin: 0 0 18px;
    }
    .apply-band__title {
      font-size: clamp(28px, 4vw, 44px);
      font-weight: 700;
      letter-spacing: -0.02em;
      line-height: 1.15;
      margin: 0 0 18px;
    }
    .apply-band__body {
      font-size: 17px;
      color: var(--text-secondary);
      max-width: 620px;
      margin: 0 auto 32px;
      line-height: 1.6;
    }
    .apply-band__inclusions {
      list-style: none;
      padding: 24px 0;
      margin: 0 auto 32px;
      max-width: 560px;
      text-align: left;
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
    }
    .apply-band__inclusions li {
      font-size: 14px;
      color: var(--text-secondary);
      padding: 6px 0 6px 24px;
      position: relative;
      line-height: 1.5;
    }
    .apply-band__inclusions li::before {
      content: '✓';
      position: absolute;
      left: 0;
      top: 6px;
      color: var(--accent);
      font-family: var(--mono);
      font-weight: 700;
    }
    .apply-actions {
      list-style: none;
      padding: 0;
      margin: 0 0 32px;
      display: flex;
      gap: 12px;
      justify-content: center;
      flex-wrap: wrap;
    }
    .apply-actions li { margin: 0; }
    .apply-band__reassurance {
      font-size: 13px;
      color: var(--text-muted);
      margin: 0;
      max-width: 480px;
      margin-left: auto;
      margin-right: auto;
      line-height: 1.5;
    }
    /* Center the apply-band blocks: override the general content-section rules,
       which set a max-width with no auto margins and otherwise left-pin these. */
    .content-section.apply-band > .container > h2.apply-band__title {
      max-width: 100%;
      margin-left: auto;
      margin-right: auto;
    }
    .content-section.apply-band > .container > p {
      margin-left: auto;
      margin-right: auto;
    }
    .content-section.apply-band > .container > p.apply-band__eyebrow { max-width: 100%; }
    .content-section.apply-band > .container > p.apply-band__body { max-width: 620px; }
    .content-section.apply-band > .container > p.apply-band__reassurance { max-width: 480px; }
    /* Contact form */
    .contact-form {
      max-width: 480px;
      margin: 8px auto 0;
      display: flex;
      flex-direction: column;
      gap: 12px;
      text-align: left;
    }
    .contact-form input,
    .contact-form textarea {
      width: 100%;
      padding: 14px 16px;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 8px;
      color: var(--text);
      font-size: 15px;
      font-family: inherit;
      transition: border-color 0.2s;
    }
    .contact-form input::placeholder,
    .contact-form textarea::placeholder { color: var(--text-muted); }
    .contact-form input:focus,
    .contact-form textarea:focus { outline: none; border-color: var(--accent); }
    .contact-form textarea { resize: vertical; min-height: 96px; line-height: 1.55; }
    .contact-form__gotcha { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
    .contact-form__submit {
      width: 100%;
      margin-top: 8px;
      padding: 15px;
      text-align: center;
      border: none;
      cursor: pointer;
      font-size: 15px;
    }
    .contact-form__success {
      font-size: 18px;
      color: var(--text);
      max-width: 480px;
      margin: 8px auto 0;
      text-align: center;
    }

    /* ═════════════ FOOTER ═════════════ */
    .site-footer {
      border-top: 1px solid var(--border);
      padding: 60px 0 32px;
    }
    .site-footer__inner { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
    .site-footer__columns {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 40px;
      margin-bottom: 40px;
    }
    .site-footer__heading {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin: 0 0 16px;
    }
    .site-footer__col ul { list-style: none; padding: 0; margin: 0; }
    .site-footer__col li { margin-bottom: 8px; }
    .site-footer__col a {
      font-size: 13px;
      color: var(--text-secondary);
      transition: color 0.2s;
    }
    .site-footer__col a:hover { color: var(--accent); }
    .site-footer__bottom {
      padding-top: 24px;
      border-top: 1px solid var(--border);
      font-family: var(--mono);
      font-size: 11px;
      color: var(--text-muted);
    }
    .site-footer__bottom a { color: var(--text-secondary); }
    @media (max-width: 720px) { .site-footer__columns { grid-template-columns: repeat(2, 1fr); } }

    /* ═════════════ PARTNERS POINTER ═════════════ */
    .partners-pointer {
      border-top: 1px solid var(--border);
      padding: 40px 0;
      text-align: center;
    }
    .partners-pointer__inner {
      max-width: 1120px;
      margin: 0 auto;
      padding: 0 24px;
    }
    .partners-pointer p {
      margin: 0;
      color: var(--text-muted);
      font-size: 14px;
    }
    .partners-pointer a {
      color: var(--accent);
      font-weight: 600;
      transition: opacity 0.2s;
    }
    .partners-pointer a:hover { opacity: 0.8; }

/* Accent-color text utility */
.text-accent { color: var(--accent); }

/* ══════════════════════════════════════════════════════════════════
   PAGE-SCOPED RULES — migrated from inline <style> blocks
   ══════════════════════════════════════════════════════════════════
   Per-page rules below. Each page section keeps the var namespace
   from its original inline block (var hygiene deferred); both legacy
   namespace (--blue-accent, --text-color) and modern namespace
   (--accent, --text) are defined in the :root blocks above.
   ══════════════════════════════════════════════════════════════════ */

/* ── 404 ── */
.notfound {
  min-height: calc(100vh - 64px - 320px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px 24px;
  text-align: center;
}
.notfound__inner { max-width: 560px; }
.notfound__code {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin: 0 0 20px;
}
.notfound__title {
  font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--text-color);
  margin: 0 0 16px;
}
.notfound__body {
  font-size: 1rem;
  line-height: 1.65;
  color: var(--text-light);
  margin: 0 0 32px;
}
.notfound__actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

/* ── brief ── */
.brief-body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.brief-page {
  flex: 1; display: flex; flex-direction: column; align-items: center;
  padding: 64px 24px 40px;
}
.brief-content {
  max-width: 1080px; width: 100%;
  display: grid; grid-template-columns: 1fr 1fr;
  grid-template-areas:
    "headline form"
    "body     form";
  column-gap: 56px; row-gap: 0;
  align-items: start;
}
.brief-copy { grid-area: headline; }
.brief-form-card { grid-area: form; }
.brief-content > .brief-intro { grid-area: body; }
.brief-compare { max-width: 1080px; width: 100%; margin-top: 28px; }
.brief-copy { padding-top: 16px; }
.brief-eyebrow {
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  color: var(--accent); text-transform: uppercase; letter-spacing: 1.5px;
  margin-bottom: 20px; display: flex; align-items: center; gap: 8px;
}
.brief-eyebrow::before { content: ''; width: 20px; height: 1px; background: var(--accent); }
.brief-page h1 {
  font-size: clamp(26px, 3.5vw, 36px); font-weight: 700;
  line-height: 1.15; margin-bottom: 20px; letter-spacing: -0.02em;
}
.brief-page h1 span { color: var(--accent); }
.brief-intro {
  font-size: 16px; color: var(--text-secondary);
  margin-bottom: 40px; line-height: 1.7; max-width: 480px;
}
.brief-deliverables {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 10px; padding: 28px;
}
.brief-del-label {
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  color: var(--accent); text-transform: uppercase; letter-spacing: 1.5px;
  margin-bottom: 16px;
}
.brief-del-item {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 10px 0; font-size: 14px; color: var(--text-secondary);
  line-height: 1.6; border-bottom: 1px solid var(--border);
}
.brief-del-item:last-child { border-bottom: none; }
.brief-del-item::before {
  content: '\2192'; color: var(--accent); font-weight: 600;
  flex-shrink: 0; margin-top: 1px;
}
.brief-del-note {
  font-size: 13px; color: var(--text-muted); margin-top: 16px;
  line-height: 1.6; font-style: italic;
}
/* Snapshot vs Visibility Audit comparison table */
.brief-cmp {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 10px; overflow: hidden;
}
.brief-cmp-row { display: grid; grid-template-columns: 92px 1fr 1fr; }
.brief-cmp-row + .brief-cmp-row { border-top: 1px solid var(--border); }
.brief-cmp-cell {
  padding: 13px 14px; font-size: 13px; line-height: 1.5;
  color: var(--text-secondary); border-left: 1px solid var(--border);
}
.brief-cmp-cell:first-child { border-left: none; }
.brief-cmp-rowlabel {
  font-family: var(--mono); font-size: 10px; color: var(--text-muted);
  text-transform: uppercase; letter-spacing: 1px; align-self: center;
}
.brief-cmp-head .brief-cmp-cell { padding-top: 16px; padding-bottom: 14px; }
.brief-cmp-free { background: rgba(var(--accent-rgb), 0.04); }
.brief-cmp-name {
  font-size: 14px; font-weight: 700; color: var(--text);
  display: block; margin-bottom: 6px;
}
.brief-cmp-price { font-family: var(--mono); font-size: 12px; }
.brief-cmp-price--free { color: var(--accent); }
.brief-cmp-price--paid { color: var(--text-secondary); }
@media (max-width: 768px) {
  .brief-cmp-row { grid-template-columns: 70px 1fr 1fr; }
  .brief-cmp-cell { padding: 11px 9px; font-size: 12px; }
  .brief-cmp-rowlabel { font-size: 9px; letter-spacing: 0.5px; }
  .brief-cmp-name { font-size: 13px; }
}
.brief-form-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 12px; padding: 36px;
}
.brief-form-title {
  font-size: 18px; font-weight: 600; margin-bottom: 6px;
}
.brief-form-sub {
  font-size: 13px; color: var(--text-muted); margin-bottom: 24px;
}
.brief-form {
  display: flex; flex-direction: column; gap: 12px;
}
.brief-form input {
  width: 100%; padding: 14px 16px;
  background: var(--bg); border: 1px solid var(--border);
  border-radius: 8px; color: var(--text); font-family: var(--font);
  font-size: 14px; outline: none; transition: border-color 0.2s;
}
.brief-form input::placeholder { color: var(--text-muted); }
.brief-form input:focus { border-color: var(--accent); }
.brief-step-label {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.5px;
  text-transform: uppercase; color: var(--accent); margin-top: 6px;
}
.brief-step-label:first-child { margin-top: 0; }
.brief-form .cf-turnstile { margin-top: 4px; }
.brief-form-error {
  font-size: 13px; color: var(--danger); background: var(--danger-bg);
  border: 1px solid rgba(var(--danger-rgb), 0.2); border-radius: 8px; padding: 10px 12px; margin: 0;
}
.brief-form-fineprint {
  font-size: 12px; color: var(--text-muted); text-align: center; margin: 8px 0 0;
}
.brief-btn-primary {
  display: block; width: 100%; background: var(--accent-fill); color: var(--accent-ink);
  padding: 14px; border-radius: 8px; font-size: 15px; font-weight: 600;
  text-decoration: none; border: none; cursor: pointer;
  font-family: var(--font); margin-top: 4px;
  transition: all 0.2s;
  box-shadow: 0 4px 20px rgba(var(--accent-rgb), 0.15);
}
.brief-btn-primary:hover {
  background: var(--accent-hover);
  box-shadow: 0 6px 28px rgba(var(--accent-rgb), 0.25);
}
.brief-form-success { padding: 32px 0; text-align: center; }
.brief-success-msg {
  font-size: 18px; font-weight: 600; color: var(--accent); margin-bottom: 8px;
}
.brief-success-sub {
  font-size: 14px; color: var(--text-secondary);
}
.brief-footer {
  padding: 28px 0; text-align: center; border-top: 1px solid var(--border);
}
.brief-footer p { font-family: var(--mono); font-size: 12px; color: var(--text-muted); }
@media (max-width: 768px) {
  .brief-page { padding: 40px 16px 32px; }
  .brief-content {
    grid-template-columns: 1fr;
    grid-template-areas:
      "headline"
      "form"
      "body";
    row-gap: 32px; column-gap: 0;
  }
  .brief-compare { margin-top: 20px; }
  .brief-copy { padding-top: 0; }
  .brief-form-card { padding: 24px; }
}

/* ── cart (/start/) ── */
.cart-body { display: flex; flex-direction: column; min-height: 100vh; }
.cart-page { flex: 1; max-width: 920px; margin: 0 auto; padding: 56px 24px 64px; width: 100%; }
.cart-head { text-align: center; margin-bottom: 36px; }
.cart-eyebrow {
  font-family: var(--mono); font-size: 12px; letter-spacing: 2px;
  text-transform: uppercase; color: var(--accent); margin-bottom: 12px;
}
.cart-title { font-size: clamp(28px, 5vw, 40px); color: var(--text); font-weight: 700; letter-spacing: -0.5px; margin-bottom: 14px; }
.cart-sub { color: var(--text-muted); max-width: 620px; margin: 0 auto; font-size: 15px; }

.cart-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 24px; }
.cart-option { position: relative; cursor: pointer; display: block; }
.cart-option input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cart-option__inner {
  height: 100%; background: var(--bg-card); border: 1.5px solid var(--border);
  border-radius: 14px; padding: 24px; transition: border-color .15s, box-shadow .15s, background .15s;
}
.cart-option:has(input:checked) .cart-option__inner {
  border-color: var(--accent); box-shadow: 0 0 0 3px rgba(var(--accent-rgb), 0.12);
}
.cart-option:hover .cart-option__inner { border-color: var(--text-muted); }
.cart-option:has(input:checked):hover .cart-option__inner { border-color: var(--accent); }
.cart-option input:focus-visible + .cart-option__inner,
.cart-option:has(input:focus-visible) .cart-option__inner { outline: 2px solid var(--accent); outline-offset: 2px; }
.cart-option__badge {
  position: absolute; top: -10px; right: 16px; z-index: 1;
  background: var(--accent-fill); color: var(--accent-ink); font-family: var(--mono);
  font-size: 10px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase;
  padding: 4px 10px; border-radius: 6px;
}
.cart-option__head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.cart-option__name { font-size: 17px; font-weight: 700; color: var(--text); }
.cart-option__price { font-size: 22px; font-weight: 700; color: var(--accent); }
.cart-option__tagline { color: var(--text-secondary); font-size: 14px; margin-bottom: 16px; }
.cart-option__list { list-style: none; padding: 0; margin: 0 0 14px; }
.cart-option__list li { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; color: var(--text-secondary); margin-bottom: 9px; }
.cart-option__list li.cart-option__muted { color: var(--text-muted); }
.cart-phase {
  flex: none; width: 18px; height: 18px; border-radius: 50%;
  border: 1px solid var(--border); color: var(--text-muted);
  font-family: var(--mono); font-size: 10px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center; margin-top: 1px;
}
.cart-phase--on { background: var(--accent-fill); color: var(--accent-ink); border-color: var(--accent-fill); }
.cart-option__note { font-size: 12.5px; color: var(--text-muted); margin: 0; }

.cart-summary { max-width: 460px; margin: 0 auto; background: var(--bg-card); border: 1px solid var(--border); border-radius: 14px; padding: 24px; }
.cart-summary__row { display: flex; justify-content: space-between; align-items: baseline; padding: 8px 0; }
.cart-summary__row--total { border-top: 1px solid var(--border); margin-top: 4px; padding-top: 14px; }
.cart-summary__label { color: var(--text-muted); font-size: 14px; }
.cart-summary__plan { color: var(--text); font-size: 14px; font-weight: 600; text-align: right; }
.cart-summary__total { color: var(--accent); font-size: 24px; font-weight: 700; }
.cart-checkout { display: block; width: 100%; margin-top: 16px; text-align: center; cursor: pointer; }
.cart-fineprint { font-size: 12px; color: var(--text-muted); text-align: center; margin: 12px 0 0; }
.cart-form-error { font-size: 13px; color: var(--danger); background: var(--danger-bg); border: 1px solid rgba(var(--danger-rgb), 0.2); border-radius: 8px; padding: 10px 12px; margin: 0 0 12px; }
.cart-footer { padding: 28px 0; text-align: center; border-top: 1px solid var(--border); }
.cart-footer p { font-family: var(--mono); font-size: 12px; color: var(--text-muted); }

/* three-phase explainer (maps to the price options below) */
.cart-steps { list-style: none; padding: 0; margin: 0 0 24px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.cart-step { display: flex; gap: 12px; align-items: flex-start; background: var(--bg-card); border: 1.5px solid var(--border); border-radius: 12px; padding: 16px; transition: border-color .15s, box-shadow .15s, opacity .15s; }
.cart-step.is-active { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(var(--accent-rgb), 0.14); }
.cart-step.is-dim { opacity: 0.4; }
.cart-step.is-dim .cart-step__n { background: transparent; color: var(--text-muted); border: 1px solid var(--border); }
.cart-step__n { flex: none; width: 26px; height: 26px; border-radius: 50%; background: var(--accent-fill); color: var(--accent-ink); font-family: var(--mono); font-weight: 700; font-size: 13px; display: inline-flex; align-items: center; justify-content: center; }
.cart-step__t { color: var(--text); font-weight: 700; font-size: 15px; margin: 0 0 3px; }
.cart-step__d { color: var(--text-muted); font-size: 12.5px; margin: 0; line-height: 1.45; }

/* phase pips inside each price option — lit = included */
.cart-phases { display: flex; gap: 8px; margin: 4px 0 8px; }
.cart-phase-pip {
  width: 30px; height: 30px; border-radius: 50%; font-family: var(--mono);
  font-weight: 700; font-size: 13px; display: inline-flex; align-items: center;
  justify-content: center; border: 1.5px solid var(--border); color: var(--text-muted);
}
.cart-phase-pip.is-on { background: var(--accent-fill); color: var(--accent-ink); border-color: var(--accent-fill); }
.cart-phase-pip.is-off { background: transparent; border-style: dashed; opacity: 0.55; }
.cart-phases__caption { font-family: var(--mono); font-size: 11px; letter-spacing: .3px; color: var(--text-secondary); margin: 0 0 12px; }

@media (max-width: 680px) {
  .cart-grid { grid-template-columns: 1fr; }
  .cart-steps { grid-template-columns: 1fr; }
}

/* ── pricing cart modal ──
   Minimal popup cart launched from the two audit cards. Recreates the /start/
   checkout in-place: tier toggle + optional website + total, nothing else. */
.pcart { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.pcart[hidden] { display: none; }
.pcart__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.72); backdrop-filter: blur(3px); }
.pcart__dialog {
  position: relative; width: 100%; max-width: 440px; max-height: calc(100vh - 40px);
  overflow-y: auto; background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 16px; padding: 28px 26px 24px;
  box-shadow: 0 24px 60px rgba(0,0,0,0.55);
  animation: pcart-in .16s ease-out;
}
@keyframes pcart-in { from { opacity: 0; transform: translateY(8px) scale(0.99); } to { opacity: 1; transform: none; } }
.pcart__close {
  position: absolute; top: 12px; right: 12px; width: 34px; height: 34px;
  border: none; background: transparent; color: var(--text-muted); font-size: 26px;
  line-height: 1; border-radius: 8px; cursor: pointer; transition: background .12s, color .12s;
}
.pcart__close:hover { background: rgba(var(--ink-rgb), 0.06); color: var(--text); }
.pcart__eyebrow { font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin: 0 0 6px; }
.pcart__title { font-size: 22px; font-weight: 700; color: var(--text); letter-spacing: -0.3px; margin: 0 0 18px; }

.pcart__options { display: grid; gap: 10px; margin: 0 0 18px; }
.pcart__opt { position: relative; display: block; cursor: pointer; }
.pcart__opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pcart__opt-inner { display: block; border: 1.5px solid var(--border); border-radius: 11px; padding: 13px 15px; transition: border-color .12s, background .12s; }
.pcart__opt:hover .pcart__opt-inner { border-color: var(--text-muted); }
.pcart__opt:has(input:checked) .pcart__opt-inner { border-color: var(--accent); background: rgba(var(--accent-rgb), 0.05); }
.pcart__opt:has(input:focus-visible) .pcart__opt-inner { outline: 2px solid var(--accent); outline-offset: 2px; }
.pcart__opt-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.pcart__opt-name { font-size: 15px; font-weight: 700; color: var(--text); }
.pcart__opt-price { font-size: 18px; font-weight: 700; color: var(--accent); white-space: nowrap; }
.pcart__opt-tag { display: block; font-size: 12.5px; color: var(--text-muted); margin-top: 5px; }

.pcart__field { margin: 0 0 16px; }
.pcart__field label { display: block; font-size: 13.5px; font-weight: 500; color: var(--text-secondary); margin-bottom: 6px; }
.pcart__optional { font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); border: 1px solid var(--border); border-radius: 999px; padding: 2px 8px; margin-left: 6px; }
.pcart__field input { width: 100%; box-sizing: border-box; background: var(--bg); border: 1px solid var(--border-light); border-radius: 10px; padding: 11px 13px; color: var(--text); font: inherit; font-size: 15px; }
.pcart__field input:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }
.pcart__prefilled { margin: 6px 0 0; font-size: 12px; color: var(--accent); }

.pcart__total { display: flex; justify-content: space-between; align-items: baseline; padding-top: 14px; border-top: 1px solid var(--border); }
.pcart__total-label { color: var(--text-muted); font-size: 14px; }
.pcart__total-amt { color: var(--accent); font-size: 24px; font-weight: 700; }
.pcart__checkout { display: block; width: 100%; margin-top: 16px; text-align: center; border: none; cursor: pointer; font: inherit; }
.pcart__checkout:disabled { opacity: .7; cursor: default; }
.pcart__fine { font-size: 12px; color: var(--text-muted); text-align: center; margin: 12px 0 0; line-height: 1.5; }
.pcart__error { font-size: 13px; color: var(--danger); background: var(--danger-bg); border: 1px solid rgba(var(--danger-rgb), 0.2); border-radius: 8px; padding: 10px 12px; margin: 14px 0 0; }

/* ── compare ── */
.compare-table-wrap {
  overflow-x: auto;
  margin: 1.75rem 0 0.5rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  -webkit-overflow-scrolling: touch;
}
.compare-table {
  width: 100%; border-collapse: collapse;
  min-width: 760px; font-size: 14px;
}
.compare-table th {
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.1em;
  text-align: left; padding: 0.85rem 1rem;
  border-bottom: 1px solid var(--border);
  white-space: nowrap; background: var(--bg-card);
}
.compare-table td {
  padding: 0.85rem 1rem; border-bottom: 1px solid var(--border);
  color: var(--text-secondary); vertical-align: top; line-height: 1.5;
}
.compare-table tbody tr:last-child td { border-bottom: none; }
.compare-table th[scope="row"] {
  font-weight: 600; color: var(--text);
  white-space: nowrap; text-transform: none;
  font-family: var(--font); font-size: 14px; letter-spacing: normal;
  background: transparent;
}
.compare-table tr.is-resonate th[scope="row"],
.compare-table tr.is-resonate td { background: var(--accent-dim); }
.compare-scroll-hint {
  font-family: var(--mono); font-size: 11px; color: var(--text-muted);
  margin: 0 0 1.75rem;
}
.compare-capsules { margin-top: 0.5rem; }
.compare-capsules h3 { font-size: 1.05rem; margin: 1.5rem 0 0.4rem; }
.compare-capsules p { margin: 0 0 0.3rem; }
.compare-note { color: var(--text-muted); }
.compare-note strong { color: var(--text-secondary); font-weight: 600; }

/* ── compare: RFP / scorecard artifact ── */
.rfp-doc {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-card);
  padding: 1.5rem 1.75rem;
  margin: 1.5rem 0;
}
.rfp-doc h3 {
  font-family: var(--mono); font-size: 12px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--accent); margin: 1.5rem 0 0.5rem;
}
.rfp-doc h3:first-child { margin-top: 0; }
.rfp-doc p { margin: 0 0 0.5rem; color: var(--text-secondary); }
.rfp-list { margin: 0 0 0.75rem; padding-left: 1.25rem; }
.rfp-list li { color: var(--text-secondary); line-height: 1.6; margin-bottom: 0.35rem; }
.rfp-group-label {
  font-family: var(--mono); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--text-muted); margin: 1.5rem 0 0.6rem;
}
.rfp-checklist { list-style: none; margin: 0.4rem 0 1rem; padding: 0; }
.rfp-checklist li {
  position: relative; padding-left: 1.6rem; margin-bottom: 0.6rem;
  color: var(--text-secondary); line-height: 1.6;
}
.rfp-checklist li::before {
  content: "\2610"; position: absolute; left: 0; top: -0.05rem;
  color: var(--accent); font-size: 1.05rem;
}

/* ── sample-report ── */

/* Hero run-metadata strip (150 queries · 4 engines · 5 personas · plan).
   Centered + the persistent note centered to match the centered hero. */
.sr-runmeta {
  list-style: none; padding: 0; margin: 1.5rem 0 0;
  display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem 1.75rem;
}
.sample-report-page .hero__inner .showcase-note { justify-content: center; }
.sr-runmeta li {
  font-family: var(--mono); font-size: 12px; color: var(--text-secondary);
  display: flex; align-items: baseline; gap: 0.4rem;
}
.sr-runmeta li strong { color: var(--accent); font-weight: 600; font-size: 15px; }

/* Annotation callout: "what this is / why it matters" beneath each visual */
.sr-callout {
  background: var(--bg-card); border: 1px solid var(--border);
  border-left: 3px solid var(--accent); border-radius: 0 10px 10px 0;
  padding: 1.25rem 1.5rem; margin-top: 1.25rem;
}
.sr-callout__label {
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.12em; color: var(--accent);
  margin: 0 0 0.5rem;
}
.sr-callout p:last-child {
  margin: 0; font-size: 14px; line-height: 1.7; color: var(--text-secondary);
}

/* Action-plan rows (L1/L2/L3) */
.sr-plan { display: grid; gap: 0.625rem; margin-bottom: 1.25rem; }
.sr-plan-row {
  display: flex; align-items: flex-start; gap: 0.875rem;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 8px; padding: 0.875rem 1rem;
}
.sr-plan-row p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--text-secondary); }
.sr-layer-tag {
  font-family: var(--mono); font-size: 10px; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase;
  padding: 0.25rem 0.5rem; border-radius: 4px; flex-shrink: 0;
}
.sr-layer-tag.l1 { color: var(--danger); background: var(--danger-dim); }
.sr-layer-tag.l2 { color: var(--warning); background: var(--warning-dim); }
.sr-layer-tag.l3 { color: var(--accent); background: var(--accent-dim); }

.sr-subhead { font-size: 15px; font-weight: 600; color: var(--text-color); margin: 1.5rem 0 0.75rem; }

/* ── Homepage: openable deliverables ─────────────────────────────────────
   The handover panel at the foot of #sample. Deliberately quotes the report's
   own "Take it with you" section (account/report) — the light cover card
   against the dark panel, the included-sections list, the paired buttons — so
   a buyer who clicks through recognises the document they were just shown.
   The cover is built from text, not an image: it stays crisp, it restyles with
   the tokens, and its content is in the HTML where AI crawlers read it. */
.deliv {
  margin-top: 2.5rem;
  scroll-margin-top: 80px; /* nav (64px) + breathing room when landing on /#deliverables */
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: 16px;
  padding: 1.75rem;
}
.deliv__head {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 0.75rem;
  padding-bottom: 1.375rem; margin-bottom: 1.625rem;
  border-bottom: 1px solid var(--border-color);
}
.deliv__eyebrow {
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  letter-spacing: 0.15em; text-transform: uppercase; color: var(--text-muted);
  margin: 0; flex-basis: 100%;
}
.deliv__title { font-size: 1.5rem; line-height: 1.2; margin: 0; margin-right: auto; }
.deliv__badge {
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--accent); border: 1px solid var(--accent);
  border-radius: 6px; padding: 0.4rem 0.7rem; white-space: nowrap;
}
.deliv__body { display: grid; grid-template-columns: 270px 1fr; gap: 2rem; align-items: start; }

/* The cover. Light on purpose: it is the printable artifact, and the contrast
   against the dark panel is what makes it read as a document rather than a UI. */
.deliv__cover {
  margin: 0; padding: 1.25rem;
  background: #faf9f6; border-radius: 10px; color: #18181b;
}
.deliv__cover-brand {
  display: flex; align-items: center; gap: 0.4rem;
  font-size: 11.5px; font-weight: 600; letter-spacing: 0.01em;
}
.deliv__cover-dot {
  width: 9px; height: 9px; border-radius: 50%;
  border: 2px solid #18181b; display: inline-block;
}
.deliv__cover-rule { height: 2px; background: var(--accent-fill); margin: 0.5rem 0 1.5rem; }
.deliv__cover-kicker {
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--text-faint); margin: 0 0 0.4rem;
}
/* Every colour on the cover is stated, never inherited. The section's own
   `p` rules set a light colour for the dark page, and a <p> on this light card
   that only inherits from the figure loses to them — which rendered the brand
   name and the headline number in near-white on cream, i.e. invisible. */
.deliv__cover-name { font-size: 1.875rem; font-weight: 600; line-height: 1.05; margin: 0 0 0.3rem; color: #18181b; }
.deliv__cover-meta { font-size: 10.5px; color: #52525b; margin: 0 0 1.5rem; }
.deliv__cover-big { font-size: 2.5rem; font-weight: 700; line-height: 1; margin: 0; letter-spacing: -0.02em; color: #18181b; }
.deliv__cover-big span { font-size: 1.25rem; font-weight: 600; color: #18181b; }
.deliv__cover-biglabel {
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--text-faint); margin: 0.2rem 0 1.25rem;
}
.deliv__cover-toc { list-style: none; margin: 0; padding: 1rem 0 0; border-top: 1px solid #e4e4e7; }
.deliv__cover-toc li {
  display: flex; justify-content: space-between; gap: 0.75rem;
  font-size: 10.5px; padding: 0.28rem 0; color: #27272a;
}
.deliv__cover-toc li span:last-child { font-family: var(--mono); font-size: 9px; color: #52525b; }
.deliv__cover-foot {
  display: flex; justify-content: space-between; gap: 0.75rem;
  font-family: var(--mono); font-size: 9px; color: #52525b;
  margin: 1.25rem 0 0; padding-top: 0.875rem; border-top: 1px solid #e4e4e7;
}

.deliv__lede { font-size: 15px; line-height: 1.65; color: var(--text-light); margin: 0 0 1.5rem; }
.deliv__list { list-style: none; margin: 0 0 1.75rem; padding: 0; display: grid; gap: 0.875rem; }
.deliv__list li {
  font-size: 14px; line-height: 1.6; color: var(--text-muted);
  padding-left: 1.125rem; position: relative;
}
.deliv__list li::before {
  content: ''; position: absolute; left: 0; top: 0.6rem;
  width: 6px; height: 6px; border-radius: 50%; background: var(--accent-fill);
}
.deliv__list strong { display: block; color: var(--text-color, var(--text)); font-weight: 600; }

.deliv__cta { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.deliv__btn {
  flex: 1 1 200px; text-align: center; text-decoration: none;
  font-size: 14px; font-weight: 600; padding: 0.875rem 1.25rem;
  border-radius: 10px; border: 1px solid var(--accent); color: var(--accent);
  transition: background 0.15s ease, color 0.15s ease;
}
.deliv__btn:hover { background: var(--accent-dim); }
.deliv__btn--primary { background: var(--accent-fill); color: var(--accent-ink); }
.deliv__btn--primary:hover { background: var(--accent-fill); filter: brightness(1.08); color: var(--accent-ink); }
.deliv__files { font-size: 13px; line-height: 1.6; color: var(--text-muted); margin: 0.85rem 0 0; }
.deliv__files a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.deliv__note { font-size: 12.5px; line-height: 1.6; color: var(--text-muted); margin: 1.25rem 0 0; }

@media (max-width: 720px) {
  .deliv { padding: 1.25rem; }
  .deliv__body { grid-template-columns: 1fr; gap: 1.5rem; }
  .deliv__cover { max-width: 320px; }
  .deliv__title { font-size: 1.3rem; }
}

/* ── Homepage: action-plan preview ───────────────────────────────────────
   Mirrors the real /account/actions/ row anatomy: layer + cycle chips, a
   bracketed work type, priority/status, then Target page / The gap / What
   to ship. Interaction is native <details> — no JS — so AI crawlers read
   every item's full text whether or not it's expanded. Do not convert this
   to a JS accordion. The copy button is progressive enhancement only. */
.plan-legend {
  list-style: none;
  margin: 1.25rem 0 1.75rem;
  padding: 0;
  display: grid;
  gap: 0.625rem;
}
.plan-legend__item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--text-light);
}
.plan-legend__item strong { color: var(--text-color); font-weight: 600; }
.plan-legend__item .sr-layer-tag { margin-top: 0.15rem; }

.plan-preview { margin: 0 0 1.25rem; display: grid; gap: 0.625rem; }
.plan-item {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: var(--radius);
  overflow: hidden;
}
.plan-item[open] { border-color: var(--blue-accent); }
.plan-item__summary {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 0.875rem 1.125rem;
  cursor: pointer;
  list-style: none;
  transition: background 0.15s;
}
.plan-item__summary::-webkit-details-marker { display: none; }
.plan-item__summary:hover { background: var(--bg-card-hover); }
.plan-item__chips { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }
.plan-item__cycle {
  font-family: var(--mono); font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--text-muted); border: 1px solid var(--border-color);
  padding: 0.2rem 0.4rem; border-radius: 4px; white-space: nowrap;
}
.plan-item__title {
  flex: 1;
  min-width: 0;
  font-family: var(--font-display);
  font-size: 14.5px;
  font-weight: 600;
  color: var(--text-color);
  line-height: 1.4;
}
.plan-item__type { font-family: var(--mono); font-size: 11px; color: var(--blue-accent); }
.plan-item__flags { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }
.plan-item__pri {
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  padding: 0.2rem 0.45rem; border-radius: 4px; white-space: nowrap;
}
.plan-item__pri.high { color: var(--bg); background: var(--blue-accent); }
.plan-item__pri.med { color: var(--warning); background: var(--warning-dim); }
.plan-item__status {
  font-family: var(--mono); font-size: 10px; color: var(--text-muted);
  border: 1px solid var(--border-color); padding: 0.2rem 0.45rem;
  border-radius: 4px; white-space: nowrap;
}
/* Expand affordance, matching the FAQ accordion's +/− language. */
.plan-item__summary::after {
  content: '+';
  font-family: var(--mono); font-size: 18px; line-height: 1;
  color: var(--blue-accent); flex-shrink: 0;
}
.plan-item[open] .plan-item__summary::after { content: '\2212'; }

.plan-item__body { padding: 0 1.125rem 1.125rem; }
.plan-block {
  border-top: 1px solid var(--border-color);
  padding: 0.875rem 0 0;
  margin-bottom: 0.875rem;
}
.plan-block__label {
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--blue-accent); margin: 0 0 0.5rem;
}
.plan-block p:not(.plan-block__label) {
  font-size: 14px; line-height: 1.65; color: var(--text-light); margin: 0;
}
.plan-block__url {
  font-family: var(--mono) !important;
  font-size: 12.5px !important;
  color: var(--text-color) !important;
  word-break: break-all;
}
.plan-block__new {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--accent);
  background: var(--accent-dim); padding: 0.15rem 0.4rem;
  border-radius: 4px; margin-left: 0.4rem; white-space: nowrap;
}
.plan-item__body code {
  font-family: var(--mono); font-size: 12.5px;
  color: var(--blue-accent); background: var(--accent-dim);
  padding: 0.1rem 0.3rem; border-radius: 3px;
}
.plan-item__why {
  font-size: 13.5px; line-height: 1.6; color: var(--text-color);
  background: var(--accent-dim); border-left: 2px solid var(--blue-accent);
  padding: 0.75rem 0.875rem; border-radius: 0 6px 6px 0; margin: 0 0 0.875rem;
}
.plan-item__foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap;
  border-top: 1px solid var(--border-color); padding-top: 0.75rem;
}
.plan-item__meta {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.04em;
  color: var(--text-muted); margin: 0;
}
.plan-copy {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.04em;
  color: var(--text-color); background: transparent;
  border: 1px solid var(--border-color); border-radius: 6px;
  padding: 0.4rem 0.7rem; cursor: pointer; white-space: nowrap;
  transition: border-color 0.15s, color 0.15s;
}
.plan-copy:hover { border-color: var(--blue-accent); color: var(--blue-accent); }
.plan-copy.is-copied { border-color: var(--blue-accent); color: var(--blue-accent); }
.plan-preview__note {
  font-size: 13.5px; color: var(--text-light); margin: 0 0 1.5rem;
}
@media (max-width: 700px) {
  .plan-item__summary { flex-wrap: wrap; gap: 0.5rem 0.625rem; }
  .plan-item__title { flex-basis: 100%; order: 3; }
  .plan-item__flags { order: 2; margin-left: auto; }
  .plan-item__summary::after { order: 4; margin-left: auto; }
  .plan-item__foot { flex-direction: column; align-items: flex-start; gap: 0.625rem; }
}

/* Engine brand-logo row — the four AI engines we score (ChatGPT, Claude, Gemini,
   Perplexity). Reusable anywhere the engines are listed. Rounded tiles; each mark
   carries its own background so light + dark favicons both read on the dark UI. */
.engine-logos { display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem; flex-wrap: wrap; }
.engine-logos--lg { gap: 0.55rem; }
.engine-logo { width: 22px; height: 22px; border-radius: 6px; object-fit: cover; flex-shrink: 0; box-shadow: 0 0 0 1px rgba(var(--ink-rgb), 0.06); }
.engine-logos--lg .engine-logo { width: 30px; height: 30px; border-radius: 7px; }

/* "Proven on" brand-logo strip (partners proof section) — white app-icon tiles
   normalize different logo backgrounds against the dark section. */
.proof-logos__label { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; color: var(--text-muted, #a1a1aa); margin: 1.75rem 0 0.75rem; }
.proof-logos { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.proof-logo { display: inline-flex; align-items: center; gap: 0.55rem; background: var(--bg-card); border: 1px solid var(--border); border-radius: 999px; padding: 0.4rem 1.05rem 0.4rem 0.4rem; }
.proof-logo img { width: 34px; height: 34px; border-radius: 8px; background: #fff; object-fit: contain; padding: 3px; box-sizing: border-box; }
.proof-logo span { font-size: 14px; font-weight: 600; color: var(--text); white-space: nowrap; }

/* Head-to-head vs each competitor (report §Competitive) */
.sr-h2h { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0.7rem; margin: 0 0 1.25rem; }
.sr-h2h__card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 10px; padding: 0.9rem 1rem; }
.sr-h2h__vs { font-size: 13px; font-weight: 600; color: var(--text-color); margin: 0 0 0.5rem; }
.sr-h2h__rec { font-family: var(--mono); font-size: 20px; font-weight: 700; color: var(--accent); font-variant-numeric: tabular-nums; }
.sr-h2h__rec .l { color: var(--text-muted); }
.sr-h2h__co { font-size: 12px; color: var(--text-muted); margin: 0.3rem 0 0; }

/* Citation footprints + your cited pages (report §Citations) — url + count rows */
.sr-gaplist { display: grid; gap: 0.4rem; margin: 0 0 1.25rem; }
.sr-gaprow { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0.75rem; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 0.6rem 0.85rem; }
.sr-gaprow.client { border-color: var(--accent); background: var(--accent-dim); }
.sr-gaprow__url { font-family: var(--mono); font-size: 12.5px; color: var(--text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sr-gaprow.client .sr-gaprow__url { color: var(--text-color); }
.sr-gaprow__n { font-family: var(--mono); font-size: 12px; color: var(--text-muted); white-space: nowrap; }
.sr-gaprow__n b { color: var(--accent); font-size: 14px; }

/* Query Explorer sample card (report §Every query, every engine) */
.sr-qcard { background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; padding: 1rem 1.1rem; margin: 0 0 0.75rem; }
.sr-qcard__q { font-size: 14.5px; font-weight: 600; color: var(--text-color); margin: 0 0 0.2rem; }
.sr-qcard__tags { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0 0 0.75rem; }
.sr-qtag { font-family: var(--mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; padding: 0.15rem 0.45rem; border-radius: 4px; background: var(--bg); border: 1px solid var(--border); color: var(--text-muted); }
.sr-qtag--no { color: var(--danger); border-color: var(--danger); }
.sr-qtag--ok { color: var(--accent); border-color: var(--accent); }
.sr-qeng { display: grid; grid-template-columns: 5.5rem 5.5rem 1fr; align-items: center; gap: 0.6rem; padding: 0.4rem 0; border-top: 1px solid var(--border); font-size: 13px; }
.sr-qeng__name { color: var(--text-secondary); font-weight: 600; }
.sr-badge { font-family: var(--mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.15rem 0.4rem; border-radius: 4px; text-align: center; }
.sr-badge--vis { color: var(--accent); background: var(--accent-dim); }
.sr-badge--inv { color: var(--danger); background: var(--danger-dim); }
.sr-qeng__detail { color: var(--text-muted); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; }
.sr-qeng__detail b { color: var(--text-secondary); font-weight: 600; }
.sr-cite { font-family: var(--mono); font-size: 11px; color: var(--blue-accent); }

@media (max-width: 720px) {
  .sr-runmeta { gap: 0.5rem 1.25rem; }
  .sr-qeng { grid-template-columns: 4.5rem 4.8rem 1fr; gap: 0.4rem; font-size: 12px; }
}

/* ── geo-vs-seo: SEO/GEO comparison table ── */
.gvs-table-wrap { overflow-x: auto; margin: 1.25rem 0; }
.gvs-table {
  width: 100%; border-collapse: collapse;
  background: var(--bg-card); border: 1px solid var(--border); border-radius: 10px;
}
.gvs-table th, .gvs-table td {
  text-align: left; padding: 0.8rem 1rem; font-size: 14px; line-height: 1.5;
  border-bottom: 1px solid var(--border); color: var(--text-secondary); vertical-align: top;
}
.gvs-table thead th {
  font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--text); font-weight: 600;
}
.gvs-table thead th:nth-child(3) { color: var(--accent); }
.gvs-table tbody tr:last-child td { border-bottom: none; }
.gvs-table .gvs-row {
  font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--text-muted); white-space: nowrap;
}

/* ── sample-foundation-review ── */
/* Page-scoped recreations of the account/booklet.css Foundation Review
   components, on main.css brand tokens, for the public annotated sample. */

/* Shared chips + severity / tier / strength badges */
.sfr-chip {
  display: inline-block; font-family: var(--mono); font-size: 11px;
  padding: 0.2rem 0.55rem; border-radius: 99px;
  border: 1px solid var(--border); color: var(--text-muted);
}
.sfr-chip--accent { color: var(--accent); border-color: rgba(var(--accent-rgb), 0.35); }
.sfr-chip-row { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0.75rem 0 1rem; }
.sfr-q { font-size: 14px; font-weight: 600; color: var(--text); margin: 0; line-height: 1.5; }
.sfr-sev {
  display: inline-block; font-family: var(--mono); font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em; padding: 0.2rem 0.5rem;
  border-radius: 4px; border: 1px solid var(--border); white-space: nowrap;
}
.sfr-sev--critical { background: rgba(var(--danger-rgb), 0.16); color: var(--danger-text); border-color: rgba(var(--danger-rgb), 0.4); }
.sfr-sev--high     { background: rgba(var(--warning-rgb), 0.16); color: var(--warning-text); border-color: rgba(var(--warning-rgb), 0.4); }
.sfr-sev--medium   { background: rgba(var(--neutral-rgb), 0.14); color: var(--text-light); border-color: rgba(var(--neutral-rgb), 0.35); }
.sfr-sev--low      { background: rgba(var(--neutral-rgb), 0.08); color: var(--text-muted); border-color: var(--border); }
.sfr-tag {
  flex: 0 0 auto; font-family: var(--mono); font-size: 10px; letter-spacing: 0.05em;
  text-transform: uppercase; padding: 0.2rem 0.55rem; border-radius: 99px;
  border: 1px solid var(--border); color: var(--text-muted); white-space: nowrap;
}
.sfr-tag--primary,
.sfr-tag--strong { color: var(--accent); border-color: rgba(var(--accent-rgb), 0.35); }
.sfr-tag--moderate { color: var(--warning); border-color: rgba(var(--warning-rgb), 0.35); }
.sfr-tag--weak { color: var(--danger); border-color: rgba(var(--danger-rgb), 0.35); }

/* Overview cover */
.sfr-cover {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 10px; padding: 1.5rem;
}
.sfr-cover__eyebrow {
  font-family: var(--mono); font-size: 10px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.12em; color: var(--accent); margin: 0 0 0.6rem;
}
.sfr-cover__name { font-size: 20px; font-weight: 700; color: var(--text); margin: 0 0 0.2rem; }
.sfr-cover__cat { font-size: 13px; color: var(--text-muted); margin: 0; }
.sfr-cover__meta {
  display: flex; flex-wrap: wrap; gap: 0.4rem 1.25rem;
  font-family: var(--mono); font-size: 12px; color: var(--text-muted); margin: 0.9rem 0 1rem;
}
.sfr-cover__lead { font-size: 14px; line-height: 1.7; color: var(--text-secondary); margin: 0 0 1.1rem; }
.sfr-sev-summary { display: flex; flex-wrap: wrap; gap: 0.5rem; }

/* KG cards (personas) */
.sfr-kg-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }
.sfr-kg-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 10px; padding: 1rem 1.125rem;
}
.sfr-kg-card__name { font-size: 14px; font-weight: 600; color: var(--text); margin: 0 0 0.15rem; }
.sfr-kg-card__role { font-size: 12px; color: var(--text-muted); margin: 0 0 0.65rem; }
.sfr-kg-card__tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }

/* KG list rows (competitors, features, pain points) */
.sfr-kg-list { display: grid; gap: 0.5rem; }
.sfr-kg-row {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 8px; padding: 0.875rem 1rem;
}
.sfr-kg-row__head { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; }
.sfr-kg-row__name { font-size: 14px; font-weight: 600; color: var(--text); }
.sfr-kg-row__body { font-size: 13px; line-height: 1.55; color: var(--text-secondary); margin: 0.4rem 0 0; }
.sfr-kg-quote { font-size: 13px; font-style: italic; color: var(--text-secondary); margin: 0.45rem 0 0; }
.sfr-kg-row__tags { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.65rem; }
.sfr-kg-meta { font-size: 12px; color: var(--text-muted); margin: 0.7rem 0 0; }

/* Crawler access grid */
.sfr-crawler-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.5rem; }
.sfr-crawler {
  display: flex; align-items: center; gap: 0.6rem;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 10px; padding: 0.7rem 0.9rem;
}
.sfr-crawler__dot { flex: 0 0 auto; width: 9px; height: 9px; border-radius: 50%; background: var(--text-muted); }
.sfr-crawler--good .sfr-crawler__dot { background: var(--accent); }
.sfr-crawler--warn .sfr-crawler__dot { background: var(--warning); }
.sfr-crawler--bad .sfr-crawler__dot { background: var(--danger); box-shadow: 0 0 0 3px rgba(var(--danger-rgb), 0.18); }
.sfr-crawler__name { font-family: var(--mono); font-size: 13px; color: var(--text); flex: 1; }
.sfr-crawler__status { font-size: 11px; color: var(--text-muted); }
.sfr-crawler--good .sfr-crawler__status { color: var(--accent); }
.sfr-crawler--bad .sfr-crawler__status { color: var(--danger-text); }

/* Content-quality gauges */
.sfr-gauge-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.85rem 1.5rem; }
.sfr-gauge__head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 0.4rem; }
.sfr-gauge__label { font-size: 13px; color: var(--text-secondary); }
.sfr-gauge__val { font-family: var(--mono); font-size: 15px; font-weight: 600; color: var(--text-muted); }
.sfr-gauge__val small { font-size: 11px; color: var(--text-muted); font-weight: 400; }
.sfr-gauge__val.good { color: var(--accent); }
.sfr-gauge__val.warn { color: var(--warning); }
.sfr-gauge__val.bad { color: var(--danger); }
.sfr-gauge__track { height: 6px; border-radius: 99px; background: var(--border); overflow: hidden; }
.sfr-gauge__fill { display: block; height: 100%; border-radius: 99px; background: var(--text-muted); }
.sfr-gauge__fill.good { background: var(--accent); }
.sfr-gauge__fill.warn { background: var(--warning); }
.sfr-gauge__fill.bad { background: var(--danger); }

/* Findings cards */
.sfr-findings { display: grid; gap: 0.625rem; }
.sfr-finding {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 10px; padding: 1.125rem 1.25rem;
}
.sfr-finding__head { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.75rem; }
.sfr-finding__title { font-size: 15px; font-weight: 600; color: var(--text); }
.sfr-finding__meta { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.85rem; }
.sfr-finding__block { margin: 0 0 0.65rem; }
.sfr-finding__block:last-of-type { margin-bottom: 0; }
.sfr-finding__h {
  font-family: var(--mono); font-size: 10px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.1em; color: var(--text-muted); margin: 0 0 0.2rem;
}
.sfr-finding__block p { font-size: 13px; line-height: 1.6; color: var(--text-secondary); margin: 0; }
.sfr-finding__block--fix { border-left: 2px solid var(--accent); padding-left: 0.8rem; }
.sfr-finding__scope { font-family: var(--mono); font-size: 11px; color: var(--text-muted); margin: 0.75rem 0 0; }

/* Review steps (numbered) + approve / request-changes panel */
.sfr-stages { display: grid; gap: 0.5rem; margin: 0 0 0.25rem; padding: 0; list-style: none; }
.sfr-stage {
  display: flex; align-items: flex-start; gap: 0.875rem;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 8px; padding: 0.875rem 1rem;
}
.sfr-stage__num {
  flex: 0 0 auto; width: 24px; height: 24px; border-radius: 50%;
  background: var(--accent-dim); color: var(--accent);
  font-family: var(--mono); font-size: 12px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; line-height: 1;
}
.sfr-stage__body { flex: 1 1 auto; }
.sfr-stage__name { font-size: 14px; font-weight: 600; color: var(--text); margin: 0 0 2px; }
.sfr-stage__desc { font-size: 13px; line-height: 1.55; color: var(--text-secondary); margin: 0; }
.sfr-decision { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin: 1.25rem 0; }
.sfr-decision__card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 10px; padding: 1.125rem 1.25rem;
}
.sfr-decision__card--approve { border-top: 3px solid var(--accent); }
.sfr-decision__card--changes { border-top: 3px solid var(--warning); }
.sfr-decision__label {
  font-family: var(--mono); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.1em; margin: 0 0 0.5rem;
}
.sfr-decision__card--approve .sfr-decision__label { color: var(--accent); }
.sfr-decision__card--changes .sfr-decision__label { color: var(--warning); }
.sfr-decision__card p { margin: 0; font-size: 13px; line-height: 1.6; color: var(--text-secondary); }

@media (max-width: 720px) {
  .sfr-kg-grid, .sfr-crawler-grid, .sfr-gauge-grid, .sfr-decision { grid-template-columns: 1fr; }
}

/* ═══════════ Portal/e-commerce additions (merged from feature branch) ═══════════ */
/* Inline text-link styled button (e.g. the secondary "pay in two steps" path). */
.link-button {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: var(--blue-accent, #c8ff00);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.link-button:hover { opacity: 0.8; }
.link-button:focus-visible { outline: 2px solid var(--blue-accent, #c8ff00); outline-offset: 2px; }


/* ═════════════ AUDIT PAGE — two-step deposit/balance inside a card ═════════════ */
/* Used on /audit/ inside .engagement-card to present the $5,000 audit as
   Step 1 (deposit) + optional Step 2 (balance). BEM-ish, homepage variables. */
.audit-steps {
  list-style: none;
  margin: 0 0 24px;
  padding: 16px 0 0;
  border-top: 1px solid var(--border);
}
.audit-step {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 0;
}
.audit-step + .audit-step {
  border-top: 1px solid var(--border);
}
.audit-step__num {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--accent-fill);
  color: var(--accent-ink);
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}
.audit-step--optional .audit-step__num {
  background: transparent;
  border: 1px solid var(--border-light);
  color: var(--text-muted);
}
.audit-step__body { flex: 1 1 auto; }
.audit-step__title {
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 4px;
  line-height: 1.4;
}
.audit-step__desc {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.55;
  margin: 0;
}
.audit-step__flag {
  display: inline-block;
  margin-left: 8px;
  padding: 1px 8px;
  border: 1px solid var(--accent);
  border-radius: 999px;
  background: var(--accent-dim);
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
  vertical-align: middle;
}

/* Inline checkout error surfaced by the start-audit script. */
.js-audit-error {
  margin: 14px 0 0;
  font-size: 13px;
  color: var(--danger);
  line-height: 1.5;
}

/* The start-audit buttons are <button>; normalize so .cta-button renders
   identically to the anchor version. */
button.cta-button {
  border: none;
  cursor: pointer;
  font-family: var(--font);
  text-align: center;
}
button.cta-button[disabled] { opacity: 0.6; cursor: default; }

/* ════════════════════════════════════════════════════════════════════════
   HOW IT WORKS — 1·2·3 value ladder + engine icon strip.
   Used on the homepage (#process) and reused in the account journey tracker.
   ════════════════════════════════════════════════════════════════════════ */
.section-eyebrow { font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); margin: 0 0 0.85rem; }

/* Engine strip — anchors the audit in the four engines buyers use */
.engine-strip {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 0.85rem 1.75rem; margin: 2rem auto 2.75rem; padding: 0.95rem 1.6rem; max-width: 780px;
  border: 1px solid var(--border); border-radius: 999px; background: var(--bg-card);
}
.engine-strip__eyebrow { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted); }
.engine-strip__item { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--text-secondary); font-weight: 600; font-size: 0.95rem; }
.engine-strip__icon { width: 22px; height: 22px; color: var(--text); flex: 0 0 auto; }
.engine-strip__item:hover .engine-strip__icon { color: var(--accent); }

/* The three steps */
.step3 { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.step3__card { position: relative; background: var(--bg-card); border: 1px solid var(--border); border-radius: 18px; padding: 2rem 1.75rem; display: flex; flex-direction: column; }
.step3__card:not(:last-child)::after {
  content: ""; position: absolute; right: -0.95rem; top: 3.1rem; z-index: 2;
  width: 1.1rem; height: 1.1rem;
  background: var(--accent); -webkit-mask: var(--rl-arrow) center/contain no-repeat; mask: var(--rl-arrow) center/contain no-repeat;
}
.step3__head { display: flex; align-items: center; gap: 0.9rem; margin-bottom: 1.1rem; }
.step3__num { font-family: var(--font); font-size: 3rem; font-weight: 700; line-height: 0.9; color: var(--accent); letter-spacing: -0.03em; }
.step3__icon { width: 30px; height: 30px; color: var(--text); flex: 0 0 auto; }
.step3__title { font-size: 1.3rem; font-weight: 700; margin: 0 0 0.6rem; color: var(--text); letter-spacing: -0.01em; }
.step3__body { color: var(--text-secondary); line-height: 1.6; margin: 0 0 1.4rem; flex: 1; }
.step3__tag { font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.03em; text-transform: uppercase; color: var(--accent); border-top: 1px solid var(--border); padding-top: 0.9rem; }

:root { --rl-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }

/* Re-audit loop band (the subscription / partner step) */
.reaudit-band {
  display: flex; align-items: center; gap: 1.25rem; margin-top: 1.25rem; padding: 1.5rem 1.75rem;
  border: 1px solid var(--border-light); border-radius: 16px;
  background: radial-gradient(130% 160% at 0% 0%, var(--accent-glow), transparent 55%), var(--bg-card);
}
.reaudit-band__loop { font-size: 1.9rem; color: var(--accent); flex: 0 0 auto; line-height: 1; }
.reaudit-band__copy { flex: 1; }
.reaudit-band__title { font-weight: 700; color: var(--text); margin: 0 0 0.3rem; font-size: 1.05rem; }
.reaudit-band__body { color: var(--text-secondary); line-height: 1.55; margin: 0; font-size: 0.95rem; }
.reaudit-band .cta-button { flex: 0 0 auto; }

@media (max-width: 880px) {
  .step3 { grid-template-columns: 1fr; }
  .step3__card:not(:last-child)::after { right: auto; left: 3rem; top: auto; bottom: -1rem; transform: rotate(90deg); }
  .reaudit-band { flex-direction: column; align-items: flex-start; }
}

/* ── shared: "Updated <month year>" marker ── */
.page-updated {
  font-family: var(--mono);
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  margin: var(--space-2xl) 0 0;
}
/* .page-updated is a direct <p> child of .container, so the blanket
   ".content-section > .container > p { margin: 0 0 40px }" (in the 769–1120px
   media query) outranks a single-class selector and zeroes the top margin.
   Match on specificity so the gap above the "Updated" line holds at every width. */
.content-section > .container > .page-updated { margin-top: var(--space-2xl); }

/* ── prominent price on the engagement cards (pricing + partners) ── */
.engagement-card__price {
  font-family: var(--font-display);
  font-size: 2.1rem;
  font-weight: 700;
  line-height: 1.05;
  color: var(--text-color);
  margin: 0.4rem 0 0.1rem;
}
.engagement-card__price-unit {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text-muted);
}
.engagement-card__price-note {
  font-family: var(--mono);
  font-size: 0.9rem;
  letter-spacing: 0.03em;
  color: var(--text-muted);
  margin: 0 0 0.6rem;
}

/* ── pricing ── */
/* Dual-audience two-up at the head of the memberships section */
.audience-twoup {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  margin: 0 0 1.5rem;
}
.audience-card {
  background: var(--bg-white);
  border: 1px solid var(--border-color);
  border-radius: var(--radius);
  padding: 1.25rem 1.4rem;
}
.audience-card__tag {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: var(--blue-accent);
  margin: 0 0 0.5rem;
}
.audience-card__body {
  font-size: 14px;
  line-height: 1.65;
  color: var(--text-light);
  margin: 0;
}
.audience-card__body a { color: var(--blue-accent); font-weight: 600; }

/* "Every membership includes" strip */
.membership-includes {
  margin: 1.5rem 0 0;
  padding: 1.5rem 1.75rem;
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: var(--radius);
}
.membership-includes__label {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin: 0 0 1rem;
}
.membership-includes__grid {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.9rem 1.75rem;
}
.membership-includes__grid li {
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--text-light);
}
.membership-includes__term {
  display: block;
  color: var(--text-color);
  font-weight: 600;
  margin-bottom: 0.15rem;
}

/* "Why the first month is more" explainer */
.price-explainer {
  margin: 1.25rem 0 var(--space-xl);
  padding: 1.25rem 1.5rem;
  border-left: 3px solid var(--blue-accent);
  background: var(--accent-glow);
  border-radius: 0 8px 8px 0;
}
.price-explainer__label {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--blue-accent);
  margin: 0 0 0.6rem;
}
.price-explainer__body {
  font-size: 14.5px;
  line-height: 1.7;
  color: var(--text-light);
  margin: 0;
}

@media (max-width: 720px) {
  .audience-twoup { grid-template-columns: 1fr; }
  .membership-includes__grid { grid-template-columns: 1fr; }
}

/* AI Visibility Crawl 3-tier pricing grid (single / 3-pack / 6-pack). Reuses the
   .engagement-card styling; this wrapper just lays the three tiers out and
   collapses to fewer columns as the viewport narrows (no media query needed). */
.pricing-tiers {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin: 0 0 1.5rem;
  align-items: stretch;
}
.pricing-tiers .engagement-card { height: 100%; }
@media (max-width: 900px) {
  .pricing-tiers { grid-template-columns: 1fr; max-width: 460px; margin-inline: auto; margin-bottom: 1.5rem; }
}
/* Depth-first pricing (2026-08-16): two tier cards — Visibility $997 vs
   Visibility + The Answers $1,296 — with packs demoted to the explainer strip
   below. Same cards, one fewer column. */
.pricing-tiers--duo { grid-template-columns: repeat(2, 1fr); max-width: 880px; margin-inline: auto; }
@media (max-width: 900px) {
  .pricing-tiers--duo { grid-template-columns: 1fr; max-width: 460px; }
}

/* Cart modal — the depth chooser + the crawl-count row. The tier radios reuse
   .pcart__opt wholesale; these rules add only the count segment, the pack
   note, the savings chip, and the guarantee lead-in. */
.pcart__tiers { display: grid; gap: 10px; }
.pcart__tiers[hidden] { display: none; }
.pcart__save {
  display: inline-block; margin-top: 4px;
  font-family: var(--mono); font-size: 10px; font-weight: 600;
  letter-spacing: .06em; text-transform: uppercase;
  color: var(--accent); background: rgba(var(--accent-rgb), 0.09);
  border-radius: 5px; padding: 2px 7px;
}
.pcart__packnote { margin: 0; font-size: 12.5px; color: var(--text-muted); }
.pcart__packnote[hidden] { display: none; }
.pcart__count { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pcart__count-label { font-size: 13px; color: var(--text-muted); margin-right: 2px; }
.pcart__count-opt { position: relative; cursor: pointer; }
.pcart__count-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pcart__count-opt span {
  display: inline-block; border: 1.5px solid var(--border); border-radius: 9px;
  padding: 6px 12px; font-size: 13.5px; font-weight: 600; color: var(--text-secondary);
  transition: border-color .12s, background .12s;
}
.pcart__count-opt span em { font-style: normal; font-weight: 400; font-size: 11.5px; color: var(--text-muted); }
.pcart__count-opt:hover span { border-color: var(--text-muted); }
.pcart__count-opt:has(input:checked) span { border-color: var(--accent); background: rgba(var(--accent-rgb), 0.05); color: var(--text); }
.pcart__count-opt:has(input:focus-visible) span { outline: 2px solid var(--accent); outline-offset: 2px; }
.pcart__shield { color: var(--accent); font-weight: 600; }

/* ── Payment journey strip (homepage pricing section) ───────────────────────
   The price ladder retold as a sequence: free map → price locked, $0 today →
   one charge on delivery. Reuses .hero-stat-card; these rules add the step
   chips, shrink the values (two of them are phrases, not lone prices), and
   draw the connector arrows that make it read left-to-right. The guarantee
   band directly below is the payoff line of this sequence. */
.pay-steps .hero-stat-card { position: relative; }
.hero-stat-card__step {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 0.6rem;
}
.pay-steps .hero-stat-card__val {
  font-size: clamp(26px, 3.2vw, 38px);
  line-height: 1.15;
}
.hero-stat-card__or {
  font-family: var(--font);
  font-size: 0.55em;
  font-weight: 400;
  color: var(--text-muted);
  letter-spacing: 0;
}
.pay-steps .hero-stat-card + .hero-stat-card::before {
  content: "→";
  position: absolute;
  left: -0.55rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--accent);
  font-size: 18px;
  opacity: 0.7;
}
@media (max-width: 900px) {
  .pay-steps .hero-stat-card + .hero-stat-card::before { content: none; }
}

/* ── Hero load choreography (homepage) ──────────────────────────────────────
   One orchestrated sequence, not scattered effects: the headline lands in two
   beats, "you" takes three heartbeats of glow, and then the attention hands
   off to the URL field — the one control the page wants acted on (its
   placeholder types itself via the inline script in index.html, and the field
   pulses twice as the typing finishes). Entrances use `backwards` fill so
   nothing flashes visible-then-hidden, and the whole thing sits behind
   prefers-reduced-motion: with motion off, the page simply IS its final state. */
.hero--home .h1-you { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  .hero--home .h1-setup          { animation: hero-rise 0.55s ease-out 0.05s backwards; }
  .hero--home .h1-payoff         { animation: hero-rise 0.60s ease-out 0.30s backwards; }
  .hero--home .hero__subhead--lead { animation: hero-rise 0.55s ease-out 0.55s backwards; }
  .hero--home .hero-console      { animation: hero-rise 0.60s ease-out 0.75s backwards; }
  .hero--home .hero__cta-note    { animation: hero-rise 0.50s ease-out 0.95s backwards; }
  .hero--home .h1-you            { animation: hero-you-pulse 1.1s ease-in-out 1.35s 3,
                                              hero-you-ambient 14s ease-in-out 8s infinite; }
  .hero--home .hero-start__urlwrap { animation: hero-beckon 1.5s ease-in-out 1.9s 2,
                                                hero-beckon-ambient 14s ease-in-out 12s infinite; }
  /* Ambient layer: once the load sequence rests, the hero keeps a slow shared
     heartbeat instead of freezing — "you" beats once per 14s cycle, the URL
     field answers 4s later, the dot-grid ground breathes underneath, and the
     console steps loop their build (inline script next to the markup). Each
     repeat is softer than its intro version: alive, not insistent. */
  .hero--home::after             { animation: hero-ground-breathe 12s ease-in-out 5s infinite; }
}
@keyframes hero-rise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}
/* "you" beats gently — scale + glow, three times, then rests. The payoff line
   is already accent-colored, so the emphasis is light, not a color change. */
@keyframes hero-you-pulse {
  0%, 100% { transform: scale(1); text-shadow: 0 0 0 rgba(var(--accent-rgb), 0); }
  45%      { transform: scale(1.09); text-shadow: 0 0 26px rgba(var(--accent-rgb), 0.55); }
}
/* The field's invitation: the focus ring breathes twice without being focused —
   same accent language as :focus-within, so it previews the interaction. */
@keyframes hero-beckon {
  0%, 100% { border-color: var(--border-light, #3f3f46); box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0); }
  45%      { border-color: var(--accent, #c8ff00); box-shadow: 0 0 0 4px rgba(var(--accent-rgb), 0.14), 0 0 20px rgba(var(--accent-rgb), 0.18); }
}
/* The ambient repeats: one beat living in the first ~10% of a 14s cycle, the
   rest is dwell. Softer scale/glow than the intro so the repetition reads as
   a pulse you notice peripherally, never a demand for attention. */
@keyframes hero-you-ambient {
  0%, 9%, 100% { transform: scale(1); text-shadow: 0 0 0 rgba(var(--accent-rgb), 0); }
  4.5%         { transform: scale(1.05); text-shadow: 0 0 18px rgba(var(--accent-rgb), 0.35); }
}
@keyframes hero-beckon-ambient {
  0%, 11%, 100% { border-color: var(--border-light, #3f3f46); box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0); }
  5.5%          { border-color: var(--accent, #c8ff00); box-shadow: 0 0 0 3px rgba(var(--accent-rgb), 0.10), 0 0 14px rgba(var(--accent-rgb), 0.12); }
}
@keyframes hero-ground-breathe {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.6; }
}

/* ── Guarantee band (homepage pricing section) ──────────────────────────────
   The charge-on-delivery promise as a named guarantee. Accent-bordered so it
   reads as a commitment, not another feature card; reused in spirit (one-line
   form) by the cart modal fine print and the account paygate. */
.guarantee-band {
  margin: 1.5rem 0 1.75rem;
  padding: 1.35rem 1.5rem;
  border: 1.5px solid rgba(var(--accent-rgb), 0.45);
  border-radius: 14px;
  background: rgba(var(--accent-rgb), 0.04);
}
.guarantee-band__title {
  margin: 0 0 0.5rem;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: -0.2px;
}
.guarantee-band__shield { color: var(--accent); margin-right: 0.35rem; }
.guarantee-band__body {
  margin: 0 0 0.85rem;
  font-size: 14.5px;
  line-height: 1.7;
  color: var(--text-secondary);
  max-width: 62ch;
}
.guarantee-band__points {
  display: flex; flex-wrap: wrap; gap: 0.5rem 0.6rem;
  margin: 0; padding: 0; list-style: none;
}
.guarantee-band__points li {
  font-family: var(--mono);
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.08);
  border-radius: 999px;
  padding: 5px 12px;
}

/* Hero subheadline — the brand line paired with the primary H1 (pricing, audit,
   partners heroes). Sits between the H1 and the lede. */
.hero__subhead {
  font-family: var(--mono);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--accent, var(--blue-accent));
  margin: 0.4rem 0 1rem;
}
/* Longer "what we do" variant — a readable sub-lede sentence rather than the
   short mono accent tagline. Used on the homepage hero. */
.hero__subhead--lead {
  font-family: var(--font);
  font-size: 17px;
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1.5;
  color: var(--text);
  max-width: 40rem;
  margin: 0.5rem auto 1rem;
}

/* Cart modal: optional-URL affordances */
.pcart__optional { color: var(--text-muted, #a1a1aa); font-weight: 400; }
.pcart__hint { margin: 6px 0 0; font-size: 12px; line-height: 1.5; color: var(--text-muted, #a1a1aa); }


/* ══════════════════════════════════════════════════════════════════
   GEO WHITE PAPER  (/geo-white-paper/)  — scoped under .gwp-page
   Ported from whitepaper.css + geo-web.css. Charts are not restyled.
   .hero -> .gwp-hero and .synthesis -> .gwp-synthesis avoid collision
   with the global homepage classes already in main.css.
   ══════════════════════════════════════════════════════════════════ */
.gwp-page {
  /* token reconciliation: alias the white paper's names to the site tokens, + whitepaper-only values */
  --font-sans: var(--font);
  --font-mono: var(--mono);
  --text-muted: #d4d4d8;            /* the white paper's lighter muted, scoped to this page only */
  --accent-ink: #09090b;
  --accent-hover: #b0e000;
  --bg-secondary: #0f0f11;
  --danger: #ef4444;  --danger-dim: rgba(var(--danger-rgb), .12);
  --warning: #f59e0b; --warning-dim: rgba(var(--warning-rgb), .12);
  --accent-dim: rgba(var(--accent-rgb), .12); --accent-glow: rgba(var(--accent-rgb), .08);
  --border-light: #3f3f46;
  /* Pin the full palette: the white paper is a designed dark artifact and
     must not respond to the site-wide theme toggle. Values = the dark
     defaults this page was built against. */
  --bg: #09090b; --bg-card: #141416; --bg-card-hover: #1a1a1d;
  --text: #fafafa; --text-secondary: #e4e4e7; --text-faint: #71717a;
  --accent: #c8ff00; --accent-fill: #c8ff00; --accent-rgb: 200, 255, 0;
  --ink-rgb: 255, 255, 255; --border: #27272a; --nav-text: #fff;
  --danger-rgb: 239, 68, 68; --warning-rgb: 245, 158, 11;
  color: var(--text); background: var(--bg);
  font-size: 17px; line-height: 1.72;
  -webkit-font-smoothing: antialiased;
}

500;
600;
700&family=JetBrains+Mono:wght@400;
500;
600;
700&display=swap');
.gwp-page * { box-sizing: border-box; }
.gwp-page html { background: #050506; }
.gwp-page body {
  margin: 0;
  background: #050506;
  color: var(--text);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.gwp-page ::selection { background: var(--accent); color: var(--accent-ink); }
.gwp-page a { color: inherit; }
.gwp-page .stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  padding: 40px 16px 80px;
}
.gwp-page .page {
  position: relative;
  width: var(--page-w);
  height: var(--page-h);
  flex: none;
  background: var(--bg);
  overflow: hidden;
  box-shadow: 0 12px 48px rgba(0,0,0,0.55);
}
.gwp-page .page--secondary { background: var(--bg-secondary); }
.gwp-page .frame {
  position: absolute;
  top: var(--mt);
  left: var(--mx);
  right: var(--mx);
  bottom: var(--mb);
}
.gwp-page .runhead {
  position: absolute;
  top: 38px;
  left: var(--mx);
  right: var(--mx);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: var(--font-mono);
  font-size: 9.5px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--text-muted);
  opacity: 0.65;
  white-space: nowrap;
}
.gwp-page .runhead > span { white-space: nowrap; }
.gwp-page .runhead::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -12px;
  height: 1px;
  background: var(--border);
}
.gwp-page .runhead .rh-mark { display: flex; align-items: center; gap: 8px; }
.gwp-page .runhead .rh-tick { width: 16px; height: 1px; background: var(--accent); opacity: 0.9; }
.gwp-page .runfoot {
  position: absolute;
  bottom: 40px;
  left: var(--mx);
  right: var(--mx);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: var(--font-mono);
  font-size: 9.5px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--text-muted);
  opacity: 0.55;
  white-space: nowrap;
}
.gwp-page .runfoot > span { white-space: nowrap; }
.gwp-page .runfoot::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: -12px;
  height: 1px;
  background: var(--border);
}
.gwp-page .runfoot .pg { color: var(--text-secondary); opacity: 0.85; }
.gwp-page .cover { display: block; }
.gwp-page .cover-glow {
  position: absolute;
  top: -6%; left: 50%; transform: translateX(-50%);
  width: 820px; height: 620px;
  background: radial-gradient(ellipse at center, rgba(var(--accent-rgb), 0.14) 0%, rgba(var(--accent-rgb), 0.04) 38%, transparent 66%);
  pointer-events: none;
}
.gwp-page .cover-top {
  position: absolute;
  top: 64px; left: var(--mx); right: var(--mx);
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--border);
}
.gwp-page .cover-logo { height: 24px; width: auto; display: block; }
.gwp-page .cover-edition {
  font-family: var(--font-mono); font-size: 10px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 2px; color: var(--text-muted);
}
.gwp-page .cover-mid {
  position: absolute;
  left: var(--mx); right: var(--mx);
  top: 318px;
}
.gwp-page .cover-eyebrow {
  font-family: var(--font-mono); font-size: 11px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 2px; color: var(--accent);
  margin-bottom: 26px;
}
.gwp-page .cover-title {
  font-size: 78px;
  font-weight: 700;
  line-height: 0.98;
  letter-spacing: -0.04em;
  color: var(--text);
  margin: 0;
}
.gwp-page .cover-title .v { color: var(--accent); }
.gwp-page .cover-sub {
  margin: 26px 0 0;
  font-size: 21px;
  line-height: 1.32;
  font-weight: 500;
  color: var(--text-secondary);
  max-width: 30ch;
  letter-spacing: -0.01em;
}
.gwp-page .cover-foot {
  position: absolute;
  left: var(--mx); right: var(--mx);
  bottom: 128px;
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 24px;
  padding-top: 22px;
  border-top: 1px solid var(--border);
}
.gwp-page .cover-byline { flex: 1 1 auto; }
.gwp-page .cover-byline .cb-role { white-space: nowrap; }
.gwp-page .cover-engines { flex: none; }
.gwp-page .cover-byline .cb-name { font-size: 16px; font-weight: 600; color: var(--text); }
.gwp-page .cover-byline .cb-role { font-size: 13px; color: var(--text-muted); margin-top: 3px; }
.gwp-page .cover-engines {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.5px;
  color: var(--text-secondary); display: flex; align-items: center; gap: 9px;
}
.gwp-page .cover-engines .dot { color: var(--accent); opacity: 0.7; }
.gwp-page .cover-copyright {
  position: absolute;
  left: var(--mx); right: var(--mx);
  bottom: 56px;
  font-family: var(--font-mono);
  font-size: 9px; line-height: 1.6; letter-spacing: 0.3px;
  color: var(--text-muted); opacity: 0.6;
  max-width: 64ch;
}
.gwp-page .eyebrow {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: 1.8px;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 18px;
}
.gwp-page .eyebrow::before {
  content: "";
  width: 22px; height: 1px;
  background: var(--accent);
  flex: none;
}
.gwp-page .eyebrow--plain::before { display: none; }
.gwp-page h1, .gwp-page h2, .gwp-page h3, .gwp-page h4 { margin: 0; font-weight: 700; color: var(--text); }
.gwp-page .h-sec {           
  font-size: 30px;
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin: 0 0 6px;
}
.gwp-page .h-sub {           
  font-size: 17px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--text);
  margin: 26px 0 10px;
  padding-left: 14px;
  position: relative;
}
.gwp-page .h-sub::before {   
  content: "";
  position: absolute;
  left: 0; top: 3px;
  width: 3px; height: 16px;
  background: var(--accent);
  border-radius: 1px;
}
.gwp-page .h-sub:first-child { margin-top: 0; }
.gwp-page p { margin: 0 0 13px; color: var(--text-secondary); }
.gwp-page p.body { font-size: 14.5px; line-height: 1.72; color: var(--text-secondary); }
.gwp-page .lede {
  font-size: 16px;
  line-height: 1.65;
  color: var(--text);
}
.gwp-page a.cite {
  color: var(--text);
  text-decoration: none;
  border-bottom: 1px solid var(--accent);
  padding-bottom: 0.5px;
  transition: background var(--dur,.2s) ease;
}
.gwp-page a.cite:hover { background: var(--accent-dim); }
.gwp-page em { color: var(--text); font-style: italic; }
.gwp-page strong { color: var(--text); font-weight: 600; }
.gwp-page .klabel {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--accent);
}
.gwp-page .toc-group { margin-bottom: 12px; }
.gwp-page .toc-grouplabel {
  font-family: var(--font-mono);
  font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 1.6px;
  color: var(--text-muted);
  padding-bottom: 7px; margin-bottom: 2px;
  border-bottom: 1px solid var(--border);
}
.gwp-page .toc-row {
  display: flex; align-items: baseline; gap: 14px;
  text-decoration: none;
  padding: 6.5px 0;
  border-bottom: 1px solid rgba(var(--ink-rgb), 0.05);
}
.gwp-page .toc-row:hover .tr-t { color: var(--text); }
.gwp-page .toc-row:hover .tr-p { color: var(--accent); }
.gwp-page .tr-n {
  font-family: var(--font-mono); font-size: 11px; font-weight: 600;
  color: var(--accent); width: 22px; flex: none;
}
.gwp-page .tr-t { font-size: 13.5px; line-height: 1.35; color: var(--text-secondary); flex: 1; transition: color .2s ease; }
.gwp-page .tr-dot { display: none; }
.gwp-page .tr-p { font-family: var(--font-mono); font-size: 12px; font-weight: 500; color: var(--text-muted); flex: none; transition: color .2s ease; }
.gwp-page .introbody p { font-size: 15px; line-height: 1.75; margin-bottom: 14px; max-width: 64ch; }
.gwp-page .sec-head { margin-bottom: 22px; }
.gwp-page .sec-kicker { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.gwp-page .sec-kicker .secnum {
  font-family: var(--font-mono); font-size: 13px; font-weight: 700;
  letter-spacing: 1px; color: var(--accent); flex: none; white-space: nowrap;
}
.gwp-page .sec-kicker .sec-eyebrow {
  font-family: var(--font-mono); font-size: 10.5px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 1.8px; color: var(--text-muted);
  flex: none; white-space: nowrap;
}
.gwp-page .sec-kicker .sec-rule { flex: 1; height: 1px; background: var(--border); }
.gwp-page .sec-head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; }
.gwp-page .sec-head-row .h-sec { flex: 1; max-width: 18ch; }
.gwp-page .anchor-stat { flex: none; width: 232px; text-align: right; border-right: 2px solid var(--accent); padding-right: 18px; }
.gwp-page .anchor-stat .as-eyebrow { font-family: var(--font-mono); font-size: 9.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.2px; color: var(--accent); margin-bottom: 6px; }
.gwp-page .anchor-stat .as-val {
  font-family: var(--font-mono); font-weight: 700; font-size: 46px;
  line-height: 0.95; color: var(--accent); letter-spacing: -0.02em;
  display: flex; flex-direction: column; align-items: flex-end; gap: 2px;
}
.gwp-page .anchor-stat .as-vs { font-size: 15px; font-weight: 500; color: var(--text-muted); letter-spacing: 0; }
.gwp-page .anchor-stat .as-label { font-size: 11.5px; line-height: 1.45; color: var(--text-secondary); margin-top: 10px; }
.gwp-page .anchor-stat .as-src {
  font-family: var(--font-mono); font-size: 9px; text-transform: uppercase;
  letter-spacing: 0.8px; color: var(--text-muted); opacity: 0.7; margin-top: 6px;
}
.gwp-page .anchor-band {
  display: flex; align-items: center; gap: 24px;
  border-top: 1px solid var(--border); border-bottom: 1px solid var(--border);
  padding: 18px 0; margin: 4px 0 6px;
}
.gwp-page .anchor-band .ab-val {
  font-family: var(--font-mono); font-weight: 700; font-size: 56px;
  line-height: 0.9; color: var(--accent); letter-spacing: -0.02em; flex: none;
}
.gwp-page .anchor-band .ab-meta { flex: 1; }
.gwp-page .anchor-band .ab-label { font-size: 14px; line-height: 1.45; color: var(--text); }
.gwp-page .anchor-band .ab-src {
  font-family: var(--font-mono); font-size: 9.5px; text-transform: uppercase;
  letter-spacing: 0.8px; color: var(--text-muted); opacity: 0.7; margin-top: 5px;
}
.gwp-page .sec-body p { font-size: 14px; line-height: 1.7; margin-bottom: 12px; max-width: 66ch; }
.gwp-page .sec-body p.lede { font-size: 15.5px; color: var(--text); line-height: 1.6; max-width: 64ch; }
.gwp-page .sec-body .h-sub + p { margin-top: 0; }
.gwp-page .closer {
  font-size: 15px; font-weight: 500; color: var(--text);
  border-left: 2px solid var(--accent); padding-left: 16px; margin-top: 22px;
  line-height: 1.5; max-width: 60ch;
}
.gwp-page .cadence { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.gwp-page .cad { background: var(--bg-card); border: 1px solid var(--border); border-radius: 10px; padding: 15px 16px; }
.gwp-page .cad-tier { font-family: var(--font-mono); font-size: 13px; font-weight: 700; color: var(--accent); text-transform: uppercase; letter-spacing: 1px; }
.gwp-page .cad-rule { height: 1px; background: var(--border); margin: 9px 0; }
.gwp-page .cad-for { font-family: var(--font-mono); font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); margin-bottom: 7px; }
.gwp-page .cad-desc { font-size: 12px; line-height: 1.5; color: var(--text-secondary); }
.gwp-page .reqs { display: flex; flex-direction: column; gap: 1px; background: var(--border); border-radius: 10px; overflow: hidden; border: 1px solid var(--border); }
.gwp-page .req { background: var(--bg-card); padding: 15px 18px; }
.gwp-page .req-name { font-family: var(--font-mono); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--accent); margin-bottom: 6px; }
.gwp-page .req-desc { font-size: 13px; color: var(--text-secondary); line-height: 1.55; }
.gwp-page .traj-section + .traj-section { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border); }
.gwp-page .traj-lab { font-family: var(--font-mono); font-size: 9.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.4px; color: var(--accent); margin-bottom: 14px; display: flex; align-items: center; gap: 10px; }
.gwp-page .traj-lab .tl-tag { color: var(--text-muted); font-weight: 500; letter-spacing: 1px; }
.gwp-page .tl-row { display: flex; align-items: center; gap: 14px; margin-bottom: 11px; }
.gwp-page .tl-name { font-family: var(--font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.8px; color: var(--text-muted); width: 120px; flex: none; }
.gwp-page .tl-track { flex: 1; height: 16px; background: rgba(var(--ink-rgb), 0.05); border-radius: 4px; overflow: hidden; }
.gwp-page .tl-fill { height: 100%; border-radius: 4px; }
.gwp-page .tl-fill.base { background: var(--border-light); }
.gwp-page .tl-fill.spike { background: var(--accent); }
.gwp-page .tl-val { font-family: var(--font-mono); font-size: 13px; font-weight: 700; flex: none; width: 116px; text-align: right; }
.gwp-page .tl-val.base { color: var(--text-muted); }
.gwp-page .tl-val.spike { color: var(--accent); }
.gwp-page .traj-chart { width: 100%; height: auto; display: block; }
.gwp-page .traj-chips { display: flex; gap: 1px; background: var(--border); border-radius: 8px; overflow: hidden; margin-top: 14px; }
.gwp-page .traj-chip { flex: 1; background: var(--bg); padding: 11px 16px; text-align: center; }
.gwp-page .traj-chip .tc-v { font-family: var(--font-mono); font-size: 18px; font-weight: 700; color: var(--accent); }
.gwp-page .traj-chip .tc-l { font-size: 10px; color: var(--text-muted); margin-top: 4px; line-height: 1.35; }
.gwp-page .proj { padding: 15px 0; border-top: 1px solid var(--border); }
.gwp-page .proj:first-of-type { border-top: none; padding-top: 4px; }
.gwp-page .proj-lead { font-size: 15px; font-weight: 700; color: var(--text); margin-bottom: 7px; display: flex; gap: 12px; align-items: baseline; letter-spacing: -0.01em; }
.gwp-page .proj-lead::before { content: "\2192"; color: var(--accent); flex: none; font-family: var(--font-mono); }
.gwp-page .proj p { margin: 0 0 0 24px; font-size: 13.5px; line-height: 1.6; color: var(--text-secondary); }
.gwp-page .gap { margin-bottom: 22px; }
.gwp-page .gap-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 9px; }
.gwp-page .gap-num { font-family: var(--font-mono); font-size: 12px; font-weight: 700; color: var(--text-muted); flex: none; }
.gwp-page .gap-tag { font-family: var(--font-mono); font-size: 8.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.2px; color: var(--warning); border: 1px solid var(--warning); border-radius: 3px; padding: 2px 6px; flex: none; }
.gwp-page .gap-title { font-size: 16px; font-weight: 600; color: var(--text); line-height: 1.3; letter-spacing: -0.01em; flex: 1; }
.gwp-page .method-item { display: flex; gap: 20px; padding: 12px 0; border-bottom: 1px solid rgba(var(--ink-rgb), 0.06); }
.gwp-page .method-item:last-child { border-bottom: none; }
.gwp-page .mi-label { font-family: var(--font-mono); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--accent); width: 132px; flex: none; padding-top: 2px; line-height: 1.4; }
.gwp-page .mi-desc { font-size: 12.5px; line-height: 1.55; color: var(--text-secondary); flex: 1; }
.gwp-page .brk { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.gwp-page .brk-row { display: flex; align-items: baseline; gap: 16px; padding: 13px 18px; border-bottom: 1px solid var(--border); }
.gwp-page .brk-row:last-child { border-bottom: none; }
.gwp-page .brk-val { font-family: var(--font-mono); font-size: 16px; font-weight: 700; color: var(--accent); flex: none; width: 110px; }
.gwp-page .brk-val.muted { color: var(--text-muted); }
.gwp-page .brk-src { font-family: var(--font-mono); font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); flex: none; width: 86px; }
.gwp-page .brk-desc { font-size: 12.5px; color: var(--text-secondary); flex: 1; line-height: 1.4; }
.gwp-page .statcallout {
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-left: 2px solid var(--accent);
  padding: 4px 0 4px 18px;
}
.gwp-page .statcallout .sc-val {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 52px;
  line-height: 0.95;
  color: var(--accent);
  letter-spacing: -0.02em;
}
.gwp-page .statcallout .sc-label {
  font-size: 13px;
  line-height: 1.45;
  color: var(--text-secondary);
  max-width: 30ch;
}
.gwp-page .statcallout .sc-src {
  font-family: var(--font-mono);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text-muted);
  opacity: 0.7;
}
.gwp-page .secnum {
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--accent);
}
.gwp-page .card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 22px 24px;
}
.gwp-page .panel-accent {
  background: var(--accent-dim);
  border: 1px solid var(--accent);
  border-radius: 10px;
  padding: 20px 22px;
}
.gwp-page .panel-quiet {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 20px 22px;
}
.gwp-page .gwp-synthesis {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--accent);
  margin-right: 8px;
}
.gwp-page .finding { display: flex; gap: 16px; padding: 14px 0; }
.gwp-page .finding + .finding { border-top: 1px solid var(--border); }
.gwp-page .finding .f-num {
  font-family: var(--font-mono);
  font-size: 22px;
  font-weight: 700;
  color: var(--accent);
  line-height: 1;
  flex: none;
  width: 34px;
}
.gwp-page .finding .f-body { font-size: 13.5px; line-height: 1.6; color: var(--text-secondary); }
.gwp-page .finding .f-body strong { color: var(--text); font-weight: 600; }
.gwp-page .tiers { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--border); border-radius: 10px; overflow: hidden; }
.gwp-page .tiers .tier:last-child { grid-column: 1 / -1; }
.gwp-page .tier { background: var(--bg-card); padding: 14px 16px; }
.gwp-page .tier .t-dot { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 8px; vertical-align: middle; }
.gwp-page .tier .t-name { font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--text); }
.gwp-page .tier .t-desc { font-size: 12px; line-height: 1.5; color: var(--text-muted); margin-top: 6px; }
.gwp-page .t-peer .t-dot { background: var(--accent); }
.gwp-page .t-prereg .t-dot { background: transparent; box-shadow: inset 0 0 0 1.5px var(--accent); }
.gwp-page .t-vendor .t-dot { background: var(--warning); }
.gwp-page .t-first .t-dot { background: #60a5fa; }
.gwp-page .t-infer .t-dot { background: var(--text-muted); }
.gwp-page .wc-cols { column-count: 2; column-gap: 36px; }
.gwp-page .wc-group { break-inside: avoid; margin-bottom: 18px; }
.gwp-page .wc-group h4 {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--accent);
  margin: 0 0 8px;
}
.gwp-page .wc-list { list-style: none; margin: 0; padding: 0; }
.gwp-page .wc-list li {
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--text-muted);
  padding: 4px 0 4px 16px;
  position: relative;
  border-bottom: 1px solid rgba(var(--ink-rgb), 0.035);
}
.gwp-page .wc-list li::before { content: "→"; position: absolute; left: 0; color: var(--accent); opacity: 0.6; }
.gwp-page .wc-list a { color: var(--text-secondary); text-decoration: none; border-bottom: 1px solid var(--accent); }
.gwp-page .contact-grid { display: flex; flex-direction: column; gap: 11px; }
.gwp-page .contact-item { display: flex; align-items: baseline; gap: 16px; }
.gwp-page .contact-item .ci-k { font-family: var(--font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); width: 76px; flex: none; }
.gwp-page .contact-item a { font-size: 14px; color: var(--text); text-decoration: none; border-bottom: 1px solid var(--accent); }
.gwp-page .about-mark { position: absolute; bottom: 0; right: 0; }
.gwp-page .correction {
  border-left: 2px solid var(--warning);
  padding: 4px 0 4px 18px;
  margin: 0 0 18px;
}
.gwp-page .correction .c-head {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--warning);
  margin-bottom: 6px;
  display: flex; align-items: center; gap: 10px;
}
.gwp-page .correction .c-title { font-weight: 600; color: var(--text); font-size: 14px; margin-bottom: 4px; font-family: var(--font-sans); }
.gwp-page .correction .c-body { font-size: 13px; line-height: 1.6; color: var(--text-secondary); }
.gwp-page .tc-block { margin-top: 10px; }
.gwp-page .tc-block + .tc-block { margin-top: 30px; }
.gwp-page .tc-rowhead { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; margin-bottom: 6px; }
.gwp-page .tc-name { font-family: var(--font-sans); font-size: 15px; font-weight: 600; color: var(--text); white-space: nowrap; }
.gwp-page .tc-desc { font-size: 11.5px; color: var(--text-muted); line-height: 1.4; }
.gwp-page .tc-plot { position: relative; height: 58px; }
.gwp-page .tc-track { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--border); }
.gwp-page .tc-track.search { background: linear-gradient(to right, var(--border-light), var(--border)); }
.gwp-page .tc-sliver { position: absolute; bottom: -4px; left: 0; height: 10px; background: var(--accent); border-radius: 2px; box-shadow: 0 0 0 3px var(--accent-dim); }
.gwp-page .tc-sliver-lab { position: absolute; bottom: 16px; left: 0; text-align: left; white-space: nowrap; }
.gwp-page .tc-sliver-lab b { display: block; font-family: var(--font-mono); font-size: 13px; font-weight: 700; color: var(--accent); line-height: 1; }
.gwp-page .tc-sliver-lab span { display: block; font-family: var(--font-mono); font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.6px; margin-top: 4px; }
.gwp-page .tc-mark { position: absolute; bottom: 0; }
.gwp-page .tc-mark .tc-dot { position: absolute; bottom: 0; left: 0; width: 11px; height: 11px; border-radius: 50%; transform: translate(-50%, 50%); }
.gwp-page .tc-mark.a .tc-dot { background: var(--accent); box-shadow: 0 0 0 4px var(--accent-dim); }
.gwp-page .tc-mark.m .tc-dot { background: var(--text-muted); box-shadow: 0 0 0 4px rgba(var(--ink-rgb), 0.06); }
.gwp-page .tc-mark .tc-lab { position: absolute; bottom: 13px; transform: translateX(-50%); white-space: nowrap; text-align: center; }
.gwp-page .tc-mark .tc-lab b { display: block; font-family: var(--font-mono); font-size: 18px; font-weight: 700; line-height: 1; }
.gwp-page .tc-mark.a .tc-lab b { color: var(--accent); }
.gwp-page .tc-mark.m .tc-lab b { color: var(--text); }
.gwp-page .tc-mark .tc-lab span { display: block; font-size: 10.5px; color: var(--text-muted); margin-top: 4px; text-transform: uppercase; letter-spacing: 0.6px; font-family: var(--font-mono); }
.gwp-page .tc-mark.edge .tc-lab { transform: translateX(-100%); text-align: right; }
.gwp-page .tc-scale { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 10px; color: var(--text-muted); opacity: 0.7; letter-spacing: 0.5px; margin-top: 9px; }
.gwp-page .tc-footnote { font-size: 11.5px; color: var(--text-muted); margin-top: 18px; line-height: 1.5; padding-top: 14px; border-top: 1px solid var(--border); }
.gwp-page .tc-caveat { font-size: 11.5px; color: var(--text-muted); margin-top: 10px; line-height: 1.5; font-style: italic; opacity: 0.92; }
.gwp-page .etier {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-mono); font-size: 8.5px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 1px;
  padding: 3px 8px; border-radius: 4px; white-space: nowrap;
  border: 1px solid var(--border); color: var(--text-muted);
  line-height: 1;
}
.gwp-page .etier .ed { width: 6px; height: 6px; border-radius: 2px; flex: none; }
.gwp-page .etier.vendor { border-color: var(--border); color: var(--text-muted); opacity: 0.78; }
.gwp-page .etier.vendor .ed { background: var(--warning); }
.gwp-page .etier.infer { border-color: var(--border); color: var(--text-muted); opacity: 0.78; }
.gwp-page .etier.infer .ed { background: var(--text-muted); }
.gwp-page .etier.first { border-color: rgba(96,165,250,0.55); color: #93c5fd; opacity: 1; }
.gwp-page .etier.first .ed { background: #60a5fa; }
.gwp-page .etier.peer { border-color: var(--accent); background: var(--accent-dim); color: var(--accent); opacity: 1; }
.gwp-page .etier.peer .ed { background: var(--accent); }
.gwp-page .etier.prereg { border-color: var(--accent); background: transparent; color: var(--accent); opacity: 1; }
.gwp-page .etier.prereg .ed { background: transparent; box-shadow: inset 0 0 0 1.5px var(--accent); }
.gwp-page .etier-inline { font-size: 8px; padding: 2px 6px; vertical-align: middle; margin: 0 2px; transform: translateY(-1px); }
.gwp-page .anchor-stat .etier { margin-top: 12px; }
.gwp-page .fig { position: relative; }
.gwp-page .fig-tier { position: absolute; top: 22px; right: 26px; margin: 0; z-index: 2; }
.gwp-page .lanes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.gwp-page .lane { background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 16px 18px; display: flex; flex-direction: column; gap: 7px; }
.gwp-page .lane.anchor { border-color: var(--accent); background: var(--accent-dim); }
.gwp-page .lane-method { font-family: var(--font-mono); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.gwp-page .lane.anchor .lane-method { color: var(--accent); }
.gwp-page .lane-anchor-tag { font-family: var(--font-mono); font-size: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--accent-ink); background: var(--accent); border-radius: 3px; padding: 2px 5px; }
.gwp-page .lane-metric { font-size: 12.5px; line-height: 1.35; color: var(--text-secondary); min-height: 34px; }
.gwp-page .lane-fig { display: flex; align-items: baseline; gap: 8px; margin-top: 2px; }
.gwp-page .lane-fig .lf-from { font-family: var(--font-mono); font-size: 16px; font-weight: 600; color: var(--text-muted); }
.gwp-page .lane-fig .lf-arrow { font-family: var(--font-mono); font-size: 14px; color: var(--border-light); }
.gwp-page .lane-fig .lf-to { font-family: var(--font-mono); font-size: 24px; font-weight: 700; color: var(--accent); letter-spacing: -0.01em; white-space: nowrap; }
.gwp-page .lane-src { font-family: var(--font-mono); font-size: 9px; text-transform: uppercase; letter-spacing: 0.6px; color: var(--text-muted); opacity: 0.7; margin-top: 2px; }
.gwp-page .cf-block { margin-top: 4px; }
.gwp-page .cf-label { display: flex; align-items: center; gap: 11px; font-family: var(--font-mono); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.4px; color: var(--text); margin-bottom: 20px; }
.gwp-page .cf-tag { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 5px; background: var(--accent); color: var(--accent-ink); font-size: 11px; font-weight: 700; flex: none; }
.gwp-page .cfunnel { display: flex; align-items: flex-end; justify-content: space-between; gap: 4px; }
.gwp-page .cf-stage { display: flex; flex-direction: column; align-items: center; gap: 12px; flex: 1; }
.gwp-page .cf-bar { width: 100%; max-width: 84px; background: rgba(var(--ink-rgb), 0.06); border: 1px solid var(--border); border-bottom: none; border-radius: 6px 6px 0 0; }
.gwp-page .cf-stage.measured .cf-bar { background: var(--accent-dim); border-color: var(--accent); }
.gwp-page .cf-name { font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.8px; color: var(--text-muted); white-space: nowrap; }
.gwp-page .cf-stage.measured .cf-name { color: var(--accent); font-weight: 600; }
.gwp-page .cf-step { font-family: var(--font-mono); font-size: 15px; color: var(--border-light); align-self: center; transform: translateY(-9px); flex: none; }
.gwp-page .cf-cap { font-size: 12px; line-height: 1.5; color: var(--text-muted); margin-top: 18px; max-width: 80ch; }
.gwp-page .sb-block { margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--border); }
.gwp-page .sbar { display: flex; width: 100%; height: 64px; border-radius: 8px; overflow: hidden; gap: 2px; }
.gwp-page .seg { display: flex; align-items: center; justify-content: center; min-width: 0; }
.gwp-page .seg-v { font-family: var(--font-mono); font-weight: 700; color: var(--accent-ink); letter-spacing: -0.01em; }
.gwp-page .seg.ghost { background: var(--warning); }
.gwp-page .seg.ghost .seg-v { font-size: 24px; }
.gwp-page .seg.mention { background: var(--border-light); }
.gwp-page .seg.mention .seg-v { font-size: 16px; color: var(--text); }
.gwp-page .seg.both { background: var(--accent); }
.gwp-page .seg.both .seg-v { font-size: 14px; }
.gwp-page .sb-legend { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 18px; margin-top: 20px; }
.gwp-page .lg { display: grid; grid-template-columns: auto 1fr; column-gap: 9px; row-gap: 3px; align-items: center; }
.gwp-page .lg-dot { width: 11px; height: 11px; border-radius: 3px; }
.gwp-page .lg-dot.ghost { background: var(--warning); }
.gwp-page .lg-dot.mention { background: var(--border-light); }
.gwp-page .lg-dot.both { background: var(--accent); }
.gwp-page .lg-name { font-size: 13px; font-weight: 600; color: var(--text); }
.gwp-page .lg-desc { grid-column: 2; font-size: 11px; line-height: 1.45; color: var(--text-muted); }
.gwp-page .funnel-fig .fig-cap { margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--border); }
.gwp-page .funnel-fig .funnel-wrap { display: flex; gap: 34px; align-items: stretch; }
.gwp-page .funnel { flex: 1 1 56%; display: flex; flex-direction: column; gap: 11px; position: relative; }
.gwp-page .fstage { display: flex; align-items: center; gap: 14px; }
.gwp-page .fstage .fname {
  width: 92px; flex: none; text-align: right;
  font-family: var(--font-mono); font-size: 11px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted);
}
.gwp-page .fstage.hot .fname { color: var(--accent); font-weight: 600; }
.gwp-page .fstage .fbarwrap { flex: 1; display: flex; justify-content: center; }
.gwp-page .fstage .fbar {
  height: 56px; border-radius: 7px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(var(--ink-rgb), 0.05); border: 1px solid var(--border);
  font-family: var(--font-mono); font-size: 11px; color: var(--text-muted);
  letter-spacing: 0.5px;
}
.gwp-page .fstage.hot .fbar { background: var(--accent-dim); border-color: var(--accent); color: var(--accent); }
.gwp-page .fstage .fbar b { font-size: 22px; font-weight: 700; color: var(--accent); }
.gwp-page .funnel-conn {
  text-align: center; font-family: var(--font-mono); font-size: 9px;
  text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); opacity: 0.7;
}
.gwp-page .fmeasured {
  position: absolute; right: -2px;
  border-right: 2px solid var(--accent); border-top: 2px solid var(--accent); border-bottom: 2px solid var(--accent);
  width: 12px; border-radius: 0 4px 4px 0;
}
.gwp-page .funnel-states {
  flex: 1 1 44%;
  border-left: 1px solid var(--border); padding-left: 30px;
  display: flex; flex-direction: column;
}
.gwp-page .fs-title { font-family: var(--font-mono); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.4px; color: var(--text); margin-bottom: 18px; }
.gwp-page .fs-bar { margin-bottom: 18px; }
.gwp-page .fs-bar-top { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 8px; gap: 10px; }
.gwp-page .fs-bar-name { font-size: 12px; color: var(--text-secondary); white-space: nowrap; }
.gwp-page .fs-bar-val { font-family: var(--font-mono); font-size: 15px; font-weight: 700; color: var(--accent); }
.gwp-page .fs-bar-val.muted { color: var(--text-muted); }
.gwp-page .fs-track { height: 8px; background: rgba(var(--ink-rgb), 0.05); border-radius: 4px; overflow: hidden; }
.gwp-page .fs-fill { height: 100%; border-radius: 4px; background: var(--accent); }
.gwp-page .fs-fill.dim { background: var(--border-light); }
.gwp-page .fs-note { font-size: 10.5px; line-height: 1.5; color: var(--text-muted); margin: 2px 0 20px; }
.gwp-page .fs-ghost { margin-top: auto; border-top: 1px solid var(--border); padding-top: 18px; }
.gwp-page .fs-ghost .g-val { font-family: var(--font-mono); font-size: 48px; font-weight: 700; color: var(--accent); line-height: 0.9; letter-spacing: -0.02em; }
.gwp-page .fs-ghost .g-label { font-size: 12px; line-height: 1.45; color: var(--text-secondary); margin-top: 8px; }
.gwp-page .pd-wrap { display: flex; gap: 18px; }
.gwp-page .pd-engine { flex: 1; border: 1px solid var(--border); border-radius: 10px; padding: 16px 20px 14px; background: var(--bg); }
.gwp-page .pd-ehead { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; }
.gwp-page .pd-name { font-family: var(--font-mono); font-size: 13px; font-weight: 700; color: var(--text); letter-spacing: 0.5px; }
.gwp-page .pd-role { font-family: var(--font-mono); font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: var(--accent); }
.gwp-page .pd-bars { display: flex; gap: 28px; align-items: flex-end; height: 124px; padding: 0 8px; }
.gwp-page .pd-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; }
.gwp-page .pd-col .pdc-val { font-family: var(--font-mono); font-size: 17px; font-weight: 700; line-height: 1; margin-bottom: 7px; }
.gwp-page .pd-col .pdc-bar { width: 100%; max-width: 64px; border-radius: 4px 4px 0 0; flex: none; }
.gwp-page .pd-col.dom .pdc-val { color: var(--accent); }
.gwp-page .pd-col.dom .pdc-bar { background: var(--accent); }
.gwp-page .pd-col.weak .pdc-val { color: var(--text-muted); }
.gwp-page .pd-col.weak .pdc-bar { background: var(--border-light); }
.gwp-page .pd-col .pdc-lab { font-family: var(--font-mono); font-size: 9px; text-transform: uppercase; letter-spacing: 0.8px; color: var(--text-muted); margin-top: 9px; }
.gwp-page .pd-axisbase { height: 1px; background: var(--border); margin-top: -1px; }
.gwp-page .pd-overlap { display: flex; align-items: stretch; gap: 22px; margin-top: 18px; border-top: 1px solid var(--border); padding-top: 16px; }
.gwp-page .pd-ov-grp { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.gwp-page .pd-ov-head { font-family: var(--font-mono); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.2px; color: var(--accent); margin-bottom: 2px; }
.gwp-page .pd-ov-chip { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 11px; color: var(--text-muted); border-bottom: 1px solid rgba(var(--ink-rgb), 0.05); padding-bottom: 6px; }
.gwp-page .pd-ov-chip .c-src { font-family: var(--font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px; }
.gwp-page .pd-ov-chip .c-val { font-family: var(--font-mono); font-size: 14px; font-weight: 700; color: var(--accent); }
.gwp-page .pd-ov-foot { font-size: 11px; color: var(--text-muted); line-height: 1.4; margin-top: auto; padding-top: 4px; }
.gwp-page .pd-615 { flex: none; width: 150px; border-left: 1px solid var(--border); padding-left: 22px; display: flex; flex-direction: column; justify-content: center; }
.gwp-page .pd-615 .x-val { font-family: var(--font-mono); font-size: 30px; font-weight: 700; color: var(--text); line-height: 0.9; }
.gwp-page .pd-615 .x-lab { font-size: 11px; color: var(--text-muted); line-height: 1.45; margin-top: 7px; }
.gwp-page .pd-615 .x-src { font-family: var(--font-mono); font-size: 9px; text-transform: uppercase; letter-spacing: 0.8px; color: var(--text-muted); opacity: 0.7; margin-top: 6px; }
.gwp-page .fig {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 26px 28px;
}
.gwp-page .fig-head { margin-bottom: 20px; }
.gwp-page .fig-klabel {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--accent);
  margin-bottom: 8px;
}
.gwp-page .fig-title { font-size: 19px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); line-height: 1.2; }
.gwp-page .fig-sub { font-size: 12.5px; line-height: 1.5; color: var(--text-muted); margin: 10px 0 0; max-width: 70ch; }
.gwp-page .fig-cap {
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--text-muted);
  margin-top: 12px;
}
.gwp-page .fig-cap .src { font-family: var(--font-mono); font-size: 9.5px; text-transform: uppercase; letter-spacing: 0.5px; opacity: 0.75; }
.gwp-page .barrow { display: flex; align-items: center; gap: 14px; padding: 6px 0; }
.gwp-page .barrow .lab { font-size: 12.5px; color: var(--text-secondary); width: 150px; flex: none; }
.gwp-page .barrow .track { flex: 1; height: 8px; background: rgba(var(--ink-rgb), 0.05); border-radius: 4px; overflow: hidden; }
.gwp-page .barrow .bar { height: 100%; border-radius: 4px; transform-origin: left; }
.gwp-page .barrow .bar.a { background: var(--accent); }
.gwp-page .barrow .bar.w { background: var(--warning); }
.gwp-page .barrow .bar.m { background: var(--border-light); }
.gwp-page .barrow .val { font-family: var(--font-mono); font-size: 12px; font-weight: 600; width: 56px; text-align: right; }
.gwp-page .barrow .val.a { color: var(--accent); }
.gwp-page .barrow .val.w { color: var(--warning); }
.gwp-page .barrow .val.m { color: var(--text-muted); }
.gwp-page .grow { transform-origin: left; }
.gwp-page .rise { transform-origin: bottom; }
@media screen and (prefers-reduced-motion: no-preference) {
.gwp-page .anim.in { animation: rl-fadeup 0.6s cubic-bezier(.16,1,.3,1) both; }
.gwp-page .grow.in { animation: rl-grow 0.9s cubic-bezier(.16,1,.3,1) both; }
.gwp-page .rise.in { animation: rl-rise 0.9s cubic-bezier(.16,1,.3,1) both; }
}
@keyframes rl-fadeup { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes rl-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes rl-rise { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@page { size: letter portrait; margin: 0; }
@media print {
.gwp-page html, .gwp-page body { background: #fff !important; }
.gwp-page .stage { display: block; padding: 0; gap: 0; }
.gwp-page .page {
    box-shadow: none !important;
    break-after: page;
    page-break-after: always;
    break-inside: avoid;
  }
.gwp-page .page:last-child { break-after: auto; page-break-after: auto; }
.gwp-page .toolbar, .gwp-page .print-btn { display: none !important; }
.gwp-page * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
.gwp-page .anim, .gwp-page .grow, .gwp-page .rise { animation: none !important; opacity: 1 !important; transform: none !important; }
}
.gwp-page .print-btn {
  position: fixed; top: 18px; right: 18px; z-index: 200;
  background: var(--accent); color: var(--accent-ink); border: none;
  padding: 11px 18px; border-radius: 8px;
  font-family: var(--font-mono); font-size: 11px; font-weight: 600;
  letter-spacing: 1.4px; text-transform: uppercase; cursor: pointer;
  box-shadow: var(--shadow-btn, 0 4px 20px rgba(var(--accent-rgb), 0.15));
}
.gwp-page .print-btn:hover { background: var(--accent-hover); }
.gwp-page html, .gwp-page body { background: var(--bg) !important; }
.gwp-page html { scroll-behavior: smooth; }
.gwp-page body { font-size: 17px; line-height: 1.72; }
.gwp-page *, .gwp-page *::before, .gwp-page *::after { box-sizing: border-box; }
.gwp-page [id] { scroll-margin-top: 88px; }
.gwp-page .progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0;
  background: var(--accent); z-index: 130; transition: width .08s linear;
}
.gwp-page .nav {
  position: sticky; top: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 13px clamp(20px, 5vw, 40px);
  background: rgba(9, 9, 11, 0.82); backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
}
.gwp-page .nav-l { display: flex; align-items: center; gap: 18px; min-width: 0; }
.gwp-page .nav img { height: 22px; display: block; }
.gwp-page .nav-back {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.4px;
  color: var(--text-muted); text-decoration: none;
  border-left: 1px solid var(--border); padding-left: 18px; white-space: nowrap;
}
.gwp-page .nav-back:hover { color: var(--text); }
.gwp-page .nav-cta {
  font-family: var(--font-mono); font-size: 12px; font-weight: 600;
  letter-spacing: 0.4px; text-decoration: none;
  color: var(--accent-ink); background: var(--accent);
  padding: 9px 16px; border-radius: 8px; white-space: nowrap; transition: background .2s ease;
}
.gwp-page .nav-cta:hover { background: var(--accent-hover); }
.gwp-page .gwp-hero { position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.gwp-page .hero-glow {
  position: absolute; top: -32%; left: 50%; transform: translateX(-50%);
  width: 980px; height: 740px; pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(var(--accent-rgb), 0.13) 0%, rgba(var(--accent-rgb), 0.035) 40%, transparent 66%);
}
.gwp-page .hero-inner {
  position: relative; max-width: 1140px; margin: 0 auto;
  padding: clamp(54px,9vw,104px) clamp(20px,5vw,40px) clamp(40px,6vw,64px);
}
.gwp-page .hero-eyebrow {
  font-family: var(--font-mono); font-size: 12px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 2px; color: var(--accent); margin-bottom: 26px;
}
.gwp-page .gwp-hero h1 {
  margin: 0; font-weight: 700; color: var(--text);
  font-size: clamp(40px, 7vw, 76px); line-height: 0.98; letter-spacing: -0.04em;
}
.gwp-page .gwp-hero h1 .v { color: var(--accent); }
.gwp-page .hero-sub {
  margin: 24px 0 0; max-width: 32ch;
  font-size: clamp(19px, 2.6vw, 23px); line-height: 1.34; font-weight: 500;
  color: var(--text-secondary); letter-spacing: -0.01em;
}
.gwp-page .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: clamp(28px,4vw,38px); }
.gwp-page .btn {
  display: inline-block; font-family: var(--font-mono); font-size: 13px; font-weight: 600;
  letter-spacing: 0.5px; text-decoration: none; padding: 13px 22px; border-radius: 9px;
  transition: background .2s ease, transform .2s ease, border-color .2s ease, color .2s ease;
}
.gwp-page .btn-primary { color: var(--accent-ink); background: var(--accent); box-shadow: 0 4px 20px rgba(var(--accent-rgb), 0.15); }
.gwp-page .btn-primary:hover { background: var(--accent-hover); transform: translateY(-1px); }
.gwp-page .btn-ghost { color: var(--text-secondary); border: 1px solid var(--border-light); }
.gwp-page .btn-ghost:hover { color: var(--text); border-color: var(--text-muted); }
.gwp-page .hero-foot {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 18px 28px; margin-top: clamp(32px,5vw,52px); padding-top: 24px; border-top: 1px solid var(--border);
}
.gwp-page .hero-byline .hb-name { font-size: 16px; font-weight: 600; color: var(--text); }
.gwp-page .hero-byline .hb-role { font-size: 13px; color: var(--text-muted); margin-top: 3px; }
.gwp-page .hero-meta {
  display: flex; flex-wrap: wrap; gap: 8px 15px; align-items: center;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.4px; color: var(--text-muted);
}
.gwp-page .hero-meta .dot { color: var(--accent); opacity: 0.7; }
.gwp-page .layout {
  max-width: 1140px; margin: 0 auto; padding: 0 clamp(20px,5vw,40px);
  display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: clamp(30px,5vw,68px);
  align-items: start;
}
.gwp-page .toc { position: sticky; top: 74px; align-self: start; max-height: calc(100vh - 92px); overflow: auto; padding: 34px 0; }
.gwp-page .toc::-webkit-scrollbar { width: 0; }
.gwp-page .toc-sum { display: none; }
.gwp-page .toc-h {
  font-family: var(--font-mono); font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 1.6px; color: var(--text-muted); margin: 0 0 14px;
}
.gwp-page .toc-grp { margin-bottom: 16px; }
.gwp-page .toc-grp-l {
  font-family: var(--font-mono); font-size: 9px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 1.4px; color: var(--text-muted); opacity: 0.6;
  margin: 0 0 6px; padding-bottom: 7px; border-bottom: 1px solid var(--border);
}
.gwp-page .toc-link {
  display: flex; gap: 9px; align-items: baseline; text-decoration: none;
  padding: 5px 0 5px 11px; border-left: 2px solid transparent; color: var(--text-muted);
  font-size: 13px; line-height: 1.3; transition: color .2s ease, border-color .2s ease;
}
.gwp-page .toc-link .n { font-family: var(--font-mono); font-size: 10px; opacity: 0.65; flex: none; width: 17px; }
.gwp-page .toc-link:hover { color: var(--text-secondary); }
.gwp-page .toc-link.active { color: var(--accent); border-left-color: var(--accent); }
.gwp-page .toc-link.active .n { color: var(--accent); opacity: 1; }
.gwp-page main.content { padding: 38px 0 0; min-width: 0; }
.gwp-page .ws { padding: clamp(34px,5vw,52px) 0; border-top: 1px solid var(--border); }
.gwp-page .ws:first-child { border-top: none; padding-top: 6px; }
.gwp-page .ws-inner { max-width: 728px; }
.gwp-page .ws .h-sec { font-size: clamp(26px, 4vw, 34px); }
.gwp-page .ws .sec-body p, .gwp-page .ws p.body { font-size: 15.5px; line-height: 1.76; }
.gwp-page .ws .lede { font-size: 18px; line-height: 1.6; }
.gwp-page .ws .introbody p { font-size: 17px; line-height: 1.76; }
.gwp-page .ws .h-sec .hlink {
  opacity: 0; text-decoration: none; color: var(--accent); margin-left: 10px;
  font-weight: 600; transition: opacity .15s ease;
}
.gwp-page .ws .h-sec:hover .hlink { opacity: 0.8; }
.gwp-page .wc-details { border: 1px solid var(--border); border-radius: 12px; overflow: hidden; margin-top: 6px; }
.gwp-page .wc-details > summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 18px 22px; background: var(--bg-card);
  font-family: var(--font-mono); font-size: 11px; font-weight: 600; text-transform: uppercase;
  letter-spacing: 1.2px; color: var(--text); transition: background .2s ease;
}
.gwp-page .wc-details > summary::-webkit-details-marker { display: none; }
.gwp-page .wc-details > summary:hover { background: var(--bg-card-hover); }
.gwp-page .wc-details > summary .chev { color: var(--accent); transition: transform .25s ease; }
.gwp-page .wc-details[open] > summary .chev { transform: rotate(90deg); }
.gwp-page .wc-details > summary .wc-count { color: var(--text-muted); font-weight: 500; letter-spacing: 0.6px; }
.gwp-page .wc-body { padding: 24px 22px; }
.gwp-page .wc-body .wc-cols { column-gap: 40px; }
.gwp-page .site-foot { border-top: 1px solid var(--border); margin-top: 20px; }
.gwp-page .foot-cta { position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.gwp-page .foot-cta-glow { position: absolute; bottom: -60%; left: 50%; transform: translateX(-50%); width: 820px; height: 560px; pointer-events: none; background: radial-gradient(ellipse at center, rgba(var(--accent-rgb), 0.10) 0%, transparent 64%); }
.gwp-page .foot-cta-inner { position: relative; max-width: 720px; margin: 0 auto; padding: clamp(52px,8vw,84px) clamp(20px,5vw,40px); text-align: center; }
.gwp-page .foot-cta h2 { margin: 0 auto 16px; max-width: 22ch; font-weight: 700; color: var(--text); font-size: clamp(25px,3.6vw,32px); line-height: 1.14; letter-spacing: -0.025em; }
.gwp-page .foot-cta p { margin: 0 auto 28px; max-width: 54ch; color: var(--text-secondary); font-size: 16px; }
.gwp-page .foot-cta-sub { margin-top: 18px; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.4px; color: var(--text-muted); }
.gwp-page .foot-meta { max-width: 1140px; margin: 0 auto; padding: 34px clamp(20px,5vw,40px); }
.gwp-page .foot-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; }
.gwp-page .foot-meta img { height: 20px; opacity: 0.7; }
.gwp-page .foot-links { display: flex; gap: 20px; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.4px; }
.gwp-page .foot-links a { color: var(--text-muted); text-decoration: none; }
.gwp-page .foot-links a:hover { color: var(--text); }
.gwp-page .foot-copy { font-family: var(--font-mono); font-size: 10px; color: var(--text-muted); opacity: 0.6; margin-top: 18px; line-height: 1.6; max-width: 80ch; }
@media (prefers-reduced-motion: no-preference) {
.gwp-page .reveal { opacity: 0; transform: translateY(16px); }
.gwp-page .reveal.in { opacity: 1; transform: none; transition: opacity .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1); }
}
@media (max-width: 920px) {
.gwp-page .layout { grid-template-columns: 1fr; gap: 0; }
.gwp-page .toc {
    position: static; max-height: none; overflow: visible; padding: 0;
    margin: 8px 0 4px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-card);
  }
.gwp-page .toc-sum {
    display: flex; align-items: center; justify-content: space-between; gap: 16px; cursor: pointer;
    list-style: none; padding: 15px 20px;
    font-family: var(--font-mono); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.2px; color: var(--text);
  }
.gwp-page .toc-sum::-webkit-details-marker { display: none; }
.gwp-page .toc-sum .chev { color: var(--accent); transition: transform .25s ease; }
.gwp-page .toc[open] .toc-sum .chev { transform: rotate(90deg); }
.gwp-page .toc-h { display: none; }
.gwp-page .toc-inner { padding: 4px 18px 18px; }
.gwp-page .nav-cta { display: none; }
}
@media (min-width: 921px) {
.gwp-page .toc-inner { display: block !important; }
}
@media (max-width: 680px) {
.gwp-page .ws-inner { max-width: 100%; }
.gwp-page .sec-head-row { flex-direction: column; align-items: stretch; gap: 18px; }
.gwp-page .anchor-stat { width: auto; text-align: left; border-right: none; border-left: 2px solid var(--accent); padding-right: 0; padding-left: 16px; }
.gwp-page .anchor-stat .as-val { display: block; }
.gwp-page .pd-wrap { flex-direction: column; }
.gwp-page .pd-overlap { flex-direction: column; align-items: stretch; gap: 18px; }
.gwp-page .pd-615 { width: auto; border-left: none; border-top: 1px solid var(--border); padding-left: 0; padding-top: 16px; }
.gwp-page .lanes { grid-template-columns: 1fr; }
.gwp-page .cadence { grid-template-columns: 1fr; }
.gwp-page .traj-chips { grid-template-columns: 1fr; }
.gwp-page .method { grid-template-columns: 1fr; }
.gwp-page .tiers { grid-template-columns: 1fr; }
.gwp-page .tiers .tier:last-child { grid-column: auto; }
.gwp-page .sb-legend { grid-template-columns: 1fr; }
.gwp-page .wc-body .wc-cols { column-count: 1; }
.gwp-page .tc-mark .tc-lab b { font-size: 14px; }
.gwp-page .tc-mark .tc-lab span { font-size: 9px; }
.gwp-page .tc-name { white-space: normal; }
.gwp-page .cf-stage .cf-name { font-size: 9px; letter-spacing: 0.4px; }
.gwp-page .cf-step { font-size: 12px; }
.gwp-page .brk-row { flex-wrap: wrap; }
}

/* ── resources: GEO White Paper featured card ── */
.wp-feature-section .container { max-width: var(--max-width); }
.wp-feature {
  position: relative; overflow: hidden;
  border: 1px solid var(--accent); border-radius: 16px;
  background: var(--bg-card); padding: clamp(28px, 4vw, 44px);
}
.wp-feature__glow {
  position: absolute; top: -45%; right: -8%; width: 520px; height: 420px; pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(var(--accent-rgb), 0.13) 0%, transparent 66%);
}
.wp-feature > *:not(.wp-feature__glow) { position: relative; }
.wp-feature__eyebrow {
  font-family: var(--mono); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 1.8px; color: var(--accent); margin-bottom: 16px;
}
.wp-feature__title { font-size: clamp(28px, 4vw, 40px); line-height: 1.05; letter-spacing: -0.03em; margin: 0 0 10px; }
.wp-feature__title a { color: var(--text); text-decoration: none; transition: color .2s ease; }
.wp-feature__title a:hover { color: var(--accent); }
.wp-feature__title span { color: var(--accent); }
.wp-feature__sub { font-size: clamp(16px, 2vw, 19px); font-weight: 500; color: var(--text-secondary); max-width: 42ch; margin: 0 0 14px; }
.wp-feature__meta { font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.3px; color: var(--text-light); margin: 0 0 22px; }
.wp-feature__stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px;
  background: var(--border-color); border: 1px solid var(--border-color);
  border-radius: 12px; overflow: hidden; margin-bottom: 26px;
}
.wp-feature__stat { background: var(--bg-white); padding: 16px 18px; }
.wp-feature__stat .v { display: block; font-family: var(--mono); font-size: 22px; font-weight: 700; color: var(--accent); letter-spacing: -0.01em; }
.wp-feature__stat .l { display: block; font-size: 12px; line-height: 1.4; color: var(--text-light); margin-top: 6px; }
.wp-feature__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.wp-feature__cta {
  display: inline-block; font-family: var(--mono); font-size: 13px; font-weight: 600;
  letter-spacing: 0.4px; text-decoration: none; padding: 12px 22px; border-radius: 9px;
  color: var(--accent-ink); background: var(--accent-fill); transition: background .2s ease, transform .2s ease;
}
.wp-feature__cta:hover { background: var(--accent-hover); transform: translateY(-1px); }
.wp-feature__cta--ghost { color: var(--text-light); background: transparent; border: 1px solid var(--border-light); }
.wp-feature__cta--ghost:hover { color: var(--text-color); border-color: var(--text-light); transform: none; }
@media (max-width: 640px) { .wp-feature__stats { grid-template-columns: 1fr; } }

/* ── geo-white-paper: breathing room after visuals at section-split points ──
   The report is authored as multiple .sec-body blocks (print pagination), and
   each continuation starts with a margin-top:0 element. On the continuous web
   page that makes text hug the figure/cards above it. Re-add the gap only at
   those continuation seams (a block preceded by a figure or another block). */
.gwp-page .fig + .sec-body { margin-top: 30px; }
.gwp-page .sec-body + .sec-body { margin-top: 24px; }

/* ── Resources library (filterable card grid) ── */
.lib-layout { display: grid; grid-template-columns: 240px 1fr; gap: 2.5rem; max-width: var(--max-width); margin: 0 auto; padding: 1.5rem 2rem 4.5rem; align-items: start; }
    .lib-filters { position: sticky; top: 80px; }
    .lib-filters__title { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .14em; color: var(--text-muted); margin: 0 0 .75rem .75rem; }
    .lib-search { width: 100%; font-family: var(--font); font-size: 14px; color: var(--text); background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: .55rem .75rem; margin-bottom: 1rem; }
    .lib-search:focus { outline: none; border-color: var(--accent); }
    .lib-select { display: none; width: 100%; font-family: var(--font); font-size: 14px; color: var(--text); background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: .55rem .75rem; }
    .lib-filter-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .15rem; }
    .lib-filter { width: 100%; text-align: left; cursor: pointer; background: transparent; border: 0; border-left: 2px solid transparent; color: var(--text-secondary); font-family: var(--font); font-size: .92rem; line-height: 1.3; padding: .5rem .75rem; border-radius: 0 6px 6px 0; display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; transition: background .12s, color .12s; }
    .lib-filter:hover { background: var(--bg-card); color: var(--text); }
    .lib-filter.is-active { background: var(--bg-card); border-left-color: var(--accent); color: var(--text); font-weight: 600; }
    .lib-filter__count { font-family: var(--mono); font-size: 11px; color: var(--text-muted); flex: none; }
    .lib-count { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: var(--text-muted); margin: 0 0 1rem; }
    .lib-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 1rem; }
    .lib-grid__head { grid-column: 1 / -1; font-family: var(--font); font-size: 1.3rem; font-weight: 700; letter-spacing: -.02em; color: var(--text); margin: 1.75rem 0 .15rem; }
    .lib-grid__head:first-child { margin-top: 0; }
    .lib-grid__sub { grid-column: 1 / -1; color: var(--text-muted); font-size: .95rem; margin: 0 0 .6rem; }
    .lib-card { display: flex; flex-direction: column; gap: .5rem; background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; padding: 1.25rem; text-decoration: none; transition: border-color .15s, background .15s, transform .15s; }
    .lib-card:hover { border-color: var(--accent); background: var(--bg-card-hover); transform: translateY(-2px); }
    .lib-card__tag { font-family: var(--mono); font-size: 10px; text-transform: uppercase; letter-spacing: .12em; color: var(--accent); }
    .lib-card__title { font-family: var(--font); font-size: 1.05rem; font-weight: 600; color: var(--text); line-height: 1.25; }
    .lib-card__desc { font-size: .88rem; color: var(--text-muted); line-height: 1.5; }
    .lib-card__cta { font-family: var(--mono); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--text-secondary); margin-top: auto; padding-top: .5rem; }
    .lib-card:hover .lib-card__cta { color: var(--accent); }
    .lib-empty { padding: 3rem 0; text-align: center; color: var(--text-muted); }
    .is-hidden { display: none !important; }
    @media (max-width: 820px) {
      .lib-layout { grid-template-columns: 1fr; gap: 1rem; }
      .lib-filters { position: sticky; top: 64px; z-index: 30; background: var(--bg); margin: 0 -2rem; padding: .65rem 2rem; border-bottom: 1px solid var(--border); }
      .lib-filters__title { display: none; }
      .lib-search { margin-bottom: .5rem; }
      .lib-filter-list { display: none; }
      .lib-select { display: block; }
    }

/* ── legal (privacy, terms) ── */
.legal-page .container { max-width: 760px; }
.legal-page h2 {
  font-size: 1.35rem;
  margin: 2.5rem 0 0.75rem;
  scroll-margin-top: 84px;
}
.legal-page h2:first-of-type { margin-top: 0; }
.legal-page p,
.legal-page li {
  color: var(--text-secondary);
  line-height: 1.7;
}
.legal-page p { margin: 0 0 1rem; }
.legal-page ul { margin: 0 0 1rem; padding-left: 1.25rem; }
.legal-page li { margin-bottom: 0.4rem; }
.legal-page .legal-updated {
  font-family: var(--mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  margin-bottom: 2rem;
}

/* ── technical-geo-checklist: page-anatomy figure ── */
.anatomy-eyebrow { display: inline-block; font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: var(--blue-accent); margin: 0 0 14px; }
.anatomy-fig { margin: 2rem 0 1.75rem; }
.anatomy-browser { background: #141416; border: 1px solid var(--border-color); border-radius: 12px; overflow: hidden; box-shadow: 0 40px 80px -40px rgba(0,0,0,0.8); }
.anatomy-chrome { display: flex; align-items: center; gap: 12px; padding: 11px 15px; background: var(--bg-card); border-bottom: 1px solid var(--border-color); }
.anatomy-dots { display: flex; gap: 6px; }
.anatomy-dots span { width: 10px; height: 10px; border-radius: 50%; background: #3a3a42; }
.anatomy-dots span:first-child { background: #4a4a52; }
.anatomy-url { flex: 1; font-family: var(--mono); font-size: 12px; color: var(--text-muted); background: var(--bg-soft); border: 1px solid var(--border-color); border-radius: 6px; padding: 6px 12px; display: flex; align-items: center; gap: 8px; white-space: nowrap; overflow: hidden; }
.anatomy-url .lock { color: var(--blue-accent); opacity: 0.8; flex: none; }
.anatomy-url b { color: var(--text-light); font-weight: 500; }
.anatomy-page { padding: 28px 34px 32px 62px; font-size: 14px; line-height: 1.55; }
.anatomy-el { position: relative; }
.anatomy-node { position: absolute; left: -46px; top: 0; width: 21px; height: 21px; border-radius: 50%; background: var(--blue-accent); color: var(--blue-dark); font-family: var(--mono); font-size: 10.5px; font-weight: 700; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 4px #141416; }
.anatomy-rawtag { margin-bottom: 16px; }
.anatomy-pill { display: inline-flex; align-items: center; gap: 7px; font-family: var(--mono); font-size: 11px; color: var(--blue-accent); background: rgba(200,255,0,0.12); border: 1px solid rgba(200,255,0,0.28); padding: 4px 11px; border-radius: 20px; }
.anatomy-crumb { font-family: var(--mono); font-size: 11px; letter-spacing: 0.03em; color: var(--text-muted); text-transform: uppercase; margin-bottom: 18px; }
.anatomy-crumb span { color: var(--blue-accent); opacity: 0.75; }
.anatomy-h1 { font-size: 23px; line-height: 1.14; letter-spacing: -0.015em; font-weight: 700; margin: 0 0 14px; color: var(--text-color); max-width: 22ch; }
.anatomy-lead { margin: 0 0 18px; color: var(--text-light); font-size: 14.5px; }
.anatomy-lift { background: rgba(200,255,0,0.14); box-shadow: inset 3px 0 0 var(--blue-accent); padding: 2px 7px 2px 11px; border-radius: 0 4px 4px 0; box-decoration-break: clone; -webkit-box-decoration-break: clone; color: var(--text-color); }
.anatomy-byline { display: flex; align-items: center; gap: 12px; padding: 13px 0; border-top: 1px solid var(--border-color); margin: 0 0 12px; }
.anatomy-avatar { width: 36px; height: 36px; border-radius: 50%; flex: none; background: var(--blue-accent); display: flex; align-items: center; justify-content: center; font-family: var(--mono); font-size: 13px; color: var(--blue-dark); font-weight: 700; }
.anatomy-who { font-size: 13.5px; color: var(--text-color); font-weight: 600; }
.anatomy-who span { display: block; color: var(--text-muted); font-weight: 400; font-size: 12px; margin-top: 1px; }
.anatomy-fresh { font-family: var(--mono); font-size: 11.5px; color: var(--text-muted); margin: 0 0 20px; padding-bottom: 14px; border-bottom: 1px solid var(--border-color); display: flex; align-items: center; gap: 8px; }
.anatomy-fresh::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--blue-accent); flex: none; }
.anatomy-fresh b { color: var(--text-light); font-weight: 600; }
.anatomy-fresh code { color: var(--blue-accent); font-size: 11px; }
.anatomy-h2 { font-size: 15.5px; font-weight: 600; letter-spacing: -0.01em; margin: 0 0 9px; color: var(--text-color); }
.anatomy-body2 { color: var(--text-light); margin: 0 0 14px; }
.anatomy-list { margin: 0 0 20px; }
.anatomy-list .lh { display: block; font-size: 13px; font-weight: 600; color: var(--text-light); margin-bottom: 9px; }
.anatomy-list ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.anatomy-list li { position: relative; padding-left: 20px; font-size: 13px; color: var(--text-muted); }
.anatomy-list li::before { content: ''; position: absolute; left: 2px; top: 7px; width: 7px; height: 7px; background: var(--blue-accent); border-radius: 2px; }
.anatomy-stat { background: rgba(200,255,0,0.12); border: 1px solid rgba(200,255,0,0.2); border-left: 3px solid var(--blue-accent); border-radius: 0 8px 8px 0; padding: 13px 16px; margin: 0 0 20px; }
.anatomy-stat .fig { display: block; font-size: 14.5px; color: var(--text-light); line-height: 1.42; }
.anatomy-stat .fig b { color: var(--blue-accent); font-weight: 800; }
.anatomy-stat .src { display: block; font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.03em; color: var(--text-muted); text-transform: uppercase; margin-top: 6px; }
.anatomy-ilinks { font-size: 13px; color: var(--text-muted); margin: 0 0 22px; }
.anatomy-ilinks a { color: var(--blue-accent); text-decoration: none; border-bottom: 1px solid rgba(200,255,0,0.3); }
.anatomy-ilinks .lbl { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted); margin-right: 8px; }
.anatomy-faq { border-top: 1px solid var(--border-color); }
.anatomy-faq .q { display: flex; align-items: center; gap: 10px; padding: 13px 0 11px; border-bottom: 1px solid var(--border-color); font-size: 14px; font-weight: 600; color: var(--text-color); }
.anatomy-faq .q .pm { margin-left: auto; font-family: var(--mono); color: var(--blue-accent); font-size: 15px; line-height: 1; flex: none; }
.anatomy-faq .a { display: block; padding: 11px 0 14px; border-bottom: 1px solid var(--border-color); font-size: 13px; color: var(--text-muted); line-height: 1.5; }
.anatomy-jsonld { margin-top: 20px; background: var(--bg-soft); border: 1px solid var(--border-color); border-radius: 8px; overflow: hidden; }
.anatomy-jsonld .bar { display: flex; align-items: center; gap: 8px; padding: 8px 13px; border-bottom: 1px solid var(--border-color); font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
.anatomy-jsonld .bar::before { content: '</>'; color: var(--blue-accent); opacity: 0.8; letter-spacing: 0; }
.anatomy-jsonld pre { margin: 0; padding: 13px; font-family: var(--mono); font-size: 11px; line-height: 1.55; color: var(--text-muted); overflow-x: auto; }
.anatomy-jsonld .k { color: var(--blue-accent); }
.anatomy-jsonld .v { color: var(--text-light); }
.anatomy-jsonld .p { color: var(--text-muted); }
.anatomy-figcap { font-family: var(--mono); font-size: 11px; letter-spacing: 0.04em; color: var(--text-muted); margin-top: 14px; text-align: center; }
.anatomy-key { margin: 2rem 0 1.5rem; border-top: 1px solid var(--border-color); padding-top: 1.5rem; }
.anatomy-key h3 { font-size: 15px; font-weight: 600; color: var(--text-color); margin: 0 0 4px; }
.anatomy-key .kdesc { font-size: 13.5px; color: var(--text-muted); margin: 0 0 18px; max-width: 70ch; }
.anatomy-key ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 48px; }
.anatomy-key li { display: grid; grid-template-columns: 26px 1fr; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--border-color); }
.anatomy-key .idx { font-family: var(--mono); font-size: 12px; font-weight: 700; color: var(--blue-accent); padding-top: 2px; }
.anatomy-key .name { display: block; font-size: 14px; font-weight: 600; color: var(--text-color); }
.anatomy-key .why { display: block; font-size: 12.5px; line-height: 1.45; color: var(--text-muted); margin-top: 3px; }
.anatomy-download { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 1.75rem; padding: 20px 22px; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 12px; }
.anatomy-download .dl-txt { flex: 1 1 300px; }
.anatomy-download .dl-txt strong { display: block; font-size: 15px; color: var(--text-color); margin-bottom: 3px; }
.anatomy-download .dl-txt span { font-size: 13px; color: var(--text-muted); }
.anatomy-download .dl-meta { display: block; font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); margin-top: 8px; }
@media (max-width: 760px) {
  .anatomy-key ol { grid-template-columns: 1fr; }
  .anatomy-page { padding-left: 56px; }
}
/* ── foundations (free Foundation sales page) ── */
.foundations-list { list-style: none; margin: 1.4rem 0 1.6rem; padding: 0; display: grid; gap: .85rem; max-width: 760px; }
.foundations-list li { padding: .9rem 1.1rem; background: var(--card-bg, #141416); border: 1px solid var(--border, #27272a); border-radius: 10px; line-height: 1.6; }
.foundations-list li strong { color: var(--text, #fafafa); }

/* ── homepage: hero console + sample-report scorecard (free Foundations funnel) ── */
/* Dot-grid ground. Overrides the legacy .hero::after hairline (same
   specificity tier, later in cascade), so every positioning prop the old
   rule sets is re-declared here. */
.hero--home::after {
  content: '';
  position: absolute;
  inset: 0;
  height: auto;
  max-width: none;
  margin: 0;
  opacity: 1;
  background: none;
  background-image: radial-gradient(rgba(var(--ink-rgb), 0.05) 1px, transparent 1px);
  background-size: 26px 26px;
  -webkit-mask-image: radial-gradient(ellipse 62% 55% at 50% 36%, #000 25%, transparent 78%);
  mask-image: radial-gradient(ellipse 62% 55% at 50% 36%, #000 25%, transparent 78%);
  pointer-events: none;
  z-index: 0;
}

.hero-console {
  max-width: 700px;
  margin: 0 auto 1rem;
  text-align: left;
  background: linear-gradient(180deg, var(--bg-card-hover, #1a1a1d) 0%, var(--bg-card, #141416) 100%);
  border: 1px solid var(--border-light, #3f3f46);
  border-radius: 12px;
  box-shadow: 0 1px 0 rgba(var(--ink-rgb), 0.04) inset, 0 30px 80px rgba(0, 0, 0, 0.55);
  overflow: hidden;
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.hero-console:focus-within {
  box-shadow: 0 1px 0 rgba(var(--ink-rgb), 0.04) inset, 0 38px 90px rgba(0, 0, 0, 0.6);
  transform: translateY(-2px);
}
.hero-console.is-flash { animation: hero-console-flash 1.1s ease-out; }
@keyframes hero-console-flash {
  0% {
    box-shadow: 0 1px 0 rgba(var(--ink-rgb), 0.04) inset, 0 30px 80px rgba(0, 0, 0, 0.55),
                0 0 0 0 rgba(var(--accent-rgb), 0.5);
  }
  100% {
    box-shadow: 0 1px 0 rgba(var(--ink-rgb), 0.04) inset, 0 30px 80px rgba(0, 0, 0, 0.55),
                0 0 0 18px rgba(var(--accent-rgb), 0);
  }
}
.hero-console__bar { display: flex; align-items: center; gap: 7px; padding: 11px 14px; border-bottom: 1px solid var(--border, #27272a); }
.hero-console__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--border-light, #3f3f46); }
.hero-console__title { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.08em; color: var(--text-faint); margin-left: 8px; }
.hero-console__body { padding: 18px; display: grid; gap: 14px; }
/* The live bar: no window dots here — dots stay on the sample report below,
   so the visual language reads dots = sample, live dot = yours. */
.hero-console__bar--live { gap: 9px; }
.hero-console__bar--live .hero-console__title { margin-left: 0; color: var(--text-muted, #a1a1aa); }
.hero-console__bar--live .hero-console__title em { font-style: normal; color: var(--text-faint); }
.hero-console__live { width: 8px; height: 8px; border-radius: 50%; background: var(--success); flex: none; animation: hero-live-pulse 2.2s ease-out infinite; }
@keyframes hero-live-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.45); }
  70%  { box-shadow: 0 0 0 7px rgba(var(--accent-rgb), 0); }
  100% { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0); }
}
.hero-start__label { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 14.5px; font-weight: 600; line-height: 1.3; color: var(--text); cursor: pointer; }
.hero-start__arrow { display: inline-block; margin-left: 6px; color: var(--accent, #c8ff00); }
.hero-start__label small { font-family: var(--mono); font-size: 11.5px; font-weight: 500; color: var(--text-faint); letter-spacing: 0.02em; }
.hero-start__row { display: flex; gap: 10px; align-items: stretch; }
.hero-start__caret { flex: none; width: 1.5px; height: 18px; margin-right: -4px; background: var(--text, #fafafa); animation: hero-caret-blink 1.05s steps(2, start) infinite; pointer-events: none; }
.hero-start__urlwrap:focus-within .hero-start__caret,
.hero-start__urlwrap.has-value .hero-start__caret,
.hero-start__urlwrap.is-typing .hero-start__caret { display: none; }
@keyframes hero-caret-blink { to { visibility: hidden; } }
/* On-demand beckon (empty submit). Its own keyframe name on purpose: the
   load choreography already runs hero-beckon on this element, and a same-name
   animation never restarts — a re-added hero-beckon would simply not play. */
.hero-start__urlwrap.is-beckon { animation: hero-beckon-again 1.3s ease-in-out 2; }
@keyframes hero-beckon-again {
  0%, 100% { border-color: var(--border-light, #3f3f46); box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0); }
  45%      { border-color: var(--accent, #c8ff00); box-shadow: 0 0 0 4px rgba(var(--accent-rgb), 0.14), 0 0 20px rgba(var(--accent-rgb), 0.18); }
}
[data-theme="light"] .hero-start__urlwrap { background: #fff; }
.hero-trust { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; padding: 0; list-style: none; font-size: 12px; font-weight: 500; color: var(--text-light); }
.hero-trust li { display: flex; align-items: center; gap: 6px; }
.hero-trust li::before { content: '✓'; font-family: var(--mono); font-size: 11px; font-weight: 700; color: var(--accent, #c8ff00); }
.hero-preview { display: grid; gap: 9px; padding-top: 14px; border-top: 1px dashed var(--border, #27272a); transition: opacity 0.4s ease; }
.hero-preview__cap { margin: 0; font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-faint); }
.hero-preview.is-idle { opacity: 0.6; }
.hero-preview.is-idle .hero-steps li { color: var(--text-faint); }
.hero-report__sample { margin-left: auto; font-family: var(--mono); font-size: 9.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-faint); border: 1px solid var(--border-light, #3f3f46); border-radius: 999px; padding: 2px 8px; }

.hero-start { display: grid; gap: 10px; margin: 0; }
.hero-start__urlwrap {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--bg, #09090b);
  border: 1px solid var(--border-light, #3f3f46);
  border-radius: 7px;
  padding: 0 16px;
  cursor: text;
  box-shadow: 0 1px 2px rgba(var(--ink-rgb), 0.06) inset;
}
.hero-start__urlwrap:focus-within { border-color: var(--accent, #c8ff00); box-shadow: 0 1px 2px rgba(var(--ink-rgb), 0.06) inset, 0 0 0 3px rgba(var(--accent-rgb), 0.14); }
.hero-start:has(.hero-start__input[aria-invalid="true"]) .hero-start__urlwrap { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(var(--danger-rgb), 0.14); }
.hero-start__scheme { font-family: var(--mono); font-size: 13px; color: var(--text-faint); user-select: none; }
.hero-start__input {
  flex: 1 1 auto;
  min-width: 0;
  background: transparent;
  border: 0;
  padding: 14px 0;
  color: var(--text, #fafafa);
  font-family: var(--mono);
  font-size: 15px;
}
.hero-start__input:focus { outline: none; }
.hero-start__input::placeholder { color: var(--text-faint, #71717a); opacity: 0.85; }
.hero-start__btn { border: 0; cursor: pointer; font-family: var(--font); white-space: nowrap; }
.hero-start__err { margin: -4px 2px 0; font-size: 0.85rem; line-height: 1.5; color: var(--danger); }

.hero-steps { list-style: none; margin: 0; padding: 2px 2px 0; display: grid; gap: 9px; }
.hero-steps li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-family: var(--mono);
  font-size: 11.5px;
  color: var(--text-muted, #a1a1aa);
  transition: color 0.35s ease;
}
.hero-steps__mark { width: 14px; flex: none; text-align: center; color: var(--accent, #c8ff00); font-weight: 700; transition: color 0.35s ease; }
.hero-steps__mark--todo { color: var(--text-faint); }
/* The console's ambient loop (inline script) advances these marks; the pop
   makes each state change read as an event, not a text swap. */
.hero-steps__mark--pop { animation: hero-mark-pop 0.4s ease-out; }
@keyframes hero-mark-pop {
  0%   { transform: scale(0.6); }
  60%  { transform: scale(1.25); }
  100% { transform: scale(1); }
}
.hero-steps__n { margin-left: auto; color: var(--text-faint); font-variant-numeric: tabular-nums; white-space: nowrap; }
.hero-steps__active .hero-steps__mark { animation: hero-steps-pulse 1.2s ease-in-out infinite; }
@keyframes hero-steps-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }
@media (prefers-reduced-motion: reduce) {
  .hero-steps li { animation: none; opacity: 1; transform: none; }
  .hero-steps__active .hero-steps__mark { animation: none; }
  .hero-console__live, .hero-start__caret { animation: none; }
  .hero-console.is-flash, .hero-start__urlwrap.is-beckon { animation: none; }
  .hero-console, .hero-preview { transition: none; }
  .hero-console:focus-within { transform: none; }
}

.hero-report__cap {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-faint);
  text-align: center;
  margin: 34px 0 12px;
  position: relative;
  z-index: 1;
}
.hero-report__cap b { color: var(--accent, #c8ff00); font-weight: 500; }
.hero-report {
  max-width: 820px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  background: linear-gradient(180deg, var(--bg-card-hover, #1a1a1d) 0%, var(--bg-card, #141416) 100%);
  border: 1px solid var(--border-light, #3f3f46);
  border-radius: 12px;
  box-shadow: 0 1px 0 rgba(var(--ink-rgb), 0.04) inset, 0 30px 80px rgba(0, 0, 0, 0.55);
  overflow: hidden;
}
.hero-report__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 16px; }
.hero-metric { background: var(--bg, #09090b); border: 1px solid var(--border, #27272a); border-radius: 9px; padding: 13px 14px; text-align: left; }
.hero-metric__k {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--text-faint);
  margin: 0 0 7px;
  white-space: nowrap;
}
.hero-metric__v { font-family: var(--mono); font-size: 23px; font-weight: 700; line-height: 1; margin: 0 0 6px; font-variant-numeric: tabular-nums; }
.hero-metric__v small { font-size: 11px; font-weight: 400; color: var(--text-faint); }
.hero-metric__c { font-size: 10.5px; color: var(--text-muted, #a1a1aa); line-height: 1.35; margin: 0; }
/* Status colors mirror the delivered report's scorecard palette. */
.hero-metric--warning .hero-metric__v { color: var(--warning); }
.hero-metric--success .hero-metric__v { color: var(--success); }
.hero-metric--accent .hero-metric__v { color: var(--accent, #c8ff00); }

.hero-statline {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  max-width: 620px;
  margin: 26px auto 0;
  padding: 16px 20px;
  border-top: 1px solid var(--border, #27272a);
  border-bottom: 1px solid var(--border, #27272a);
  text-align: left;
  position: relative;
  z-index: 1;
}
.hero-statline__val { font-family: var(--mono); font-size: 30px; font-weight: 700; color: var(--accent, #c8ff00); line-height: 1; flex: none; }
.hero-statline__txt { font-size: 12.5px; color: var(--text-muted, #a1a1aa); line-height: 1.45; }
.hero-statline__txt strong { color: var(--text-secondary, #e4e4e7); font-weight: 600; }
.hero-statline__src { font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-faint); display: block; margin-top: 4px; }

@media (max-width: 880px) {
  .hero-report__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .hero-start__row { flex-direction: column; align-items: stretch; }
  .hero-start__btn { width: 100%; }
  .hero-steps__n { display: none; }
}

/* ── invisible-shortlist ── */
.shortlist-body { min-height: 100vh; display: flex; flex-direction: column; }
.shortlist-body main { flex: 1; }
.shortlist-hero { padding: 72px 24px 56px; position: relative; overflow: hidden; }
/* A quiet accent bloom behind the form card — atmosphere, not decoration.
   Rides --accent-rgb so all three themes keep it coherent. */
.shortlist-hero::before {
  content: ''; position: absolute; top: -200px; right: -140px;
  width: 620px; height: 620px; pointer-events: none;
  background: radial-gradient(circle, rgba(var(--accent-rgb), 0.07) 0%, transparent 62%);
}
.shortlist-hero__grid {
  max-width: 1080px; margin: 0 auto; width: 100%;
  display: grid; grid-template-columns: 1.15fr 1fr;
  column-gap: 56px; align-items: start;
  position: relative;   /* above the hero bloom */
}
.shortlist-copy { padding-top: 8px; }
.shortlist-eyebrow {
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  color: var(--accent); text-transform: uppercase; letter-spacing: 1.5px;
  margin-bottom: 20px; display: flex; align-items: center; gap: 8px;
}
.shortlist-eyebrow::before { content: ''; width: 20px; height: 1px; background: var(--accent); }
.shortlist-hero h1 {
  font-size: clamp(28px, 3.8vw, 40px); font-weight: 700;
  line-height: 1.12; margin-bottom: 20px; letter-spacing: -0.02em;
}
.shortlist-hero h1 span { color: var(--accent); }
.shortlist-intro {
  font-size: 16px; color: var(--text-secondary);
  line-height: 1.7; margin-bottom: 22px; max-width: 540px;
}
.shortlist-points { list-style: none; padding: 0; margin: 0; max-width: 540px; }
.shortlist-points li {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 9px 0; font-size: 14.5px; color: var(--text-secondary);
  line-height: 1.55; border-bottom: 1px solid var(--border);
}
.shortlist-points li:last-child { border-bottom: none; }
.shortlist-points li::before {
  content: '\2192'; color: var(--accent); font-weight: 600;
  flex-shrink: 0; margin-top: 1px;
}
.shortlist-form-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 16px; padding: 36px;
  box-shadow: 0 12px 44px rgba(var(--accent-rgb), 0.05);
  position: relative; overflow: hidden;
  /* The capture card breathes: a slow accent halo that swells and settles,
     drawing the eye without ever strobing. Glow rides --accent-rgb so it
     retints per theme like every other wash. */
  animation: shortlist-card-breathe 3.6s ease-in-out infinite;
}
@keyframes shortlist-card-breathe {
  0%, 100% {
    box-shadow: 0 12px 44px rgba(var(--accent-rgb), 0.05),
                0 0 0 0 rgba(var(--accent-rgb), 0);
  }
  50% {
    box-shadow: 0 14px 52px rgba(var(--accent-rgb), 0.12),
                0 0 0 7px rgba(var(--accent-rgb), 0.07);
  }
}
/* Accent hairline across the card's top edge — the conversion element wears
   the brand color without shouting. A slow shimmer drifts along it. */
.shortlist-form-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent 4%, var(--accent-fill) 50%, transparent 96%);
  background-size: 200% 100%;
  animation: shortlist-hairline-drift 4.8s ease-in-out infinite;
}
@keyframes shortlist-hairline-drift {
  0%, 100% { background-position: 20% 0; }
  50% { background-position: 80% 0; }
}
/* Arrival flash — fired by JS when any #get-guide link lands the reader here:
   one emphatic ring, then back to the idle breathing. */
.shortlist-form-card.is-flash { animation: shortlist-card-flash 1.1s ease-out; }
@keyframes shortlist-card-flash {
  0% { box-shadow: 0 12px 44px rgba(var(--accent-rgb), 0.05), 0 0 0 0 rgba(var(--accent-rgb), 0.45); }
  100% { box-shadow: 0 12px 44px rgba(var(--accent-rgb), 0.05), 0 0 0 22px rgba(var(--accent-rgb), 0); }
}
.shortlist-form-title { font-size: 18px; font-weight: 600; margin-bottom: 6px; }
.shortlist-form-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.shortlist-form-chips span {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.6px;
  text-transform: uppercase; color: var(--text-muted);
  border: 1px solid var(--border); border-radius: 99px; padding: 3px 10px;
}
.shortlist-form-sub { font-size: 13px; color: var(--text-muted); margin-bottom: 24px; }
.shortlist-form { display: flex; flex-direction: column; gap: 12px; }
.shortlist-form input {
  width: 100%; padding: 14px 16px;
  background: var(--bg); border: 1px solid var(--border);
  border-radius: 8px; color: var(--text); font-family: var(--font);
  font-size: 14px; outline: none; transition: border-color 0.2s;
}
.shortlist-form input::placeholder { color: var(--text-muted); }
.shortlist-form input:focus { border-color: var(--accent); }
.shortlist-step-label {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.5px;
  text-transform: uppercase; color: var(--accent);
}
/* Honeypot — visually removed, still submittable by bots. */
.shortlist-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.shortlist-form-error {
  font-size: 13px; color: var(--danger); background: var(--danger-bg);
  border: 1px solid rgba(var(--danger-rgb), 0.2); border-radius: 8px; padding: 10px 12px; margin: 0;
}
.shortlist-form-fineprint { font-size: 12px; color: var(--text-muted); text-align: center; margin: 8px 0 0; }
.shortlist-btn-primary {
  display: block; width: 100%; background: var(--accent-fill); color: var(--accent-ink);
  padding: 14px; border-radius: 8px; font-size: 15px; font-weight: 600;
  text-decoration: none; border: none; cursor: pointer;
  font-family: var(--font); margin-top: 4px;
  transition: all 0.2s;
  box-shadow: 0 4px 20px rgba(var(--accent-rgb), 0.15);
  position: relative; overflow: hidden;
}
.shortlist-btn-primary:hover {
  background: var(--accent-hover);
  box-shadow: 0 6px 28px rgba(var(--accent-rgb), 0.25);
  transform: translateY(-1px);
}
/* A soft sheen sweeps the fill every few seconds — the button keeps a
   heartbeat between the card's breaths. White light over the lime fill,
   so it reads as gloss in every theme. */
.shortlist-btn-primary::after {
  content: ''; position: absolute; top: 0; bottom: 0; left: -70%; width: 45%;
  background: linear-gradient(105deg, transparent, rgba(255, 255, 255, 0.4), transparent);
  animation: shortlist-btn-sheen 3.6s ease-in-out infinite;
  pointer-events: none;
}
@keyframes shortlist-btn-sheen {
  0%, 55% { left: -70%; }
  85%, 100% { left: 125%; }
}
/* Inside-the-guide: cover facsimile + table of contents */
.shortlist-inside {
  display: grid; grid-template-columns: 320px 1fr;
  gap: 40px; align-items: start; margin-top: 36px;
}
/* The cover is artwork — a facsimile of the printed PDF cover. It deliberately
   keeps the guide's own dark palette in every site theme, like a book jacket. */
.shortlist-cover {
  background: #0a0a0c; border: 1px solid #232327; border-radius: 12px;
  padding: 30px 26px 26px; box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
}
.shortlist-cover__eyebrow {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 2px;
  text-transform: uppercase; color: #c8ff00; margin-bottom: 20px;
}
.shortlist-cover__title {
  font-family: var(--font); font-size: 34px; font-weight: 700;
  line-height: 1.05; letter-spacing: -0.02em; color: #fafafa; margin-bottom: 12px;
}
.shortlist-cover__title em {
  font-style: normal; color: transparent;
  -webkit-text-stroke: 1px #9b9ba3;
}
.shortlist-cover__sub { font-size: 12.5px; color: #a1a1aa; line-height: 1.5; margin-bottom: 22px; }
.shortlist-cover__list { border-top: 1px solid #232327; }
.shortlist-cover__row {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 0; border-bottom: 1px solid #1b1b1f;
}
.shortlist-cover__n { font-family: var(--mono); font-size: 10px; color: #71717a; width: 14px; flex-shrink: 0; }
.shortlist-cover__bar { height: 9px; border-radius: 4px; background: #3a3a41; flex: 1; max-width: 120px; }
.shortlist-cover__bar--s { max-width: 88px; }
.shortlist-cover__tag {
  margin-left: auto; font-family: var(--mono); font-size: 8.5px;
  letter-spacing: 1.2px; text-transform: uppercase; color: #71717a;
}
.shortlist-cover__row--you { border-bottom: none; }
.shortlist-cover__you {
  font-family: var(--mono); font-size: 10px; letter-spacing: 2px;
  text-transform: uppercase; color: #c8ff00;
  border: 1px dashed rgba(200, 255, 0, 0.55); border-radius: 4px;
  padding: 3px 14px;
  /* The whole pitch in one element — let it breathe. Raw lime is fine here:
     the cover is theme-invariant artwork. */
  animation: shortlist-you-pulse 2.8s ease-in-out infinite;
}
@keyframes shortlist-you-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(200, 255, 0, 0); }
  50% { box-shadow: 0 0 0 6px rgba(200, 255, 0, 0.10); }
}
@media (prefers-reduced-motion: reduce) { .shortlist-cover__you { animation: none; } }
.shortlist-cover__tag--miss { color: #c8ff00; }
.shortlist-toc { list-style: none; padding: 0; margin: 0; counter-reset: none; }
.shortlist-toc li {
  display: flex; align-items: flex-start; gap: 18px;
  padding: 15px 0; border-bottom: 1px solid var(--border);
}
.shortlist-toc li:last-child { border-bottom: none; }
.shortlist-toc__num {
  font-family: var(--mono); font-size: 12px; color: var(--accent);
  flex-shrink: 0; margin-top: 3px;
}
.shortlist-toc li strong { display: block; font-size: 15.5px; font-weight: 600; margin-bottom: 3px; }
.shortlist-toc li span { font-size: 13.5px; color: var(--text-muted); line-height: 1.5; }
/* Thanks page */
.shortlist-hero--thanks { padding-bottom: 40px; }
.shortlist-thanks { max-width: 760px; margin: 0 auto; }
.shortlist-download {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 16px; padding: 26px 28px; margin: 28px 0 16px;
  box-shadow: 0 12px 44px rgba(var(--accent-rgb), 0.05);
}
/* Book-jacket thumbnail — the same theme-invariant artwork as the LP cover,
   shrunk, so the download card shows the thing being handed over. */
.shortlist-minicover {
  flex-shrink: 0; width: 94px;
  background: #0a0a0c; border: 1px solid #232327; border-radius: 8px;
  padding: 12px 11px 14px; box-shadow: 0 10px 26px rgba(0, 0, 0, 0.4);
}
.shortlist-minicover__eyebrow {
  display: block; font-family: var(--mono); font-size: 6.5px;
  letter-spacing: 1.4px; text-transform: uppercase; color: #c8ff00; margin-bottom: 8px;
}
.shortlist-minicover__title {
  display: block; font-size: 14px; font-weight: 700;
  line-height: 1.12; letter-spacing: -0.02em; color: #fafafa;
}
.shortlist-minicover__title em { font-style: normal; color: transparent; -webkit-text-stroke: 0.6px #9b9ba3; }
.shortlist-download__txt { display: flex; flex-direction: column; gap: 5px; flex: 1; }
.shortlist-download__txt > strong { font-size: 16px; }
.shortlist-download__txt > span { font-size: 13.5px; color: var(--text-muted); line-height: 1.5; }
.shortlist-download__meta {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.5px;
  text-transform: uppercase; color: var(--accent);
}
.shortlist-download .cta-button { flex-shrink: 0; }

/* thanks-page Foundation embed + LP trust line + secondary download (2026-08 conversion pass) */
.foundation-embed { margin: 1.6rem 0 0.4rem; }
.foundation-embed__cap { font-size: 13.5px; color: var(--text-light); line-height: 1.5; margin: 0 0 12px; }
.foundation-embed__frame { position: relative; border: 1px solid var(--border-color); border-radius: 12px; overflow: hidden; background: var(--bg-soft); height: 460px; box-shadow: 0 30px 60px -30px rgba(0,0,0,.6); }
.foundation-embed__frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.foundation-embed__link { display: inline-block; margin-top: 12px; font-size: 13.5px; color: var(--blue-accent); text-decoration: none; border-bottom: 1px solid rgba(200,255,0,.35); }
.foundation-embed__link:hover { opacity: 0.75; }
.shortlist-form-trust { margin: 12px 0 0; text-align: center; font-size: 12.5px; color: var(--text-muted); }
.shortlist-download--secondary { opacity: 0.9; }
@media (max-width: 640px) { .foundation-embed__frame { height: 360px; } }
.shortlist-fineprint { font-size: 12.5px; color: var(--text-muted); }
/* The Foundation console on the thanks page — same component as the homepage
   hero, left-aligned into the section's prose column. */
.shortlist-console-lead { font-size: 15.5px; margin: 30px 0 12px; }
/* The console is the conversion element on /thanks/ — it breathes like the
   LP's form card, and flashes when a "Build my Foundation" anchor lands the
   reader on it. Keyframes restate .hero-console's base shadow (inset hairline
   + smoke drop) so the accent ring layers on top instead of replacing it. */
.shortlist-console {
  margin: 0 0 12px;
  animation: shortlist-console-breathe 3.6s ease-in-out infinite;
}
@keyframes shortlist-console-breathe {
  0%, 100% {
    box-shadow: 0 1px 0 rgba(var(--ink-rgb), 0.04) inset, 0 30px 80px rgba(0, 0, 0, 0.55),
                0 0 0 0 rgba(var(--accent-rgb), 0);
  }
  50% {
    box-shadow: 0 1px 0 rgba(var(--ink-rgb), 0.04) inset, 0 30px 80px rgba(0, 0, 0, 0.55),
                0 0 0 7px rgba(var(--accent-rgb), 0.07);
  }
}
.shortlist-console.is-flash { animation: shortlist-console-flash 1.1s ease-out; }
/* The three-step strip under the /thanks/ console — names the account as the
   expected next step before the OAuth screen asks for it. Width-matched to
   the console above it. */
.shortlist-fnd-steps {
  list-style: none; padding: 0; margin: 18px 0 0;
  max-width: 620px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
}
.shortlist-fnd-steps li {
  font-size: 12.5px; color: var(--text-muted); line-height: 1.5;
  padding-top: 10px; border-top: 1px solid var(--border);
}
.shortlist-fnd-steps__num {
  display: block; font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 1.2px; color: var(--accent); margin-bottom: 6px;
}
.shortlist-fnd-steps li strong {
  display: block; font-size: 13.5px; font-weight: 600;
  color: var(--text); margin-bottom: 3px;
}
@media (max-width: 640px) {
  .shortlist-fnd-steps { grid-template-columns: 1fr; gap: 12px; }
}
/* the shared note component centers itself for the homepage hero; here it
   sits in a left-aligned column under the console */
#start-foundation .hero__cta-note { margin: 12px 0 0; }
@keyframes shortlist-console-flash {
  0% {
    box-shadow: 0 1px 0 rgba(var(--ink-rgb), 0.04) inset, 0 30px 80px rgba(0, 0, 0, 0.55),
                0 0 0 0 rgba(var(--accent-rgb), 0.45);
  }
  100% {
    box-shadow: 0 1px 0 rgba(var(--ink-rgb), 0.04) inset, 0 30px 80px rgba(0, 0, 0, 0.55),
                0 0 0 22px rgba(var(--accent-rgb), 0);
  }
}
.shortlist-footer { padding: 28px 0; text-align: center; border-top: 1px solid var(--border); }
.shortlist-footer p { font-family: var(--mono); font-size: 12px; color: var(--text-muted); }
/* Mobile-only sticky CTA bar — JS shows it (.is-on) while the hero form is
   off-screen; desktop and no-JS visitors never see it. aria-hidden in the
   markup: it duplicates the nav CTA for thumbs, not for screen readers. */
.shortlist-sticky-cta {
  display: none; position: fixed; left: 16px; right: 16px; bottom: 14px; z-index: 60;
  background: var(--accent-fill); color: var(--accent-ink);
  border-radius: 12px; padding: 13px 16px;
  font-family: var(--font); font-size: 15px; font-weight: 600; text-align: center;
  text-decoration: none;
  box-shadow: 0 10px 30px rgba(var(--accent-rgb), 0.28), 0 2px 8px rgba(var(--ink-rgb), 0.18);
  transform: translateY(calc(100% + 18px)); opacity: 0;
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.shortlist-sticky-cta__sub {
  display: block; font-size: 11px; font-weight: 500; opacity: 0.75; margin-top: 1px;
}
@media (max-width: 768px) {
  .shortlist-sticky-cta { display: block; }
  .shortlist-sticky-cta.is-on { transform: none; opacity: 1; }
}
/* Reveal-on-scroll — the hidden state exists only under html.sl-js (set by the
   page script), so content is never invisible without JS. */
html.sl-js .sl-reveal {
  opacity: 0; transform: translateY(16px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}
html.sl-js .sl-reveal.sl-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .shortlist-form-card,
  .shortlist-form-card::before,
  .shortlist-form-card.is-flash,
  .shortlist-btn-primary::after,
  .shortlist-console,
  .shortlist-console.is-flash,
  .shortlist-sticky-cta { animation: none; transition: none; }
  html.sl-js .sl-reveal { opacity: 1; transform: none; transition: none; }
}
/* .hero__cta-row is a bare flex row with no margin of its own, so after the
   step cards the buttons sit flush against the tiles and read as a fourth
   element in the row. Scoped to this page so the shared class is untouched. */
.shortlist-body .step3 + .hero__cta-row { margin-top: 2.5rem; }
@media (max-width: 900px) {
  .shortlist-inside { grid-template-columns: 1fr; }
  .shortlist-cover { max-width: 340px; }
}
@media (max-width: 768px) {
  .shortlist-hero { padding: 40px 16px 32px; }
  .shortlist-hero__grid { grid-template-columns: 1fr; row-gap: 32px; column-gap: 0; }
  .shortlist-copy { padding-top: 0; }
  .shortlist-form-card { padding: 24px; }
  .shortlist-download { flex-direction: column; align-items: flex-start; }
  .shortlist-download .cta-button { width: 100%; text-align: center; }
}

/* ════════════════════════════════════════════════════════════════
   THEMES — user-selectable via the nav .theme-toggle button.
   Default (no data-theme attribute on <html>) = the original dark
   design, untouched. Each block overrides BOTH variable namespaces
   (modern --bg/--accent and legacy --blue-… and --text-…) so every
   page themes coherently. Themes override color/background/border/
   shadow (+ font-family in terminal) ONLY — never layout properties,
   so toggling causes no layout shift.
   The choice persists in localStorage('rl-theme'); a tiny inline
   head script sets the attribute before first paint (no flash).
   .gwp-page pins its own palette and deliberately ignores themes.

   ── Letterpress (light) ─ premium cardstock: warm white paper
   (#faf9f6, the same stock as the report-cover mock), soft press-ink
   text, hairline rules, lime kept as "edge paint" on interactive
   fills (--accent-fill), accent TEXT darkened to ink-olive for
   WCAG AA. All pairs verified >= 4.5:1.
   ════════════════════════════════════════════════════════════════ */
:root[data-theme="light"] {
  color-scheme: light;
  /* modern namespace */
  --bg: #faf9f6;
  --bg-secondary: #f2f0ea;
  --bg-card: #fffefb;          /* stays a plain color: used inside gradient stops */
  --bg-card-hover: #f5f3ec;
  --text: #1c1c1a;
  --text-secondary: #44443f;
  --text-muted: #5c5b52;
  --text-faint: #6f6e64;
  --accent: #556800;           /* ink-olive: accent as TEXT/border, 5.9:1 on cardstock */
  --accent-rgb: 85, 104, 0;    /* washes/glows retint to olive */
  --ink-rgb: 28, 28, 24;       /* hairlines/washes flip to press-ink */
  --border: #e5e2d9;
  --border-light: #d3cfc3;
  --nav-bg: #faf9f6;
  --nav-text: #1c1c1a;
  --danger: #b3261e;
  --danger-bg: #faeae7;
  --danger-text: #942018;
  --danger-rgb: 179, 38, 30;
  --warning: #8a5a00;
  --warning-text: #6e4700;
  --warning-rgb: 158, 106, 0;
  --neutral-rgb: 92, 91, 82;
  --success: #1b7a3d;
  --info: #0e7490;
  --info-soft: #0e7490;
  --eng-chatgpt: #047857;
  --eng-claude: #9a3412;
  --eng-gemini: #1d4ed8;
  --eng-perplexity: #0e7490;
  --bg-rgb: 250, 249, 246;
  --panel-rgb: 255, 254, 251;
  --tone-900: #f5f3ec;
  --tone-850: #eceae2;
  --tone-600: #7d7b6f;
  --tone-500: #6f6e64;
  --accent-dim-solid: #e3edc4;
  --chart-grid: #e8e5da;
  --won: #5c7000;
  --won-dim: #5c7000;
  --ok-text: #047857;
  --ok-rgb: 4, 120, 87;
  --l1-ink: #1d4ed8;
  --l1-rgb: 29, 78, 216;
  --l2-ink: #6d28d9;
  --l2-rgb: 109, 40, 217;
  --high-rgb: 166, 58, 8;
  --med-rgb: 138, 90, 0;
  --rl-amber: #a16207;
  --rl-blue: #0369a1;
  --rl-red: #b91c1c;
  --high-ink: #a63a08;
  --red-ink: #b91c1c;
  --red-rgb: 185, 28, 28;
  --sky-ink: #0369a1;
  --sky-rgb: 3, 105, 161;
  --amber-ink: #8a5a00;
  --amber-bright: #8a5a00;
  --amber-rgb: 138, 90, 0;
  --blue-ink: #1d4ed8;
  --green-ink: #15803d;
  --green-rgb: 21, 128, 61;
  --lime-soft: #4d6a00;
  --lime-soft-rgb: 77, 106, 0;
  /* --accent-deep stays at its base value in every theme: it is the olive
     INK used on literal light surfaces (#ecfccb chips, white balloons) */
  /* legacy namespace */
  --blue-primary: var(--accent);
  --blue-accent: var(--accent);
  --blue-dark: var(--accent-ink);
  --blue-nav: var(--nav-bg);
  --blue-mid: var(--accent-hover);
  --text-color: var(--text);
  --text-light: var(--text-secondary);
  --bg-white: var(--bg);
  --bg-light: var(--bg-secondary);
  --bg-soft: #f6f4ee;
  --bg-tinted: #f1f3e0;
  --bg-card-tinted: #f6f5e6;
  --bg-blue-gradient: linear-gradient(135deg, #faf9f6 0%, #c8ff00 100%);
  --border-color: var(--border);
  --shadow-sm: 0 1px 2px rgba(60, 55, 40, 0.08);
  --shadow-md: 0 4px 14px rgba(60, 55, 40, 0.10);
}
/* letterpress finish: debossed headings, hairline nav/footer rules,
   paper-soft nav shadow instead of the dark theme's smoke shadow */
[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3 { text-shadow: 0 1px 0 rgba(255, 255, 255, 0.85); }
[data-theme="light"] .site-nav { box-shadow: 0 1px 0 var(--border), 0 2px 10px rgba(60, 55, 40, 0.05); }
[data-theme="light"] .site-footer { border-top: 1px solid var(--border); }
/* the brand logo is white SVG artwork; print it in ink on cardstock */
[data-theme="light"] .site-nav__logo img,
[data-theme="light"] .site-footer img { filter: invert(1); }

/* ── Terminal ─ phosphor console: near-black green-cast ground with
   a faint graph-paper grid (pure CSS gradients, no images), mono
   display type, lime glow. Grid rides the legacy section-surface
   tokens (--bg-white/--bg-light are only ever used as full
   `background:` values) + a body rule for modern pages. ── */
:root[data-theme="terminal"] {
  color-scheme: dark;
  /* modern namespace */
  --bg: #050b05;
  --bg-secondary: #081108;
  --bg-card: #0a140a;          /* plain color: used inside gradient stops */
  --bg-card-hover: #0e1a0e;
  --text: #d9f0d2;
  --text-secondary: #b4d2ac;
  --text-muted: #8cab85;
  --text-faint: #6d8a68;
  --ink-rgb: 200, 255, 140;    /* hairlines glow faintly phosphor */
  --border: #162814;
  --border-light: #27401f;
  --nav-bg: #050b05;
  --nav-text: #d9f0d2;
  --bg-rgb: 5, 11, 5;
  --panel-rgb: 10, 20, 10;
  --tone-950: #101810;
  --tone-900: #0e1a0e;
  --tone-850: #122112;
  --tone-600: #4f6a49;
  --tone-500: #5d7a57;
  --accent-dim-solid: #223509;
  --chart-grid: #12210f;
  --won: #9fdc00;
  --won-dim: #7ba300;
  --danger: #ff6b57;
  --danger-bg: #1c0d08;
  --danger-text: #ffab9e;
  --danger-rgb: 255, 107, 87;
  --warning: #ffb020;
  --warning-text: #ffd280;
  --warning-rgb: 255, 176, 32;
  --neutral-rgb: 140, 171, 133;
  --success: #37e06e;
  /* type: headings go mono via the legacy display token + rule below */
  --font-display: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
  /* legacy namespace */
  --blue-primary: var(--accent);
  --blue-accent: var(--accent);
  --blue-dark: var(--accent-ink);
  --blue-nav: var(--nav-bg);
  --blue-mid: var(--accent-hover);
  --text-color: var(--text);
  --text-light: var(--text-secondary);
  --bg-white: repeating-linear-gradient(0deg, rgba(200, 255, 0, 0.025) 0 1px, transparent 1px 36px),
              repeating-linear-gradient(90deg, rgba(200, 255, 0, 0.025) 0 1px, transparent 1px 36px) #050b05;
  --bg-light: repeating-linear-gradient(0deg, rgba(200, 255, 0, 0.03) 0 1px, transparent 1px 36px),
              repeating-linear-gradient(90deg, rgba(200, 255, 0, 0.03) 0 1px, transparent 1px 36px) #081108;
  --bg-soft: #070f07;
  --bg-tinted: #0b1206;
  --bg-card-tinted: #0e1607;
  --bg-blue-gradient: linear-gradient(135deg, #050b05 0%, #c8ff00 100%);
  --border-color: #162814;
}
[data-theme="terminal"] body {
  background-image:
    repeating-linear-gradient(0deg, rgba(200, 255, 0, 0.025) 0 1px, transparent 1px 36px),
    repeating-linear-gradient(90deg, rgba(200, 255, 0, 0.025) 0 1px, transparent 1px 36px);
}
[data-theme="terminal"] h1,
[data-theme="terminal"] h2,
[data-theme="terminal"] h3 { font-family: var(--mono); letter-spacing: -0.02em; }
[data-theme="terminal"] .hero h1 { text-shadow: 0 0 28px rgba(var(--accent-rgb), 0.28); }

/* ── Theme toggle button (lives in .site-nav__inner on every page).
   Shows the glyph of the CURRENT theme; click cycles dark → light →
   terminal. Real <button>, keyboard-operable, visible focus ring. ── */
.theme-toggle {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 1px solid var(--border, #27272a);
  color: var(--nav-text, #fff);
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
  font-size: 14px;
  line-height: 1;
  transition: border-color 0.15s, color 0.15s;
}
.theme-toggle:hover { border-color: var(--accent, #c8ff00); color: var(--accent, #c8ff00); }
.theme-toggle:focus-visible { outline: 2px solid var(--accent, #c8ff00); outline-offset: 2px; }
.theme-toggle span { display: none; pointer-events: none; }
.theme-toggle .theme-toggle__term { font-family: var(--mono); font-size: 11px; font-weight: 700; letter-spacing: -0.05em; }
html:not([data-theme]) .theme-toggle__dark { display: block; }
[data-theme="light"] .theme-toggle__light { display: block; }
[data-theme="terminal"] .theme-toggle__term { display: block; }

/* ── Listening arc (2026-09) ─────────────────────────────────────────────
   The homepage's bundle table, the price tag on a process chip, and the
   stake line under the problem panes. Tokens only; every theme retints. */
.bundle-table { width: 100%; max-width: 44rem; border-collapse: collapse; margin: var(--space-lg) 0 var(--space-xl); font-size: 0.97rem; }
.bundle-table th, .bundle-table td { text-align: left; vertical-align: top; padding: 0.65rem 0.25rem; border-bottom: 1px solid var(--border-color); }
.bundle-table th { font-weight: 500; color: var(--text-color); }
.bundle-table td { font-family: var(--mono); font-size: 0.8rem; white-space: nowrap; color: var(--text-light); padding-left: 1rem; }
.bundle-table tr:nth-child(n+2) td { color: var(--accent, var(--blue-accent)); }
.intro-chip__tag { display: inline-block; margin-left: 0.4rem; padding: 0.1em 0.5em; border-radius: 3px; font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.05em; text-transform: uppercase; background: var(--accent-fill, var(--blue-accent)); color: var(--accent-ink, var(--blue-dark)); vertical-align: middle; }
.problem__stake { margin-top: var(--space-lg); font-size: 1.1rem; max-width: 40rem; }
@media (max-width: 640px) { .bundle-table td { white-space: normal; } }