/* ═══════════════════════════════════════════════════════════════════════
   R5 PALETTE — Source unique de vérité pour toutes les couleurs du site
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

   PALETTE ACTUELLE : BLEU MARINE (ex-vert remplacé en juin 2026)
   POUR CHANGER LE BLEU EN AUTRE COULEUR :
   1. Modifier ici : --green, --green-mid, --green-light et toutes les
      variantes foncées ci-dessous (dériver depuis la nouvelle couleur)
   2. Dans mockup_rousseau5.html, chercher "R5.c" (ligne ~18773) →
      mettre à jour green:'#XXXXXX' avec la même valeur que --green
   3. Dans mockup_rousseau5.html, chercher "var green = " (~ligne 25140) →
      même valeur hex
   4. Sauvegarder — TOUT le reste se met à jour automatiquement
      (HTML, CSS classes, inline styles, gradients, tooltips...)

   POUR CHANGER L'OR EN BRONZE :
   1. Modifier --gold et --gold-light
   2. Chercher "R5.c.gold" dans le HTML → même valeur

   ⚠️  Les variantes foncées (--green-700, --green-800, --green-900)
       sont utilisées dans les gradients de sections et d'overlays.
       Si vous changez --green, dérivez de nouvelles valeurs pour ces
       variantes en assombrissant votre nouvelle couleur principale.

   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

:root {

  /* ── BLEU NUIT — Couleur primaire (fond sections, headers, boutons) ─── */
  /* Palette "Nuit de Saphir" — deep midnight, nuancé, ultra-premium      */
  --green:          #081938;   /* Bleu nuit profond — couleur principale        */
  --green-mid:      #103060;   /* Saphir nuit — gradient partner                */
  --green-light:    #163A72;   /* Bleu royal nuit — hover, variantes           */
  --green-glow:     #1A4A80;   /* Point d'accent lumineux (gradients premium)   */

  /* Variantes sombres — du quasi-noir au bleu nuit riche               */
  --green-900:      #010306;   /* Quasi-noir saphir (overlay absolument sombre) */
  --green-800:      #020814;   /* Nuit très profonde (galerie plein écran)      */
  --green-750:      #040A18;   /* Nuit profonde (overlay hero)                  */
  --green-700:      #061225;   /* Bleu nuit footer/sections sombres             */
  --green-680:      #040E22;   /* Hover bouton (version sombre nuancée)         */
  --green-650:      #081C38;   /* Hero overlay gradient                         */

  /* ── OR — Couleur accent (badges, bordures premium, highlights) ── */
  --gold:           #8B6F47;   /* Accent principal                             */
  --gold-light:     #A88B63;   /* Texte gold sur fond sombre                  */

  /* ── CRÈME — Fonds et surfaces alternatives ───────────────────── */
  --cream:          #F5F2ED;   /* Fond sections alternées                      */
  --cream-dark:     #EDE9E1;   /* Fond sections plus marquées                  */
  --cream-warm:     #f0ebe3;   /* Variante chaude (lead forms sombres)         */
  --cream-hover:    #F9F6F1;   /* Hover lignes de tableau                      */

  /* ── NEUTRES ──────────────────────────────────────────────────── */
  --white:          #FFFFFF;
  --text:           #1A1A1A;   /* Corps de texte principal                     */
  --text-muted:     #6B6B6B;   /* Texte secondaire, labels                     */
  --text-light:     #999999;   /* Texte tertiaire, placeholders                */
  --border:         #E0DCD4;   /* Bordures, séparateurs                        */

  /* ── TYPOGRAPHIE ──────────────────────────────────────────────── */
  --font:           'Georgia', 'Times New Roman', serif;
  --font-sans:      -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* ── COULEURS D'ÉTAT (miroir de R5.c dans le JS) ─────────────── */
  /*    ⚠️  Chaque couleur ici a son équivalent dans R5.c (JS).     */
  /*    Modifier l'une = modifier l'autre.                           */
  --error:          #ef4444;   /* Champ invalide fond clair  [R5.c.error]      */
  --error-light:    #f87171;   /* Champ invalide fond sombre [R5.c.errorLight] */
  --error-dk:       #DC2626;   /* Tendance prix négative     [R5.c.errorDk]    */
  --success:        #059669;   /* Tendance prix positive     [R5.c.success]    */
  --danger:         #B4493A;   /* Effort hypothécaire élevé  [R5.c.danger]     */
  --danger-bg:      rgba(180,73,58,0.06);  /* Fond alerte danger               */
  --heart:          #e11d48;   /* Icône favoris/cœur         [R5.c.heart]      */

  /* ── TIERCES PARTIES — Ne pas modifier ───────────────────────── */
  --seo-blue:       #2563EB;   /* Liens internes SEO                           */
  --whatsapp:       #25D366;   /* Bouton WhatsApp                              */

  /* ── ÉCHELLE Z-INDEX (stacking contexts) ─────────────────────── */
  /*    Utiliser ces vars partout plutôt que des valeurs numériques  */
  --z-base:         1;         /* Contenu standard                             */
  --z-raised:       2;         /* Contenu légèrement surélevé (images, cards) */
  --z-sticky:       90;        /* Headers de section sticky (atlas, etc.)     */
  --z-nav:          100;       /* Barre de navigation principale               */
  --z-dropdown:     200;       /* Menus déroulants                             */
  --z-modal:        1000;      /* Modales et overlays                          */
  --z-modal-top:    1001;      /* Éléments au-dessus des modales               */
  --z-toast:        9000;      /* Notifications toast / flux ticker            */
  --z-overlay:      9998;      /* Overlay plein écran (galerie)                */
  --z-top:          9999;      /* Éléments toujours au premier plan            */
}