:root {
  --size: 580px;
}

#home-main {
  height: var(--size);
  width: 100vw;
  font-size: var(--font-normal);
  background: var(--bg-beige-tint);
}

#home-main .container-fluid {
  position: relative;
  height: var(--size);
  overflow-x: none;
}

#home-main .swiper {
  height: var(--size);
  width: 100vw;
  overflow-x: none;

  border-bottom-left-radius: 30px;
  border-bottom-right-radius: 30px;
}

#home-main .swiper-slide img,
#home-main .swiper-slide video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#home-main .swiper-slide video {
  pointer-events: none;
}

#home-main .mobile {
  display: none;
}

.search-bar {
  top: -40px;
  position: relative;
  z-index: 2;
  border-radius: 1000px;
  box-shadow: 0px 3px 30px #0000000d;
  height: 80px;
  width: 100%;
}

.search-bar select {
  flex: 1 1 0px;
}

#home-markets {
  padding-bottom: 3rem;
  background-color: var(--bg-markets);
}

#home-markets h5 {
  color: var(--brown-tint-2);
}

#home-markets .row {
  padding-top: 5.5rem;
}

#text-1 {
  padding-top: 16.5rem;
  padding-bottom: 8rem;
}

#text-2 {
  padding-top: 16.5rem;
  padding-bottom: 12rem;
}

#text-1 .col,
#text-2 .col {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 50px;
}

#text-1 .text-container,
#text-2 .text-container {
  max-width: 424px;
}

#text-1 p {
  text-align: left;
  letter-spacing: 0px;
  color: #000;
  opacity: 1;
}

#text-2 p {
  text-align: left;
  letter-spacing: 0px;
  color: #707070;
  opacity: 1;
}

#text-1 {
  background: var(--bg-yellow);
}

#text-1 img,
#text-2 img {
  width: 100%;
}

#text-1 .image img,
#text-2 .image img {
  height: 100%;
  width: auto;
}

#text-2 {
  background: var(--bg-beige);
}

.img-detalhe .leaf {
  width: 250px;
  top: 30px;
  right: -60px;
  transform: rotate(-5deg);
}

.img-detalhe.second .leaf {
  bottom: 60px;
  left: -40px;
  transform: rotate(10deg);
  top: auto;
  right: auto;
}

.img-detalhe .dots {
  bottom: 80px;
  left: 10px;
  width: 100px;
}

.img-detalhe.second .dots {
  top: 100px;
  right: 10px;
  width: 100px;
  bottom: auto;
  left: auto;
}

.img-detalhe .detail {
  width: 610px;
  left: -70px;
}

@media (width < 768px) {
  #home-main .mobile {
    display: block;
  }

  #home-main .desktop {
    display: none;
  }

  .section-detail-top img,
  .section-detail-bottom img {
    vertical-align: super;
  }

  .search-bar {
    height: fit-content !important;
    border-radius: 30px !important;
  }

  .search-bar form {
    flex-direction: column;
  }

  .search-bar form .select2.select2-container.select2-container--default {
    width: 100%;
  }

  #text-1 .col,
  #text-2 .col {
    flex-direction: column;
  }

  #home-markets .row {
    padding-top: 4rem;
  }

  #text-1 {
    padding-top: 4.5rem;
    padding-bottom: 4rem;
  }

  #text-2 {
    padding-top: 4.5rem;
    padding-bottom: 4rem;
  }

  .img-detalhe .container {
    height: 500px;
    width: 340px;
  }

  .img-detalhe .image {
    width: 350px;
  }

  .img-detalhe .leaf {
    top: 25px;
    right: -40px;
    width: 200px;
  }

  .img-detalhe .dots {
    bottom: 100px;
    left: 10px;
    width: 70px;
  }

  .img-detalhe .detail {
    width: 500px;
    left: -70px;
  }
}

@media (width > 768px) and (width < 1390px) {
  .img-detalhe .image {
    width: 430px;
  }
}

@media (width > 1390px) {
  .img-detalhe .container {
    height: 500px;
    width: 570px;
  }

  .img-detalhe .leaf {
    width: 300px;
    top: -70px;
    right: -93px;
  }

  .img-detalhe .dots {
    width: 100px;
    bottom: 10px;
    left: 20px;
  }

  .img-detalhe .detail {
    width: 800px;
    left: -90px;
  }
}
