/* ==========================================================================
   Design tokens. Every colour, font, size and space used by the site is
   defined here once. Components reference these variables only.
   ========================================================================== */
:root {
	/* Colour */
	--dc-navy: #192C4B;
	--dc-navy-deep: #101E36;
	--dc-navy-raised: #16284A;
	--dc-sky: #62CCF5;
	--dc-sky-tint: #E8F7FE;
	--dc-link: #0B6E99;
	--dc-text: #44506A;
	--dc-surface: #F5F8FA;
	--dc-line: #E2E8EF;
	--dc-line-strong: #B9C6D8;
	--dc-white: #FFFFFF;
	--dc-on-dark: #C4D1E3;
	--dc-on-dark-line: rgba(255, 255, 255, 0.16);

	/* Type */
	--dc-font-heading: "Jost", "Century Gothic", system-ui, sans-serif;
	--dc-font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	--dc-fs-h1: clamp(2.25rem, 1.3rem + 3.4vw, 3.75rem);
	--dc-fs-h1-hero: clamp(2.25rem, 1.2rem + 4vw, 4.5rem);
	--dc-fs-h2: clamp(1.75rem, 1.3rem + 1.7vw, 2.75rem);
	--dc-fs-h3: clamp(1.25rem, 1.15rem + 0.4vw, 1.5rem);
	--dc-fs-lead: clamp(1rem, 0.9rem + 0.4vw, 1.1875rem);
	--dc-fs-body: 1rem;
	--dc-fs-small: 0.9375rem;
	--dc-fs-xs: 0.8125rem;
	--dc-lh-body: 1.6;
	--dc-lh-heading: 1.1;

	/* Space */
	--dc-space-1: 4px;
	--dc-space-2: 8px;
	--dc-space-3: 12px;
	--dc-space-4: 16px;
	--dc-space-5: 20px;
	--dc-space-6: 24px;
	--dc-space-7: 32px;
	--dc-space-8: 48px;
	--dc-space-9: 56px;
	--dc-section-y: clamp(56px, 7vw, 104px);
	--dc-gutter: clamp(20px, 4vw, 32px);
	--dc-container: 1200px;
	--dc-gap-grid: clamp(16px, 2vw, 24px);
	--dc-gap-split: clamp(32px, 5vw, 72px);

	/* Shape and elevation */
	--dc-radius-sm: 10px;
	--dc-radius-md: 12px;
	--dc-radius-lg: 16px;
	--dc-radius-pill: 999px;
	--dc-shadow-xs: 0 1px 2px rgba(16, 30, 54, 0.05), 0 2px 8px rgba(16, 30, 54, 0.04);
	--dc-shadow-sm: 0 2px 4px rgba(16, 30, 54, 0.04), 0 10px 24px rgba(16, 30, 54, 0.07);
	--dc-shadow-card: 0 4px 10px rgba(16, 30, 54, 0.05), 0 24px 48px rgba(16, 30, 54, 0.12);
	--dc-shadow-btn: 0 1px 2px rgba(16, 30, 54, 0.2), 0 6px 16px rgba(16, 30, 54, 0.18);
	--dc-shadow-btn-accent: 0 1px 2px rgba(11, 110, 153, 0.25), 0 8px 20px rgba(98, 204, 245, 0.35);
	--dc-shadow-header: 0 6px 24px rgba(16, 30, 54, 0.08);
	--dc-shadow-float: 0 30px 70px rgba(2, 8, 20, 0.35);

	/* Motion */
	--dc-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
	--dc-speed: 0.35s;
	--dc-reveal-step: 70ms;
	--dc-icon-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 6h14M10 1l5 5-5 5'/%3E%3C/svg%3E");
	--dc-icon-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 5l3.5 3.5L11 1'/%3E%3C/svg%3E");

	/* Layout */
	--dc-header-h: 76px;
	--dc-nav-break: 980px; /* documented value; media queries cannot read variables */
}
