/* FGExpo — page Galerie
   Sur ordinateur : reproduit la page Hostinger (montage pleine largeur,
   texte posé au même endroit). Sur téléphone : le texte passe sous le montage. */

.galerie {
  max-width: 1018px;            /* largeur des montages, comme sur Hostinger */
  margin: 0 auto;
  padding: 0 var(--marge) 40px;
  container-type: inline-size;  /* permet au texte de suivre la largeur des montages */
}
.galerie-titre {
  text-align: center;
  font-size: clamp(1.8rem, 5vw, 3rem);     /* 48 px sur ordinateur */
  font-weight: 600;
  margin: 60px 0 16px;
  color: #1a1a1c;
}
.galerie-sous-titre {
  text-align: center;
  font-size: 1rem;
  color: #56585e;
  margin: 0 0 100px;
}

.tableau { position: relative; }
.montage { position: relative; }
.montage > img:first-child { width: 100%; height: auto; display: block; }

/* ---------- Texte de chaque tableau ---------- */
.fiche h2, .fiche p, .note {
  color: #0d141a;
  line-height: 1.5;            /* interligne, comme sur Hostinger */
}
.fiche h2 { font-size: 0.95rem; font-weight: 600; margin: 0 0 8px; }   /* espace sous « Tableau No » */
.fiche p  { font-size: 0.95rem; font-weight: 400; margin: 0; }

/* Téléphone et petite tablette : texte sous le montage */
.fiche { padding: 14px 0 40px; }
.extra-image { display: block; width: 91px; height: auto; margin-top: 4px; }   /* le cardinal sous le texte du tableau 4 */
.note { font-size: 0.9rem; margin: 0 0 30px; }

/* Ordinateur : texte posé dans le montage, au même endroit que sur Hostinger.
   La taille suit la largeur des montages (14 px pour 1018 px de large). */
@media (min-width: 760px) {
  .fiche, .note {
    position: absolute;
    left: var(--x);
    top: var(--y);
    width: var(--l);
    z-index: 2;
  }
  .fiche { padding: 0; }
  .fiche h2, .fiche p, .note { font-size: 1.3753cqw; }   /* = 14 px à 1018 px */
  .fiche h2 { margin-bottom: 0.786cqw; }                 /* = 8 px  */
  .note { margin: 0; }
  .extra-image { width: 8.94cqw; }
}

/* ---------- Fin de page ---------- */
.fin { position: relative; margin-top: -6%; text-align: center; }   /* espace entre la ligne et « Merci! » : plus négatif = plus près */
.fin-ornement { width: 100%; height: auto; display: block; }
.merci {
  font-size: 1rem;
  font-weight: 600;
  margin: 0;
  position: absolute; left: 0; right: 0;
  top: 47%;          /* hauteur de « Merci! » : plus le chiffre est grand, plus il est près du feuillage */
}