/* ==========================================================================
   VIBE Budapest — Design Tokens
   Re-themes the MÁK token-driven static baseline into the green–gold world.
   Architecture (container, gutters, header height, img-frame, scrim, serif+sans)
   is inherited from MÁK; only the *values* are re-pointed to green/gold.
   Palette + type are LOCKED in TASK.md; confirm exact hexes with client at review.
   ========================================================================== */

:root {
  /* --- Canvas / surfaces ------------------------------------------------ */
  --bg:        #002a0c;            /* deep forest green — dominant surface + footer */
  --bg-2:      #06381a;            /* lifted green — alternating bands (reads vs --bg) */
  --bg-deep:   #001b07;            /* darker green — hero scrims, footer base       */
  --paper:     #F4EFE4;            /* ivory paper — sparing light/contrast sections */
  --paper-2:   #ece4d2;            /* paper alt                                     */

  /* --- Ink -------------------------------------------------------------- */
  --ink:        #F4EFE4;           /* ivory headlines / primary text on green       */
  --ink-soft:   rgba(244,239,228,.74);
  --ink-mute:   rgba(244,239,228,.55);
  --ink-faint:  rgba(244,239,228,.32);
  --ink-on-paper:      #1c2419;    /* dark green-ink for text on paper sections     */
  --ink-on-paper-soft: rgba(28,36,25,.70);

  /* --- Accent: warm metallic gold — JEWELLERY ONLY --------------------- */
  /* hairlines, small uppercase labels, button outlines, wordmark, hovers   */
  --accent:       #C9A24B;
  --accent-soft:  #d8b76a;         /* hover / lighter gold                          */
  --accent-deep:  #a8843a;         /* pressed / darker gold                         */
  --accent-faint: rgba(201,162,75,.30);

  /* --- Lines / hairlines ----------------------------------------------- */
  --line:          rgba(201,162,75,.34);   /* gold hairline on green                */
  --line-soft:     rgba(244,239,228,.16);  /* ivory hairline, subtle                */
  --line-on-paper: rgba(28,36,25,.16);

  /* --- Photo system (scrim + framed corners) --------------------------- */
  --scrim:        linear-gradient(180deg, rgba(0,29,8,.10) 0%, rgba(0,29,8,.30) 45%, rgba(0,29,8,.86) 100%);
  --scrim-soft:   linear-gradient(180deg, rgba(0,29,8,0) 0%, rgba(0,29,8,.55) 100%);
  --scrim-side:   linear-gradient(90deg, rgba(0,29,8,.78) 0%, rgba(0,29,8,.25) 55%, rgba(0,29,8,0) 100%);
  --img-frame:    clamp(10px, 1.4vw, 18px);   /* soft rounded photo corners (COYA)  */

  /* --- Layout ----------------------------------------------------------- */
  --max:       1320px;
  --max-narrow: 880px;             /* centred serif statement blocks                */
  --gutter:    clamp(20px, 4vw, 64px);
  --header-h:  100px;              /* slim header                                   */
  --header-h-scrolled: 76px;

  /* --- Section rhythm (MÁK restraint — generous, disciplined) ---------- */
  --section-y: clamp(48px, 6vw, 96px);
  --block-gap: clamp(28px, 4vw, 64px);

  /* --- Type families ---------------------------------------------------- */
  --serif: "Playfair Display", "Georgia", "Times New Roman", serif;  /* display    */
  --sans:  "Gotham", "Montserrat", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;

  /* --- Fluid type scale (one confident serif headline per section) -----
     Tuned for Playfair Display, which has a much larger x-height than the
     Cormorant Garamond this baseline started from: the whole display scale is
     ~12% smaller so headlines sit at the same optical size. --------------- */
  --fs-display: clamp(2.3rem, 5.2vw, 4.6rem);   /* hero headline                    */
  --fs-h1:      clamp(1.95rem, 3.9vw, 3.3rem);  /* section headline                 */
  --fs-h2:      clamp(1.5rem, 2.6vw, 2.2rem);
  --fs-h3:      clamp(1.18rem, 1.8vw, 1.5rem);
  --fs-lead:    clamp(1.05rem, 1.5vw, 1.32rem); /* intro / lead paragraph           */
  --fs-body:    clamp(.98rem, 1.05vw, 1.06rem);
  --fs-label:   .72rem;            /* small uppercase letter-spaced labels          */

  --ls-label:  .2em;               /* label letter-spacing (Gotham is already wide) */
  --ls-wide:   .11em;

  /* --- Motion ----------------------------------------------------------- */
  --ease:   cubic-bezier(.22, .61, .36, 1);
  --t-fast: .18s;
  --t-med:  .34s;

  --z-header: 100;
  --z-menu:   120;
}