/* EXITT — styles d'appoint pour la version statique (menus reconstruits) */

/* Dropdown "Nos Services" */
.exitt-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 8px;
  min-width: 240px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.14);
  padding: 8px;
  z-index: 60;
}
.exitt-dropdown a {
  display: block;
  padding: 10px 12px;
  border-radius: 8px;
  color: #1f2937;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
}
.exitt-dropdown a:hover { background: #fff3ec; color: #ea5b0c; }

/* Menu mobile */
.exitt-mobile-menu {
  position: absolute;
  top: 100%;
  right: 8px;
  left: 8px;
  margin-top: 8px;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.2);
  padding: 12px;
  z-index: 70;
  max-height: 75vh;
  overflow-y: auto;
}
.exitt-mobile-menu a {
  display: block;
  padding: 12px 14px;
  border-radius: 8px;
  color: #1f2937;
  text-decoration: none;
  font-weight: 600;
}
.exitt-mobile-menu a:hover { background: #fff3ec; color: #ea5b0c; }
.exitt-mm-label {
  display: block;
  padding: 12px 14px 4px;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #9ca3af;
  font-weight: 700;
}

/* Masquer la barre de scroll du carrousel */
.exitt-noscrollbar { scrollbar-width: none; -ms-overflow-style: none; }
.exitt-noscrollbar::-webkit-scrollbar { display: none; }

/* Élément replié (accordéon) */
[hidden] { display: none !important; }

/* Galerie interactive « Comment identifier … » : sa variante mobile est figée par le
   snapshot avec une hauteur mais SANS largeur (le calcul de mise en page JS de React
   n'a pas lieu en statique), d'où des boutons effondrés et des photos invisibles.
   On rétablit l'affichage pleine largeur des photos. */
.md\:hidden.space-y-3[role="group"] > button {
  display: block;
  width: 100%;
}

/* Débordements horizontaux mobile (bugs responsive hérités du site React) :
   - pages zones/* : les éléments de la grille hero ne rétrécissent pas (min-width:auto) ;
   - pages merule-urgence/* : un blob décoratif en position absolue dépasse à droite.
   On autorise le rétrécissement des grilles et on clippe les décorations. */
@media (max-width: 1023px) {
  .grid > * { min-width: 0; }
  .grid img { max-width: 100%; height: auto; }
  section { overflow-x: clip; }
}
