/*
 * Light is the default theme. The site always starts in light unless the
 * visitor explicitly toggles dark (data-theme="dark"). Do not bind theme
 * to prefers-color-scheme.
 */

:root {
	/* Brand primitives */
	--olv-cream: #f7f3ec;
	--olv-sand: #ebe4d8;
	--olv-beige: #d9cfc0;
	--olv-ivory: #fbf9f5;
	--olv-ink: #1a1814;
	--olv-stone: #6b6560;
	--olv-olive: #5a7a3a;
	--olv-olive-bright: #6b9a3e;
	--olv-near-black: #0c0b09;
	--olv-charcoal: #161411;
	--olv-white: #ffffff;

	/* Semantic colour — light (default) */
	--bg-base: var(--olv-cream);
	--bg-surface: var(--olv-sand);
	--bg-elevated: var(--olv-ivory);
	--bg-inverse: var(--olv-near-black);
	--text-primary: var(--olv-ink);
	--text-secondary: var(--olv-stone);
	--text-on-inverse: var(--olv-cream);
	--accent: var(--olv-ink);
	--border-color: rgba(26, 24, 20, 0.14);
	--detail-accent: var(--olv-olive);
	--hero-shade: rgba(26, 24, 20, 0.35);
	--header-on-hero: #ffffff;

	/* Typography */
	--font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
	--font-body: "Jost", "Segoe UI", sans-serif;

	--fs-hero: clamp(3rem, 8vw, 5.5rem);
	--fs-h1: clamp(2.5rem, 5vw, 3.75rem);
	--fs-h2: clamp(2.1rem, 4vw, 3.15rem);
	--fs-h3: clamp(1.25rem, 2vw, 1.65rem);
	--fs-body: 1.0625rem;
	--fs-eyebrow: 0.6875rem;
	--fs-small: 0.875rem;

	/* Spacing */
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-5: 1.5rem;
	--space-6: 2rem;
	--space-7: 3rem;
	--space-8: 4rem;
	--space-9: 6.5rem;
	--space-10: 8.5rem;

	--radius: 0;
	/* Thin site header height */
	--header-h: 3.75rem;

	/* Motion */
	--ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
	--ease-premium: cubic-bezier(0.16, 1, 0.3, 1);
	--duration-fast: 150ms;
	--duration-base: 300ms;
	--duration-slow: 800ms;

	/* Breakpoints (documentation only) */
	/* 641px / 1025px / 1441px */
}

[data-theme="dark"] {
	--bg-base: var(--olv-near-black);
	--bg-surface: var(--olv-charcoal);
	--bg-elevated: #1e1b17;
	--bg-inverse: var(--olv-cream);
	--text-primary: var(--olv-cream);
	--text-secondary: #a39e96;
	--text-on-inverse: var(--olv-ink);
	--accent: var(--olv-cream);
	--border-color: rgba(247, 243, 236, 0.16);
	--detail-accent: var(--olv-olive-bright);
	--hero-shade: rgba(0, 0, 0, 0.45);
	--header-on-hero: var(--olv-cream);
}
