/* ==========================================================================
   Reservations Group — Design Tokens
   Single source of truth for color, type, spacing, and motion.
   ========================================================================== */

:root {
  /* --- Core palette --------------------------------------------------- */
  --ink: #0a1a2f;          /* midnight navy — primary text & dark surfaces */
  --ink-800: #10263f;
  --ink-700: #1b3a56;
  --ink-600: #2c5069;      /* slate — secondary cool tone */
  --paper: #f6f3ec;        /* warm cream — primary light surface */
  --paper-100: #fbf9f4;
  --paper-300: #ece7db;    /* hairline / muted fills */
  --white: #ffffff;

  --accent: #c25a34;       /* burnt copper — signal accent */
  --accent-600: #a8492a;
  --accent-100: #f0d9cd;

  --muted: #5b6b7a;        /* muted body text on light */
  --muted-on-dark: #9fb2c4;

  /* --- Semantic surfaces --------------------------------------------- */
  --surface: var(--paper);
  --surface-alt: var(--paper-100);
  --text: var(--ink);
  --text-muted: var(--muted);
  --hairline: color-mix(in srgb, var(--ink) 12%, transparent);
  --hairline-strong: color-mix(in srgb, var(--ink) 22%, transparent);

  /* --- Typography ----------------------------------------------------- */
  --font-display: "Fraunces", "Times New Roman", serif;
  --font-body: "Hanken Grotesk", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", monospace;

  /* Fluid type scale (clamp: min, preferred vw, max) */
  --step--1: clamp(0.78rem, 0.74rem + 0.18vw, 0.88rem);
  --step-0:  clamp(0.98rem, 0.93rem + 0.24vw, 1.12rem);
  --step-1:  clamp(1.2rem, 1.1rem + 0.5vw, 1.55rem);
  --step-2:  clamp(1.5rem, 1.3rem + 1vw, 2.2rem);
  --step-3:  clamp(1.95rem, 1.6rem + 1.8vw, 3.1rem);
  --step-4:  clamp(2.5rem, 1.9rem + 3vw, 4.4rem);
  --step-5:  clamp(3rem, 2rem + 5vw, 6.5rem);

  --leading-tight: 1.04;
  --leading-snug: 1.22;
  --leading-normal: 1.62;

  --tracking-tight: -0.02em;
  --tracking-wide: 0.14em;

  /* --- Spacing (based on 8px rhythm) ---------------------------------- */
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-3xl: 9rem;

  /* --- Layout --------------------------------------------------------- */
  --measure: 68ch;
  --container: 1240px;
  --container-wide: 1440px;
  --gutter: clamp(1.25rem, 5vw, 4rem);
  --radius: 4px;
  --radius-lg: 10px;

  /* --- Motion --------------------------------------------------------- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 180ms;
  --dur: 420ms;
  --dur-slow: 720ms;

  /* --- Elevation ------------------------------------------------------ */
  --shadow-sm: 0 1px 2px rgba(10, 26, 47, 0.06);
  --shadow-md: 0 10px 30px -12px rgba(10, 26, 47, 0.22);
  --shadow-lg: 0 30px 60px -20px rgba(10, 26, 47, 0.35);

  color-scheme: light;
}