:root {
  --color-bg: #f6f7f9;
  --color-surface: #ffffff;
  --color-text: #12161c;
  --color-text-muted: #4a5568;
  --color-accent: #1a4a6e;
  --color-accent-hover: #143a56;
  --color-border: #e2e6eb;
  --color-border-strong: #c8d0da;
  --color-highlight: #e8f0f6;

  --font-display: "Source Serif 4", Georgia, "Times New Roman", serif;
  --font-ui: "IBM Plex Sans", system-ui, -apple-system, sans-serif;

  --text-display: clamp(2.25rem, 5vw, 3.5rem);
  --text-h1: clamp(1.875rem, 4vw, 2.75rem);
  --text-h2: clamp(1.5rem, 3vw, 2rem);
  --text-h3: 1.25rem;
  --text-body: 1.0625rem;
  --text-small: 0.875rem;
  --text-label: 0.75rem;

  --leading-tight: 1.15;
  --leading-body: 1.65;
  --gutter: clamp(1.25rem, 2.5vw, 2.5rem);
  --container-max: 84rem;
  --measure: 48rem;
  --measure-narrow: 40rem;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --section-y: clamp(3.5rem, 8vw, 6.5rem);

  --radius-sm: 2px;
  --radius-md: 4px;
  --shadow-sm: 0 1px 2px rgba(18, 22, 28, 0.06);
  --shadow-md: 0 8px 24px rgba(18, 22, 28, 0.08);
  --header-h: 4.25rem;
  --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
}