#header__slider {
  position: relative;
}

#header__slider .header-logo {
  position: absolute;
  margin-top: 18px;
  left: 50%;
  top: 40px;
  transform: translateX(-50%);
  z-index: 99;
}

#header__slider .header-desc {
  position: absolute;
  margin: auto;
  left: 3%;
  bottom: 15%;
  z-index: 10;
  color: white;
  font-weight: 700;
  font-size: 26px;
  width: 900px;
}

#header__slider .header-desc p {
  font-size: 24px;
  text-wrap: balance;
  letter-spacing: 0.03rem;
  font-family: 'Montserrat-Regular';
}

#header__slider .header-desc .highligth {
  font-size: 32px;
}

#header__slider .swiper-container {
  width: 100%;
  height: 900px;
  overflow: hidden;
}

#header__slider .bg-opacity {
  position: absolute;
  content: ' ';
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(0 0 0 / 40%);
  z-index: 5;
}

#header__slider .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}

#header__slider .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#header__slider .swiper-pagination-bullet {
  width: 20px;
  height: 20px;
  background-color: none;
  border: 2px solid white;
  margin: 9px 3px;
  z-index: 6;
}

#header__slider .swiper-pagination-bullet {
  width: 24px;
  height: 24px;
  background-color: white;
}

/* CAROUSEL 1 - DOBLE CAROUSEL */
#carousel__small {
  align-items: center;
  display: flex;
}

.mobile {
  display: none;
}

@media (width <=992px) {
  .mobile {
    display: block;
  }

  #header__slider .header-desc {
    width: 100%;
  }
}

#carousel__small .owl-carousel .owl-nav {
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  display: flex;
  justify-content: space-between;
  left: 50%;
  padding: 0 40px;
  pointer-events: none;
  position: absolute;
  top: 35%;
  transform: translate(-50%, -50%);
  width: 135%;
}

@media (width <=992px) {
  #carousel__small .owl-carousel .owl-nav {
    display: none;
  }
}

#carousel__small .owl-carousel .owl-nav button {
  border: none;
  outline: none;
  pointer-events: all;
  width: 60px;
}

#carousel__small .owl-carousel .owl-nav button img {
  width: 100%;
}

#carousel__small .owl-carousel .owl-nav button:nth-child(1) {
  transform: rotate(180deg);
}

#carousel__small .owl-carousel .item img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

#carousel__small .owl-carousel .owl-stage-outer .owl-stage .owl-item.active {
  opacity: 1;
}

#carousel__small
  .owl-carousel
  .owl-stage-outer
  .owl-stage
  .owl-item.active
  .item {
  opacity: 1;
  transition: 0.8s;
}

#carousel__small .owl-carousel.owl-theme {
  height: 592px;
  position: relative;
  width: 500px;
}

#carousel__small .owl-carousel.owl-theme .item {
  height: 692px;
  width: 500px;
}

#carousel__small .owl-carousel .item img {
  height: 392px;
  margin: 0 auto;
  opacity: 1;
  position: relative;
  transition: 0.8s;
  width: 382px;
}

@media (width <=992px) {
  #carousel__small .owl-carousel.owl-theme {
    height: 592px;
    width: 100%;
  }

  #carousel__small .owl-carousel.owl-theme .item {
    height: 692px;
    width: 100%;
  }

  #carousel__small .owl-carousel .item img {
    height: 392px;
    width: 100%;
  }
}

#carousel__small
  .owl-carousel
  .owl-stage-outer
  .owl-stage
  .owl-item.active
  .item {
  opacity: 1;
  transition: 0.4s;
}

#carousel__big .owl-carousel .item {
  height: 924px;
  opacity: 0.4;
  position: relative;
  transition: 0.8s;
}

@media (width <=992px) {
  #carousel__big .owl-carousel .item {
    height: 424px;
  }
}

#carousel__big .owl-carousel .item img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

#carousel__big .owl-carousel .owl-stage-outer .owl-stage .owl-item.active {
  opacity: 1;
}

#carousel__big
  .owl-carousel
  .owl-stage-outer
  .owl-stage
  .owl-item.active
  .item {
  opacity: 1;
  transition: 0.4s;
}

/* CAROUSEL 2 - OCIO */
#render__ocio,
#hogar,
#proyecto {
  position: relative;
}

#render__ocio .box,
#hogar .box {
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
  height: 594px;
  justify-content: flex-start;
  padding: 0 48px;
  position: absolute;
  right: 10%;
  top: 50%;
  transform: translateY(-50%);
  width: 669px;
  z-index: 99;
}

#proyecto .box {
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
  height: 594px;
  justify-content: flex-start;
  padding: 0 48px;
  position: absolute;
  left: 10%;
  top: 50%;
  transform: translateY(-50%);
  width: 669px;
  z-index: 99;
}

#hogar img,
#proyecto img {
  object-fit: cover;
  height: 44vw;
  width: 100%;
}

@media (width <=992px) {
  #render__ocio .box,
  #hogar .box,
  #proyecto .box {
    height: 300px;
    padding: 0 18px;
    left: 0;
    right: 0;
    top: 0;
    transform: translateY(0);
    width: 100%;
  }
  #hogar .box,
  #proyecto .box {
    opacity: 0.9;
  }
}

#render__ocio .owl-carousel .item {
  height: 44vw;
  opacity: 0.4;
  position: relative;
  transition: 8s ease-in;
}

#render__ocio .owl-carousel .item img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

#render__ocio .owl-carousel .owl-stage-outer .owl-stage .owl-item.active {
  opacity: 1;
}

#render__ocio .owl-carousel .owl-stage-outer .owl-stage .owl-item.active .item {
  opacity: 1;
  transition: 0.4s ease-in;
}

@media (width <=992px) {
  #render__ocio .owl-carousel .item {
    height: 424px;
  }

  #render__ocio .owl-carousel .owl-item {
    margin-top: 300px;
  }
}

@media (width <=480px) {
  #render__ocio .owl-carousel .owl-item {
    margin-top: 460px;
  }
}

@media (width <=768px) {
  #header__slider .header-logo {
    margin: 0 auto;
    margin-top: 10px;
    z-index: 99;
    top: 0;
  }

  #header__slider .header-logo img {
    width: 200px;
  }

  #header__slider .header-desc {
    font-size: 20px;
    left: 0;
    bottom: 18px;
    width: 99%;
    text-align: center;
  }

  #header__slider .swiper-container {
    height: 500px;
  }
}

/* CAROUSEL 3 - SLIDER CON TARJETAS */

#slider .owl-carousel {
  cursor: grab;
}

#slider .owl-carousel .item {
  min-height: 500px;
  max-height: 500px;
  opacity: 0.4;
  position: relative;
  transition: 0.8s;
  margin-inline: 36px;
}

#slider .owl-carousel .item img {
  min-height: 500px;
  max-height: 500px;
  object-fit: cover;
  width: 100%;
}

/* @media (width <=768px) {
  #slider .owl-carousel .item {
    width: 98%;
  }

  #slider .owl-carousel .item img {
    width: 98%;
  }
} */

#slider .owl-carousel .owl-stage-outer .owl-stage .owl-item.active {
  opacity: 1;
}

#slider .owl-carousel .owl-stage-outer .owl-stage .owl-item.active .item {
  opacity: 1;
  transition: 0.4s;
}

/* CAROUSEL 3 - GALERIA */
#gallery__slider {
  position: relative;
}

.inactive1 {
  display: none;
}

.inactive2 {
  display: none;
}

#gallery {
  left: 0;
  position: absolute;
  top: 0;
  transition: 500ms ease-in;
  width: 0%;
  z-index: 2;
}

#gallery .gallery__item {
  background-color: #2c2c2c;
  height: 1160px;
}

#gallery .gallery__item img {
  height: 100%;
  object-fit: contain;
  width: 100%;
}

#gallery .gallery__item video {
  height: 1160px;
  width: 100%;
}

.gallery__item:not(.active) {
  display: none;
}

.open__gallery {
  align-items: center;
  background-color: #d8cfbe;
  color: #000000;
  display: flex;
  height: 172px;
  justify-content: center;
  cursor: pointer;
  left: 0%;
  position: absolute;
  top: 70%;
  transform: translateY(-50%);
  transition: 500ms ease-in;
  width: 172px;
  z-index: 3;
}

@media (width <=1024px) {
  #gallery,
  .open__gallery {
    display: none;
  }
}

.gallery__next {
  align-items: center;
  background-color: #2c2c2c;
  color: #ffffff;
  display: none;
  border-radius: 50%;
  padding: 28px;
  height: 30px;
  width: 30px;
  /* height: 172px; */
  justify-content: center;
  cursor: pointer;
  left: 82%;
  position: absolute;
  top: 53%;
  transform: translateY(-100%);
  transition: 500ms ease-in;
  /* width: 172px; */
  z-index: 3;
}

.gallery__next img {
  width: 30px;
}

.gallery__close {
  display: none;
}

#galeria__mobile {
  display: none;
}

@media (width <=1024px) {
  #galeria__mobile {
    display: flex;
    flex-direction: column;
  }
}

#galeria__mobile .owl-carousel .item {
  /* height: 600px; */
  opacity: 1;
  position: relative;
  display: flex;
  align-items: center;
  transition: 0.8s;
}

#galeria__mobile .owl-carousel .item img {
  height: 100%;
  object-fit: contain;
  width: 100%;
}

#galeria__mobile .owl-carousel .item video {
  width: 100%;
}

.owl-dots {
  display: none;
}

@media (width <=1024px) {
  #carousel__small .owl-dots {
    bottom: 35%;
  }

  #slider .owl-dots {
    bottom: 28%;
  }

  .owl-dots {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: max-content;
  }

  .owl-dots .owl-dot {
    width: 15px;
    height: 15px;
    margin: 5px 10px;
    border-radius: 15px;
    /* Para dots cuadrados establecer a 0 */
    border: 2px solid #ffffff;
    /* Color del borde de los dots */
  }

  .owl-dots .owl-dot.active {
    background: #ffffff;
    /* Color de fondo del dot activo */
  }

  .owl-dots .owl-dot :focus {
    outline: none;
  }
}
