/* ════════════════════════════════════════════════════════════════
   WRENBI — canonical token layer (single source of truth)
   ----------------------------------------------------------------
   This is the ONE place design tokens live. The firm homepage links
   it today; the Astro blog (PR-2) links the SAME file. Nothing
   inlines its own divergent copy — that's the anti-drift rule. See
   blog_design/handoff/design-system-notes.md.

   Scope = genuinely shared design-system tokens + the self-hosted
   font faces. Homepage-only tuning knobs (hero-meta optics, the
   word-cloud, the motion grammar) live next to their component CSS
   in home.css, not here — they aren't part of the shared system.

   Self-hosted Inter (latin subset) — no third-party request, per the
   N-640 privacy posture. Weights 400/500/700/900 are used by the
   homepage; 800 is the blog's display weight (additive — the homepage
   doesn't reference it).
   ════════════════════════════════════════════════════════════════ */

@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/inter-400.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/inter-500.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/inter-700.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 800; font-display: swap; src: url('/fonts/inter-800.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 900; font-display: swap; src: url('/fonts/inter-900.woff2') format('woff2'); }

:root {
  --black: #0A0A0A;
  --white: #F5F2EE;
  --accent: #E63B2E;
  --accent-text: #CE3322;   /* AA-passing vermillion (4.57:1 on paper) for small accent labels */
  --grey-900: #2A2A2A;
  --grey-700: #555;
  --grey-500: #6B6B6B;   /* darkened from #8A8A8A (3.1:1) to clear WCAG AA 4.5:1 on paper */
  --grey-300: #B5B1AB;
  --grey-200: #D4D0CB;
  --grey-100: #EDEBE7;
  --font: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --page-max: 1080px;
  --page-pad: clamp(24px, 5vw, 72px);

  /* ── Spacing scale (4px sub-grid, 8px major rhythm) ── */
  --s-xs: 8px;   --s-sm: 12px;  --s-md: 16px;  --s-lg: 24px;  --s-xl: 32px;
  --s-2xl: 48px; --s-3xl: 64px; --s-4xl: 96px; --s-5xl: 128px;

  /* ── Measures (collapse to two line-lengths) ── */
  --measure-lede: 52ch;   /* hero subhead, section ledes */
  --measure-body: 46ch;   /* supporting / column copy */
}