/* =========================================================================
   EN-TETE — TENUE SUR PETIT ECRAN
   Posee le 13/08/2026. Signalee par Akim depuis son telephone : « le logo et
   le numero de telephone se marchent dessus ».

   LA MESURE, A 390 px DE LARGE
       logo    de x=10  a x=157
       bouton  de x=147 a x=301   -> ils se recouvrent de 6 a 10 px
       burger  de x=342 a x=374
   Le defaut est sur TOUS les gabarits d'en-tete, pas seulement l'accueil :
   releve identique sur / , sur /epaviste-45/gien/ et sur /a-propos/.

   LE CALCUL DE LA PLACE, a 390 px
       390 - 10 (marge gauche) - 32 (burger) - 16 (marge droite) = 332
       moins deux respirations de 12 px                          = 308
       il faut donc loger logo + bouton dans 308 px : 118 + 150 = 268. Ca tient.

   RETOUR ARRIERE, EN UNE COMMANDE
       mv .../vhu-v2/vhu-entete-mobile.css ~/archives-claude/2026-08-13-entete/
   Le chargement teste l'existence du fichier.

   Rien n'est touche au-dessus de 480 px : sur ordinateur, l'en-tete est deja
   correct et n'a aucune raison de bouger.
   ========================================================================= */

@media (max-width: 480px) {

    /* Le logo est servi a 147 px de large. On le ramene a 118 : il reste
       parfaitement lisible — le mot « CARS ECO » y fait encore 11 px de haut —
       et il libere les 29 px qui manquaient. */
    .et_pb_menu__logo img,
    .et_pb_menu__logo-wrap img {
        max-width: 118px !important;
        width: 118px !important;
        height: auto !important;
    }

    /* Le bouton d'appel garde sa taille et son numero en clair : c'est le
       premier geste attendu d'un visiteur sur telephone, il ne se reduit pas.
       On lui donne seulement une marge a gauche pour qu'il ne colle plus au
       logo, et on retire le rembourrage asymetrique (25 px a gauche contre 5 a
       droite) qui poussait le texte hors de son axe. */
    .btn_header.et_pb_button,
    a.et_pb_button_0_tb_header {
        margin-left: 12px !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    /* ESSAI RETIRE, ET LA MESURE DIT POURQUOI. Forcer la rangee en flex nowrap
       mettait bien les trois elements sur une ligne, mais il n'y avait pas la
       place : le bouton d'appel finissait a x=420 pour un ecran de 360 px de
       large, donc hors de l'ecran, aux quatre largeurs testees. Divi range
       cette rangee lui-meme ; on ne la contrarie pas, on rend seulement au
       logo la place qu'il prenait de trop. */
}