/* ============================================================
   HALE & CROW — DESIGN TOKENS
   Single source of truth. No color, easing, duration, radius,
   or spacing value may be hardcoded anywhere else.
   ============================================================ */

:root {
  /* ---- Color ---- */
  --clr-bg:        #141110;  /* Charred Umber — page base */
  --clr-surface:   #221C18;  /* Smoked Walnut — panels, menu overlay */
  --clr-surface-2: #2C2420;  /* hover / raised */
  --clr-text:      #EDE6DA;  /* Bone */
  --clr-muted:     #9B8F81;  /* Ash Taupe */
  --clr-brass:     #C29A5E;  /* hairlines, numerals, hover underline */
  --clr-brass-dim: #8F6F3E;  /* borders at rest */
  --clr-ember:     #C25A3A;  /* THE booking CTA only — one per viewport */
  --clr-ink:       #0C0A09;  /* footer well, deepest layer */

  /* Derived alphas (kept here so components never invent rgba) */
  --clr-bg-95:       rgba(20, 17, 16, 0.95);
  --clr-ink-40:      rgba(12, 10, 9, 0.4);
  --clr-ink-85:      rgba(12, 10, 9, 0.85);
  --clr-brass-15:    rgba(194, 154, 94, 0.15);
  --clr-brass-30:    rgba(194, 154, 94, 0.3);

  /* ---- Typography ---- */
  --ff-display: 'Boska', 'Iowan Old Style', Georgia, serif;
  --ff-text:    'General Sans', 'Avenir Next', 'Segoe UI', sans-serif;
  --ff-mono:    'JetBrains Mono', ui-monospace, 'SF Mono', monospace;

  --fs-hero:    clamp(3.2rem, 11vw, 10rem);
  --fs-h2:      clamp(2.4rem, 5.5vw, 4.8rem);
  --fs-h3:      clamp(2rem, 3.4vw, 3rem);
  --fs-menu:    clamp(2.4rem, 4.5vw, 4.4rem);
  --fs-quote:   clamp(2rem, 4.2vw, 3.6rem);
  --fs-body:    clamp(1rem, 1.15vw, 1.125rem);
  --fs-small:   0.875rem;
  --fs-mono:    0.8125rem;
  --fs-label:   0.6875rem;   /* 11px eyebrow, letterspaced caps */
  --fs-footer-mark: clamp(4.5rem, 14vw, 15rem);

  --ls-label:   0.14em;
  --ls-wordmark: 0.22em;
  --lh-tight:   1.04;
  --lh-display: 1.12;
  --lh-body:    1.65;

  /* ---- Space ---- */
  --sp-1:  0.5rem;
  --sp-2:  1rem;
  --sp-3:  1.5rem;
  --sp-4:  2.5rem;
  --sp-5:  4rem;
  --sp-section: clamp(6rem, 12vw, 11rem);   /* vertical rhythm between sections */
  --sp-gutter:  clamp(1.25rem, 4vw, 4rem);  /* page side padding */

  /* ---- Shape ---- */
  --radius-frame: 2px;      /* image frames */
  --radius-pill:  999px;    /* CTA pills */
  --hairline: 1px;

  /* ---- Motion ---- */
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-inout: cubic-bezier(0.85, 0, 0.15, 1);
  --dur-fast: 250ms;
  --dur-mid:  600ms;
  --dur-slow: 1100ms;

  /* ---- Layers ---- */
  --z-grain:     90;
  --z-nav:       100;
  --z-menu:      110;
  --z-cursor:    120;
  --z-lightbox:  130;
  --z-preloader: 140;
}