/* Stabilité de la largeur : aucun défilement horizontal, quelle que soit la taille d'écran. */
html { -webkit-text-size-adjust: 100%; }
html, body { max-width: 100%; overflow-x: clip; }
main { overflow-x: clip; }
img, svg, video, iframe { max-width: 100%; }
:where(input, select, textarea) { max-width: 100%; min-width: 0; }

/* Radios masquées du devis : recouvrent leur libellé au lieu de flotter hors de la page. */
.choice-grid label { position: relative; min-width: 0; }
.choice-grid label input { inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.choice-grid label input:focus-visible + span { outline: 2px solid #a87840; outline-offset: 2px; }

/* Les enfants de grilles/flex peuvent rétrécir (évite les débordements dus au contenu). */
.field-row > *, .hero-form-fields > *, .performances-grid > *, .video-mosaic > * { min-width: 0; }

/* Colonnes de grille qui rétrécissent : un « 1fr » seul ne descend pas sous la largeur de son contenu. */
main section, main section * { min-width: 0; }
@media (max-width: 900px) {
  .media-feature, .story-section, .repertoire-section, .home-media, .values-section,
  .area-section, .about-portrait, .video-mosaic, .media-categories { grid-template-columns: minmax(0, 1fr); }
}
h1, h2, h3 { overflow-wrap: break-word; }

/* Largeur bloquée : le site est centré et plafonné sur très grands écrans. */
:root { --site-max: 1680px; }
html { background: #0b0b0a; }
main { width: 100%; max-width: var(--site-max); margin-inline: auto; position: relative; }