/* =============================================================================
   equipe-grille.css — grille des membres de l'equipe (bloc ADDITIONNEL)
   =============================================================================
   Repris de la maquette figee (style.css l. 2768-2775, 2783-2786, 2833-2834). Les commentaires d'origine sont
   conserves : ils portent des motifs de conception qu'aucune autre source ne
   documente.

   ⚠️ TOUT le CSS de ce type de bloc vit ici — y compris ses @media. Rien dans
   le CSS d'une page : un bloc duplique vers une page vierge doit rester correct.
   ============================================================================= */

.eq-grille{ background:var(--blanc); }
.eq-grille__grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(270px, 1fr));
  gap:clamp(18px,2vw,32px); }
.eq-carte{ background:var(--creme); border:1px solid var(--creme-2); border-radius:18px;
  padding:18px 18px 26px; text-align:center;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease); }
.eq-carte:hover{ transform:translateY(-6px); box-shadow:0 24px 60px rgba(0,0,0,.12); }
/* Grands portraits RONDS.
   ⚠️ PAS d'obturateur ici, contrairement a ce qu'annoncent deux commentaires de la
   maquette : son propre code ne l'applique qu'a `.pg-dest__pic` et `.gd-carte__pic`,
   avec la mention « RETIRE de la page equipe ». Le code fait foi.
   ⚠️ `background` est une propriete RACCOURCIE : elle remet `background-image` a zero.
   L'image du portrait arrive donc par un style INLINE sur le span, qui prime. */
.eq-carte__pic{ position:relative; display:block; width:min(240px, 82%); aspect-ratio:1;
  border-radius:50%; overflow:hidden; margin:0 auto 20px;
  background:#241d12 center top/cover no-repeat; border:3px solid var(--jaune);
  box-shadow:0 14px 34px -14px rgba(0,0,0,.35); }
.eq-carte__nom{ font-size:clamp(24px,2.2vw,32px); color:var(--noir); margin:6px 0 12px; }
.eq-carte__bio{ font-size:var(--fs-small); line-height:1.6; color:var(--noir-50); text-align:left; }

/* --- Responsive (maquette mobile.css) --- */
@media (max-width:1024px){
  /* Pas de survol au doigt : l'etat :hover resterait colle apres un tap. */
  .eq-carte:hover{ transform:none; box-shadow:none; }
}
