/* ==========================================================================
   Interactions
   Aucune animation décorative : ni sur les textes, ni sur les photos.
   Il ne reste que de l'interface, l'en-tête qui se compacte, l'ouverture
   fluide de la FAQ et le curseur de la galerie.
   ========================================================================== */

/* ------------------------------------------- Cadres des photos ---------- */
/* Ces règles ne servent qu'au cadrage, rien n'est animé. */

.rev-photo { position: relative; overflow: hidden; }

.cadre-hero {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  min-height: clamp(300px, 30vw, 640px);
  align-self: stretch;
}
.cadre-hero img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 45%;
  display: block;
}

.stack .rev-photo {
  border-radius: 10px;
  min-height: clamp(220px, 17vw, 340px);
}
.stack .rev-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  border-radius: 0;
  object-fit: cover;
}

/* ------------------------------------- Curseur « Agrandir » -------------- */

.curseur-photo {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 120;
  pointer-events: none;
  background: var(--ink);
  color: #fff;
  border-radius: 999px;
  padding: 11px 19px;
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  opacity: 0;
  transition: opacity .22s ease;
}
.curseur-photo.actif { opacity: 1; }

@media (hover: none), (pointer: coarse) {
  .curseur-photo { display: none; }
}

/* ------------------------------------------- En-tête qui se compacte ----- */

.site-header { transition: border-color .3s ease; }
.site-header .shell { transition: padding-block .3s ease; }

.entete-compacte .site-header { border-bottom-color: var(--line-strong); }
.entete-compacte .site-header .shell { padding-block: 10px; }

/* --------------------------------------------- FAQ, ouverture fluide ----- */

.faq-corps {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .35s cubic-bezier(.4, 0, .2, 1);
}
.faq-corps > * { overflow: hidden; min-height: 0; }
.faq details[open] .faq-corps { grid-template-rows: 1fr; }
.faq details.se-ferme .faq-corps { grid-template-rows: 0fr; }