/* Eric Fletcher — Design Tokens
 * Source of truth: DESIGN.md
 * Auto-generated from DESIGN.md front matter.
 * For plain HTML/CSS (no Tailwind build step).
 * Tailwind v4 users: use theme.css (@theme block) instead.
 */

:root {
  /* Colors */
  --color-primary: #1e293b;
  --color-secondary: #64748b;
  --color-tertiary: #b45309;
  --color-neutral: #fafaf8;
  --color-surface: #ffffff;
  --color-on-primary: #ffffff;
  --color-on-tertiary: #ffffff;

  /* Typography — families */
  --font-display: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-h1: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-h2: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-h3: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-body-md: "Inter", system-ui, sans-serif;
  --font-body-sm: "Inter", system-ui, sans-serif;
  --font-label: "Inter", system-ui, sans-serif;

  /* Typography — sizes */
  --text-display: 3.5rem;
  --text-h1: 2.25rem;
  --text-h2: 1.5rem;
  --text-h3: 1.125rem;
  --text-body-md: 1rem;
  --text-body-sm: 0.875rem;
  --text-label: 0.75rem;

  /* Typography — tracking */
  --tracking-display: -0.03em;
  --tracking-h1: -0.02em;
  --tracking-label: 0.08em;

  /* Typography — weights */
  --font-weight-display: 800;
  --font-weight-h1: 700;
  --font-weight-h2: 600;
  --font-weight-h3: 600;
  --font-weight-label: 600;

  /* Rounded */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-full: 9999px;

  /* Spacing */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 48px;
  --spacing-2xl: 64px;
}