/* lead-funnels — design system v2 (spec 01). Mobile-first.
   Per-vertical theme = 5 vars injected by the server (see src/lib/theme.ts):
   --brand, --brand-dark, --accent, --tint, --tint-strong. Everything below is global. */

@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/archivo-700-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/fonts/archivo-800-latin.woff2') format('woff2');
}

:root {
  /* pickedpros site brand (hue 250 / accent 70) — used by the home page, legal
     pages and admin, which have no vertical. Funnel pages override all five per
     vertical via the injected style block (src/lib/theme.ts). Same band rule. */
  --brand: oklch(0.48 0.11 250);
  --brand-dark: oklch(0.36 0.09 250);
  --accent: oklch(0.62 0.10 70);
  --tint: oklch(0.96 0.015 250);
  --tint-strong: oklch(0.92 0.035 250);
  /* global — never varies per niche */
  --ink: oklch(0.26 0.01 250);
  --muted: oklch(0.5 0.02 250);
  --bg: oklch(0.985 0.004 90);
  --card: #ffffff;
  --line: oklch(0.9 0.006 250);
  --error: oklch(0.55 0.19 25);
  --error-dark: oklch(0.48 0.17 25);
  --error-tint: oklch(0.97 0.015 25);
  --radius: 12px;
  --radius-lg: 16px;
  --shadow-card: 0 2px 12px rgb(0 0 0 / 0.07);
  --font-head: 'Archivo', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-body: system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: var(--font-body); font-size: 16px; line-height: 1.6; color: var(--ink); background: var(--bg); }
h1, h2, h3 { font-family: var(--font-head); color: var(--ink); }
h1 { font-weight: 800; font-size: 2rem; line-height: 1.12; letter-spacing: -0.02em; margin: 0 0 0.5rem; text-wrap: pretty; }
h2 { font-weight: 700; font-size: 1.5rem; line-height: 1.2; margin: 0 0 0.5rem; }
h3 { font-weight: 700; font-size: 1.1875rem; line-height: 1.25; margin: 0; }
a { color: var(--brand); }
.icon { width: 22px; height: 22px; }

/* ---------- Site header ---------- */
.site-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 0.875rem 1.25rem; background: var(--card); border-bottom: 1px solid var(--tint); }
.wordmark { font-family: var(--font-head); font-weight: 800; font-size: 1rem; letter-spacing: -0.01em; color: var(--brand-dark); text-decoration: none; }
.wordmark .dot { color: var(--accent); }
.site-header .tag { font-size: 0.75rem; color: var(--muted); }
.advertorial-chip { font-family: ui-monospace, Menlo, monospace; font-weight: 600; font-size: 0.625rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); border: 1px solid var(--line); padding: 3px 8px; border-radius: 4px; }

/* ---------- LP Type A ---------- */
.lp-a .hero-band { background: linear-gradient(var(--tint), var(--bg)); padding: 1.625rem 1.25rem 0.5rem; }
.lp-a .hero-copy { max-width: 640px; margin: 0 auto; }
.lp-a .sub { font-size: 1rem; line-height: 1.5; color: var(--ink); margin: 0.625rem 0 0; }
.lp-a .zip-wrap { padding: 0.875rem 1rem 0.25rem; max-width: 640px; margin: 0 auto; width: 100%; }
.lp-a .hero-illo { display: none; }

.trust-bullets { list-style: none; display: flex; flex-direction: column; gap: 0.5625rem; padding: 1rem 1.5rem 0.5rem; margin: 0 auto; max-width: 640px; }
.trust-bullets li { display: flex; align-items: center; gap: 0.625rem; font-size: 0.875rem; font-weight: 500; }
.trust-bullets .bullet-ic { width: 20px; height: 20px; border-radius: 50%; background: var(--tint-strong); color: var(--brand); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.trust-bullets .bullet-ic .icon { width: 12px; height: 12px; }

.below-fold { margin: 1.125rem auto 0; padding: 1.25rem; background: var(--card); border: 1px solid var(--tint); border-radius: 14px; max-width: 600px; width: calc(100% - 2.5rem); }
.below-fold h2 { font-size: 1.0625rem; margin: 0 0 0.75rem; }
.hiw-steps { display: flex; flex-direction: column; gap: 0.75rem; }
.hiw-step { display: flex; gap: 0.6875rem; align-items: flex-start; }
.hiw-step .n { width: 22px; height: 22px; border-radius: 50%; background: var(--tint); color: var(--brand-dark); font: 700 0.75rem var(--font-head); display: flex; align-items: center; justify-content: center; flex: none; }
.hiw-step .h { font-weight: 600; font-size: 0.875rem; }
.hiw-step .b { font-size: 0.8125rem; line-height: 1.5; color: var(--muted); }

.reassure-line { padding: 1rem 1.5rem; text-align: center; font-size: 0.78rem; color: var(--muted); max-width: 640px; margin: 0 auto; }

/* ---------- ZIP card + quiz (shared component) ---------- */
.zip-card { background: var(--card); color: var(--ink); border-radius: var(--radius-lg); padding: 1.5rem; box-shadow: var(--shadow-card); }
.zip-card .q-title { font-family: var(--font-head); font-weight: 700; font-size: 1.1875rem; line-height: 1.25; }
.zip-card .q-sub { font-size: 0.84rem; color: var(--muted); margin: 0.25rem 0 0; }
.zip-form label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.zip-form input { width: 100%; margin-top: 1rem; padding: 0.875rem 1rem; font-size: 1.125rem; font-weight: 600; letter-spacing: 0.04em; border: 1.5px solid var(--line); border-radius: var(--radius); outline: none; color: var(--ink); }
.zip-form input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--tint-strong); }
.zip-form input.invalid { border-color: var(--error); background: var(--error-tint); }
.zip-error { display: flex; align-items: center; gap: 6px; font-size: 0.8125rem; font-weight: 600; color: var(--error-dark); margin: 0.4375rem 0 0; }
.zip-error[hidden] { display: none; }
.zip-error::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--error); flex: none; }
.btn-primary { width: 100%; margin-top: 0.75rem; padding: 0.9375rem; background: var(--brand); color: #fff; border: none; border-radius: var(--radius); font-family: var(--font-head); font-weight: 700; font-size: 1rem; cursor: pointer; }
.btn-primary:hover { background: var(--brand-dark); }
.btn-primary:disabled { opacity: 0.55; cursor: default; }
.zip-reassure { display: flex; align-items: center; gap: 7px; margin-top: 0.75rem; justify-content: center; font-size: 0.75rem; color: var(--muted); }
.zip-reassure .bullet-ic { width: 14px; height: 14px; border-radius: 50%; background: var(--tint-strong); flex: none; }

/* Quiz steps (injected by quiz.js into the zip card) */
.quiz-top { display: flex; justify-content: space-between; align-items: center; }
.quiz-back { background: none; border: none; color: var(--muted); font-size: 0.8125rem; cursor: pointer; padding: 0; font-family: var(--font-body); }
.quiz-back:hover { color: var(--brand); }
.quiz-count { font: 600 0.75rem ui-monospace, Menlo, monospace; color: var(--muted); }
.quiz-progress { height: 4px; background: var(--tint); border-radius: 2px; margin-top: 0.625rem; overflow: hidden; }
.quiz-progress-bar { height: 100%; background: var(--accent); border-radius: 2px; transition: width 0.25s ease; }
.quiz-step h3 { margin-top: 1rem; }
.quiz-options { display: flex; flex-direction: column; gap: 0.625rem; margin-top: 0.875rem; }
.quiz-option { display: flex; align-items: center; gap: 0.75rem; width: 100%; text-align: left; min-height: 56px; padding: 0.625rem 0.75rem; background: var(--card); border: 1.5px solid var(--line); border-radius: var(--radius); font-family: var(--font-body); font-size: 1rem; font-weight: 600; color: var(--ink); cursor: pointer; }
.quiz-option:hover { border-color: var(--brand); background: var(--tint); }
.quiz-option.selected { border: 2px solid var(--brand); background: var(--tint); }
.quiz-option .opt-ic { position: relative; width: 40px; height: 40px; border-radius: 10px; background: var(--tint); color: var(--brand); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.quiz-option .opt-badge { position: absolute; right: -5px; bottom: -5px; background: var(--brand); color: #fff; font: 700 0.5625rem var(--font-head); padding: 1px 4px; border-radius: 5px; }
.quiz-option .opt-label { flex: 1; }
.quiz-option .opt-chev { color: var(--brand); font-weight: 700; }

/* Matching interstitial (spec 09) */
.quiz-interstitial { text-align: center; padding: 0.625rem 0 0.5rem; }
.quiz-interstitial .q-title { margin: 0; }
.quiz-interstitial .q-sub { margin-top: 0.375rem; }
.inter-progress { height: 5px; background: var(--tint); border-radius: 3px; margin-top: 1.25rem; overflow: hidden; }
.inter-bar { height: 100%; width: 0%; background: var(--accent); border-radius: 3px; transition: width 1.2s ease-out; }

/* ---------- LP Type B ---------- */
.lp-b .guide { max-width: 680px; margin: 0 auto; padding: 1.5rem 1.375rem 3rem; }
.lp-b .guide-meta { font-size: 0.78rem; color: var(--muted); margin: 0.5rem 0 0; }
.lp-b .guide-hero { width: 100%; border-radius: var(--radius); margin-top: 0.875rem; display: block; }
.lp-b .guide-intro { font-size: 1.0625rem; line-height: 1.7; }
.lp-b p { font-size: 1rem; line-height: 1.7; }
.guide-section { margin: 2rem 0; }
.guide-section .section-illo { width: 100%; border-radius: var(--radius); margin-top: 0.75rem; display: block; }
.lp-b .quiz-panel { margin: 1.5rem 0; padding: 1.25rem; background: var(--tint); border-radius: var(--radius-lg); }
.lp-b .quiz-panel .zip-card { box-shadow: none; background: transparent; padding: 0; border-radius: 0; }
.lp-b .quiz-panel .zip-form input { border-color: #fff; background: #fff; }
.lp-b .quiz-panel .zip-form input:focus { border-color: var(--brand); }
.quiz-block-label { font-family: var(--font-head); font-weight: 700; font-size: 1.0625rem; color: var(--ink); margin: 0 0 0.25rem; }

/* Desktop */
@media (min-width: 960px) {
  h1 { font-size: 2.75rem; line-height: 1.1; }
  .site-header { padding: 1rem 2.25rem; }
  .site-header .tag { font-size: 0.8125rem; }
  .lp-a .hero-band { padding: 2.75rem 2.25rem; }
  .lp-a .hero-grid { display: grid; grid-template-columns: 1.15fr 400px; gap: 2.75rem; max-width: 1120px; margin: 0 auto; align-items: start; }
  .lp-a .hero-copy { max-width: 520px; margin: 0; }
  .lp-a .sub { font-size: 1.0625rem; max-width: 480px; }
  .lp-a .hero-illo { display: block; margin-top: 1.625rem; max-width: 480px; border-radius: 14px; }
  .lp-a .hero-trust { padding: 1.375rem 0 0; max-width: none; }
  .lp-a .zip-wrap { padding: 0; margin: 0; }
  .lp-a .trust-mobile { display: none; }
  .lp-b .guide-cols { display: grid; grid-template-columns: 1fr 320px; gap: 1.5rem; max-width: 1040px; margin: 0 auto; padding: 1.5rem 1.375rem 3rem; align-items: start; }
  .lp-b .guide-cols .guide { padding: 0; }
  .lp-b .sticky-rail { position: sticky; top: 24px; }
  .lp-b .quiz-panel.repeat-mid { display: none; }
}
@media (max-width: 959.98px) {
  .lp-a .hero-trust { display: none; }
  .lp-b .sticky-rail { display: none; }
}

/* ---------- LP Type C (design round 2 addendum) ----------
   Band rhythm: 28px mobile / 56px desktop vertical padding; hero + closer get
   extra breathing room. Backgrounds cycle white / --tint / --bg with
   --brand-dark appearing exactly twice (phone panel + closer). */
.lp-c .c-wrap { max-width: 1080px; margin: 0 auto; padding-left: 1.25rem; padding-right: 1.25rem; }
.lp-c .c-band { padding-top: 1.75rem; padding-bottom: 1.75rem; }
.lp-c .c-band-tint { background: var(--tint); }
.lp-c h2 { font-size: 1.375rem; letter-spacing: -0.01em; margin: 0; }

/* hero */
.lp-c .c-hero { background: linear-gradient(var(--tint), var(--bg)); padding: 1.5rem 0 1.25rem; }
.lp-c .c-eyebrow { display: block; font: 700 0.84rem var(--font-head); letter-spacing: 0.02em; color: var(--brand-dark); }
.lp-c .c-hero h1 { margin: 0.875rem 0 0; }
.lp-c .c-sub { font-size: 1rem; line-height: 1.5; margin: 0.625rem 0 0; }
.lp-c .c-hero-card { margin-top: 1rem; }
.lp-c .c-hero-extras { display: none; }

/* stat bar */
/* one row of equal columns at every count (3 tiles ships today) */
.lp-c .c-stats { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 0.5rem; }
.lp-c .c-stats-mobile { padding: 1.25rem 1.25rem 0.375rem; max-width: 1080px; margin: 0 auto; }
.lp-c .c-stat { background: var(--tint); border-radius: var(--radius); padding: 1rem 0.5rem; text-align: center; }
.lp-c .c-stat-v { font-family: var(--font-head); font-weight: 800; font-size: 1.25rem; letter-spacing: -0.02em; color: var(--brand-dark); }
.lp-c .c-stat-l { font-size: 0.72rem; font-weight: 600; margin-top: 3px; line-height: 1.35; }

/* benefits */
.lp-c .c-benefit-grid { display: flex; flex-direction: column; gap: 1rem; margin-top: 1rem; }
.lp-c .c-benefit { display: flex; gap: 0.8125rem; align-items: flex-start; }
.lp-c .c-benefit-ic { width: 40px; height: 40px; border-radius: 10px; background: var(--tint); color: var(--brand); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.lp-c .c-benefit-h { font-family: var(--font-head); font-weight: 700; font-size: 1rem; }
.lp-c .c-benefit-b { font-size: 0.84rem; line-height: 1.5; color: var(--muted); margin-top: 2px; }

/* re-pitch anatomy (spec C3 rule ④: kicker + headline + sub + chips + card) */
.lp-c .c-kicker { font: 700 0.84rem var(--font-head); letter-spacing: 0.02em; color: var(--brand-dark); }
.lp-c .c-repitch-h { font-weight: 800; font-size: 1.5625rem; line-height: 1.15; letter-spacing: -0.02em; margin: 0.5rem 0 0; text-wrap: pretty; }
.lp-c .c-repitch-sub { font-size: 0.9rem; line-height: 1.55; margin: 0.5rem 0 0; }
.lp-c .c-repitch .zip-card { margin-top: 1rem; }
.lp-c .c-card-outline { margin-top: 1rem; }
.lp-c .c-card-outline .zip-card { border: 1.5px solid var(--tint-strong); box-shadow: 0 2px 12px rgb(0 0 0 / 0.05); }
/* quiz-open state (spec C3): furniture recedes while the quiz runs */
.lp-c [data-quiz-band] .c-furniture { transition: opacity 0.2s ease; }
.lp-c [data-quiz-band].quiz-active .c-furniture { opacity: 0.45; }

/* comparison */
.lp-c .c-compare-grid { display: flex; flex-direction: column; gap: 0.75rem; margin-top: 1rem; }
.lp-c .c-compare-old { border: 1px solid var(--line); border-radius: 14px; padding: 1.125rem; }
.lp-c .c-compare-new { background: var(--tint); border-radius: 14px; padding: 1.125rem; }
.lp-c .c-compare-t { font-family: var(--font-head); font-weight: 700; font-size: 0.9375rem; color: var(--muted); margin-bottom: 0.625rem; }
.lp-c .c-compare-new .c-compare-t { color: var(--brand-dark); }
.lp-c .c-row { display: flex; gap: 9px; align-items: flex-start; font-size: 0.875rem; line-height: 1.45; color: var(--muted); margin-top: 0.5625rem; }
.lp-c .c-row:first-of-type { margin-top: 0; }
.lp-c .c-row-strong { font-weight: 500; color: var(--ink); }
.lp-c .c-x { font-weight: 700; font-size: 0.8125rem; flex: none; margin-top: 1px; }
.lp-c .c-check { width: 16px; height: 16px; border-radius: 50%; background: var(--accent); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex: none; margin-top: 2px; }
.lp-c .c-check .icon { width: 10px; height: 10px; }

/* process */
.lp-c .c-steps { display: flex; flex-direction: column; margin-top: 1rem; }
.lp-c .c-step { display: flex; gap: 0.8125rem; align-items: stretch; }
.lp-c .c-step-rail { display: flex; flex-direction: column; align-items: center; flex: none; }
.lp-c .c-step-n { width: 26px; height: 26px; border-radius: 50%; background: var(--card); border: 2px solid var(--brand); color: var(--brand-dark); font: 700 0.8125rem var(--font-head); display: flex; align-items: center; justify-content: center; flex: none; }
.lp-c .c-step-line { width: 2px; flex: 1; background: var(--tint-strong); }
.lp-c .c-step-body { padding-bottom: 1.125rem; }
.lp-c .c-step-h { font-family: var(--font-head); font-weight: 700; font-size: 1rem; margin-top: 2px; }
.lp-c .c-step-b { font-size: 0.84rem; line-height: 1.5; margin-top: 3px; }

/* faq + phone */
.lp-c .c-faqband { background: var(--bg); }
.lp-c .c-faq-item { border-bottom: 1px solid var(--line); }
.lp-c .c-faq-q { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 0.9375rem 0; font-family: var(--font-head); font-weight: 700; font-size: 0.96875rem; cursor: pointer; list-style: none; }
.lp-c .c-faq-q::-webkit-details-marker { display: none; }
.lp-c .c-faq-q::after { content: '+'; font-family: var(--font-head); font-weight: 700; font-size: 1.125rem; color: var(--brand); flex: none; }
.lp-c .c-faq-item[open] .c-faq-q::after { content: '−'; }
.lp-c .c-faq-a { font-size: 0.84rem; line-height: 1.55; padding-bottom: 0.9375rem; }
.lp-c .c-phone { background: var(--brand-dark); border-radius: var(--radius-lg); padding: 1.5rem; text-align: center; margin-top: 1.25rem; }
.lp-c .c-phone-h { font-family: var(--font-head); font-weight: 800; font-size: 1.3125rem; letter-spacing: -0.01em; color: #fff; }
.lp-c .c-phone p { margin: 7px 0 0; font-size: 0.84rem; line-height: 1.55; color: var(--tint-strong); }
.lp-c .c-phone-btn { display: inline-flex; align-items: center; gap: 9px; margin-top: 0.875rem; padding: 13px 22px; background: #fff; color: var(--brand-dark); border-radius: var(--radius); font-family: var(--font-head); font-weight: 800; font-size: 1.0625rem; letter-spacing: 0.02em; text-decoration: none; }
.lp-c .c-phone-btn .icon { width: 18px; height: 18px; }
.lp-c .c-phone-note { font-size: 0.72rem; color: var(--tint-strong); margin-top: 9px; opacity: 0.85; }

/* closer */
.lp-c .c-closer { background: var(--brand-dark); padding-top: 2rem; padding-bottom: 1.75rem; }
.lp-c .c-closer-h { font-weight: 800; font-size: 1.75rem; line-height: 1.12; letter-spacing: -0.02em; color: #fff; margin: 0; text-wrap: pretty; }
.lp-c .c-closer-sub { margin: 9px 0 0; font-size: 0.9375rem; line-height: 1.55; color: var(--tint-strong); }
.lp-c .c-closer .zip-card { margin-top: 1rem; box-shadow: 0 4px 20px rgb(0 0 0 / 0.18); }
.lp-c .c-closer-bullets { list-style: none; display: flex; flex-direction: column; gap: 0.5rem; margin: 1rem 0 0; padding: 0; }
.lp-c .c-closer-bullets li { display: flex; align-items: center; gap: 9px; font-size: 0.84rem; font-weight: 500; color: #fff; }
.lp-c .c-bullets-desktop { display: none; }

/* in-card contact flow + thank-you (Type C, no redirects) */
.c-contact h3 { margin-top: 1rem; }
.c-contact .contact-grid { margin-top: 0.875rem; }
.c-contact .btn-primary { margin-top: 0.875rem; }
.c-contact .q-sub { margin-top: 0.25rem; }
.c-thanks { text-align: center; padding: 0.5rem 0; }
.c-thanks h3 { margin-top: 0.875rem; }
.c-thanks .q-sub { margin-top: 0.5rem; }

/* sticky mobile CTA bar (spec C3): off-screen by default, JS toggles data-visible */
.lp-c .c-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 10px 16px calc(12px + env(safe-area-inset-bottom)); background: var(--card); border-top: 1px solid var(--line); box-shadow: 0 -4px 16px rgb(0 0 0 / 0.08); transform: translateY(110%); transition: transform 0.15s ease; }
.lp-c .c-sticky[data-visible] { transform: translateY(0); }
.lp-c .c-sticky-label { font-family: var(--font-head); font-weight: 700; font-size: 0.9375rem; line-height: 1.2; }
.lp-c .c-sticky-btn { flex: none; min-height: 44px; padding: 12px 18px; background: var(--brand); color: #fff; border: none; border-radius: 11px; font-family: var(--font-head); font-weight: 700; font-size: 0.90625rem; cursor: pointer; }
.lp-c .c-sticky-btn:hover { background: var(--brand-dark); }

@media (min-width: 960px) {
  .lp-c .c-wrap { padding-left: 2.25rem; padding-right: 2.25rem; }
  .lp-c .c-band { padding-top: 3.5rem; padding-bottom: 3.5rem; }
  .lp-c h2 { font-size: 1.875rem; letter-spacing: -0.02em; }
  .lp-c .c-hero { padding: 3.25rem 0 2.75rem; }
  .lp-c .c-hero-grid { display: grid; grid-template-columns: 1fr 400px; gap: 3.5rem; align-items: start; }
  .lp-c .c-hero h1 { margin-top: 1rem; }
  .lp-c .c-sub { font-size: 1.0625rem; max-width: 480px; }
  .lp-c .c-hero-card { margin-top: 0; position: sticky; top: 24px; }
  /* stat bar + chips fold into the hero's left column on desktop (C2 note ①) */
  .lp-c .c-hero-extras { display: block; max-width: 560px; }
  .lp-c .c-hero-extras .c-stats { margin-top: 1.75rem; gap: 0.75rem; }
  .lp-c .c-hero-extras .c-stat { background: var(--card); border: 1px solid var(--tint-strong); }
  .lp-c .c-stat-v { font-size: 1.375rem; }
  .lp-c .c-stat-l { font-size: 0.75rem; }
  .lp-c .c-stats-mobile { display: none; }
  .lp-c .c-benefit-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; margin-top: 1.625rem; }
  .lp-c .c-benefit { flex-direction: column; }
  .lp-c .c-repitch-grid { display: grid; grid-template-columns: 1fr 400px; gap: 3.5rem; align-items: center; }
  .lp-c .c-repitch-h { font-size: 2rem; }
  .lp-c .c-repitch-sub { font-size: 1rem; max-width: 480px; }
  .lp-c .c-repitch .zip-card { margin-top: 0; }
  /* re-pitch #2: the one symmetric moment on the page (C2 note ③) */
  .lp-c .c-repitch-center .c-repitch2-inner { display: flex; flex-direction: column; align-items: center; text-align: center; }
  .lp-c .c-repitch-center .c-repitch-h { max-width: 640px; }
  .lp-c .c-repitch-center .c-repitch-sub { max-width: 520px; }
  .lp-c .c-repitch-center .c-card-outline { width: 400px; text-align: left; margin-top: 1.5rem; }
  .lp-c .c-compare-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-top: 1.625rem; }
  .lp-c .c-compare-old, .lp-c .c-compare-new { padding: 1.625rem 1.75rem; border-radius: var(--radius-lg); }
  .lp-c .c-row { font-size: 0.9375rem; margin-top: 0.75rem; }
  /* process becomes 4 cards (C2) */
  .lp-c .c-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; margin-top: 1.625rem; }
  .lp-c .c-step { display: block; background: var(--card); border-radius: 14px; padding: 1.375rem; }
  .lp-c .c-step-rail { display: block; }
  .lp-c .c-step-line { display: none; }
  .lp-c .c-step-body { padding-bottom: 0; }
  .lp-c .c-step-h { margin-top: 0.75rem; }
  .lp-c .c-faq-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 3.5rem; align-items: start; }
  .lp-c .c-faq-a { font-size: 0.90625rem; }
  .lp-c .c-phone { position: sticky; top: 24px; padding: 1.875rem; margin-top: 0; }
  .lp-c .c-closer { padding-top: 4rem; padding-bottom: 4rem; }
  .lp-c .c-closer-grid { display: grid; grid-template-columns: 1fr 400px; gap: 3.5rem; align-items: center; }
  .lp-c .c-closer-h { font-size: 2.375rem; }
  .lp-c .c-closer-sub { font-size: 1.0625rem; max-width: 440px; }
  .lp-c .c-closer .zip-card { margin-top: 0; }
  .lp-c .c-bullets-desktop { display: flex; margin-top: 1.375rem; }
  .lp-c .c-bullets-mobile { display: none; }
  .lp-c .c-sticky { display: none; }
}

/* ---------- Home page ----------
   Renders as .lp-c .lp-home so it inherits the whole Type C band system (wrap,
   band, hero gradient, steps, benefits, FAQ, dark closer). Only the service
   grid and the two link-styled CTAs are new. */
.lp-home .home-cta { display: inline-block; width: auto; text-decoration: none; text-align: center; padding: 0.9375rem 1.75rem; margin-top: 1.25rem; }
.lp-home .home-trust { padding: 1.25rem 0 0; margin: 0; max-width: none; }
.lp-home .home-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.625rem; margin-top: 1.25rem; }
.lp-home .home-svc { display: flex; align-items: center; gap: 0.625rem; background: var(--card); border: 1px solid var(--tint-strong); border-radius: 12px; padding: 0.875rem; text-decoration: none; color: var(--ink); font-family: var(--font-head); font-weight: 700; font-size: 0.84rem; line-height: 1.25; }
.lp-home .home-svc:hover { border-color: var(--brand); box-shadow: var(--shadow-card); }
.lp-home .home-svc-ic { width: 34px; height: 34px; border-radius: 9px; background: var(--tint); color: var(--brand); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.lp-home .home-svc-ic .icon { width: 19px; height: 19px; }
/* band rhythm: bg → tint → white → bg → dark closer */
.lp-home .home-plainly { background: var(--card); }
.lp-home .home-faq { margin-top: 1rem; }
.lp-home .home-closer-btn { margin-top: 1.5rem; }

@media (min-width: 960px) {
  /* No hero form card on this page, so the page centres on its own axis
     instead of inheriting Type C's left-copy / right-card asymmetry. */
  .lp-home .c-wrap { text-align: center; }
  .lp-home .c-sub { max-width: 620px; margin-left: auto; margin-right: auto; }
  .lp-home .c-hero { padding: 3.75rem 0 3rem; }
  .lp-home .c-hero h1 { font-size: 2.75rem; max-width: 900px; margin-left: auto; margin-right: auto; }
  .lp-home .home-trust { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 1.75rem; padding-top: 1.75rem; }
  .lp-home .home-grid { grid-template-columns: repeat(4, 1fr); gap: 0.875rem; margin-top: 1.75rem; text-align: left; }
  .lp-home .home-svc { font-size: 0.9375rem; padding: 1.125rem; gap: 0.75rem; }
  .lp-home .c-steps { grid-template-columns: repeat(3, 1fr); text-align: left; }
  .lp-home .c-benefit-grid { text-align: left; }
  .lp-home .home-faq { max-width: 780px; margin: 1.5rem auto 0; text-align: left; }
  .lp-home .c-closer-sub { max-width: 620px; margin-left: auto; margin-right: auto; }
}

/* ---------- Contact step ---------- */
.contact-page { max-width: 480px; margin: 0 auto; padding: 1.75rem 1.25rem 3rem; }
.contact-card { background: var(--card); border-radius: var(--radius-lg); padding: 1.5rem; box-shadow: var(--shadow-card); }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.625rem; margin-top: 0.875rem; }
.contact-grid input { min-width: 0; padding: 0.75rem 0.875rem; font-size: 0.9375rem; font-family: var(--font-body); border: 1.5px solid var(--line); border-radius: 10px; outline: none; color: var(--ink); }
.contact-grid input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--tint-strong); }
.contact-grid .span2 { grid-column: 1 / -1; }
.field-error { display: flex; align-items: center; gap: 6px; color: var(--error-dark); font-size: 0.8125rem; font-weight: 600; margin: 0.5rem 0 0; }
.field-error::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--error); flex: none; }
.field-error[hidden] { display: none; }
.addr-wrap { position: relative; }
.addr-wrap input { width: 100%; box-sizing: border-box; }
.addr-suggest { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 20; display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow-card); overflow: hidden; }
.addr-suggest[hidden] { display: none; }
.addr-option { text-align: left; padding: 0.625rem 0.875rem; background: none; border: none; border-bottom: 1px solid var(--tint); font-family: var(--font-body); font-size: 0.875rem; color: var(--ink); cursor: pointer; }
.addr-option:last-child { border-bottom: none; }
.addr-option:hover { background: var(--tint); }
.consent-box { display: flex; gap: 0.625rem; margin-top: 0.875rem; padding: 0.75rem; background: var(--bg); border: 1px solid var(--line); border-radius: 10px; }
.consent-box input[type='checkbox'] { margin-top: 1px; width: 18px; height: 18px; flex-shrink: 0; accent-color: var(--brand); }
.consent-text { font-size: 0.75rem; line-height: 1.55; color: oklch(0.33 0.015 250); }
.consent-text a { color: inherit; }

/* ---------- Thank-you (spec 08) ---------- */
.thanks-page { max-width: 480px; margin: 0 auto; padding: 1.25rem 1rem 2rem; }
.thanks-card { background: var(--card); border-radius: var(--radius-lg); padding: 1.75rem 1.5rem; box-shadow: var(--shadow-card); text-align: center; }
.thanks-check { width: 56px; height: 56px; border-radius: 50%; background: var(--tint-strong); color: var(--brand); display: inline-flex; align-items: center; justify-content: center; }
.thanks-check .icon { width: 28px; height: 28px; }
.thanks-card h1 { font-size: 1.625rem; margin: 0.875rem 0 0; }
.thanks-card p { font-size: 0.9375rem; line-height: 1.6; margin: 0.5rem 0 0; }
.thanks-next { margin-top: 1.125rem; padding: 1.25rem; background: var(--card); border: 1px solid var(--tint); border-radius: 14px; }
.thanks-next h2 { font-size: 1.0625rem; margin: 0 0 0.75rem; }
.thanks-exit { padding: 1.125rem 1.5rem; text-align: center; font-size: 0.8125rem; color: var(--muted); }

/* ---------- Legal + opt-out ---------- */
.legal-page { max-width: 680px; margin: 0 auto; padding: 2rem 1.25rem 3rem; }
.legal-page h1 { font-size: 1.6rem; }

/* ---------- Footer ---------- */
.site-footer { background: #232830; color: #9aa1ab; margin-top: 2rem; padding: 1.25rem 1.25rem 2rem; font-size: 0.72rem; line-height: 1.6; }
/* Type C ends on the dark closer band — no gap strip above the footer */
.lp-c ~ .site-footer { margin-top: 0; }
.site-footer .footer-inner { max-width: 680px; margin: 0 auto; }
.footer-links { text-align: center; margin: 0 0 0.625rem; }
.footer-links a { color: #c6ccd4; }
.footer-note { margin: 0; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .quiz-progress-bar, .inter-bar { transition: none; }
}

/* ---------- Admin (unchanged system) ---------- */
.admin-body { background: #f2f4f6; }
.admin-shell { max-width: 1200px; margin: 0 auto; padding: 1rem 1.25rem 3rem; }
.admin-nav { display: flex; flex-wrap: wrap; gap: 1rem; padding: 0.75rem 0; border-bottom: 1px solid #dde3e8; margin-bottom: 1.25rem; align-items: center; }
.admin-nav a { text-decoration: none; font-weight: 600; color: var(--muted); }
.admin-nav a.active, .admin-nav a:hover { color: var(--brand); }
.admin-nav .brand { font-weight: 800; color: var(--ink); margin-right: 0.5rem; }
table.admin-table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06); font-size: 0.9rem; }
.admin-table th { text-align: left; background: #eef1f4; padding: 0.55rem 0.75rem; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); }
.admin-table td { padding: 0.55rem 0.75rem; border-top: 1px solid #f0f2f5; }
.admin-table tr:hover td { background: #fafbfc; }
.badge { display: inline-block; padding: 0.15rem 0.5rem; border-radius: 99px; font-size: 0.75rem; font-weight: 700; }
.badge-live { background: #d9f2e5; color: #0b6b45; }
.badge-draft { background: #fdf1d6; color: #8a6410; }
.badge-retired { background: #e8e8e8; color: #666; }
.badge-delivered { background: #d9f2e5; color: #0b6b45; }
.badge-pending { background: #fdf1d6; color: #8a6410; }
.badge-failed { background: #fadbd8; color: #a93226; }
.badge-suppressed { background: #e8e8e8; color: #666; }
.admin-filters { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-bottom: 1rem; align-items: flex-end; }
.admin-filters label { font-size: 0.75rem; font-weight: 700; color: var(--muted); display: block; }
.admin-filters input, .admin-filters select { padding: 0.4rem 0.5rem; border: 1px solid #cfd6dc; border-radius: 6px; font-size: 0.9rem; }
.btn-secondary { background: #fff; border: 1px solid #cfd6dc; border-radius: 6px; padding: 0.4rem 0.8rem; font-size: 0.85rem; cursor: pointer; font-weight: 600; color: var(--ink); text-decoration: none; display: inline-block; }
.btn-secondary:hover { border-color: var(--brand); color: var(--brand); }
.btn-danger { background: #fff; border: 1px solid #e4b6b0; color: #a93226; border-radius: 6px; padding: 0.4rem 0.8rem; font-size: 0.85rem; cursor: pointer; font-weight: 600; }
.cards-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1.5rem; }
.stat-card { background: #fff; border-radius: 8px; padding: 0.9rem 1rem; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06); }
.stat-card .num { font-size: 1.6rem; font-weight: 800; }
.stat-card .lbl { font-size: 0.78rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.04em; }
.admin-section { margin-bottom: 2rem; }
.lint-panel { background: #fff; border: 1px solid #e4e9ec; border-radius: 8px; padding: 0.9rem; margin: 1rem 0; }
.lint-finding { color: var(--error); font-size: 0.85rem; margin: 0.25rem 0; }
.lint-clean { color: #0b6b45; font-weight: 700; }
.editor-field { margin-bottom: 1rem; }
.editor-field label { display: block; font-weight: 700; font-size: 0.8rem; color: var(--muted); margin-bottom: 0.3rem; }
.editor-field input, .editor-field textarea { width: 100%; padding: 0.55rem 0.65rem; border: 1px solid #cfd6dc; border-radius: 6px; font-size: 0.92rem; font-family: inherit; }
.editor-field textarea { min-height: 90px; }
.mono { font-family: ui-monospace, Menlo, monospace; font-size: 0.82rem; }
.muted { color: var(--muted); }
.dropoff-bar { background: var(--brand); height: 14px; border-radius: 3px; }
.dropoff-row { display: grid; grid-template-columns: 160px 1fr 60px; gap: 0.6rem; align-items: center; font-size: 0.85rem; margin: 0.3rem 0; }
