/**
 * Seymour design tokens.
 *
 * Every colour, font, size, space and radius from STYLE-GUIDE.md sections 2 to 6.
 * Templates and theme.css use these names only, so a rebrand is a change to this one file.
 *
 * Fonts are self-hosted. Newsreader (headings, since October 23, 2026; Fraunces before it) and
 * Hanken Grotesk are under the SIL Open Font Licence 1.1; the licence sits beside each font in
 * assets/fonts/. The Fraunces files stay in assets/fonts/fraunces for the record.
 */

/* ------------------------------------------------------------------
 * Fonts. Files from the Google Fonts CSS API, split by character set.
 * The browser only downloads a file when the page uses its characters.
 * ------------------------------------------------------------------ */

/* Newsreader, italic, latin-ext (variable: optical size 6 to 72, weight 300 to 700) */
@font-face {
	font-family: "Newsreader";
	font-style: italic;
	font-weight: 300 700;
	font-display: swap;
	src: url("../fonts/newsreader/newsreader-italic-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Newsreader, italic, latin (variable: optical size 6 to 72, weight 300 to 700) */
@font-face {
	font-family: "Newsreader";
	font-style: italic;
	font-weight: 300 700;
	font-display: swap;
	src: url("../fonts/newsreader/newsreader-italic-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Newsreader, normal, latin-ext (variable: optical size 6 to 72, weight 300 to 700) */
@font-face {
	font-family: "Newsreader";
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url("../fonts/newsreader/newsreader-normal-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Newsreader, normal, latin (variable: optical size 6 to 72, weight 300 to 700) */
@font-face {
	font-family: "Newsreader";
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url("../fonts/newsreader/newsreader-normal-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Hanken Grotesk, normal, cyrillic-ext */
@font-face {
	font-family: "Hanken Grotesk";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/hanken-grotesk/hanken-grotesk-cyrillic-ext.woff2") format("woff2");
	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* Hanken Grotesk, normal, vietnamese */
@font-face {
	font-family: "Hanken Grotesk";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/hanken-grotesk/hanken-grotesk-vietnamese.woff2") format("woff2");
	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

/* Hanken Grotesk, normal, latin-ext */
@font-face {
	font-family: "Hanken Grotesk";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/hanken-grotesk/hanken-grotesk-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Hanken Grotesk, normal, latin */
@font-face {
	font-family: "Hanken Grotesk";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/hanken-grotesk/hanken-grotesk-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ------------------------------------------------------------------
 * Tokens. Phone values first; desktop values from 900 px.
 * ------------------------------------------------------------------ */

:root {
	/* Brand (section 2). */
	--navy: #1E3A5F;
	--gold: #C9A84C;

	/* Navy tints. */
	--navy-900: #152A45;
	--navy-700: #1E3A5F;
	--navy-100: #E8EDF3;

	/* Gold tints. Gold-500 is never text on white. Gold-800 is the only gold for small text on white. */
	--gold-200: #E9D9A6;
	--gold-hover: #E9D9A6; /* gold buttons on navy lighten to this on hover; sections never redefine it (Kaz, October 22, 2026) */
	--gold-500: #C9A84C;
	/* Gold-700: large text on white only (headlines, 3:1 or better), and a fill under white text. */
	--gold-700: #9C7B2E;
	--gold-800: #7A5E1C;

	/* Footer (Kaz, October 20, 2026): flat deep navy under a gold accent bar. */
	--footer-bg: #0A1628;
	--footer-accent: linear-gradient(90deg, #0A1628, #C9A84C 30%, #E8C97A 50%, #C9A84C 70%, #0A1628);
	--footer-accent-height: 3px;
	--footer-photo-opacity: 0.15;
	/* Small grey text on the footer: about 8.6:1 on #0A1628. */
	--footer-muted: #A9B4C2;
	/* Gold text on the footer navy: the brand gold, about 8:1 on #0A1628. */
	--footer-gold: #C9A84C;
	/* The listing pages' strip under the photo: the footer navy at 70%. */
	--listing-bar-bg: rgba(10, 22, 40, 0.7);

	/* Neutrals. */
	--white: #FFFFFF;
	--cream: #F7F5F0;
	--ink: #2B2F36;
	--grey-600: #5F6B7A;
	--line: #DDE3EA;
	--error: #B42318;
	--success: #1E6B3A;

	/* Fonts (section 3). opsz follows the size on its own. */
	--font-serif: "Newsreader", Georgia, "Times New Roman", serif;
	--font-serif-settings: normal; /* Newsreader has no SOFT or WONK axes; optical size follows the font size on its own. */
	--font-sans: "Hanken Grotesk", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;

	/* Weights. The serif never goes above 500. Bold is the sans at 600. */
	--weight-regular: 400;
	--weight-medium: 500;
	--weight-semibold: 600;

	/* Type scale (section 4), phone sizes. */
	--fs-display: 44px;
	--fs-h1: 36px;
	--fs-h2: 28px;
	--fs-h3: 22px;
	--fs-h4: 17px;
	--fs-lead: 19px;
	--fs-body: 19px; /* 17 px until October 22, 2026: two sizes up (Kaz) */
	--fs-link: 17px;
	--fs-nav: 12px; /* the page menu and small text links keep the old label size (Kaz, October 22, 2026) */ /* arrow links keep the old body size (Kaz, October 22, 2026) */
	--fs-price: 28px;
	--fs-price-card: 18px;
	--fs-meta: 14px;
	--fs-eyebrow: 14px; /* 12 px until October 22, 2026: gold labels two sizes up (Kaz) */
	--fs-button: 15px;
	--fs-card-title: 24px;
	--fs-fact-value: 24px;

	--lh-display: 1.05;
	--lh-heading: 1.25;
	--lh-tight: 1.15;
	--lh-body: 1.6;

	--tracking-eyebrow: 0.1em;
	--tracking-button: 0.02em;

	/* Spacing (section 5). Base unit 4 px. */
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 24px;
	--space-6: 32px;
	--space-7: 48px;
	--space-8: 64px;
	--space-9: 96px;
	--space-10: 128px;

	--space-section: 64px;
	--space-block: 32px;
	--space-card: 24px;
	--gutter: 20px;
	--container: 1200px;
	--measure: 680px;
	--grid-gap: 24px;

	/* Shape. Nothing is a pill. Photos have no radius. */
	--radius: 2px;
	--border-button: 1.5px;
	--shadow-call-bar: 0 -2px 8px rgba(30, 58, 95, 0.08);

	/* Components (sections 6 and 10). */
	--button-height: 48px;
	--input-height: 48px;
	--touch-target: 44px;
	--header-height: 60px;
	--call-bar-height: 56px;
	--icon-size: 24px;
	--icon-size-button: 20px;
	--icon-stroke: 1.5px;
	--focus-ring: 2px solid var(--gold-500);
	--focus-offset: 2px;
	--transition: 150ms ease;

	/*
	 * GeneratePress reads its own colour names. Point them at ours so anything
	 * GeneratePress draws matches the brand. These load after GeneratePress, so ours win.
	 */
	--contrast: var(--ink);
	--contrast-2: var(--grey-600);
	--contrast-3: var(--line);
	--base: var(--navy-100);
	--base-2: var(--cream);
	--base-3: var(--white);
	--accent: var(--navy);
}

@media (min-width: 900px) {
	:root {
		--fs-display: 72px;
		--fs-h1: 52px;
		--fs-h2: 38px;
		--fs-h3: 24px;
		--fs-h4: 18px;
		--fs-lead: 21px;
		--fs-body: 20px;
		--fs-link: 18px;
		--fs-nav: 13px;
		--fs-price: 32px;
		--fs-price-card: 20px;
		--fs-meta: 15px;
		--fs-eyebrow: 15px;
		--fs-button: 16px;

		--space-section: 96px;
		--space-block: 48px;
		--gutter: 40px;
		--header-height: 72px;
	}
}