/* brand-vars.css · contract v1.0 · generator v1.0.0 · saved 2026-10-30T17:42:14+00:00 · DO NOT EDIT (generated from Brand Standards fields) */

:root {

  /* ── Brand color ramp — 500/600/700 ratified anchors; rest interpolated ── */
  --color-brand-50: #fbfcfb;
  --color-brand-100: #f6f8f6;
  --color-brand-200: #ecefea;
  --color-brand-300: #dee4db;
  --color-brand-400: #cad4c6;
  --color-brand-500: #a7b7a0;
  --color-brand-600: #263d33;
  --color-brand-700: #263d33;
  --color-brand-800: #192821;
  --color-brand-900: #0d1512;

  /* ── Ink ramp — derived from single anchor ── */
  --color-ink-50: #f8f9f9;
  --color-ink-100: #eeefef;
  --color-ink-200: #dce0de;
  --color-ink-300: #c2c9c6;
  --color-ink-400: #a4aea9;
  --color-ink-500: #88948f;
  --color-ink-600: #6b7b74;
  --color-ink-700: #51645c;
  --color-ink-800: #3c5047;
  --color-ink-900: #263d33;
  --color-ink-950: #192821;

  /* ── Surfaces (light base; stone photography reads bright) ── */
  --color-surface-base: #ffffff;
  --color-surface:      #ffffff;
  --color-surface-2:    #f8f9f9;
  --color-surface-3:    #eeefef;
  --color-border:       #dce0de;
  --color-border-faint: #eeefef;

  /* ── Interaction states (hover / active — see Derivation::states() for the rule) ── */
  --color-brand-btn-default: #263d33;
  --color-brand-btn-hover: #263d33;
  --color-brand-btn-active: #192821;
  --color-brand-link: #263d33;
  --color-brand-link-hover: #263d33;
  --color-brand-on-dark: #a7b7a0;
  --color-brand-on-dark-hover: #cad4c6;

  /* ── Typography (§7 allowlist; full stacks with system fallbacks) ── */
  --font-display: "Lato", Arial, sans-serif;
  --font-body:    "Lato", Arial, sans-serif;
  --font-accent:  var(--font-display);
  --font-mono:    ui-monospace, 'SF Mono', Menlo, monospace;

  /* ── Type ladder (§6) — clamp() fluid tokens, correct by construction ── */
  --text-h1: clamp(1.5428rem, 1.2276rem + 1.5759vw, 2.4883rem);  /* line-height: 1.10 */
  --text-h2: clamp(1.3686rem, 1.1336rem + 1.175vw, 2.0736rem);  /* line-height: 1.12 */
  --text-h3: clamp(1.2442rem, 1.0829rem + 0.8064vw, 1.728rem);  /* line-height: 1.15 */
  --text-h4: clamp(1.1232rem, 1.0176rem + 0.528vw, 1.44rem);  /* line-height: 1.20 */
  --text-h5: clamp(1.02rem, 0.96rem + 0.3vw, 1.2rem);  /* line-height: 1.25 */
  --text-h6: clamp(0.9859rem, 0.9494rem + 0.1826vw, 1.0954rem);  /* line-height: 1.30 */
  --text-body-lg: clamp(0.95rem, 0.8917rem + 0.2917vw, 1.125rem);  /* line-height: 1.55 */
  --text-body: 1rem;  /* line-height: 1.60 */
  --text-small: 0.875rem;  /* line-height: 1.50 */
  --text-caption: 0.75rem;  /* line-height: 1.40 */

  /* ── Radius personality: md ── */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-card: 8px;
  --radius-button: 6px;
  --radius-pill: 9999px;

  /* ── WCAG 2.1 verdicts for standard brand/ink pairs ──────────────── */
  /* WCAG: brand-600 on white — 11.68:1 | AA:PASS AA-large:PASS AAA:PASS */
  /* WCAG: brand-700 on white — 11.68:1 | AA:PASS AA-large:PASS AAA:PASS */
  /* WCAG: ink-900 on white — 11.68:1 | AA:PASS AA-large:PASS AAA:PASS */
  /* WCAG: white on brand-600 — 11.68:1 | AA:PASS AA-large:PASS AAA:PASS */
  /* WCAG: white on ink-900 — 11.68:1 | AA:PASS AA-large:PASS AAA:PASS */
  /* WCAG: brand-500 on ink-950 — 7.26:1 | AA:PASS AA-large:PASS AAA:PASS */
  /* WCAG: brand-700 on ink-900 — 1:1 | AA:FAIL AA-large:FAIL AAA:FAIL */
  /* WCAG: ink-900 on brand-50 — 11.36:1 | AA:PASS AA-large:PASS AAA:PASS */
  --color-surface-base: #F7F6F0;
  --color-surface-2: #DFE6D9;
  --color-surface-3: #F2DEDF;
  --color-secondary: #A63C58;
  --color-border: #C5CDC2;
  --color-text: #263D33;
  --text-hero: clamp(2.35rem, 4.7vw, 4.15rem);
  --text-section: clamp(1.85rem, 3.3vw, 2.75rem);
  --color-focus-ring: var(--color-brand-600);
}