/* ============================================================
   TOKENS.CSS — Les Trois Gourmets
   Source unique de vérité : §3–§6 du DESIGN_SYSTEM.md
   Piste B "La Cave" — ne jamais hardcoder de valeurs hex
   ============================================================ */

/* ── Polices auto-hébergées ─────────────────────────────────── */
@font-face {
  font-family: 'Libre Baskerville';
  src: url('../fonts/libre-baskerville-v24-latin_latin-ext-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Libre Baskerville';
  src: url('../fonts/libre-baskerville-v24-latin_latin-ext-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Libre Baskerville';
  src: url('../fonts/libre-baskerville-v24-latin_latin-ext-italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Source Sans 3';
  src: url('../fonts/source-sans-3-v19-latin_latin-ext-300.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Source Sans 3';
  src: url('../fonts/source-sans-3-v19-latin_latin-ext-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Source Sans 3';
  src: url('../fonts/source-sans-3-v19-latin_latin-ext-italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Source Sans 3';
  src: url('../fonts/source-sans-3-v19-latin_latin-ext-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Source Sans 3';
  src: url('../fonts/source-sans-3-v19-latin_latin-ext-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {

  /* ── Familles de polices ─────────────────────────────────── */
  --font-display: 'Libre Baskerville', Georgia, 'Times New Roman', serif;
  --font-body:    'Source Sans 3', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* Graisses disponibles (évite d'appeler une graisse non chargée) */
  --fw-light:    300;   /* Source Sans 3 seulement */
  --fw-regular:  400;
  --fw-semibold: 600;   /* Source Sans 3 seulement */
  --fw-bold:     700;

  /* ── Palette de couleurs ─────────────────────────────────── */

  /* Fonds — du plus sombre au plus clair */
  --color-cave:          #18100A;  /* Fond principal */
  --color-cave-mid:      #231508;  /* Sections alternées */
  --color-cave-elevated: #2E1D0F;  /* Cards, panneaux */
  --color-cave-surface:  #3A2518;  /* Hover, focus zones */

  /* Textes */
  --color-cream:         #F5EDD6;  /* Texte principal, headings */
  --color-cream-muted:   #C4B99A;  /* Descriptions, labels */
  --color-cream-subtle:  #8A7A62;  /* Métadonnées, horaires */

  /* Accents */
  --color-wine:          #8B1A2C;  /* CTA, prix, accent bordeaux */
  --color-wine-light:    #A52035;  /* Hover wine */
  --color-wine-glow:     rgba(139, 26, 44, 0.25);
  --color-wine-drop:     rgba(139, 26, 44, 0.55);

  /* Accents secondaires */
  --color-bottle-green:  #2D4A2D;  /* Badges "Vigneron confidentiel" uniquement */
  --color-amber:         #C4963C;  /* Étoiles de note — usage très parcimonieux */

  /* Bordures & overlays */
  --color-border:        rgba(245, 237, 214, 0.10);
  --color-border-warm:   rgba(245, 237, 214, 0.18);
  --color-overlay:       rgba(24, 16, 10, 0.82);
  --color-hero-overlay:  linear-gradient(
    to top,
    #18100A 0%,
    rgba(24, 16, 10, 0.6) 50%,
    rgba(24, 16, 10, 0.1) 100%
  );

  /* Statut horaires */
  --color-open-bg:   #1B4332;
  --color-open-text: #D1FAE5;

  /* Footer (légèrement plus sombre que cave) */
  --color-footer-bg: #0E0905;

  /* ── Échelle typographique ───────────────────────────────── */
  --text-display: clamp(3rem, 7vw, 5.5rem);
  --text-h1:      clamp(2.5rem, 5vw, 4rem);
  --text-h2:      clamp(1.875rem, 3.5vw, 2.75rem);
  --text-h3:      clamp(1.375rem, 2.5vw, 1.875rem);
  --text-h4:      1.25rem;
  --text-lead:    clamp(1rem, 1.5vw, 1.25rem);
  --text-body:    1rem;
  --text-sm:      0.9375rem;
  --text-xs:      0.875rem;
  --text-eyebrow: 0.875rem;

  /* Graisses */
  --weight-light:    300;
  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;

  /* Interlignages */
  --leading-tight:   1.1;
  --leading-snug:    1.25;
  --leading-normal:  1.5;
  --leading-relaxed: 1.7;
  --leading-loose:   1.9;

  /* Espacements de lettres */
  --tracking-tighter: -0.03em;
  --tracking-tight:   -0.015em;
  --tracking-normal:  0em;
  --tracking-wide:    0.05em;
  --tracking-wider:   0.1em;
  --tracking-widest:  0.15em;

  /* ── Espacements (base 4pt) ──────────────────────────────── */
  --space-1:  0.25rem;   /*  4px */
  --space-2:  0.5rem;    /*  8px */
  --space-3:  0.75rem;   /* 12px */
  --space-4:  1rem;      /* 16px */
  --space-5:  1.25rem;   /* 20px */
  --space-6:  1.5rem;    /* 24px */
  --space-8:  2rem;      /* 32px */
  --space-10: 2.5rem;    /* 40px */
  --space-12: 3rem;      /* 48px */
  --space-16: 4rem;      /* 64px */
  --space-20: 5rem;      /* 80px */
  --space-24: 6rem;      /* 96px */
  --space-32: 8rem;      /* 128px */
  --space-40: 10rem;     /* 160px */

  /* Inter-sections */
  --section-gap-sm: var(--space-16);
  --section-gap:    var(--space-24);
  --section-gap-lg: var(--space-32);

  /* ── Breakpoints & paddings container ───────────────────── */
  --bp-tablet:  768px;
  --bp-desktop: 1024px;
  --bp-wide:    1440px;

  --container-padding-mobile:  1.25rem;
  --container-padding-tablet:  2rem;
  --container-padding-desktop: 3rem;

  /* ── Border-radius ───────────────────────────────────────── */
  --radius-none: 0;
  --radius-sm:   2px;
  --radius-md:   6px;
  --radius-lg:   12px;
  --radius-xl:   20px;
  --radius-pill: 999px;

  /* ── Ombres ──────────────────────────────────────────────── */
  --shadow-sm:   0 2px 8px rgba(0, 0, 0, 0.40);
  --shadow-md:   0 4px 20px rgba(0, 0, 0, 0.50);
  --shadow-lg:   0 8px 40px rgba(0, 0, 0, 0.60);
  --shadow-xl:   0 16px 60px rgba(0, 0, 0, 0.70);
  --shadow-wine: 0 4px 24px var(--color-wine-glow);
  --shadow-card: 0 2px 12px rgba(0, 0, 0, 0.50),
                 inset 0 1px 0 rgba(245, 237, 214, 0.05);
  --shadow-inset: inset 0 1px 3px rgba(0, 0, 0, 0.40);

  /* ── Bordures ────────────────────────────────────────────── */
  --border-subtle: 1px solid var(--color-border);
  --border-warm:   1px solid var(--color-border-warm);
  --border-wine:   1px solid var(--color-wine);
  --border-focus:  2px solid var(--color-wine);

  /* ── Easings ─────────────────────────────────────────────── */
  --ease-out:    cubic-bezier(0.0, 0.0, 0.2, 1);
  --ease-in:     cubic-bezier(0.4, 0.0, 1, 1);
  --ease-in-out: cubic-bezier(0.4, 0.0, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ── Durées ──────────────────────────────────────────────── */
  --duration-fast:     150ms;
  --duration-base:     250ms;
  --duration-slow:     400ms;
  --duration-dramatic: 600ms;
  --duration-drop:    1500ms;

  /* Shorthands */
  --transition-fast: var(--duration-fast) var(--ease-out);
  --transition-base: var(--duration-base) var(--ease-out);
  --transition-slow: var(--duration-slow) var(--ease-in-out);

  /* ── Z-index ─────────────────────────────────────────────── */
  --z-base:     0;
  --z-raised:   10;
  --z-dropdown: 20;
  --z-sticky:   40;
  --z-overlay:  60;
  --z-modal:    80;
  --z-canvas:   5;
  --z-toast:    100;

  /* ── Header (bandeau + nav) ──────────────────────────────── */
  --banner-height: 32px;
  --nav-height:    64px;
  --header-height: 96px; /* banner + nav — utilisé pour le décalage pages sans hero */
}