/*
 * TMA — Design tokens
 * Source of truth pour couleurs, typo, espacements. Importé en premier.
 * Aligné sur l'index.html static existant (zéro divergence).
 */

:root {
  /* ── Couleurs ── */
  --color-bg:            #faf9f7;  /* body */
  --color-bg-warm:       #faf9f6;
  --color-bg-warm2:      #f5f2ed;
  --color-bg-cream:      #f2ede5;
  --color-bg-ruled-line: #e8e3db;
  --color-rule:          #cdc4b7;
  --color-text:          #1a1a1a;
  --color-text-muted:    #5a5048;
  --color-text-soft:     #7a6e63;
  --color-text-faint:    #b8aea0;
  --color-copper:        #B5541A;
  --color-copper-soft:   rgba(181, 84, 26, 0.67);  /* scrollbar thumb */

  /* Dark surfaces (nav, footer, blocs éditoriaux) */
  --color-dark:          #17140f;
  --color-dark-alt:      #1a1a1a;
  --color-on-dark:       #f0ece5;
  --color-on-dark-muted: #c8bfb5;  /* nav links etc. (relevé pour lisibilité) */
  --color-on-dark-dim:   #9a8d80;  /* footer tagline (relevé) */
  --color-on-dark-faint: #807468;  /* footer copyright / links secondaires (relevé) */
  --color-on-dark-line:  rgba(255, 255, 255, 0.10);

  /* Placeholders */
  --color-ph-line-a:     #e3ddd6;
  --color-ph-line-b:     #ece8e2;
  --color-ph-text:       #b8b0a6;

  /* ── Typo ── */
  --font-body:   'Barlow', sans-serif;
  --font-cond:   'Barlow Condensed', sans-serif;
  --font-serif:  'Playfair Display', serif;

  /* ── Espacements / dimensions ── */
  --nav-height:        68px;
  --nav-height-small:  56px;
  --max-content:       1280px;
  --max-shop:          1400px;

  /* ── Z-index ── */
  --z-nav:      100;
  --z-mobile:   99;
  --z-grain:    9999;

  /* ── Transitions ── */
  --t-fast: 0.2s;
  --t-mid:  0.3s;
}