/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[13].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[13].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[13].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[13].use[5]!./app/Realisations/style.scss ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
.realisations {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: auto;
  overflow-y: scroll; /* Permet le défilement vertical */
  scroll-snap-type: y mandatory; /* Active l'accrochage vertical obligatoire */
  height: 100vh;
  scrollbar-width: none; /* Cacher la barre de défilement sur Firefox */
}
.realisations .photos {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.realisations .photos .row, .realisations .photos .full-width {
  scroll-snap-align: start; /* Chaque section s'accroche au début */
}
.realisations .photos .row {
  display: flex; /* Aligne les images horizontalement */
  width: 100%; /* La rangée occupe toute la largeur */
}
.realisations .photos .image {
  width: 50%;
  height: 50vh;
  object-fit: cover;
}
@media screen and (min-width: 60rem) {
  .realisations .photos .image {
    height: 100vh;
  }
}
.realisations .photos .full-width {
  width: 100%; /* La troisième image occupe toute la largeur */
}
@media screen and (min-width: 60rem) {
  .realisations .photos .full-width {
    height: 100vh;
  }
}