/*
 * WCP 2026 - design tokens
 * ---------------------------------------------------------------------------
 * The single source of truth for colour, spacing, radius, shadow and type.
 * Every rule in main.css and every template must consume these variables;
 * no raw hex values anywhere else in the theme.
 *
 * Colour modes: light lives on :root, dark on [data-theme="dark"].
 * Only the tokens that actually change are redeclared in the dark block, so
 * anything not listed there deliberately inherits its light value.
 *
 * Note: system colour-scheme preference is intentionally NOT wired up here.
 * The theme toggle owns the data-theme attribute; auto-applying dark from
 * prefers-color-scheme would fight that control.
 */

/* --------------------------------------------------------------------------
 * Poppins - self-hosted, OFL. Latin subset (217 codepoints), covers every
 * character used on the site including the trademark sign in "ENVY(TM)".
 * ----------------------------------------------------------------------- */

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/poppins-400.woff2') format('woff2');
}

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('../fonts/poppins-500.woff2') format('woff2');
}

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/poppins-600.woff2') format('woff2');
}

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/poppins-700.woff2') format('woff2');
}

/* --------------------------------------------------------------------------
 * Light mode (default)
 * ----------------------------------------------------------------------- */

:root {
	/* Brand */
	--c-primary: #087BCC;
	--c-primary-hover: #065E9B;
	--c-accent: #14B2E1;
	--c-accent-hover: #0EA6D4;
	--c-navy: #003C6F;

	/* Surfaces + ink */
	--c-bg: #FFFFFF;
	--c-surface: #F7F9FC;
	--c-surface-2: #EDF2F8;
	--c-text: #1B2733;
	--c-text-muted: #5A6B7B;
	--c-border: #E3E9F0;

	/* Hero gradient. Both stops keep white text at or above AA (11.19:1 and
	   6.81:1), so hero body copy is safe anywhere across the sweep. */
	--c-hero-grad-a: #003C6F;
	--c-hero-grad-b: #065E9B;

	/* Radius */
	--radius: 12px;
	--radius-sm: 8px;

	/* Elevation - tinted with the ink colour rather than pure black */
	--shadow-1: 0 1px 2px rgba(27, 39, 51, 0.06), 0 2px 8px rgba(27, 39, 51, 0.08);
	--shadow-2: 0 4px 12px rgba(27, 39, 51, 0.10), 0 12px 32px rgba(27, 39, 51, 0.14);

	/* Spacing scale */
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 16px;
	--space-4: 24px;
	--space-5: 32px;
	--space-6: 48px;
	--space-7: 64px;
	--space-8: 96px;

	/* Type + layout */
	--font-sans: 'Poppins', system-ui, sans-serif;
	--container: 1200px;
}

/* --------------------------------------------------------------------------
 * Dark mode
 * ----------------------------------------------------------------------- */

[data-theme="dark"] {
	/* Primary is lifted so it stays legible on a dark ground; hover lifts
	   further (dark mode brightens on hover instead of darkening). Accent is
	   unchanged - it already reads at 7.36:1 on the dark background. */
	--c-primary: #2E9BE6;
	--c-primary-hover: #4DAAEA;

	--c-bg: #0B1622;
	--c-surface: #122236;
	--c-surface-2: #18304A;
	--c-text: #E8F0F7;
	--c-text-muted: #9FB3C8;
	--c-border: #23405E;

	--c-hero-grad-a: #002A4E;
	--c-hero-grad-b: #06568F;

	/* Shadows need more opacity to register against a dark ground. */
	--shadow-1: 0 1px 2px rgba(0, 0, 0, 0.40), 0 2px 8px rgba(0, 0, 0, 0.32);
	--shadow-2: 0 4px 12px rgba(0, 0, 0, 0.46), 0 12px 32px rgba(0, 0, 0, 0.52);
}