/* ═══════════════════════════════════════════════════════════════════════════
   site.css: THE ADDITIONS FILE (boardCss.additionsFile). Every vendored sheet in public/css/ is the approved board byte-for-byte
   (scripts/check-board-css.mjs FAILS on one byte of drift); a rule the production site needs that the approved design does not
   carry lives HERE, with its reason, and is what the owner reviews at the gate. Tokens only (no new colours, faces or scales).
   T1, PHASE 2 wave B0, 2026-10-24.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ---------- 0. RUNBOOK PHASE 2 required tokens (aliases of the approved tokens; body overflow-x: clip is already base.css) ---------- */
:root { --header-height: var(--nav-h, 64px); --brand-accent: var(--dusty-blue); --color-primary-rgb: 25, 25, 25; }

/* ---------- 1. GBP H2s on the homepage (ARCHITECTURE §1, D3 APPROVED by the owner 2026-10-24) ----------
   Three approved sections carry their exact GBP category H2 IN THE APPROVED EYEBROW PILL SHELL, and their large voice line keeps
   the H2 look as a non-heading display <p>. The pill classes (A .v1-eyebrow, B .v1b-kicker) already set the pill's family, size,
   tracking, weight and line-height over the element h2 rule; these rules only undo the element-scoped h2 rules that would still
   reach a pill (B's max-width: 15em / 9em, the orbit's motion font-size) and give the display <p> the h2 metrics. */
[data-variant] h2.rv-gbp-h2 { max-width: none; text-wrap: nowrap; }
[data-variant="B"].v1b-phases .v1b-orbit-head h2.v1b-kicker.rv-gbp-h2,
html [data-variant="B"].v1b-phases .v1b-orbit-head h2.v1b-kicker.rv-gbp-h2 { max-width: none; font-size: var(--utility-size); line-height: 1.2; color: var(--fg-on-ink); }
.rv-h2-display { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: var(--h2-size); line-height: 1.0; letter-spacing: -0.02em; text-wrap: balance; }
.rv-h2-display em { font-style: italic; }
[data-variant="B"] .v1b-orbit-head .rv-h2-display { color: var(--fg-on-ink); max-width: 9em; }
@media (min-width: 1024px) {
  [data-variant="B"].v1b-phases:is(.rv-motion *) .v1b-orbit-head .rv-h2-display { font-size: clamp(44px, 4vw, 60px); }
}
/* the answer capsule under the display line (A bands; the orbit's capsule uses the approved .v1b-orbit-intro) */
[data-variant="A"] .rv-gbp-capsule { margin-top: 24px; max-width: 44ch; color: var(--fg-muted); }
[data-variant="A"] .rv-gbp-capsule a,
[data-variant="B"] .v1b-orbit-intro a { color: inherit; text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* ---------- 2. The SHORT veterans block in the condition router's veterans row (ARCHITECTURE §5, owner ruling 4) ----------
   It continues the row (same column as the row's description, the same muted body type) and sits OUTSIDE the row link (a link in a
   link is invalid HTML). Desktop: under the description column (5fr | 6fr | 56px row grid); 390: full width. */
/* the same column grid as the approved row (approved.css X1: 104px thumb | 5fr | 6fr | 56px; 3 columns when the peek replaces the
   thumbnails; 76px | 1fr | 48px at 390 with the description spanning the first two), so the block sits under the description */
[data-variant="A"] .rv-who-vet { display: grid; grid-template-columns: 104px minmax(0, 5fr) minmax(0, 6fr) 56px; column-gap: 32px; padding: 0 0 40px; margin-top: -16px; }
[data-variant="A"] .rv-who-vet > * { grid-column: 3; max-width: 52ch; }
@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
  [data-variant="A"]:is(.rv-motion *) .rv-who-vet { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr) 56px; }
  [data-variant="A"]:is(.rv-motion *) .rv-who-vet > * { grid-column: 2; }
}
[data-variant="A"] .rv-who-vet-p { color: var(--fg-muted); }
[data-variant="A"] .rv-who-vet-p + .rv-who-vet-p { margin-top: 12px; }
[data-variant="A"] .rv-who-vet a { color: var(--fg); text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; text-decoration-thickness: 1px; }
[data-variant="A"] .rv-who-vet-note { font-size: 14px; }
@media (max-width: 767.98px) {
  [data-variant="A"] .rv-who-vet { grid-template-columns: 76px minmax(0, 1fr) 48px; column-gap: 16px; padding-bottom: 30px; margin-top: -14px; }
  [data-variant="A"] .rv-who-vet > * { grid-column: 1 / 3; font-size: 16px; }
  [data-variant="A"] .rv-who-vet .rv-who-vet-note { font-size: 14px; }
}

/* ---------- 3. The folded towns on the location card (ARCHITECTURE §5, D1): one line per town inside the approved .v1-areas block ---------- */
[data-variant="A"] .rv-towns { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 24px; }
[data-variant="A"] .rv-town { break-inside: avoid; padding: 2px 0; }
[data-variant="A"] .rv-areas-counties { margin-top: 10px; }
@media (max-width: 767.98px) { [data-variant="A"] .rv-towns { columns: 1; } }

/* ---------- 3b. Authority links ([R14]: >= 1 external authority link on a money page) rendered in their slot as one sentence
   (authority_links[].lead + the linked .text), in the slot's own muted body type ---------- */
.rv-authority { color: var(--fg-muted); font-size: 15px; line-height: 1.6; }
.rv-authority a { color: var(--fg); text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* ---------- 4. SENTINEL pages (structure only, noindex; never deployed: deploy.mjs refuses them) ---------- */
.rv-sentinel { padding: calc(var(--nav-h, 72px) + 96px) 0 120px; background: var(--bg); }
.rv-sentinel-k { display: inline-flex; align-items: center; gap: 12px; font-family: var(--font-utility); font-weight: 600; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-muted); }
.rv-sentinel-k .rv-glyph { width: 26px; height: auto; }
.rv-sentinel-h1 { margin-top: 24px; font-family: var(--font-display); font-size: var(--h2-size); line-height: 1.04; max-width: 18em; }
.rv-sentinel-m { margin-top: 24px; font-family: var(--font-utility); font-size: 13px; letter-spacing: .14em; color: var(--fg-muted); }