/* ===== Widget Intervenants (braillard-intervenants) =====
   Liste nom + poste ; au clic la photo apparaît en overlay au niveau de la
   ligne active + lien « En savoir plus » à droite (positionnés en px par
   intervenants.js — pas de transition sur la position, cf. gels Chrome). */

.br-interv{ position: relative; }

.br-interv__heading{
  margin: 0 0 clamp(20px, 2vw, 34px);
  font-family: var(--br-font-body);
  font-size: clamp(24px, 1.97vw, 34px);
  font-weight: 400;
  line-height: 1.2;
}

.br-interv__list{ list-style: none; margin: 0; padding: 0; }

.br-interv__btn{
  display: flex; align-items: baseline; width: 100%;
  gap: clamp(16px, 2.3vw, 40px);
  /* réserve à droite pour « En savoir plus » (les postes longs passaient dessous) */
  padding: .3em clamp(150px, 13vw, 220px) .3em 0;
  box-sizing: border-box;
  background: none; border: 0; text-align: left; cursor: pointer;
  font: inherit; color: inherit; text-decoration: none;
  white-space: normal;
}
.br-interv__role{ min-width: 0; }
.br-interv__name{
  flex: 0 0 clamp(150px, 13vw, 230px);
  font-weight: 700;
}
/* la ligne est un <a> : neutralise les couleurs de lien du thème */
.br-interv__btn, .br-interv__btn:hover, .br-interv__btn:visited,
.br-interv__name, .br-interv__role{ color: var(--br-black, #000); }
.br-interv__name,
.br-interv__role{
  font-family: var(--br-font-body);
  font-size: clamp(15px, 1.15vw, 20px);
  line-height: 1.4;
}
.br-interv__name:hover{ color: #6b6660; }
.br-interv__row.is-active .br-interv__name{ color: var(--br-terracotta, #B85D43); }

/* La photo surplombe la liste (les noms restent visibles à gauche). */
.br-interv__photo{
  position: absolute; left: 37%; top: 0;
  transform: translateY(-50%);
  width: clamp(220px, 22vw, 340px);
  display: none; z-index: 2;
}
.br-interv__photo img{ display: block; width: 100%; height: auto; }
.br-interv__photo.is-empty{ display: none !important; }

.br-interv__more{
  position: absolute; right: 0; top: 0;
  transform: translateY(-50%);
  display: none; z-index: 2;
  align-items: center; gap: 10px;
  font-family: var(--br-font-body); font-size: 16px;
  color: var(--br-black, #000); text-decoration: none;
}
.br-interv--open .br-interv__photo{ display: block; }
.br-interv--open .br-interv__more{ display: inline-flex; }
.br-interv__more:hover{ text-decoration: underline; }
.br-interv__plus{ width: 22px; height: 22px; display: block; }

@media (max-width: 700px){
  .br-interv__btn{ flex-direction: column; gap: 2px; padding: .5em 0; }
  .br-interv__name{ flex: none; }
  /* photo plus large, calée à droite (les noms restent lisibles) */
  .br-interv__photo{ left: auto; right: 0; width: min(62vw, 300px); }
  .br-interv__more{ top: auto; transform: none; position: static; margin-top: 10px; }
}