/* ==========================================================================
   Mondios — design tokens
   Direction: "Cellar Dark". Pure black ground, gold-leaf accent taken from
   the Selection label. Colour arrives as narrative: monochrome → gold →
   the valley in full colour at the end of every journey.
   ========================================================================== */

/* --- faces — all self-hosted; the site makes no font request off-origin -- */
@font-face {
  font-family: 'Bodoni 72';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/bodoni-ff1850e0-22a8-4229-87a9-18ed2bdaab26.woff2') format('woff2');
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-300.woff2') format('woff2');
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-300-italic.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url('../fonts/inter-300-600.woff2') format('woff2');
}

:root {
  /* --- ground — true black. Every bottle is photographed on pure black, so
         the page and the product photography become one surface. --------- */
  --ground:         oklch(0%  0 0);
  --ground-raised:  oklch(24% 0 0);         /* #1F1F1F  plates, rows     */
  --ground-deep:    oklch(0%  0 0);
  --ground-black:   oklch(0%  0 0);

  /* --- ink — neutral -------------------------------------------------- */
  --bone:           oklch(96% 0 0);         /* 18.7:1                    */
  --bone-dim:       oklch(75% 0 0);         /*  9.4:1                    */
  --bone-mute:      oklch(58% 0 0);         /*  4.9:1                    */

  /* --- accent — the one warm note ------------------------------------- */
  --gold:           oklch(80%  0.108 84);   /* #DFB868  11.2:1           */
  --gold-dim:       oklch(64%  0.082 84);   /* #A48850   6.2:1           */
  --wine:           oklch(40%  0.120 22);   /* fill only — never text    */

  /* --- rules & scrims -------------------------------------------------- */
  --hairline:       oklch(100% 0 0 / .13);
  --hairline-soft:  oklch(100% 0 0 / .06);
  --hairline-gold:  oklch(80%  0.108 84 / .38);
  --scrim:          oklch(0% 0 0 / .62);

  /* --- type ------------------------------------------------------------ */
  --font-display: 'Bodoni 72', 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-accent:  'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-ui:      'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --text-micro:   0.6875rem;
  --text-small:   0.8125rem;
  --text-body:    clamp(1rem,      0.955rem + 0.22vw, 1.125rem);
  --text-lead:    clamp(1.1875rem, 1.02rem + 0.83vw,  1.625rem);
  --text-h3:      clamp(1.375rem,  1.16rem + 1.05vw,  2rem);
  --text-h2:      clamp(1.875rem,  1.28rem + 2.6vw,   3.5rem);
  --text-display: clamp(2.5rem,    1.15rem + 5.9vw,   6.5rem);
  --text-figure:  clamp(2rem,      1.3rem + 3.2vw,    4rem);
  --text-scrub:   clamp(1.5rem,    1.05rem + 2.1vw,   2.9rem);

  --track-caps:   0.24em;
  --track-tight:  -0.015em;

  --measure:        62ch;
  --measure-tight:  46ch;
  --measure-lead:   34ch;

  /* --- space ------------------------------------------------------------ */
  --space-1: 0.5rem;
  --space-2: 0.75rem;
  --space-3: 1.125rem;
  --space-4: 1.75rem;
  --space-5: 2.75rem;
  --space-6: 4.25rem;
  --space-7: 6.5rem;
  --space-section: clamp(5rem, 3rem + 8vw, 11rem);

  --shell:       min(100% - 2.5rem, 78rem);
  --shell-wide:  min(100% - 2.5rem, 92rem);
  --shell-text:  min(100% - 2.5rem, 44rem);

  /* --- layers ------------------------------------------------------------ */
  --z-menu:     90;
  --z-header:   100;
  --z-progress: 120;
  --z-cursor:   130;
  --z-entrance: 140;

  /* --- motion ------------------------------------------------------------ */
  --dur-fast: 180ms;
  --dur:      420ms;
  --dur-slow: 900ms;
  --ease-out:    cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);

  /* --- photographic treatment ------------------------------------------- */
  --treat-filter:      grayscale(1) contrast(1.06) brightness(1.02);
  --treat-lift:        0.035;                 /* screen wash that lifts photo blacks off the page black */
  --treat-bloom-dur:   700ms;

  /* --- atmosphere: fractal grain ----------------------------------------- */
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}