@font-face {
	font-family: "Marcellus";
	src: url("../fonts/marcellus-latin-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Serif 4";
	src: url("../fonts/source-serif-4-latin-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Serif 4";
	src: url("../fonts/source-serif-4-latin-700-normal.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans 3";
	src: url("../fonts/source-sans-3-latin-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Source Sans 3";
	src: url("../fonts/source-sans-3-latin-700-normal.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

:root {
	/*
	 * Direction D bilingual token baseline.
	 * Section templates reference these variables so future design-direction
	 * changes remain mostly constrained to this file.
	 */
	--color-page: #f7f3ec;
	--color-page-alt: #efe9dd;
	--color-surface: #f7f3ec;
	--color-ink: #22303a;
	--color-ink-soft: #54636e;
	--color-primary: #234a68;
	--color-primary-deep: #16324a;
	--color-accent: #b04a1e;
	--color-accent-hover: #993f19;
	--color-highlight: #c99a3c;
	--color-muted-accent: #74510f;
	--color-link: var(--color-primary);
	--color-link-hover: var(--color-accent);
	--color-line: #d8d0c2;
	--color-deep: #0f2136;
	--color-on-deep: #f7f3ec;
	--color-on-deep-soft: #c2d4e2;
	--color-on-primary: #f7f3ec;
	--color-on-accent: #fffaf2;
	--color-on-highlight: #22303a;
	--color-on-image: #fffaf2;
	--color-on-image-soft: #efe9dd;
	--color-focus: #14678a;
	--paper: #f7f3ec;
	--paper-2: #efe9dd;
	--ink: #22303a;
	--ink-soft: #54636e;
	--navy: #234a68;
	--navy-deep: #16324a;
	--deep: #0f2136;
	--gold: #c99a3c;
	--gold-text: #8a6414;
	--flame: #b04a1e;
	--sky: #2099cc;
	--sky-text: #14678a;
	--teal: #62a8c9;
	--pale: #a7d5e8;
	--hairline: #d8d0c2;
	--glass-yellow: #fcd571;
	--footer-bg: #0b1929;
	--footer-text: #a3b9ca;
	--footer-line: #24425c;
	--footer-muted: #7d95a9;
	--body-muted: #3c4a54;
	--county-sub: #b6cbdb;
	--control-glass: rgb(15 33 54 / 0.08);
	--control-glass-hover: rgb(247 243 236 / 0.12);
	--gold-ring: rgb(201 154 60 / 0.65);
	--county-ring: rgb(252 213 113 / 0.55);
	--soft-shadow: 0 12px 28px rgb(34 48 58 / 0.08);
	--cta-gradient: linear-gradient(120deg, var(--deep), var(--navy-deep));
	--cta-glow: radial-gradient(700px 350px at 85% 20%, rgb(252 213 113 / 0.13), transparent), radial-gradient(700px 350px at 10% 90%, rgb(32 153 204 / 0.16), transparent);
	--font-serif: "Marcellus", Georgia, serif;
	--font-display: "Marcellus", Georgia, serif;
	--font-body-serif: "Source Serif 4", Georgia, serif;
	--font-sans: "Source Sans 3", Helvetica, Arial, sans-serif;
	--accent-glass: linear-gradient(90deg, #e05928 0%, #efa657 18%, #fcd571 36%, #62a8c9 58%, #2099cc 78%, #8fa9c8 100%);
	--glass: linear-gradient(90deg, #e05928 0%, #efa657 18%, #fcd571 36%, #62a8c9 58%, #2099cc 78%, #8fa9c8 100%);
	--hero-overlay: linear-gradient(180deg, rgb(15 33 54 / 0.2) 0%, rgb(15 33 54 / 0) 40%, rgb(15 33 54 / 0.5) 100%);
	--image-card-overlay: linear-gradient(180deg, rgb(15 33 54 / 0) 60%, rgb(15 33 54 / 0.45) 100%);
	--shadow-large: 0 18px 50px rgb(30 40 50 / 0.18);
	--ease: cubic-bezier(0.22, 1, 0.36, 1);
	--eo: cubic-bezier(0.22, 1, 0.36, 1);
	--eo2: cubic-bezier(0.16, 1, 0.3, 1);
	--container-wide: 77.5rem;
	--container-narrow: 50rem;
	--space-1: 0.35rem;
	--space-2: 0.75rem;
	--space-3: 1.25rem;
	--space-4: 2rem;
	--space-5: 3rem;
	--space-6: 4.5rem;
	--space-7: 6rem;
	--space-8: 8rem;
	--step--1: clamp(0.86rem, 0.82rem + 0.2vw, 0.95rem);
	--step-0: clamp(1rem, 0.96rem + 0.25vw, 1.12rem);
	--step-1: clamp(1.18rem, 1.08rem + 0.45vw, 1.38rem);
	--step-2: clamp(1.42rem, 1.23rem + 0.8vw, 1.85rem);
}
