/* KD Home tokens. Source: Figma HcLlTkFzWkEXGPiktTYrH8 variables. Owner: foundation (A). */
.kd-home {
	/* Colour */
	--kdh-navy: #1c2161;
	--kdh-navy-hover: #2a3080;
	--kdh-green: #02c17f;
	--kdh-green-hover: #34cd99;
	--kdh-blue: #2383eb;
	--kdh-blue-ink: #136fd2;
	--kdh-blue-ink-hover: #0f5db8;
	--kdh-yellow: #ffda38;
	--kdh-ink: #333333;
	--kdh-stone: #6b7280;
	--kdh-cloud: #f7f8fc;
	--kdh-border: #e5e7eb;
	--kdh-white: #ffffff;
	--kdh-retreat-blue: #0260c7;
	--kdh-retreat-yellow: #ffea80;

	/* Space */
	--kdh-s-4: 4px;
	--kdh-s-8: 8px;
	--kdh-s-12: 12px;
	--kdh-s-16: 16px;
	--kdh-s-24: 24px;
	--kdh-s-32: 32px;
	--kdh-s-64: 64px;
	--kdh-s-96: 96px;

	/* Radius */
	--kdh-r-sm: 8px;
	--kdh-r-card: 24px;
	--kdh-r-pill: 9999px;

	/* Layout */
	--kdh-max: 1320px;
	--kdh-gutter: 16px;

	/* Type families */
	--kdh-font-head: "Rubik", system-ui, sans-serif;
	--kdh-font-body: "Roboto Slab", Georgia, serif;

	/* Type scale: fluid, phone value -> desktop value between 375 and 1440 */
	--kdh-fs-display: clamp(2.75rem, 1.606rem + 4.883vw, 6rem);       /* 44 -> 96 */
	--kdh-fs-h1: clamp(2.25rem, 1.81rem + 1.878vw, 3.5rem);           /* 36 -> 56 */
	--kdh-fs-h2: clamp(1.75rem, 1.486rem + 1.127vw, 2.5rem);          /* 28 -> 40 */
	--kdh-fs-h3: clamp(1.5rem, 1.324rem + 0.7512vw, 2rem);            /* 24 -> 32 */
	--kdh-fs-h4: clamp(1.25rem, 1.162rem + 0.3756vw, 1.5rem);         /* 20 -> 24 */
	--kdh-fs-lead: clamp(1.125rem, 1.081rem + 0.1878vw, 1.25rem);     /* 18 -> 20 */
	--kdh-fs-body: clamp(1.0625rem, 1.0405rem + 0.0939vw, 1.125rem);  /* 17 -> 18 */
	--kdh-fs-small: 0.9375rem;                                        /* 15 */
	--kdh-fs-eyebrow: 1rem;                                           /* 16 */
	--kdh-fs-label: 0.875rem;                                         /* 14 */
	--kdh-fs-button: 1rem;                                            /* 16 */
	--kdh-fs-quote: clamp(1.1875rem, 1.121rem + 0.2817vw, 1.375rem);  /* 19 -> 22 */
	--kdh-fs-card-title: clamp(1.125rem, 1.081rem + 0.1878vw, 1.25rem); /* 18 -> 20 */
	--kdh-lh-display: 1;           /* 96/96, 44/44 */
	--kdh-lh-h1: 1.1;
	--kdh-lh-h2: 1.15;             /* 46/40, 32/28 */
	--kdh-lh-h3: 1.2;
	--kdh-lh-h4: 1.3;
	--kdh-lh-lead: 1.55;           /* 31/20, 28/18 */
	--kdh-lh-body: 1.6;
	--kdh-ls-display: -0.02em;
	--kdh-ls-h2: -0.01em;
	--kdh-ls-eyebrow: 0.08em;
	--kdh-ls-button: 0.04em;

	/* Focus */
	--kdh-focus-light: 0 0 0 2px #fff, 0 0 0 4px var(--kdh-navy);
}

@media (min-width: 768px) {
	.kd-home { --kdh-gutter: 32px; }
}
@media (min-width: 1024px) {
	.kd-home { --kdh-gutter: 60px; }
}