/*
 * CHARTE GRAPHIQUE — CAMIER AVOCAT
 * Version 1.0 — Validée
 *
 * Ce fichier est la source de vérité de toute la charte.
 * NE JAMAIS utiliser de valeurs hexadécimales codées en dur dans les autres fichiers.
 * Toujours utiliser les variables CSS définies ici.
 */

:root {

  /* ════════════════════════════
     COULEURS PRINCIPALES
  ════════════════════════════ */
  --y:           #f5d84a;   /* Jaune principal — boutons, tags, trust strip, CTA */
  --y-deep:      #e8c827;   /* Jaune foncé — hover, bordures, eyebrows */
  --y-pale:      #fdf6d0;   /* Jaune pâle — fonds de sections, highlights */
  --y-mid:       #f9e87a;   /* Jaune moyen — accents doux, avatars */

  /* ════════════════════════════
     ENCRE
  ════════════════════════════ */
  --ink:         #1a1f2e;   /* Marine profond — hero, footer, fond sombre */
  --ink-soft:    #2c3347;   /* Marine doux — cartes semi-sombres */

  /* ════════════════════════════
     NEUTRES CHAUDS
  ════════════════════════════ */
  --stone:       #f2ede4;   /* Pierre — fonds sections alternatives */
  --linen:       #ede7db;   /* Lin — fonds complémentaires */
  --border:      #e0d9ce;   /* Bordures — séparateurs, cartes */
  --text:        #363636;   /* Texte principal */
  --muted:       #888888;   /* Texte secondaire, labels */

  /* ════════════════════════════
     BLANC CASSÉ
  ════════════════════════════ */
  --white:       #fdfcf9;   /* Fond général */

  /* ════════════════════════════
     TYPOGRAPHIE
  ════════════════════════════ */
  --font-serif:  'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-sans:   'DM Sans', system-ui, -apple-system, sans-serif;

  /* ════════════════════════════
     TAILLES DE TEXTE
  ════════════════════════════ */
  --text-xs:     11px;
  --text-sm:     13px;
  --text-base:   16px;
  --text-lg:     18px;
  --line-base:   1.72;
  --line-tight:  1.15;
  --line-loose:  1.82;

  /* ════════════════════════════
     ESPACEMENTS SECTIONS
  ════════════════════════════ */
  --space-section:    96px;
  --space-section-md: 72px;
  --space-section-sm: 64px;

  /* ════════════════════════════
     RAYONS
  ════════════════════════════ */
  --radius-btn:   50px;
  --radius-card:  12px;
  --radius-lg:    16px;
  --radius-sm:     8px;

  /* ════════════════════════════
     OMBRES
  ════════════════════════════ */
  --shadow-card:  0 8px 28px rgba(26, 31, 46, 0.08);
  --shadow-card-hover: 0 16px 48px rgba(26, 31, 46, 0.12);
  --shadow-y:     0 12px 32px rgba(245, 216, 74, 0.35);
  --shadow-y-lg:  0 24px 64px rgba(245, 216, 74, 0.30);

  /* ════════════════════════════
     TRANSITIONS
  ════════════════════════════ */
  --transition:   all 0.28s ease;
  --transition-fast: all 0.18s ease;

  /* ════════════════════════════
     Z-INDEX
  ════════════════════════════ */
  --z-header:    200;
  --z-sticky:    300;
  --z-overlay:   400;
}