/*
 * Design tokens for the Generiek Kompas site.
 * Colors are taken from the original site (brand blue #2F5AAE, accent
 * orange #FF9311). Fonts fall back to the system UI stack instead of
 * loading Asap/Lato from Google Fonts, so the site never needs a
 * third-party font-src in the Content-Security-Policy.
 */

:root {
  --color-primary: #2f5aae;
  --color-primary-dark: #23447f;
  --color-accent: #ff9311;
  --color-accent-dark: #cc7500;

  --color-text: #272626;
  --color-text-muted: #56534f;
  --color-white: #ffffff;

  --color-bg: #ffffff;
  --color-bg-muted: #f5f6f8;
  --color-border: #e2e4e8;

  --color-success-bg: #e7f6ec;
  --color-success-text: #1e7a3d;
  --color-error-bg: #fdecec;
  --color-error-text: #b3261e;

  --font-heading: 'Asap', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-body: 'Lato', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

  --container-width: 1200px;
  --container-width-narrow: 820px;

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4.5rem;

  --radius: 8px;
  --radius-sm: 4px;

  --header-height: 88px;
}