/* =========================
   FOND
========================= */
.fond-batiment-abandonne {
  background-image: url("../images/fonds/fond_batiment_abandonne.webp");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  color: #fff;
}

/* =========================
   ZONE BATIMENT ABANDONNE
========================= */
.batiment-abandonne-zone {
  position: relative;
  width: 100%;
  min-height: calc(100vh - 140px); /* header + footer */
}

/* =========================
   ZONES CLIQUABLES
========================= */
.zone {
  position: absolute;
  display: block;

  text-decoration: none;
  color: transparent;        /* TEXTE INVISIBLE */
  user-select: none;
}

/* =========================
   POSITIONS (À AJUSTER)
========================= */
.zone-dortoir {
  top: 42%;
  left: 17%;
  width: 16%;
  height: 37%;
}

.zone-observatoire {
  top: 44%;
  left: 58%;
  width: 16%;
  height: 37%;
}

/* =========================
   MODE DEBUG (TEMPORAIRE)
========================= */
.debug .zone {
  background: rgba(255, 0, 0, 0.25);
  border: 2px dashed red;
}

/* =========================
   PANCARTE CENTRALE – ZONE DANGEREUSE
========================= */
.pancarte-danger {
  position: absolute;

  /* 🔧 POSITIONNEMENT PAR POURCENTAGE */
  top: 50%;
  left: 45.5%;
  transform: translate(-50%, -50%);

  width: 38%;          /* ajustable */
  max-width: 420px;
  min-width: 220px;

  pointer-events: none; /* ne bloque pas les zones cliquables */
  z-index: 3;
}

.pancarte-danger img {
  width: 100%;
  height: auto;
  display: block;
}

@media (orientation: portrait) {
  .fond-batiment-abandonne {
  background-image: url("../images/fonds/fond_batiment_abandonne_mobile.webp");
  }
  
  .zone-dortoir {
  top: 44%;
  left: 0%;
  width: 50%;
  height: 37%;
  }

.zone-observatoire {
  top: 14%;
  left: 58%;
  width: 40%;
  height: 37%;
  }

  .pancarte-danger {
  top: 95%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: 48%;          /* ajustable */
  max-width: 520px;
  min-width: 260px;
  }
}