/* ── tokens.css — Evergreen Media Design-Tokens ──────────────────────────────
   Gespiegelt aus scraped-pages/<seite>/design.md (Design-Vertrag).
   Zuerst laden, vor base.css und Komponenten-CSS.
   ──────────────────────────────────────────────────────────────────────────── */

:root {
	/* Farben (CI) */
	--c-primary: #212529;        /* Near-Black — Text, primäre Aktionen */
	--c-primary-rgb: 33 37 41;
	--c-accent: #8aa14a;         /* Oliv — sparsam als Akzent/Highlight */
	--c-accent-rgb: 138 161 74;
	--c-accent-dark: #6f8339;    /* dunklerer Oliv-Ton — nur Nicht-Text (Border, Fokus-Outline), 4.21:1 reicht nicht für Text/AA */
	--c-link: #5F7233;           /* Textlinks — 5,33:1 auf Weiß, 5,02:1 auf #f8f8f8, 4,78:1 auf #f0f4ea (WCAG AA) */
	--c-surface-olive: #f0f4ea;  /* heller Oliv-Ton für Flächen (GEO-design.md surface) */
	--c-bg: #ffffff;
	--c-surface: #f8f8f8;
	--c-text: #212529;
	--c-text-muted: #5c636a;     /* echtes Grau statt des extrahierten Oliv */
	--c-border: #212529;
	--c-border-light: #e2e4e6;
	--c-divider: #eeeff0;
	--c-white: #ffffff;
	--c-white-rgb: 255 255 255;

	/* Typo */
	--font-head: "Montserrat", system-ui, sans-serif;
	--font-body: "Source Sans Pro", system-ui, sans-serif;
	--fs-display: 1.75rem;   /* 28px */
	--fs-h2: 1.625rem;       /* 26px */
	--fs-h2-fluid: clamp(1.75rem, 1.5rem + 1.2vw, 2.25rem); /* Sektions-H2, fluid */
	--fs-h3: 1.25rem;        /* 20px */
	--fs-body: 1.125rem;     /* 18px */
	--fs-sm: 0.875rem;       /* 14px */
	--lh-body: 1.55;

	/* Shape */
	--radius-sm: 0.375rem;   /* 6px */
	--radius: 0.5rem;        /* 8px */
	--radius-full: 62.5rem;

	/* Elevation */
	--shadow-card: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.06);
	--shadow-card-hover: 0 0.375rem 1.25rem rgba(0, 0, 0, 0.10);

	/* Layout */
	--maxw: 75rem;
	--space: 1rem;
}