/* ===================================================
   📐 Layout intelligent : pleine largeur vs contenu centré
=================================================== */

/* Section bord à bord */
.section-full {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

/* Contenu centré à l’intérieur d’une section pleine largeur */
.section-contained {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1rem;
}

/* Variante fluide pour écrans larges */
@media (min-width: 1600px) {
  .section-contained {
    max-width: 1440px;
  }
}

/* Exemple : slider ou bannière immersive */
.hero-banner,
.slider-wrapper,
.full-banner {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

/* Texte ou contenu dans une section large */
.hero-banner .content,
.slider-wrapper .content,
.full-banner .content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 2rem 1rem;
}

/* Sécurité responsive */
img, video {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Optionnel : désactive les paddings globaux sur certaines sections */
.no-padding {
  padding: 0 !important;
}

.no-margin {
  margin: 0 !important;
}