/* Design tokens for the consulting and outsourcing explainer. Simple and professional:
   warm paper, slate ink, one steel-blue accent, Georgia headings for a calm editorial tone.
   Original palette; not based on any firm's branding.
   Contrast (WCAG AA) on --color-bg: text 14.6, muted 6.7, link/accent 7.0, link hover 11.2 (lowest on surface 6.0);
   header text 12.7 on the slate header, hover/focus sand 8.7 on it. */
:root {
  --color-bg: #f9f8f5;
  --color-surface: #ecebe5;
  --color-text: #1f2528;
  --color-muted: #50595e;
  --color-link: #1d5b79;
  --color-link-hover: #123b50;
  --color-accent: #1d5b79;
  --color-accent-strong: #f0c98a;
  --color-border: #d3d1c7;
  --color-header-bg: #22303a;
  --color-header-text: #f9f8f5;
  --color-focus: #1d5b79;

  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-heading: Georgia, "Times New Roman", serif;
  --font-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;

  /* type scale, ratio ~1.25 */
  --text-sm: 0.875rem;
  --text-base: 1.0625rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5625rem;
  --text-2xl: 1.953rem;
  --text-3xl: 2.441rem;
  --leading-body: 1.65;
  --leading-heading: 1.2;

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 2rem;
  --space-4: 3rem;
  --measure: 65ch;
  --radius: 6px;
  --rule: 1px solid var(--color-border);
}