/* =========================================================================
   Design Tokens — single source of truth
   Änderungen hier wirken auf alle Seiten, die tokens.css einbinden.
   ========================================================================= */

:root {
	/* Farben: Schwarz + Off-White + 1 Akzent -------------------------------- */
	--c-bg: #fafaf7;
	--c-fg: #0a0a0a;
	--c-accent: #c44900;
	--c-muted: #6b6b6b;
	--c-border: #0a0a0a;
	--c-border-soft: rgba(10, 10, 10, 0.12);
	--c-surface: #ffffff;

	/* Typografie ----------------------------------------------------------- */
	--ff-sans:
		"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial,
		sans-serif;
	--ff-mono:
		ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

	--fw-regular: 400;
	--fw-bold: 700;

	/* Fluide Typografie via clamp(min, ideal, max) */
	--fs-hero: clamp(2rem, 7.5vw, 5.5rem); /* 32px – 88px */
	--fs-h2: clamp(1.75rem, 4vw, 2.75rem); /* 28px – 44px */
	--fs-h3: clamp(1.25rem, 2.5vw, 1.5rem); /* 20px – 24px */
	--fs-body: 1.125rem; /* 18px */
	--fs-small: 0.875rem; /* 14px */
	--fs-tiny: 0.75rem; /* 12px */

	--lh-tight: 1.1;
	--lh-snug: 1.3;
	--lh: 1.5;

	/* Spacing (8px-Grid) ---------------------------------------------------- */
	--space-2xs: 0.25rem;
	--space-xs: 0.5rem;
	--space-sm: 1rem;
	--space-md: 1.5rem;
	--space-lg: 2.5rem;
	--space-xl: 4rem;
	--space-2xl: 6rem;
	--space-3xl: 8rem;

	/* Layout --------------------------------------------------------------- */
	--container: 1200px;
	--container-narrow: 760px;
	--radius: 0;
	--border-w: 1px;
	--border-w-thick: 2px;

	/* Transitions ---------------------------------------------------------- */
	--t-hover: 150ms ease-out;

	/* Z-Indizes ------------------------------------------------------------ */
	--z-nav: 1000;
	--z-modal: 2000;
}

/* High-contrast / forced-colors Fallback (Windows-Nutzer) */
@media (forced-colors: active) {
	:root {
		--c-muted: CanvasText;
		--c-border-soft: CanvasText;
	}
}