/**
 * Cristaline design tokens.
 *
 * Palette hexes are fixed by the brand — do not adjust without approval.
 * --color-sale (#8E2633) is reserved: sale badge, sale price, and the
 * "Soldes" nav item (via the manual .nav-sale class) ONLY. Every other
 * button/link/CTA uses --color-gold.
 */

:root {
	/* Palette */
	--color-bg: #F8F7F4;
	--color-bg-alt: #EDF1F2;
	--color-ink: #171717;
	--color-accent-soft: #C9DDE2;
	--color-neutral: #A8B0B3;
	--color-gold: #C5AD8A;
	--color-gold-hover: #B49873;
	--color-sale: #8E2633;

	/* 0.2.0-dev.4: "dark chrome" palette — header + footer only (the client's
	   own explicit brief for this round: a dark premium header/footer,
	   everything else on the site stays on the light palette above).
	   --color-chrome-bg reuses --color-ink verbatim rather than introducing
	   a literal 2nd near-black hex — the client's own spec allows "#171A1F
	   ou une teinte charbon très proche", and #171717 already qualifies, so
	   nothing new is needed there. --color-chrome-accent reuses --color-gold
	   verbatim for the same reason (the client's requested champagne accent,
	   #C5AD8A, IS this token's existing value). Only --color-chrome-text-muted
	   and --color-chrome-border are genuinely new values (a light-on-dark
	   secondary text tint and a translucent white divider), since nothing in
	   the existing light-mode palette can substitute for either on a dark
	   background. */
	--color-chrome-bg: var(--color-ink);
	--color-chrome-text: var(--color-bg);
	--color-chrome-text-muted: rgba(248, 247, 244, .68);
	--color-chrome-accent: var(--color-gold);
	--color-chrome-accent-hover: var(--color-gold-hover);
	--color-chrome-border: rgba(255, 255, 255, .12);

	/* Type — self-hosted webfonts (decision D5), matched to the reference
	   site. System stacks are the fallback while a font is loading
	   (font-display: swap, see fonts.css) or if it fails to load. */
	--font-heading: "Hedvig Letters Serif", Georgia, "Times New Roman", Times, serif;
	--font-body: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--font-nav: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	/* Spacing (4px base) */
	--space-1: .25rem;
	--space-2: .5rem;
	--space-3: .75rem;
	--space-4: 1rem;
	--space-6: 1.5rem;
	--space-8: 2rem;
	--space-12: 3rem;
	--space-16: 4rem;

	/* Radius / shadow */
	--radius-sm: 2px;
	--radius-md: 6px;
	--radius-pill: 999px;
	--shadow-card: 0 2px 12px rgba(23, 23, 23, .06);

	/* Layout */
	--container-max: 1280px;

	/* Breakpoints (documented here, used directly in @media queries) */
	/* sm 480 . md 768 . lg 1024 . xl 1280 */
}