/* ==========================================================================
   DORIC · Design tokens
   --------------------------------------------------------------------------
   The single source of truth for every colour, size, space, duration and
   easing in the theme. Nothing below this file may contain a raw hex value,
   a magic pixel number or an inline easing curve.

   Contrast ratios in the comments are measured against --d-obsidian.
   ========================================================================== */

:root {
	color-scheme: dark;

	/* ── Colour primitives ─────────────────────────────────────────────── */
	--d-obsidian: #0B0A09;
	--d-surface-1: #121110;
	--d-surface-2: #1A1817;
	--d-surface-3: #201D1B;
	--d-charcoal: #2A2724;
	--d-ivory: #E9E2D7;
	--d-ivory-dim: #D8CFC2;
	--d-taupe: #8A8178;
	--d-stone: #857D75;
	--d-brown: #3A2E23;
	--d-gold: #A8844A;
	--d-gold-raised: #C09B5E;

	/* ── Semantic surfaces ─────────────────────────────────────────────── */
	--d-bg: var(--d-obsidian);
	--d-bg-elevated: var(--d-surface-1);
	--d-bg-overlay: var(--d-surface-2);
	--d-bg-inverse: var(--d-ivory);

	/* ── Semantic text ─────────────────────────────────────────────────── */
	--d-text: #E9E2D7;          /* 15.3:1  AAA */
	--d-text-2: #A8A099;        /*  7.6:1  AAA */
	--d-text-muted: #857D75;    /*  4.8:1  AA  — floor for body copy */
	--d-text-faint: #5E5850;    /*  decorative only, never for content   */
	--d-text-inverse: #0B0A09;
	--d-text-inverse-2: #58514A;

	/* ── Lines ─────────────────────────────────────────────────────────── */
	--d-border: rgba(233, 226, 215, .12);
	--d-border-strong: rgba(233, 226, 215, .24);
	--d-border-faint: rgba(233, 226, 215, .07);
	--d-border-inverse: rgba(11, 10, 9, .14);
	--d-border-inverse-faint: rgba(11, 10, 9, .08);

	/* ── Accent · punctuation only, never paint ────────────────────────── */
	--d-accent: #A8844A;        /*  5.6:1  AA as text on obsidian */
	--d-accent-hover: #C09B5E;
	--d-on-accent: #0B0A09;     /*  5.6:1  AA dark label on gold  */
	--d-focus: #C09B5E;

	/* ── States · desaturated to stay inside the palette ───────────────── */
	--d-success: #7E9C78;
	--d-warning: #C2984B;
	--d-error: #C08074;

	/* ── Typefaces ─────────────────────────────────────────────────────── */
	--d-font-display: "Bodoni Moda", "Bodoni Fallback", Georgia, "Times New Roman", serif;
	--d-font-ui: "Inter", "Inter Fallback", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;

	/* ── Type scale · fluid ────────────────────────────────────────────── */
	--d-fs-display-xl: clamp(3.5rem, 10vw, 9rem);
	--d-fs-display-l: clamp(2.125rem, 5.2vw, 4.25rem);
	--d-fs-h1: clamp(1.875rem, 3.6vw, 3.125rem);
	--d-fs-h2: clamp(1.5rem, 2.6vw, 2.375rem);
	--d-fs-h3: clamp(1.125rem, 1.5vw, 1.375rem);
	--d-fs-body-l: 1.0625rem;
	--d-fs-body: .9375rem;
	--d-fs-small: .8125rem;
	--d-fs-label: .6875rem;
	--d-fs-micro: .625rem;

	--d-lh-tight: 1.02;
	--d-lh-heading: 1.14;
	--d-lh-body: 1.7;

	--d-ls-display: -.015em;
	--d-ls-label: .18em;
	--d-ls-nav: .13em;
	--d-ls-btn: .14em;

	/* ── Space · 4px base ──────────────────────────────────────────────── */
	--d-s1: 4px;
	--d-s2: 8px;
	--d-s3: 12px;
	--d-s4: 16px;
	--d-s5: 20px;
	--d-s6: 24px;
	--d-s7: 32px;
	--d-s8: 40px;
	--d-s9: 48px;
	--d-s10: 64px;
	--d-s11: 80px;
	--d-s12: 96px;
	--d-s13: 120px;
	--d-s14: 160px;

	/* ── Layout ────────────────────────────────────────────────────────── */
	--d-gutter: clamp(16px, 4vw, 64px);
	--d-container: 1560px;
	--d-measure: 62ch;
	--d-measure-editorial: 46ch;
	--d-section-y: clamp(56px, 7.5vw, 128px);
	--d-hairline: 1px;

	/* ── Chrome ────────────────────────────────────────────────────────── */
	--d-header-h: 50px;
	--d-bottomnav-h: 44px;
	/* The bottom bar floats too, and the page has to clear it. */
	--d-bottomnav-gap: 12px;
	/* The bar floats: the gap above and below it is part of the chrome the
	   page has to clear. */
	--d-header-gap: 10px;
	--d-chrome-h: calc(var(--d-header-h) + var(--d-header-gap) * 2);

	/* ── Motion ────────────────────────────────────────────────────────── */
	--d-dur-micro: 120ms;
	--d-dur-fast: 180ms;
	--d-dur-base: 240ms;
	--d-dur-slow: 320ms;
	--d-dur-reveal: 700ms;
	--d-dur-hero: 900ms;
	--d-dur-zoom: 10s;

	--d-ease-out: cubic-bezier(.22, .61, .36, 1);
	--d-ease-inout: cubic-bezier(.65, 0, .35, 1);
	--d-ease-cine: cubic-bezier(.16, 1, .3, 1);

	/* ── Component defaults ────────────────────────────────────────────── */
	--d-r: 3 / 4;                       /* media ratio, overridden per slot  */
	--d-btn-h: 50px;
	--d-r-pill: 999px;                   /* every control, like the chrome */
	--d-tap: 44px;                      /* minimum interactive target        */
	--d-z-header: 100;
	--d-z-overlay: 200;
	--d-z-bottomnav: 90;
}

@media (min-width: 768px) {
	:root {
		--d-header-h: 62px;
		--d-header-gap: 14px;
		--d-btn-h: 48px;
	}
}