/* ==========================================================================
   Frijns theme — design tokens & font
   Geladen vóór alle andere partials (handle: frijnsvof-vars)
   ========================================================================== */

@font-face {
	font-family: 'Plus Jakarta Sans';
	font-style: normal;
	font-weight: 200 800;
	font-display: swap;
	src: url('../fonts/plus-jakarta-sans-latin.woff2') format('woff2');
}

:root {
	/* Kleuren — afgeleid van het Frijns-logo (#1528B3) */
	--color-primary: #1528B3;
	--color-primary-dark: #0F1D8A;
	--color-navy: #0A1240;

	/* Diepe versie van het logoblauw: rustig genoeg voor grote vlakken
	   (footer, CTA-banden, mededelingsbalk) en duidelijk familie van het merk. */
	--color-deep: #16256B;
	--color-deep-soft: #1C2F87;
	--color-tint: #EEF0FB;
	--color-tint-strong: #DFE3F7;
	--color-white: #FFFFFF;
	--color-text: #1A1D29;
	--color-muted: #5A6178;
	--color-border: #E1E5F4;

	--gradient-primary: linear-gradient(135deg, #0F1D8A 0%, #1528B3 55%, #3243D6 100%);

	/* Vormtaal */
	--radius-s: 10px;
	--radius-m: 16px;
	--radius-l: 24px;
	--radius-pill: 999px;

	--shadow-card: 0 2px 8px rgba(10, 18, 64, 0.06), 0 12px 32px rgba(10, 18, 64, 0.08);
	--shadow-card-hover: 0 4px 12px rgba(10, 18, 64, 0.10), 0 20px 44px rgba(21, 40, 179, 0.16);
	--shadow-header: 0 1px 0 rgba(10, 18, 64, 0.06), 0 8px 24px rgba(10, 18, 64, 0.05);

	/* Fluid spacing. De secties zaten net iets te ruim uit elkaar; vooral
	   boven een kop viel dat op als een gat. */
	--space-section: clamp(2.75rem, 5.2vw, 4.75rem);
	--space-block: clamp(1.5rem, 3vw, 2.5rem);
	--space-card: clamp(1.5rem, 2.5vw, 2.25rem);

	/* Transities */
	--transition-base: 0.22s ease;
}