/* PELICANO — design tokens
   Two palettes under one wordmark.
   .theme-riviera  = restaurant / events / default (navy, off-white, coral red)
   .theme-disco    = club pages & night sections (black, magenta, violet, chrome)
   Use semantic tokens (--bg, --fg, --accent) in components; never raw palette values. */

:root {
  /* Palette — Riviera */
  --navy-900: #0A1230;
  --navy-800: #0E1B3A;
  --navy-700: #16295A;
  --navy-100: #D9DEEB;
  --cream-100: #F4EFE6;
  --cream-200: #EDE5D6;
  --sand-300: #D9C7A1;
  --timber-500: #B88A5A;
  --coral-500: #E63B2E;
  --coral-600: #C92F24;

  /* Palette — Disco */
  --black-950: #0A0A0A;
  --black-900: #111111;
  --black-800: #1A1A1C;
  --magenta-500: #FF2D95;
  --violet-500: #7B2CFF;
  --acid-400: #C6FF3D;
  --chrome-100: #F2F2F2;
  --chrome-400: #A8A8AD;

  /* Type */
  --font-display: "Jost", "Futura", "Century Gothic", system-ui, sans-serif;
  --font-body: "Manrope", "Inter", system-ui, sans-serif;
  --track-display: 0.12em;
  --track-label: 0.2em;

  --fs-hero: clamp(2.75rem, 8vw, 7rem);
  --fs-h1: clamp(2.25rem, 5.5vw, 4.5rem);
  --fs-h2: clamp(1.75rem, 3.5vw, 2.75rem);
  --fs-h3: clamp(1.25rem, 2vw, 1.5rem);
  --fs-body: clamp(1.0625rem, 1.1vw, 1.125rem);
  --fs-small: 0.875rem;
  --lh-tight: 0.95;
  --lh-body: 1.55;

  /* Space & shape */
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
  --space-6: 1.5rem; --space-8: 2rem; --space-12: 3rem; --space-16: 4rem; --space-24: 6rem;
  --container: 80rem;
  --gutter: clamp(1rem, 4vw, 3rem);
  --radius-sm: 2px;
  --radius-md: 6px;
  --radius-pill: 999px;

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 180ms;
  --dur-med: 420ms;
  --dur-slow: 900ms;

  /* Semantic — default Riviera */
  --bg: var(--cream-100);
  --bg-elev: #FFFFFF;
  --bg-inverse: var(--navy-800);
  --fg: var(--navy-900);
  --fg-muted: #4A5270;
  --fg-inverse: var(--cream-100);
  --accent: var(--coral-500);
  --accent-hover: var(--coral-600);
  --accent-fg: #FFFFFF;
  --line: rgba(14, 27, 58, 0.14);
  --focus: var(--coral-500);
  --grain-opacity: 0;
}

.theme-riviera-dark {
  --bg: var(--navy-800);
  --bg-elev: var(--navy-700);
  --bg-inverse: var(--cream-100);
  --fg: var(--cream-100);
  --fg-muted: var(--navy-100);
  --fg-inverse: var(--navy-900);
  --accent: var(--coral-500);
  --line: rgba(244, 239, 230, 0.16);
}

.theme-disco {
  --bg: var(--black-950);
  --bg-elev: var(--black-800);
  --bg-inverse: var(--chrome-100);
  --fg: var(--chrome-100);
  --fg-muted: var(--chrome-400);
  --fg-inverse: var(--black-950);
  --accent: var(--magenta-500);
  --accent-hover: #FF57AA;
  --accent-fg: var(--black-950);
  --line: rgba(242, 242, 242, 0.14);
  --focus: var(--acid-400);
  --grain-opacity: 0.08;
  /* Accessibility: magenta/violet on black fail AA for small text.
     Use --accent for ≥24px display, buttons with --accent-fg, rules and glows only.
     Body text in disco theme = --fg (chrome). */
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur-med: 0ms; --dur-slow: 0ms; }
}