/* Exceptions responsive — et rien d'autre.
   La maquette Épi v3 est reprise au balisage près et apporte sa propre
   feuille, inlinée dans chaque page. Ce fichier ne contient QUE les écarts
   rendus nécessaires par les petits écrans. Aucun n'a d'effet à 1280 px,
   la largeur de composition d'origine. */

/* Un bloc que la maquette posait en absolu sur la composition de 1280 px
   (`left:96px`, `left:28px`…) sort de l'écran sur un téléphone, et comme la
   page ne défile pas horizontalement il est rogné. Le générateur marque ces
   blocs ; ils reviennent dans le flux. */
@media (max-width: 900px) {
  .pose {
    position: static !important;
    inset: auto !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
  }
}

@media (max-width: 900px) {
  [style*="grid-template-columns:repeat(4"],
  [style*="grid-template-columns:repeat(3"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 640px) {
  [style*="grid-template-columns"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  [style*="display:flex"],
  [style*="display: flex"] {
    flex-wrap: wrap;
  }

  /* Une vignette de galerie porte `grid-column: span 2`, hérité des trois
     colonnes. Avec une seule colonne, ce `span` crée une colonne IMPLICITE
     de 0 px : les vignettes qui y tombent sont écrasées à zéro. */
  [style*="grid-column"],
  [style*="grid-row:"] {
    grid-column: auto !important;
    grid-row: auto !important;
  }
}

/* Les sections pleine largeur.
   Dans la maquette, une section de héros portait `max-width:900px` et
   96 px de retrait : 1092 px au total, soit presque toute la page de
   1280 px. Depuis que la composition occupe la fenêtre, cette section
   s'arrête court — et comme elle porte `overflow:hidden`, elle tranche net
   le halo décoratif qui la déborde. C'est le bord visible signalé sur la
   page Contact.

   Une section est pleine largeur quand elle est enfant direct de <main> :
   son contenu garde ses propres mesures, seul le fond s'étend. */
main > [style*="overflow:hidden"] {
  max-width: none !important;
}