/* ==========================================================================
   Design tokens — the single source of truth for the Quintessential Paris
   visual language. Nothing else in the project declares a raw colour, font
   family or type size.

   Colours are declared twice on purpose: a hex fallback first, then the
   authored oklch value. Browsers without oklch keep the hex.
   ========================================================================== */

:root {
  /* -- surface ------------------------------------------------------------ */
  --qp-cream: #fbf9f4;          /* page background */
  --qp-stone: #f3f0e9;          /* alternating band */
  --qp-ink: #17201c;            /* dark band, primary text */

  /* -- line --------------------------------------------------------------- */
  --qp-line: #e2ded4;           /* hairline rules and borders */
  --qp-line-strong: #cfcbc0;    /* input underlines, outlined buttons */
  --qp-line-on-dark: rgba(251, 249, 244, 0.18);
  --qp-line-ghost: rgba(251, 249, 244, 0.45);        /* ghost button border, on video */
  --qp-line-quiet-on-dark: rgba(207, 216, 207, 0.4); /* underline of quiet links, on video */

  /* -- text --------------------------------------------------------------- */
  --qp-text: #17201c;
  --qp-text-body: #4a5049;      /* long-form paragraphs */
  --qp-text-muted: #6b6f69;     /* secondary copy */
  --qp-text-faint: #9a9c93;     /* captions, meta */
  --qp-text-on-dark: #fbf9f4;
  --qp-text-on-dark-muted: #cfd8cf;

  /* -- accent ------------------------------------------------------------- */
  --qp-accent: #3d5a4a;
  --qp-accent: oklch(0.4 0.05 160);
  --qp-accent-on-dark: #8fa79a;
  --qp-selection: #e4e9e2;      /* text selection */

  /* -- overlays ------------------------------------------------------------- */
  --qp-ghost-hover: rgba(251, 249, 244, 0.08);
  --qp-scrim-strong: rgba(14, 20, 17, 0.78);   /* hero scrim, three stops */
  --qp-scrim-mid: rgba(14, 20, 17, 0.42);
  --qp-scrim-light: rgba(14, 20, 17, 0.18);

  /* -- placeholder hatch (used until real imagery is uploaded) ------------- */
  --qp-hatch: repeating-linear-gradient(135deg, #ede9df 0 9px, #f5f2ea 9px 18px);

  /* -- type --------------------------------------------------------------- */
  --qp-font-display: "Marcellus", Georgia, "Times New Roman", serif;
  --qp-font-body: "Karla", system-ui, -apple-system, "Segoe UI", sans-serif;
  --qp-font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  --qp-size-display: clamp(38px, 5.4vw, 76px);   /* hero h1 */
  --qp-size-h2: clamp(27px, 2.9vw, 40px);
  --qp-size-h2-lead: clamp(27px, 3vw, 42px);     /* enquiry heading */
  --qp-size-quote: clamp(24px, 2.5vw, 33px);
  --qp-size-h3: 23px;
  --qp-size-lead: 16.5px;
  --qp-size-body: 15.5px;
  --qp-size-small: 15px;
  --qp-size-meta: 13px;
  --qp-size-eyebrow: 11px;
  --qp-size-label: 12.5px;

  --qp-track-eyebrow: 0.3em;
  --qp-track-nav: 0.14em;
  --qp-track-wordmark: 0.22em;
  --qp-track-qualifier: 0.42em;

  /* -- layout ------------------------------------------------------------- */
  --qp-max-width: 1440px;
  --qp-gutter: 48px;
  --qp-gutter-narrow: 24px;
  --qp-section-y: 104px;
  --qp-section-y-narrow: 68px;
  --qp-split-gap: 80px;

  /* -- motion ------------------------------------------------------------- */
  --qp-transition: 160ms ease;
}
