/**
 * LOBNA Design System v1.
 * Brand values live here so templates and components share one visual language.
 */
:root {
	/* Brand color system */
	--color-navy: #172b60;
	--color-deep-navy: #1a2b4d;
	--color-ivory: #fcf9f2;
	--color-soft-ivory: #f7f4ed;
	--color-white: #ffffff;
	--color-gold: #ba9a5a;
	--color-text: #1a2b4d;
	--color-text-muted: #626773;
	--color-border: #e5ded2;
	--color-background: var(--color-ivory);
	--color-surface: var(--color-soft-ivory);
	--color-focus: var(--color-navy);

	/* Font families: intentionally no remote font requests. */
	--font-family-heading: "Cormorant Garamond", Georgia, serif;
	--font-family-body: "Manrope", Arial, sans-serif;

	/* Fluid type scale */
	--font-size-xs: 0.75rem;
	--font-size-sm: 0.875rem;
	--font-size-base: 1rem;
	--font-size-lg: clamp(1.0625rem, 0.99rem + 0.24vw, 1.25rem);
	--font-size-xl: clamp(1.5rem, 1.32rem + 0.58vw, 2rem);
	--font-size-2xl: clamp(2.125rem, 1.72rem + 1.3vw, 3.25rem);
	--font-size-3xl: clamp(3rem, 2.1rem + 2.9vw, 5.5rem);

	/* Approved 4–144px spacing scale */
	--space-0: 0;
	--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: 5rem;
	--space-10: 7rem;
	--space-11: 9rem;

	/* Content and container widths */
	--container-reading: 45rem;
	--container-standard: 73.75rem;
	--container-wide: 85rem;
	--container-max: 90rem;
	--layout-gutter: var(--space-4);

	/* Editorial shape language */
	--radius-none: 0;
	--radius-soft: 0.125rem;

	/* Motion */
	--ease-lobna: cubic-bezier(0.22, 1, 0.36, 1);
	--duration-micro: 180ms;
	--duration-reveal: 480ms;
	--duration-emphasis: 680ms;
	--transition-micro: var(--duration-micro) var(--ease-lobna);
	--transition-reveal: var(--duration-reveal) var(--ease-lobna);

	/* Layer order */
	--z-base: 0;
	--z-header: 100;
	--z-overlay: 200;
	--z-modal: 300;
}