/**
 * Haven design tokens.
 *
 * Single source of truth for every color, type, spacing, and motion value.
 * Change a value here once; every component consumes it through var(--token).
 *
 * Confirmed values are labeled CONFIRMED with their source.
 * Everything else is labeled TEMP and must be swapped when the real value
 * arrives — see MISSING-ASSETS.md. Nothing temporary here is presented as final.
 */

:root {

  /* ---- Color: confirmed ---- */
  --color-ash: #2A2624;              /* CONFIRMED — nav build notes, PDF p.3 */

  /* ---- Color: temporary, approximated from the rendered PDF ---- */
  --color-cherry-temp: #7C1425;      /* TEMP — exact hex not in any reference doc; sample from .ai swatches when available */
  --color-noir-temp: #17130F;        /* TEMP — used at 55% for the nav dropdown backdrop dim */
  --color-copper-temp: #A9702F;      /* TEMP — signature/accent tone seen on Collection badges + video frame border, no hex documented anywhere */

  /* ---- Color: base palette ---- */
  --color-cream: #F2EEE6;            /* light section background, sampled visually from About/Catering pages */
  --color-white: #FFFFFF;
  --color-ink: #1C1815;              /* near-black body text on light backgrounds */
  --color-ink-soft: #6B6058;
  --color-paper-on-dark: #F5F1E9;    /* off-white text on dark/photo backgrounds */
  --color-paper-on-dark-soft: rgba(245, 241, 233, 0.72);
  --color-line: #E4DFD5;             /* hairline rules on light backgrounds */
  --color-line-on-dark: rgba(245, 241, 233, 0.18);

  /* ---- Typography ---- */
  /* TEMP: Termina is present only as unlicensed *Test* files (local dev only — see MISSING-ASSETS.md).
     TEMP: the approved headline serif has no source file at all; Playfair Display stands in for it. */
  --font-ui: 'Haven Termina Temp', 'Segoe UI', Arial, sans-serif;      /* nav links, buttons, labels */
  --font-display: 'Haven Display Temp', Georgia, 'Times New Roman', serif; /* editorial headlines (About, Catering, etc.) */
  --font-body: 'Haven Montserrat', 'Segoe UI', Arial, sans-serif;      /* paragraph copy */
  --font-script: 'Haven Roustel', cursive;                              /* accent script, e.g. "Chef's selection" */

  --nav-link-size: 13.5px;           /* CONFIRMED — nav build notes */
  --nav-heading-size: 11.5px;        /* CONFIRMED — nav build notes */
  --nav-heading-tracking: 0.16em;    /* CONFIRMED — nav build notes */

  --fs-000: 0.75rem;
  --fs-00: 0.85rem;
  --fs-0: 0.95rem;
  --fs-1: 1rem;
  --fs-2: 1.25rem;
  --fs-3: 1.75rem;
  --fs-4: 2.5rem;
  --fs-5: 3.5rem;
  --fs-6: 5rem;

  /* ---- Spacing ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* ---- Section rhythm ----
   * Internal breathing room (heading-to-image, image-to-CTA, etc). This is
   * intentionally NOT viewport-height-based — an earlier version compressed
   * padding via clamp(...,6vh,...), which squeezed every section down to fit
   * one screen and made large showcase sections (Collection, Corporate,
   * Catering, Lounges) feel thin and empty on short-height laptop windows.
   * The section's overall cinematic presence is now controlled separately by
   * --section-min-height (see below); this token only sets comfortable
   * internal padding and scales gently with viewport *width* instead. */
  --section-pad-y: clamp(3rem, 5vw, 5.5rem);
  --section-pad-y-lg: clamp(3.5rem, 6vw, 7rem); /* for sections with more internal content stacked (Contact, Collection header) */

  /* ---- Section presence ----
   * Major visual/showcase sections use this as a min-height floor (not a
   * fixed height) so they read as full, composed scenes rather than
   * mathematically fitting inside one screen. Content is always allowed to
   * grow taller than this — never clipped. Small utility CTA bands (e.g.
   * Partner With Us) intentionally use a shorter floor; see their own CSS. */
  --section-min-height: 100svh;
  /* Same value on desktop/tablet — only differs below the mobile breakpoint
     (see the override at the bottom of this file). Sections built as
     normal-flow text+CTA content (Story, Corporate/Catering/Partner
     teasers, Contact, Lounges, the Corporate/Careers page heroes) use THIS
     token instead of --section-min-height directly, so they can size to
     their own content on a phone instead of forcing a mostly-empty
     full-screen-tall card — exactly the "enormous empty card" feedback.
     Structural full-bleed-photo sections (the Collection carousel, whose
     absolutely-positioned slides have no height of their own without a
     real min-height) deliberately keep using --section-min-height directly
     and are unaffected by this. */
  --section-min-height-flow: var(--section-min-height);

  /* ---- Nav dropdown panel: confirmed measurements ---- */
  --nav-panel-inset: 26px;           /* CONFIRMED */
  --nav-panel-link-gap: 30px;        /* CONFIRMED */
  --nav-panel-bottom-padding: 24px;  /* CONFIRMED */
  --nav-panel-rule-width: 2px;       /* CONFIRMED */
  --nav-panel-motion-duration: 180ms; /* CONFIRMED */
  --nav-panel-motion-easing: ease-out; /* CONFIRMED */
  --nav-panel-rise: 6px;             /* CONFIRMED */
  --nav-panel-close-delay: 240ms;    /* CONFIRMED */
  --nav-backdrop-opacity: 0.55;      /* CONFIRMED — "55% Noir" */

  /* ---- Layout ---- */
  --container-max: 1440px;           /* PDF canvas width */
  --container-padding: clamp(1.25rem, 4vw, 3.5rem);
  --header-height: 96px;
  --announcement-height: 44px;

  /* ---- Breakpoints (referenced in comments; media queries can't read custom properties) ---- */
  /* mobile: 0–639px · tablet: 640–1023px · desktop: 1024px+ */

  /* ---- Borders / radii ---- */
  --radius-none: 0;                  /* CONFIRMED — nav panel has no radius, and it's the site's general language */
  --border-hairline: 1px solid var(--color-line);

  /* ---- Motion (general, beyond the nav) ---- */
  --transition-fast: 150ms ease-out;
  --transition-base: 240ms ease-out;

  /* ---- Z-index layers ----
   * Backdrop sits BELOW the header so "the navigation bar itself remains
   * interactive" while a panel is open (confirmed spec) — it only dims
   * ordinary page content, never the header or the open panel itself. */
  --z-backdrop: 90;
  --z-header: 100;
  --z-dropdown: 110;
  --z-mobile-nav: 150; /* above dropdowns/header, below the skip-link */
  --z-skip-link: 200;
}

/* Mobile: content-driven section height instead of a forced full-screen
   card — see --section-min-height-flow above for which sections this
   affects and why. 640px matches the mobile breakpoint already used
   throughout the component CSS (e.g. partner.css, collection.css). */
@media (max-width: 640px) {
  :root {
    --section-min-height-flow: auto;
  }
}

/* ---- Arabic typography ----
 * CONFIRMED — client-supplied Arabic typeface (Simah Zaza Arabic W05),
 * declared in base.css. None of the Latin faces used above (Termina/
 * Playfair-style display serif/cursive script) carry Arabic glyphs, so this
 * override applies across the board — UI, display, body, and script — for
 * any element under an Arabic-language root.
 *
 * `lang="ar"` is only ever set on <html> by inc/i18n.php: either the
 * dev/admin-gated RTL preview, or a real public /ar/... request once
 * Arabic Language is Enabled (haven_is_ar_preview() covers both) — never
 * for a normal English visitor, so this rule has zero effect on the
 * public/English site.
 */
:root[lang="ar"] {
  --font-ui: 'Haven Simah Zaza Arabic', Tahoma, Arial, sans-serif;
  --font-display: 'Haven Simah Zaza Arabic', Tahoma, Arial, sans-serif;
  --font-body: 'Haven Simah Zaza Arabic', Tahoma, Arial, sans-serif;
  --font-script: 'Haven Simah Zaza Arabic', Tahoma, Arial, sans-serif;
}