/* Amora — design tokens. Mirrors DESIGN.md. Never hardcode hex/px elsewhere. */

:root {
  /* Brand palette */
  --ivory: #F4F1EA;
  --soft-stone: #D9D3C7;
  --dusty-rose: #8F6A73;
  --oxblood: #6B3F4A;
  --olive-taupe: #8A7658;
  --deep-petrol: #213432;
  --ink: #111111;

  /* Functional aliases */
  --bg-primary: var(--ivory);
  --bg-secondary: var(--soft-stone);
  --bg-tile: #EDE8DD;          /* Subtle frame for catalogue tiles — barely darker than ivory */
  --bg-dark: var(--deep-petrol);
  --text-primary: var(--ink);
  --text-secondary: var(--deep-petrol);
  --text-muted: rgba(17, 17, 17, 0.6);
  --text-on-dark: var(--ivory);
  --accent: var(--oxblood);
  --accent-hover: var(--dusty-rose);
  --rule: rgba(17, 17, 17, 0.12);
  --rule-on-dark: rgba(244, 241, 234, 0.18);

  /* Typography stacks */
  --font-serif: 'Gilda Display', 'Cormorant Garamond', Georgia, serif;
  --font-sans: 'Roboto', 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'Space Mono', 'JetBrains Mono', ui-monospace, monospace;

  /* Fluid type scale */
  --font-display: clamp(2.5rem, 6vw, 5rem);
  --font-h1: clamp(2rem, 4vw, 3.5rem);
  --font-h2: clamp(1.5rem, 3vw, 2.5rem);
  --font-h3: clamp(1.25rem, 2vw, 1.75rem);
  --font-body: 1rem;
  --font-small: 0.875rem;
  --font-caption: 0.75rem;

  /* Line heights */
  --lh-display: 1.15;
  --lh-heading: 1.3;
  --lh-body: 1.6;
  --lh-mono: 1.5;

  /* Letter spacing */
  --tracking-default: 0;
  --tracking-loose: 0.05em;
  --tracking-uppercase: 0.1em;
  --tracking-nav: 0.15em;
  --tracking-wordmark: 0.3em;

  /* Spacing scale (8px modular) */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 2rem;
  --space-lg: 4rem;
  --space-xl: 6rem;
  --space-2xl: 10rem;

  /* Layout */
  --container-max: 1440px;
  --container-pad: clamp(1.5rem, 5vw, 4rem);
  --header-height: 96px;
  --header-height-scrolled: 72px;

  /* Motion */
  --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --transition-fast: 200ms var(--ease);
  --transition-base: 400ms var(--ease);
  --transition-slow: 700ms var(--ease);

  /* Z-index */
  --z-header: 100;
  --z-overlay: 200;
  --z-modal: 300;
}
