.carrucel{
 display: flex;
 justify-content: center;
  
}

.carrucelImg{
   width:25%;
   height: 100vh; 
   object-fit: cover;
   overflow: hidden;
   transition: all 0.5s Ease-in-out;
}
 

.carrucel img:hover {
    width: 300%;
}

.textCacuarto{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCacuarto1{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCacuarto2{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCacuarto3{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCatercero{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCatercero1{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCatercero2{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCatercero3{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCasegundo{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCasegundo1{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCasegundo2{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCasegundo3{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCa{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textCa1{
    position: relative;
    overflow: hidden;
    display: contents;
}

.textCa2{
    position: relative;
    overflow: hidden;
    display: contents;
}

.textCa3{
    position: relative;
    overflow: hidden;
    display: contents;
}

.textfoter{
    position: relative;
    overflow: hidden;
    display: contents;
}

.textfoter1{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textfoter2{
  position: relative;
  overflow: hidden;
  display: contents;
}

.textfoter3{
  position: relative;
  overflow: hidden;
  display: contents;
}

.capa{
  position: absolute;
  top: 185%;
  left: 2%;
  width: 33%;
  transition: all 400ms ease-out;
  opacity: 0;
  color: white;
  visibility: hidden;
  text-align: left;
}

.capa h2{
  font-family: "Barlow", sans-serif; 
  font-weight: 400; 
  font-style: normal;
  font-size: 35px;
}

.capa p{
  font-family: "Barlow", sans-serif; 
  font-weight: 100; 
  font-style: normal;
  font-size: 19px;
}

.carrucel .textCa:hover > .capa {
    opacity: 1;
    visibility: visible;
}


.capa1{
    position: absolute;
    top: 185%;
    left: 10%;
    width: 33%;
    transition: all 400ms ease-out;
    opacity: 0;
    color: white;
    visibility: hidden;
    text-align: left;
}
 
.capa1 img{
    width: 100px;
    height: 90px;
}

.carrucel .textCa1:hover > .capa1 {
    opacity: 1;
    visibility: visible;
}

.capa1 h2{
    font-family: "Barlow", sans-serif; 
    font-weight: 400; 
    font-style: normal;
    font-size: 35px;
}

.capa1 p{
    font-family: "Barlow", sans-serif; 
    font-weight: 100; 
    font-style: normal;
    font-size: 19px;
}

.capa2{
    position: absolute;
    top: 185%;
    left: 17%;
    width: 33%;
    transition: all 400ms ease-out;
    opacity: 0;
    color: white;
    visibility: hidden;
    text-align: left;
}

.capa2 img{
    width: 115px;
    height: 100px;
}

.carrucel .textCa2:hover > .capa2 {
    opacity: 1;
    visibility: visible;
}

.capa2 h2{
    font-family: "Barlow", sans-serif; 
    font-weight: 400; 
    font-style: normal;
    font-size: 35px;
}

.capa2 p{
    font-family: "Barlow", sans-serif; 
    font-weight: 100; 
    font-style: normal;
    font-size: 19px;
}

.capa3{
    position: absolute;
    top: 185%;
    left: 23%;
    width: 31%;
    transition: all 400ms ease-out;
    opacity: 0;
    color: white;
    visibility: hidden;
    text-align: left;
}
.carrucel .textCa3:hover > .capa3 {
    opacity: 1;
    visibility: visible;
}

.capa img{
    width: 115px;
    height: 100px;
}

.capa3 h2{
    font-family: "Barlow", sans-serif; 
    font-weight: 400; 
    font-style: normal;
    font-size: 35px;
}

.capa3 p{
    font-family: "Barlow", sans-serif; 
    font-weight: 100; 
    font-style: normal;
    font-size: 19px;
}


.scroll-container {
    height: 100vh;
    overflow-y: scroll;
    scroll-snap-type: y mandatory;
    position: relative;
  }

  .section {
    scroll-snap-align: start;
    scroll-snap-stop: always;
    object-fit: cover;
    object-position: center;
    width: 100%;
  }


  /*Segundo carrusel*/
  .capasegundo{
    position: absolute;
    transition: all 400ms ease-out;
    opacity: 0;
    color: white;
    visibility: hidden;
    left: 2%;
    width: 38%;
    display: flex;
    flex-direction: column;
    justify-content: end;
    top: 383%; 
  }

  .capasegundo h2{
    font-family:"Barlow", sans-serif;
    font-weight: 400; 
    font-style: normal;
    font-size: 33.5px;
  }

  .capasegundo p{
    font-family: "Barlow", sans-serif; 
    font-weight: 100; 
    font-style: normal;
    font-size: 13.5px;
  }

  .carrucel .textCasegundo:hover > .capasegundo {
    opacity: 1;
    visibility: visible;
  }

/*segundo carrucel*/
  .capasegundo1{
    position: absolute;
    transition: all 400ms ease-out;
    opacity: 0;
    color: white;
    visibility: hidden;
    left: 10%;
    width: 38%;
    display: flex;
    flex-direction: column;
    justify-content: end;
    top: 383%;
  }

  .capasegundo1 h2{
    font-family: "Barlow", sans-serif; 
    font-weight: 400; 
    font-style: normal;
    font-size: 33.5px;
  }

  .capasegundo1 p{
    font-family: "Barlow", sans-serif; 
    font-weight: 100; 
    font-style: normal;
    font-size: 13.5px;
  }

  .carrucel .textCasegundo1:hover > .capasegundo1 {
    opacity: 1;
    visibility: visible;
  }

  .capasegundo2{
    position: absolute;
    transition: all 400ms ease-out;
    opacity: 0;
    color: white;
    visibility: hidden;
    left: 17%;
    width: 38%;
    display: flex;
    flex-direction: column;
    justify-content: end;
    top: 383%;
  }

  .capasegundo2 h2{
    font-family: "Barlow", sans-serif; 
    font-weight: 400; 
    font-style: normal;
    font-size: 33.5px;
  }

  .capasegundo2 p{
    font-family: "Barlow", sans-serif; 
    font-weight: 100; 
    font-style: normal;
    font-size: 13.5px;
  }

  .carrucel .textCasegundo2:hover > .capasegundo2 {
    opacity: 1;
    visibility: visible;
  }

  .capasegundo3{
    position: absolute;
    transition: all 400ms ease-out;
    opacity: 0;
    color: white;
    visibility: hidden;
    left: 24%;
    width: 38%;
    display: flex;
    flex-direction: column;
    justify-content: end;
    top: 383%;
  }

  .capasegundo3 h2{
    font-family: "Barlow", sans-serif; 
    font-weight: 400; 
    font-style: normal;
    font-size: 33.5px;
  }

  .capasegundo3 p{
    font-family: "Barlow", sans-serif; 
    font-weight: 100; 
    font-style: normal;
    font-size: 13.5px;
  }

  .carrucel .textCasegundo3:hover > .capasegundo3 {
    opacity: 1;
    visibility: visible;
  }

/*Segundo carrusel*/



/*Tercer Carrusel*/
.capatercero{
    position: absolute;
    top: 483%;
    left: 2%;
    width: 28%;
    transition: all 400ms ease-out;
    opacity: 0;
    color: white;
    visibility: hidden;
    text-align: left;
}

.capatercero h2{
    font-family: "Barlow", sans-serif; 
    font-weight: 400; 
    font-style: normal;
    font-size: 35px;
}

.capatercero p{
    font-family: "Barlow", sans-serif; 
    font-weight: 100; 
    font-style: normal;
    font-size: 14px;
}

.carrucel .textCatercero:hover > .capatercero {
    opacity: 1;
    visibility: visible;
}


.capatercero1{
    position: absolute;
    top: 483%;
    left: 11%;
    width: 34%;
    transition: all 400ms ease-out;
    opacity: 0;
    color: white;
    visibility: hidden;
    text-align: left;
}
 
.capatercero1 img{
    width: 100px;
    height: 90px;
}

.carrucel .textCatercero1:hover > .capatercero1 {
    opacity: 1;
    visibility: visible;
}

.capatercero1 h2{
    font-family: "Barlow", sans-serif; 
    font-weight: 400; 
    font-style: normal;
    font-size: 35px;
}

.capatercero1 p{
    font-family: "Barlow", sans-serif; 
    font-weight: 100; 
    font-style: normal;
    font-size: 14px;
}

.capatercero2{
    position: absolute;
    top: 483%;
    left: 17%;
    width: 30%;
    transition: all 400ms ease-out;
    opacity: 0;
    color: white;
    visibility: hidden;
    text-align: left;
}

.capatercero2 img{
    width: 115px;
    height: 100px;
}

.carrucel .textCatercero2:hover > .capatercero2 {
    opacity: 1;
    visibility: visible;
}

.capatercero2 h2{
    font-family: "Barlow", sans-serif; 
    font-weight: 400; 
    font-style: normal;
    font-size: 35px;
}

.capatercero2 p{
    font-family: "Barlow", sans-serif; 
    font-weight: 100; 
    font-style: normal;
    font-size: 14px;
}

.capatercero3{
    position: absolute;
    top: 483%;
    left: 23%;
    width: 31%;
    transition: all 400ms ease-out;
    opacity: 0;
    color: white;
    visibility: hidden;
    text-align: left;
}
.carrucel .textCatercero3:hover > .capatercero3 {
    opacity: 1;
    visibility: visible;
}

.capatercero3 img{
    width: 115px;
    height: 100px;
}

.capatercero3 h2{
    font-family: "Barlow", sans-serif; 
    font-weight: 400; 
    font-style: normal;
    font-size: 35px;
}

.capatercero3 p{
    font-family: "Barlow", sans-serif; 
    font-weight: 100; 
    font-style: normal;
    font-size: 14px;
}

/*Tercer carrusel*/



/* Estilos específicos para el carrusel móvil de Fachadas */
@media (max-width: 768px) {
  /* Estructura del slider en versión móvil */
  #slider-wrapperFachada {
    position: relative;
    width: 100%;
    margin: 0 auto;
    font-family: arial, sans-serif;
    font-size: 0;
    box-sizing: border-box;
  }

  #sliderFachada {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
  }

  #sliderFachada a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
  }

  #sliderFachada img {
    width: 100%;
    min-height: 100%;
    object-fit: cover;
  }

  /* Flechas de navegación móvil */
  a.masFachada, a.menosFachada {
    position: absolute;
    top: 50%;
    left: 91%;
    text-decoration: none;
    color: white;
  }

  a.menosFachada {
    left: 5%;
  }
}