/* ==========================================================================
   BFE – Charte graphique du site
   --------------------------------------------------------------------------
   Toutes les couleurs, polices et dimensions du site sont définies ici.
   Modifier une valeur dans ce fichier la change partout sur le site.
   ========================================================================== */

:root {
  /* --- Couleurs du logo ------------------------------------------------- */
  --c-bleu:        #0652DD;  /* bleu du logo (texte « BFE », anneau) */
  --c-bleu-fonce:  #0441B3;  /* survol des boutons bleus */
  --c-bleu-nuit:   #0A1A3F;  /* sections sombres */
  --c-bleu-clair:  #EEF3FD;  /* fonds teintés bleus */
  --c-jaune:       #FFC312;  /* anneau extérieur du logo */
  --c-jaune-fonce: #E9AE00;  /* survol des boutons jaunes */
  --c-jaune-clair: #FFF6DB;
  --c-vert:        #009432;  /* « Ingénierie & Conseils » */
  --c-vert-fonce:  #007A29;  /* vert lisible pour les petits textes */
  --c-vert-clair:  #E7F5EC;

  /* --- Neutres ---------------------------------------------------------- */
  --c-encre:       #0E1B33;  /* titres */
  --c-texte:       #3A4560;  /* texte courant */
  --c-discret:     #64708A;  /* textes secondaires */
  --c-trait:       #E2E7F0;  /* bordures */
  --c-fond:        #FFFFFF;
  --c-fond-alt:    #F4F7FC;  /* sections alternées */
  --c-erreur:      #C62828;

  /* --- Typographie ------------------------------------------------------ */
  --police: "Esperluette", "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --largeur-titres: 112%;    /* titres légèrement élargis, comme « BFE » */

  /* --- Mise en page ----------------------------------------------------- */
  --conteneur: 1180px;       /* largeur maximale du contenu */
  --gouttiere: 20px;         /* marge latérale sur mobile */
  --hauteur-entete: 84px;
  --espace-section: clamp(4.5rem, 3rem + 5vw, 7.5rem);

  /* --- Formes ----------------------------------------------------------- */
  --rayon-s: 8px;
  --rayon:   14px;
  --rayon-l: 22px;
  --ombre-s: 0 1px 2px rgba(14, 27, 51, .06), 0 2px 8px rgba(14, 27, 51, .05);
  --ombre:   0 2px 6px rgba(14, 27, 51, .05), 0 16px 40px rgba(14, 27, 51, .10);
}