/* ==========================================================================
   Highlands Ranch Resort — design tokens ("Quiet Basalt")
   Palette drawn from the place: volcanic basalt, pine forest, meadow sage,
   ash/linen, a single ember accent, and the dusk sky over Childs Meadow.
   ========================================================================== */
:root {
  /* Color */
  --bone: #f3eee4;          /* page background: ash / linen */
  --bone-2: #ebe4d6;        /* subtle panels */
  --paper: #faf7f1;         /* cards */
  --basalt: #1f1d1b;        /* text, dark bands */
  --basalt-2: #2a2724;
  --pine: #1f4a33;          /* primary — tuned to the logo's forest green */
  --pine-2: #2f5e45;
  --sage: #8a9a7b;          /* meadow */
  --sage-soft: #d9ddcf;
  --cinder: #5f574f;        /* muted text (AA on bone) */
  --ember: #a8432a;         /* the one hot accent — Book buttons & key CTAs */
  --ember-2: #8f3621;
  --dusk: #1d2a36;          /* night sections */
  --dusk-2: #2b3a4a;
  --line: rgba(31, 29, 27, 0.14);
  --line-light: rgba(243, 238, 228, 0.22);

  /* Type */
  --font-display: "Fraunces", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --font-body: "Source Sans 3", "Segoe UI", system-ui, -apple-system, sans-serif;

  --step--1: clamp(0.83rem, 0.8rem + 0.15vw, 0.92rem);
  --step-0: clamp(1.02rem, 0.98rem + 0.2vw, 1.13rem);
  --step-1: clamp(1.2rem, 1.1rem + 0.45vw, 1.45rem);
  --step-2: clamp(1.45rem, 1.25rem + 0.9vw, 1.95rem);
  --step-3: clamp(1.8rem, 1.45rem + 1.6vw, 2.75rem);
  --step-4: clamp(2.25rem, 1.6rem + 3vw, 4.1rem);
  --step-5: clamp(2.6rem, 1.7rem + 4.4vw, 5.4rem);

  /* Space */
  --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: clamp(3.5rem, 2.5rem + 4vw, 6rem);
  --space-9: clamp(4.5rem, 3rem + 6vw, 8.5rem);

  --gutter: clamp(1rem, 0.5rem + 2.5vw, 2.5rem);
  --max: 76rem;
  --max-text: 40rem;

  --radius: 6px;
  --radius-lg: 14px;
  --shadow: 0 1px 2px rgba(31, 29, 27, 0.06), 0 8px 28px rgba(31, 29, 27, 0.08);
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --header-h: 4.5rem;
}
