.hero {
  height: calc(100vh - 56px);
  position: relative; /* important pour que l'overlay se positionne par rapport à ce conteneur */
}

.hero-map {
  height: 100%;
  width: 100%;
  position: relative;
  z-index: 0; /* carte en arrière-plan */
}

.hero-overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(55,65,81,0.55);
  padding: 0 1rem;
  z-index: 10; /* overlay au-dessus de la carte */
}


.btn-warning {
  background-color: var(--accent);
  border-color: var(--accent);
  color: #111827;
}

.btn-warning:hover {
  background-color: #d4a107;
  border-color: #d4a107;
}

/* Animation fade */
.fade-marker {
  opacity: 0;
  transition: opacity 1.5s ease-in-out;
}
.fade-marker.visible {
  opacity: 1;
}