/*
 * OBSSEZ design tokens.
 * All colors, type, spacing and motion values are defined once here as custom
 * properties. Customizer overrides for brand colors are injected after this
 * file (see inc/customizer-render.php) so store settings always win.
 */

:root {
	/* ---------- Brand palette ---------- */
	--olive: #4A5233;
	--olive-deep: #333B22;
	--olive-soft: #6B7350;
	--ivory: #F7F3EA;
	--cream: #FBF9F3;
	--beige: #E7DFCF;
	--beige-deep: #D8CDB6;
	--grey: #8C8A85;
	--grey-soft: #B7B4AD;
	--ink: #1C1B18;
	--ink-soft: #43413B;
	--gold: #B08D4C;
	--gold-soft: #C9AC77;
	--white: #FFFFFF;

	/* ---------- Semantic roles ---------- */
	--color-bg: var(--cream);
	--color-bg-alt: var(--ivory);
	--color-bg-contrast: var(--olive);
	--color-surface: var(--white);
	--color-text: var(--ink);
	--color-text-muted: var(--ink-soft);
	--color-text-faint: var(--grey);
	--color-heading: var(--olive-deep);
	--color-line: rgba(28, 27, 24, 0.12);
	--color-line-soft: rgba(28, 27, 24, 0.07);
	--color-accent: var(--gold);
	--color-link: var(--olive);
	--color-link-hover: var(--gold);
	--color-sale: #8A3B2B;
	--color-success: #4A5233;

	/* ---------- Typography ---------- */
	--font-heading: "Cormorant Garamond", "Iowan Old Style", "Palatino Linotype", Palatino, "Times New Roman", serif;
	--font-body: "Jost", "Helvetica Neue", Helvetica, Arial, system-ui, -apple-system, sans-serif;

	--fs-display: clamp(2.75rem, 1.6rem + 5vw, 5rem);
	--fs-h1: clamp(2.25rem, 1.5rem + 3.2vw, 3.5rem);
	--fs-h2: clamp(1.9rem, 1.4rem + 2.2vw, 2.75rem);
	--fs-h3: clamp(1.4rem, 1.15rem + 1vw, 1.85rem);
	--fs-h4: 1.25rem;
	--fs-lead: clamp(1.05rem, 1rem + 0.35vw, 1.25rem);
	--fs-body: 1.0625rem;
	--fs-small: 0.875rem;
	--fs-eyebrow: 0.75rem;

	--lh-tight: 1.12;
	--lh-heading: 1.18;
	--lh-body: 1.72;

	--tracking-eyebrow: 0.22em;
	--tracking-caps: 0.08em;

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

	--section-pad-y: clamp(3.5rem, 2rem + 7vw, 8rem);
	--gutter: clamp(1.25rem, 0.5rem + 3vw, 3rem);

	/* ---------- Layout ---------- */
	--container: 1280px;
	--container-narrow: 940px;
	--container-text: 680px;
	--radius-sm: 2px;
	--radius: 4px;
	--radius-lg: 10px;
	--radius-pill: 999px;

	/* ---------- Elevation ---------- */
	--shadow-sm: 0 1px 2px rgba(28, 27, 24, 0.05);
	--shadow: 0 12px 40px -18px rgba(28, 27, 24, 0.28);
	--shadow-lg: 0 40px 90px -40px rgba(28, 27, 24, 0.4);

	/* ---------- Motion ---------- */
	--ease: cubic-bezier(0.22, 1, 0.36, 1);
	--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--dur-fast: 160ms;
	--dur: 320ms;
	--dur-slow: 620ms;

	/* ---------- Chrome ---------- */
	--header-h: 76px;
	--announcement-h: 40px;
	--z-header: 100;
	--z-drawer: 200;
	--z-overlay: 190;
	--z-float: 90;
}

@media (max-width: 782px) {
	:root {
		--header-h: 64px;
		--announcement-h: 36px;
		--fs-body: 1rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--dur-fast: 0ms;
		--dur: 0ms;
		--dur-slow: 0ms;
	}
}