/* Auto-generated from /tokens — do not edit by hand */


:root {
  --color-federal-blue-50: #EBF2FA;    /* Lichtste federale blauw — achtergrondvelden */
  --color-federal-blue-100: #D9E8F7;
  --color-federal-blue-200: #B0CCEB;
  --color-federal-blue-300: #739ED4;
  --color-federal-blue-400: #3669B0;
  --color-federal-blue-500: #0F458F;    /* Federale blauw — primaire merkkleur */
  --color-federal-blue-600: #0A3878;
  --color-federal-blue-700: #052B5E;    /* Donkerblauwe accent voor headers */
  --color-federal-blue-800: #031F45;
  --color-federal-blue-900: #03122E;
  --color-tricolor-yellow: #FCD117;    /* Belgisch geel — accentstrook, niet voor tekst */
  --color-tricolor-red: #C70F2E;    /* Belgisch rood — accentstrook + alert-states */
  --color-tricolor-black: #1A1A1A;    /* Belgisch zwart — koptekst, autoriteit */
  --color-neutral-0: #FFFFFF;
  --color-neutral-50: #FAFAF7;    /* Warme achtergrond */
  --color-neutral-100: #F5F5F2;
  --color-neutral-200: #E8E8E3;
  --color-neutral-300: #D4D4CC;
  --color-neutral-400: #A3A39C;
  --color-neutral-500: #75756E;
  --color-neutral-600: #575752;
  --color-neutral-700: #3D3D38;
  --color-neutral-800: #242421;
  --color-neutral-900: #121212;
  --color-feedback-success-500: #1A8C52;
  --color-feedback-warning-500: #DB9C12;
  --color-feedback-error-500: #C70F2E;
  --color-feedback-info-500: #0F458F;
  --color-feedback-success: #1A8C52;
  --color-feedback-warning: #DB9C12;
  --color-feedback-error: #C70F2E;
  --color-feedback-info: #0F458F;
  --color-background-default: #FFFFFF;
  --color-background-subtle: #FAFAF7;
  --color-background-muted: #F5F5F2;
  --color-background-inverted: #121212;
  --color-background-brand: #0F458F;
  --color-background-brand-strong: #052B5E;
  --color-text-default: #121212;
  --color-text-muted: #575752;
  --color-text-subtle: #75756E;
  --color-text-inverted: #FFFFFF;
  --color-text-brand: #052B5E;
  --color-text-link: #0A3878;
  --color-text-link-visited: #031F45;
  --color-border-default: #E8E8E3;
  --color-border-strong: #A3A39C;
  --color-border-brand: #0F458F;
  --color-border-focus: #0A3878;
  --color-accent-yellow: #FCD117;
  --color-accent-red: #C70F2E;
  --color-accent-black: #1A1A1A;
  --spacing-0: 0rem;
  --spacing-50: 0.25rem;
  --spacing-100: 0.5rem;
  --spacing-150: 0.75rem;
  --spacing-200: 1.0rem;
  --spacing-300: 1.5rem;
  --spacing-400: 2.0rem;
  --spacing-500: 3.0rem;
  --spacing-600: 4.0rem;
  --spacing-700: 6.0rem;
  --spacing-800: 8.0rem;
  --radius-none: 0rem;
  --radius-sm: 0.125rem;
  --radius-md: 0.25rem;
  --radius-lg: 0.5rem;
  --radius-full: 9999px;
  --border-width-thin: 1px;
  --border-width-thick: 2px;
  --border-width-heavy: 4px;
  --font-family-primary: Inter, "system-ui", "-apple-system", "Segoe UI", Roboto, "sans-serif";    /* Latijns + Grieks + Cyrillisch — vervangt definitief gekozen federaal merklettertype in productie */
  --font-family-serif: "IBM Plex Serif", Georgia, serif;    /* Voor lange-vorm publicaties (rapporten, jaarverslagen) */
  --font-family-mono: "IBM Plex Mono", Menlo, monospace;    /* Voor code en data */
  --font-family-arabic: "Noto Sans Arabic", "Geeza Pro", "sans-serif";    /* Script-fallback Arabisch (bestek punt 4.1) */
  --font-family-cjk: "Noto Sans CJK SC", "PingFang SC", "Hiragino Sans", "sans-serif";    /* Script-fallback Chinees/Japans (bestek punt 4.1) */
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-size-100: 0.75rem;
  --font-size-200: 0.875rem;
  --font-size-300: 1.0rem;
  --font-size-400: 1.125rem;
  --font-size-500: 1.25rem;
  --font-size-600: 1.5rem;
  --font-size-700: 1.875rem;
  --font-size-800: 2.25rem;
  --font-size-900: 3.0rem;
  --font-size-display: 4.0rem;
  --font-line-height-tight: 1.15;
  --font-line-height-snug: 1.3;
  --font-line-height-normal: 1.5;
  --font-line-height-relaxed: 1.65;
  --button-primary-background: #0F458F;
  --button-primary-background-hover: #052B5E;
  --button-primary-text: #FFFFFF;
  --button-primary-border: #0F458F;
  --button-secondary-background: #FFFFFF;
  --button-secondary-background-hover: #F5F5F2;
  --button-secondary-text: #052B5E;
  --button-secondary-border: #0F458F;
  --button-padding-y: 0.75rem;
  --button-padding-x: 1.5rem;
  --button-radius: 0.25rem;
  --button-font-weight: 600;
  --office-font-heading-fallback: "Aptos Display", Calibri, Arial;    /* Microsoft 365 default */
  --office-font-body-fallback: Aptos, Calibri, Arial;
  --office-page-letterhead-margin-top: 4.5cm;
  --office-page-letterhead-margin-bottom: 2.5cm;
  --office-page-letterhead-margin-left: 2.0cm;
  --office-page-letterhead-margin-right: 2.0cm;
  --print-color-federal-blue-cmyk: #001F8F;
  /* --print-color-federal-blue-pantone: PMS 280 C; (Pantone, niet voor CSS) */
  --print-color-tricolor-yellow-cmyk: #FFE600;
  /* --print-color-tricolor-yellow-pantone: PMS 116 C; (Pantone, niet voor CSS) */
  --print-color-tricolor-red-cmyk: #E60022;
  /* --print-color-tricolor-red-pantone: PMS 186 C; (Pantone, niet voor CSS) */
  --print-bleed: 3mm;
  --print-safe-margin: 5mm;
}

.typo-display {
  font-family: Inter, "system-ui", "-apple-system", "Segoe UI", Roboto, "sans-serif";
  font-weight: 700;
  font-size: 4.0rem;
  line-height: 1.15;
}

.typo-heading-1 {
  font-family: Inter, "system-ui", "-apple-system", "Segoe UI", Roboto, "sans-serif";
  font-weight: 700;
  font-size: 2.25rem;
  line-height: 1.15;
}

.typo-heading-2 {
  font-family: Inter, "system-ui", "-apple-system", "Segoe UI", Roboto, "sans-serif";
  font-weight: 600;
  font-size: 1.875rem;
  line-height: 1.3;
}

.typo-heading-3 {
  font-family: Inter, "system-ui", "-apple-system", "Segoe UI", Roboto, "sans-serif";
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1.3;
}

.typo-heading-4 {
  font-family: Inter, "system-ui", "-apple-system", "Segoe UI", Roboto, "sans-serif";
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.3;
}

.typo-body {
  font-family: Inter, "system-ui", "-apple-system", "Segoe UI", Roboto, "sans-serif";
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.65;
}

.typo-body-sm {
  font-family: Inter, "system-ui", "-apple-system", "Segoe UI", Roboto, "sans-serif";
  font-weight: 400;
  font-size: 1.0rem;
  line-height: 1.5;
}

.typo-caption {
  font-family: Inter, "system-ui", "-apple-system", "Segoe UI", Roboto, "sans-serif";
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.5;
}

.typo-eyebrow {
  font-family: Inter, "system-ui", "-apple-system", "Segoe UI", Roboto, "sans-serif";
  font-weight: 600;
  font-size: 0.875rem;
  line-height: 1.5;
}