/* =====================================================
   BASE
   Reset, variables de couleurs, système bilingue
   =======================================================*/

 /* ===== RESET & BASE ===== */
 *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
 :root {
   --blue:       #1565C0;
   --blue-dark:  #0D47A1;
   --blue-mid:   #1976D2;
   --blue-light: #E3F2FD;
   --orange:     #F57C00;
   --orange-dk:  #E65100;
   --orange-lt:  #FF9800;
   --white:      #FFFFFF;
   --off:        #F8FAFF;
   --gray:       #F0F4FA;
   --gray-text:  #6B7280;
   --dark:       #111827;
   --font-h:     'Montserrat', sans-serif;
   --font-b:     'Open Sans', sans-serif;
   --r:          12px;
   --sh:         0 4px 24px rgba(21,101,192,.10);
   --sh-lg:      0 8px 40px rgba(21,101,192,.16);
   --nav-h:      70px;

   /* ---- ALIAS (noms longs utilisés dans le reste de la feuille) ---- */
   --font-heading:     var(--font-h);
   --font-body:        var(--font-b);
   --off-white:        var(--off);
   --gray-border:      #E5EAF3;
   --orange-dark:      var(--orange-dk);
   --red:              #C0392B;
   --red-dark:         #922B21;
   --green:            #2E7D32;
   --green-dark:       #1B5E20;
   --teal:             #00695C;
   --radius:           var(--r);
   --radius-sm:        8px;
   --shadow-sm:        0 2px 10px rgba(21,101,192,.07);
   --shadow:           var(--sh);
   --shadow-lg:        var(--sh-lg);
   --transition:       .25s ease;
   --transition-fast:  .16s ease;
 }
 html { scroll-behavior: smooth; font-size: 16px; }
 body { font-family: var(--font-b); color: var(--dark); background: var(--white); overflow-x: hidden; }

 /* ===== BILINGUAL SYSTEM ===== */
 /*  ALL .en content hidden by default (FR mode)           */
 /*  Switching body to class "en" flips visibility         */
 /* --- BILINGUAL SYSTEM ---
All .fr/.en are <span> elements (inline).
Default: FR visible, EN hidden.
body.lang-en: flip visibility.
Use !important to override any inherited display from flex/grid parents. */
 .fr { display: inline !important; }
 .en { display: none   !important; }
 body.lang-en .fr { display: none   !important; }
 body.lang-en .en { display: inline !important; }