:root {
	/* Koelkastwijzer 3.0 — consumentenplatform: marine, helder blauw, koel turquoise. */
	--kw-navy: #071f4b;
	--kw-navy-2: #0b2d63;
	--kw-blue: #0c5de8;
	--kw-blue-hover: #0849ba;
	--kw-cyan: #00aebb;
	--kw-cyan-dark: #008996;
	--kw-green: #167a5a;
	--kw-green-soft: #ecf7f2;
	--kw-gold: #c99122;
	--kw-gold-soft: #fff7e5;
	--kw-ink: #0b1f36;
	--kw-text: #26384a;
	--kw-muted: #607184;
	--kw-subtle: #7e8b99;
	--kw-border: #dce3ea;
	--kw-border-strong: #c9d3dd;
	--kw-bg: #f5f7fa;
	--kw-surface: #ffffff;
	--kw-surface-soft: #f8fafc;
	--kw-background: var(--kw-bg);
	--kw-blue-soft: #eef5ff;
	--kw-danger: #a63838;
	--kw-danger-soft: #fff1f1;

	/* Backwards-compatible aliases voor bestaande componenten. */
	--wg-color-primary: var(--kw-blue);
	--wg-color-primary-hover: var(--kw-blue-hover);
	--wg-color-primary-soft: var(--kw-blue-soft);
	--wg-color-primary-muted: #5d7ea8;
	--wg-color-secondary: var(--kw-cyan);
	--wg-color-secondary-hover: var(--kw-cyan-dark);
	--wg-color-secondary-soft: #eaf9fa;
	--wg-color-text: var(--kw-text);
	--wg-color-heading: var(--kw-ink);
	--wg-color-text-muted: var(--kw-muted);
	--wg-color-text-subtle: var(--kw-subtle);
	--wg-color-background: var(--kw-surface);
	--wg-color-surface: var(--kw-bg);
	--wg-color-surface-soft: var(--kw-surface-soft);
	--wg-color-surface-strong: #eef2f6;
	--wg-color-border: var(--kw-border);
	--wg-color-border-strong: var(--kw-border-strong);
	--wg-color-success: var(--kw-green);
	--wg-color-success-soft: var(--kw-green-soft);
	--wg-color-warning: #8a6117;
	--wg-color-warning-soft: var(--kw-gold-soft);
	--wg-color-danger: var(--kw-danger);
	--wg-color-danger-soft: var(--kw-danger-soft);
	--wg-color-gold: var(--kw-gold);
	--wg-color-gold-soft: var(--kw-gold-soft);
	--wg-color-gold-text: #6b4a0d;

	/* Typografie: één snelle systeemstack, volwassen en helder. */
	--wg-font-family: "Segoe UI", "Helvetica Neue", Arial, system-ui, -apple-system, sans-serif;
	--wg-font-size-base: 16px;
	--wg-font-size-sm: 0.875rem;
	--wg-font-size-lg: 1.125rem;
	--wg-font-size-eyebrow: 12px;
	--wg-font-size-hero: clamp(2.25rem, 4.8vw, 4.15rem);
	--wg-font-size-section: clamp(1.75rem, 3vw, 2.55rem);
	--wg-font-size-card-title: 1.125rem;
	--wg-font-size-intro: clamp(1.05rem, 1.4vw, 1.2rem);
	--wg-line-height-body: 1.68;
	--wg-line-height-heading: 1.08;

	/* Layout */
	--wg-container-width: 1240px;
	--wg-content-width: 780px;
	--wg-reading-width: 760px;
	--kw-container: var(--wg-container-width);
	--kw-reading-width: var(--wg-reading-width);
	--wg-page-gutter: 28px;
	--wg-page-gutter-mobile: 18px;
	--wg-section-space: clamp(64px, 7vw, 96px);
	--wg-section-space-small: clamp(40px, 5vw, 64px);
	--wg-header-height: 72px;
	--kw-header-height: 112px;
	--kw-header-height-mobile: 62px;

	/* Ruimte */
	--wg-space-1: 4px;
	--wg-space-2: 8px;
	--wg-space-3: 12px;
	--wg-space-4: 16px;
	--wg-space-5: 24px;
	--wg-space-6: 32px;
	--wg-space-7: 48px;
	--wg-space-8: 64px;
	--wg-space-9: 96px;

	/* Vorm */
	--wg-radius-sm: 6px;
	--wg-radius-md: 10px;
	--wg-radius-lg: 14px;
	--wg-radius-xl: 20px;
	--kw-radius: var(--wg-radius-md);
	--kw-radius-lg: var(--wg-radius-lg);
	--kw-shadow-sm: 0 5px 16px rgba(7, 31, 75, 0.05);
	--kw-shadow-md: 0 12px 32px rgba(7, 31, 75, 0.08);
	--wg-shadow-card: 0 8px 26px rgba(7, 31, 75, 0.06);
	--wg-shadow-card-hover: 0 16px 34px rgba(7, 31, 75, 0.10);
	--wg-transition: 160ms ease;
}
