/* ==========================================================================
   Design tokens — Longines boutique LP
   Provisional. Colors/type to be confirmed against the live Longines site.
   ========================================================================== */

:root {
  /* --- Color -------------------------------------------------------------
     Sampled from the live Longines site screenshots (assets/Longines Website/).
     The current Longines web palette is: navy + warm light-grey + white, with a
     blued-steel accent. No gold. Fine-tune hexes against final screenshots. */
  --c-ink:        #17284a;   /* Longines navy — primary text / brand / nav / logo */
  --c-ink-soft:   #33456b;   /* softer navy — secondary text */
  --c-blue:       #33538f;   /* blued-steel accent (links/hover) — from the dial hands */
  --c-text:       #26262a;   /* body copy — very dark warm grey */
  --c-paper:      #f2f1ee;   /* warm light-grey page ground (NOT pure white) */
  --c-paper-alt:  #ececea;   /* product-tile / card grey */
  --c-paper-pure: #ffffff;   /* buttons, input fields */
  --c-line:       rgba(23, 40, 74, 0.12);   /* hairline dividers */
  --c-muted:      #6b6f76;
  --c-gold:       #b08d57;   /* NOT part of current Longines web — optional accent only */

  /* --- Typography --------------------------------------------------------
     REAL Longines web fonts (provided, in assets/fonts/, @font-face'd in base.css):
       · "Longines Serif" — editorial display serif (headlines, wordmark feel)
       · "Longines Sans"  — Medium-weight humanist sans for UI/body
     Only these two files were supplied (Serif Regular + Sans Medium); request
     more weights from the client if a lighter/bolder cut is needed. */
  --font-display: "Longines Serif", Georgia, "Times New Roman", serif;
  --font-body:    "Longines Sans", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;

  --fs-hero:    clamp(2.75rem, 7vw, 6rem);
  --fs-h2:      clamp(1.75rem, 4vw, 3.25rem);
  --fs-h3:      clamp(1.25rem, 2vw, 1.75rem);
  --fs-body:    clamp(1rem, 1.2vw, 1.125rem);
  --fs-small:   0.8125rem;

  --lh-tight:   1.05;
  --lh-body:    1.6;
  --tracking-wide: 0.14em;   /* for eyebrow/label caps */

  /* --- Spacing / layout --------------------------------------------------- */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 6rem;
  --space-7: 9rem;

  --maxw:       1280px;
  --maxw-text:  62ch;
  --gutter:     clamp(1.25rem, 5vw, 5rem);
  --radius-btn: 0;   /* Longines buttons are sharp-cornered (no radius) */

  /* --- Motion ------------------------------------------------------------- */
  /* --ease-lux is for marketing-scale entrances only; UI feedback (hover,
     press, nav state) uses the short durations + strong-out below. */
  --ease-lux:        cubic-bezier(0.16, 1, 0.3, 1);    /* slow-out, editorial */
  --ease-out-strong: cubic-bezier(0.23, 1, 0.32, 1);   /* UI ease-out with punch */
  --ease-swipe:      cubic-bezier(0.32, 0.72, 0, 1);   /* iOS drawer curve — sliders */
  --dur-press:  0.16s;
  --dur-hover:  0.2s;
  --dur-ui:     0.3s;
  --dur-2:      0.8s;
  --dur-3:      1.2s;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-press: 0.001s; --dur-hover: 0.001s; --dur-ui: 0.001s; --dur-2: 0.001s; --dur-3: 0.001s; }
}