/* ============================================================
   VICTORY BEAUTY — design tokens
   Built by Prizmek from victory-beauty-prd.md (v1.1).

   The palette is the logo's monochrome base (ink on ivory)
   with exactly two accents layered on: champagne gold carries
   every primary action, deep burgundy anchors the two blocks
   that need weight (Policies, Footer).

   CONTRAST NOTE — the one deviation from PRD 9.
   Champagne gold on ivory measures 2.07:1. It fails WCAG AA
   for text by a wide margin. So gold is never text on ivory:
   it is a FILL (ink on gold = 8.07:1) and a RULE. Prices stay
   ink black. See DESIGN.md 3.
   ============================================================ */

:root {
  color-scheme: light;

  /* ---- Brand ------------------------------------------------ */
  --ink:        #171512;   /* logo black, all headline + body text */
  --ivory:      #F8F5EF;   /* primary page ground */
  --stone:      #E6E0D5;   /* cards, dividers, the logo's backdrop */
  --gold:       #C7A968;   /* primary accent — CTA fill, rules */
  --burgundy:   #5C1A2B;   /* depth — policies block, footer */

  /* Tints derived from the five above. Nothing else is a colour. */
  --ink-2:      #4A453D;   /* secondary text on ivory — 8.9:1 */
  --ink-3:      #6E675C;   /* meta text on ivory — 5.1:1, AA at all sizes */
  --stone-2:    #F1EDE4;   /* card ground, one step off the page */
  --stone-line: #DCD4C6;   /* hairlines on ivory */
  --gold-deep:  #A98B4B;   /* gold hover / gold that must sit on ivory as a RULE */
  --burgundy-2: #74263A;   /* burgundy hover */
  --gold-glow:  rgba(199, 169, 104, 0.16);

  /* ---- Type -------------------------------------------------
     Cormorant Garamond for display: high-stroke-contrast serif,
     the closest web face to an engraved monogram. It runs small
     and light, so display sizes are set larger than they look.
     Jost for everything functional — geometric, and its
     small-caps tracking mirrors the logo's wordmark. */
  --font-display: "Cormorant Garamond", "Hoefler Text", Georgia, "Times New Roman", serif;
  --font-body: "Jost", "Futura", "Avenir Next", "Segoe UI", system-ui, -apple-system, sans-serif;

  --t-display: clamp(2.45rem, 1.5rem + 2.9vw, 4.5rem);
  --t-h2:      clamp(1.95rem, 1.4rem + 1.9vw, 3.1rem);
  --t-h3:      clamp(1.35rem, 1.16rem + 0.82vw, 1.85rem);
  --t-h4:      clamp(1.06rem, 1rem + 0.3vw, 1.22rem);
  --t-lead:    clamp(1.04rem, 0.98rem + 0.36vw, 1.24rem);
  --t-body:    1rem;
  --t-small:   0.875rem;
  --t-label:   0.7rem;

  --lh-display: 0.94;
  --lh-heading: 1.1;
  --lh-body: 1.7;

  --track-display: -0.012em;   /* Cormorant is loose by default */
  --track-label: 0.22em;       /* the wordmark treatment */
  --track-nav: 0.12em;

  /* ---- Space ------------------------------------------------- */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4rem;
  --s-9: 6rem;
  --section-y: clamp(4.25rem, 2.6rem + 7vw, 8rem);
  --gutter: clamp(1.15rem, 0.55rem + 2.6vw, 3rem);
  --measure: 60ch;
  --max: 1240px;
  --max-narrow: 880px;

  /* ---- Shape ------------------------------------------------
     Deliberately near-square. Luxury print does not have
     rounded corners; the 2px is just to take the digital
     hard edge off. Pills are used for one thing: the CTA. */
  --r-card: 2px;
  --r-input: 2px;
  --r-pill: 999px;

  /* ---- Motion ------------------------------------------------ */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);
  --d-fast: 160ms;
  --d-mid: 320ms;
  --d-slow: 620ms;

  /* ---- Elevation ---------------------------------------------
     Warm shadows. A neutral grey shadow on an ivory ground
     reads as dirt. */
  --shadow-sm: 0 1px 2px rgba(23, 21, 18, 0.05);
  --shadow-md: 0 6px 24px -8px rgba(23, 21, 18, 0.13);
  --shadow-lg: 0 24px 60px -20px rgba(23, 21, 18, 0.22);

  --nav-h: 74px;
}

@media (max-width: 860px) {
  :root { --nav-h: 64px; }
}
