/* Gegenereerd door scripts/build.py uit tokens/tokens.json. Niet aanpassen. */
:root {
  /* kleur · basispalet */
  --enmdn-herbarium: #F3EFE6;
  --enmdn-kalk: #E8E2D5;
  --enmdn-inkt: #1C2420;
  --enmdn-inkt-zacht: #454C47;
  --enmdn-lijn: #B3AE9F;
  --enmdn-beemdkroon: #5B5FA6;
  --enmdn-beemdkroon-licht: #BDBFE3;
  --enmdn-sepia: #7B5E3B;
  --enmdn-salie: #B9C1AE;
  --enmdn-wit: #FFFFFF;
  --enmdn-zwart: #000000;
  /* kleur · functie (gebruik deze) */
  --color-bg: var(--enmdn-herbarium);
  --color-bg-alt: var(--enmdn-kalk);
  --color-bg-soft: var(--enmdn-salie);
  --color-bg-inverse: var(--enmdn-inkt);
  --color-text: var(--enmdn-inkt);
  --color-text-muted: var(--enmdn-inkt-zacht);
  --color-text-inverse: var(--enmdn-herbarium);
  --color-tagline: var(--enmdn-sepia);
  --color-line: var(--enmdn-lijn);
  --color-accent: var(--enmdn-beemdkroon);
  --color-accent-inverse: var(--enmdn-beemdkroon-licht);
  --color-link: var(--enmdn-beemdkroon);
  --color-drawing-line: var(--enmdn-inkt);
  --color-drawing-root: var(--enmdn-sepia);
  --color-drawing-soil: var(--enmdn-sepia);
  --color-drawing-water: var(--enmdn-beemdkroon);
  --color-drawing-grid: var(--enmdn-lijn);
  /* typografie */
  --font-display: "Libre Caslon Display", "Libre Caslon Text", Georgia, serif;
  --font-text: "Libre Caslon Text", Georgia, "Times New Roman", serif;
  --font-mono: "IBM Plex Mono", Menlo, Consolas, monospace;
  --font-botanical: "Libre Caslon Text", Georgia, serif;
  --text-display-size: clamp(40px, 27.86px + 3.237vw, 68px);
  --text-display-line: 1.02;
  --text-display-tracking: -0.012em;
  --text-display-weight: 400;
  --text-h1-size: clamp(32px, 25.93px + 1.618vw, 46px);
  --text-h1-line: 1.06;
  --text-h1-tracking: -0.01em;
  --text-h1-weight: 400;
  --text-h2-size: clamp(23px, 21.27px + 0.462vw, 27px);
  --text-h2-line: 1.2;
  --text-h2-tracking: -0.005em;
  --text-h2-weight: 400;
  --text-h3-size: clamp(16px, 15.57px + 0.116vw, 17px);
  --text-h3-line: 1.35;
  --text-h3-tracking: 0em;
  --text-h3-weight: 700;
  --text-lead-size: clamp(19px, 18.13px + 0.231vw, 21px);
  --text-lead-line: 1.5;
  --text-lead-tracking: 0em;
  --text-lead-weight: 400;
  --text-body-size: clamp(16px, 15.57px + 0.116vw, 17px);
  --text-body-line: 1.6;
  --text-body-tracking: 0em;
  --text-body-weight: 400;
  --text-small-size: 14px;
  --text-small-line: 1.5;
  --text-small-tracking: 0em;
  --text-small-weight: 400;
  --text-label-size: 11px;
  --text-label-line: 1.3;
  --text-label-tracking: 0.14em;
  --text-label-weight: 500;
  --text-data-size: clamp(12px, 11.57px + 0.116vw, 13px);
  --text-data-line: 1.45;
  --text-data-tracking: 0.02em;
  --text-data-weight: 400;
  --text-latin-size: clamp(17px, 16.57px + 0.116vw, 18px);
  --text-latin-line: 1.3;
  --text-latin-tracking: 0em;
  --text-latin-weight: 400;
  /* ruimte */
  --space-3xs: 4px;
  --space-2xs: 8px;
  --space-xs: 12px;
  --space-s: 16px;
  --space-m: 24px;
  --space-l: 32px;
  --space-xl: 48px;
  --space-2xl: 64px;
  --space-3xl: 96px;
  --space-4xl: 128px;
  /* layout */
  --layout-grid-columns: 12;
  --layout-max-width: 1240px;
  --layout-gutter: 24px;
  --layout-margin-mobile: 16px;
  --layout-margin-desktop: 48px;
  --layout-measure-ch: 66ch;
  --layout-print-margin-mm: 18mm;
  /* lijn */
  --line-hair: 0.6px;
  --line-fine: 0.9px;
  --line-ground: 1.4px;
  --line-botanical: 1.05px;
  --line-botanical-fine: 0.8px;
  --line-botanical-hair: 0.5px;
  --line-root: 0.85px;
  /* beweging */
  --motion-draw: 1.8s;
  --motion-fade: 1.0s;
  --motion-ease: cubic-bezier(.45, 0, .2, 1);
}

/* typografische rollen: één klasse per rol */
.enmdn-display { font-family: var(--font-display); font-weight: var(--text-display-weight); font-size: var(--text-display-size); line-height: var(--text-display-line); letter-spacing: var(--text-display-tracking); }
.enmdn-h1 { font-family: var(--font-display); font-weight: var(--text-h1-weight); font-size: var(--text-h1-size); line-height: var(--text-h1-line); letter-spacing: var(--text-h1-tracking); }
.enmdn-h2 { font-family: var(--font-text); font-weight: var(--text-h2-weight); font-size: var(--text-h2-size); line-height: var(--text-h2-line); letter-spacing: var(--text-h2-tracking); }
.enmdn-h3 { font-family: var(--font-text); font-weight: var(--text-h3-weight); font-size: var(--text-h3-size); line-height: var(--text-h3-line); letter-spacing: var(--text-h3-tracking); }
.enmdn-lead { font-family: var(--font-text); font-weight: var(--text-lead-weight); font-size: var(--text-lead-size); line-height: var(--text-lead-line); letter-spacing: var(--text-lead-tracking); }
.enmdn-body { font-family: var(--font-text); font-weight: var(--text-body-weight); font-size: var(--text-body-size); line-height: var(--text-body-line); letter-spacing: var(--text-body-tracking); }
.enmdn-small { font-family: var(--font-text); font-weight: var(--text-small-weight); font-size: var(--text-small-size); line-height: var(--text-small-line); letter-spacing: var(--text-small-tracking); }
.enmdn-label { font-family: var(--font-mono); font-weight: var(--text-label-weight); font-size: var(--text-label-size); line-height: var(--text-label-line); letter-spacing: var(--text-label-tracking); text-transform: uppercase; }
.enmdn-data { font-family: var(--font-mono); font-weight: var(--text-data-weight); font-size: var(--text-data-size); line-height: var(--text-data-line); letter-spacing: var(--text-data-tracking); }
.enmdn-latin { font-family: var(--font-botanical); font-weight: var(--text-latin-weight); font-size: var(--text-latin-size); line-height: var(--text-latin-line); letter-spacing: var(--text-latin-tracking); font-style: italic; }
