/* ============================================================
   DESIGN TOKENS — Luxury Jewelry System
   Palette: deep espresso-black, warm ivory, champagne, soft
   stone, muted brown, restrained oxblood accent.
   Luxury is built from composition, spacing, type and light —
   not from making everything gold.
   ============================================================ */

:root {
  /* --- Core neutrals (warm, not clinical) --- */
  --ivory:        #f4efe7;   /* primary page ground */
  --ivory-2:      #eae3d7;   /* raised surfaces / cards */
  --stone:        #d9cfc0;   /* soft dividers, muted fields */
  --stone-deep:   #b9ab97;
  --mocha:        #8a7256;   /* muted brown text accents */
  --espresso:     #241d18;   /* primary ink */
  --espresso-2:   #3a2f27;
  --noir:         #14100d;   /* deep black for cinematic sections */
  --noir-2:       #0b0908;

  /* --- Metals (restrained, used as accents only) --- */
  --champagne:    #cbae7e;
  --champagne-lt: #e4d2b0;
  --gold-line:    rgba(185, 152, 98, 0.27);  /* hairline metallic */
  --silver:       #c7c9cc;
  --oxblood:      #6d2130;    /* editorial accent (nav, marks) */

  /* --- Semantic (dark-warm, cinematic — matches the photography) --- */
  --bg:            #141009;   /* warm near-black page ground */
  --surface:       #1f1811;   /* raised dark surface */
  --ink:           #f0e6d4;   /* warm cream text */
  --ink-soft:      #b0a087;   /* muted warm text */
  --line:          #352a1d;   /* hairline on dark */
  --accent:        #cba24c;   /* warm gold */
  --metal:         var(--champagne);

  /* --- Typography --- */
  --font-display: "Fraunces", "Cormorant Garamond", "Georgia", serif;
  --font-ui:      "Inter", "Helvetica Neue", system-ui, -apple-system, sans-serif;

  /* fluid display scale */
  --fs-hero:   clamp(3.4rem, 9vw, 9.5rem);
  --fs-h1:     clamp(2.6rem, 6vw, 6rem);
  --fs-h2:     clamp(2rem, 4.4vw, 4rem);
  --fs-h3:     clamp(1.4rem, 2.4vw, 2.1rem);
  --fs-lead:   clamp(1.05rem, 1.5vw, 1.35rem);
  --fs-body:   clamp(0.98rem, 1.05vw, 1.08rem);
  --fs-sm:     0.82rem;
  --fs-xs:     0.72rem;

  --tracking-wide: 0.24em;
  --tracking-mid:  0.08em;
  --leading-tight: 0.98;
  --leading-body:  1.62;

  /* --- Spacing / rhythm --- */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.75rem;
  --space-4: 3rem;
  --space-5: 5rem;
  --space-6: 8rem;
  --section-pad: clamp(4.5rem, 10vw, 11rem);
  --gutter: clamp(1.25rem, 5vw, 5rem);
  --maxw: 1560px;

  /* --- Motion --- */
  --ease-lux:   cubic-bezier(0.22, 1, 0.36, 1);
  --ease-inout: cubic-bezier(0.76, 0, 0.24, 1);
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --dur-micro:  0.35s;
  --dur-med:    0.6s;
  --dur-major:  1.05s;

  /* --- Elevation / depth --- */
  --shadow-card:  0 30px 60px -30px rgba(36, 29, 24, 0.35);
  --shadow-float: 0 40px 90px -40px rgba(20, 16, 13, 0.55);
  --radius: 2px;
  --radius-lg: 4px;

  --header-h: 84px;
}

/* Deepest black sections (hero-adjacent, footer) */
.is-dark {
  --bg:       #0b0806;
  --surface:  #161009;
  --ink:      #f0e6d4;
  --ink-soft: #b0a087;
  --line:     #2e2416;
  --accent:   #d8b45f;
}

/* Warm-stone light sections (product close-ups, editorial rest) */
.is-light {
  --bg:       #ece2d0;
  --surface:  #e3d8c3;
  --ink:      #241d15;
  --ink-soft: #6b5c46;
  --line:     #d3c6ad;
  --accent:   #9c7a2c;
}
