/* =============================================================
   DECIMA DESIGN TOKENS
   Single source of truth for the design system.

   These are NEUTRAL PLACEHOLDERS. When the Decima brand/design
   system is ready, swap the values here (colours, fonts, scale)
   and the whole site updates consistently. Prefer editing tokens
   over hard-coding values anywhere else.
   ============================================================= */

:root {
	/* --- Colour: brand (placeholder — replace with Decima brand) --- */
	--color-primary: #2563eb;
	--color-primary-hover: #1d4ed8;
	--color-primary-contrast: #ffffff;
	--color-accent: #0ea5e9;

	/* --- Colour: neutrals / surfaces --- */
	--color-bg: #ffffff;
	--color-surface: #f7f8fa;
	--color-surface-2: #eef1f6;
	--color-border: #e2e8f0;

	/* --- Colour: text --- */
	--color-text: #0f172a;
	--color-text-muted: #475569;
	--color-heading: #0b1220;

	/* --- Colour: dark sections (footer, CTA bands) --- */
	--color-dark: #0b1220;
	--color-dark-surface: #131c2e;
	--color-dark-text: #e2e8f0;
	--color-dark-muted: #94a3b8;

	/* --- Typography: families (placeholder — replace with brand fonts) --- */
	--font-sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--font-heading: var(--font-sans);

	/* --- Typography: fluid scale --- */
	--text-xs: 0.8rem;
	--text-sm: 0.9rem;
	--text-base: 1rem;
	--text-lg: 1.125rem;
	--text-xl: 1.375rem;
	--text-2xl: clamp(1.5rem, 1rem + 2.2vw, 2rem);
	--text-3xl: clamp(2rem, 1.2rem + 3.6vw, 3rem);
	--text-4xl: clamp(2.5rem, 1.4rem + 5vw, 4rem);

	/* --- Typography: weights & line-heights --- */
	--weight-normal: 400;
	--weight-medium: 500;
	--weight-semibold: 600;
	--weight-bold: 700;
	--leading-tight: 1.15;
	--leading-snug: 1.3;
	--leading-normal: 1.6;

	/* --- Spacing scale --- */
	--space-2xs: 0.25rem;
	--space-xs: 0.5rem;
	--space-sm: 0.75rem;
	--space-md: 1rem;
	--space-lg: 1.5rem;
	--space-xl: 2rem;
	--space-2xl: 3rem;
	--space-3xl: 4rem;
	--space-4xl: 6rem;

	/* --- Radii --- */
	--radius-sm: 0.375rem;
	--radius: 0.5rem;
	--radius-lg: 1rem;
	--radius-full: 999px;

	/* --- Shadows --- */
	--shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
	--shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
	--shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.12);

	/* --- Layout --- */
	--container-max: 75rem;
	--container-pad: 1.5rem;
	--header-height: 4.5rem;

	/* --- Motion --- */
	--transition: 150ms ease;
}
