/*
 * DS-002 design tokens (brand/design-system-v2/03-color-system.md, DS-001 §2-3).
 * Site-wide custom properties — not scoped to .smq-home, unlike the legacy home.css.
 * Baseline responsive breakpoints (WEB-014): 375 / 768 / 1440px — documented here as reference;
 * CSS media queries below use the literal px values since custom properties are not valid
 * inside @media conditions.
 */
:root {
	/* Neutrals — unchanged from DS-001 */
	--smq-navy-950: #0B0F19;
	--smq-navy-900: #141A2B;
	--smq-navy-700: #2A3245;
	--smq-white: #FFFFFF;
	--smq-gray-50: #F4F6F9;
	--smq-gray-200: #E2E6EE;
	--smq-gray-400: #8B93A6;
	--smq-gray-600: #5B6472;

	/* Brand / interactive — DS-002 (two roles, never interchangeable) */
	--smq-blue-brand: #0C7EB1;
	--smq-blue-interactive: #2F80ED;
	/* DS-A11Y-01: same hue/saturation as blue-interactive, HSL lightness 55.7% -> 47.1%. Role: the
	   interactive blue where it meets LIGHT or WHITE — filled-CTA background under white text
	   (white 5.13:1) and interactive text on white / gray-50 (5.13 / 4.74:1). The base token stays
	   for dark surfaces (4.95:1 on navy-950) and non-text accents (focus ring, markers); no single
	   value of this hue can reach 4.5:1 in both roles. See docs/DS_A11Y_01.md. */
	--smq-blue-interactive-strong: #1369DD;

	/* Semantic — unchanged from DS-001 */
	--smq-green-500: #22C55E;
	--smq-red-500: #E5484D;

	/* Typography trio — DS-001 §2 (unchanged by DS-002) */
	--smq-font-display: "Space Grotesk", system-ui, sans-serif;
	--smq-font-text: "Inter", system-ui, sans-serif;
	--smq-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;

	/* Spacing scale — DS-001 §3, base 8px */
	--smq-space-1: 4px;
	--smq-space-2: 8px;
	--smq-space-3: 16px;
	--smq-space-4: 24px;
	--smq-space-5: 32px;
	--smq-space-6: 48px;
	--smq-space-7: 64px;
	--smq-space-8: 96px;
	--smq-space-9: 128px;
}