/* Option A : cibler uniquement les pages d’article si ta page a bien la classe .single */
.single #hero {
  height: 0px !important;      /* au lieu de 150px */
  min-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Écrans >= md (remplace md:h-[200px]) */
@media (min-width: 768px) {
  .single #hero { height: 0px !important; }
}

/* Option B : si .single n’est pas présent chez toi, cible tout simplement #hero partout */
#hero {
  height: 0px !important;
  min-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
@media (min-width: 768px) {
  #hero { height: 0px !important; }
}

/* Bonus anti-"marge fantôme" si jamais l’espace vient d’un effondrement de marges */
#hero { overflow: auto; }



/* ==== Réglages faciles (change juste ces 4 valeurs) ==== */
:root{
  --logo-h: 40px;        /* taille logo mobile */
  --logo-h-md: 40px;     /* taille logo desktop (≥768px) */
  --menu-py: 0.5rem;     /* épaisseur barre mobile (py-2) */
  --menu-py-md: 0.75rem; /* épaisseur barre desktop (py-3) */
}

/* Barre du haut */
.main-menu{
  padding-block: var(--menu-py) !important;
}
@media (min-width:768px){
  .main-menu{ padding-block: var(--menu-py-md) !important; }
}

/* Logo (span.logo + svg) */
.main-menu .logo{
  height: var(--logo-h) !important;
  display: inline-flex !important;
  align-items: center !important;
}
.main-menu .logo svg{
  height: 100% !important;   /* le SVG suit la hauteur du conteneur */
  width: auto !important;
}
@media (min-width:768px){
  .main-menu .logo{ height: var(--logo-h-md) !important; }
}


/* --- Contour blanc fin sur tout le contenu du logo --- */
.logo svg,
.logo svg * {
  stroke: #fff !important;
  stroke-width: 2.5px !important;      /* ajuste si besoin */
  vector-effect: non-scaling-stroke !important;
  paint-order: stroke fill !important;
  stroke-linejoin: round !important;
  stroke-linecap: round !important;
}