#home-hero {
  position: relative;
  width: 100%;
  height: fit-content;
  padding: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0 0 8rem 0;
}
#home-hero #carouselHero {
  width: 100%;
}
#carouselHero .carousel-control-next, #carouselHero .carousel-control-prev {
  width: fit-content;
  margin: 0 20px;
  opacity: 1;
}
#carouselHero .carousel-control-next:hover, #carouselHero .carousel-control-prev:hover {
  opacity: 0.4;
}
#home-hero #carouselHero .carousel-inner {
  width: 100%;
}
#home-hero #carouselHero .carousel-item {
  width: 100%;
}
#home-hero #carouselHero .carousel-item .hero-item-wrapper {
  position: relative;
  width: 100%;
  height: 62vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 10% 10%;
}
#home-hero #carouselHero .hero-item-wrapper .hero-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#home-hero #carouselHero .hero-item-wrapper .hero-background img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  border-radius: 5px;
}
#home-hero #carouselHero .hero-item-wrapper .hero-background::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: transparent linear-gradient(270deg, #FFFFFF63 0%, #2727279E 50%, #0000009E 80%, #4444448C 100%) 0% 0% no-repeat padding-box;
  mix-blend-mode: multiply;
  opacity: 0.9;
}
#home-hero #carouselHero .hero-item-wrapper #categories-wrapper {
  z-index: 1;
}
#home-hero #carouselHero .hero-item-wrapper .hero-title {
  font-family: "DM Sans";
  color: #fff;
  font-weight: 400;
  font-size: 42px;
  line-height: 52px;
  margin: 0.3em 0 0.6em 0;
  z-index: 1;
  max-width: 550px;
}
#home-hero #carouselHero .hero-item-wrapper .hero-link {
  width: fit-content;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 0.9rem 1.15rem;
  margin: 1rem 0 4rem 0;
  background-color: transparent;
  border: 2px solid #fff;
  border-radius: 5px;
  z-index: 1;
}
#home-hero #carouselHero .hero-item-wrapper .hero-link img {
  margin-left: 1rem;
  scale: 1.2;
  transition: all 0.5s ease-in-out;
}
#home-hero #carouselHero .hero-item-wrapper .hero-link .text {
  color: #fff;
  font-weight: 400;
  font-size: 16px;
  line-height: 19px;
  text-transform: uppercase;
}
#home-hero #carouselHero .hero-item-wrapper .hero-link:hover img {
  transform: translateX(-0.5rem);
}
@media (max-width: 992px) {
  #home-hero {
    padding: 0 0 2rem 0;
  }
  #home-hero #carouselHero .carousel-item .hero-item-wrapper {
    height: 75vh;
    justify-content: center;
    align-items: center;
  }
  #home-hero #carouselHero .hero-item-wrapper .hero-title {
    font-size: 40px;
    line-height: 50px;
    text-align: center;
  }
  #home-hero #carouselHero .hero-item-wrapper .hero-link {
    margin: 1rem 0;
  }
}

#now {
  padding: 0 0 8rem 0;
}
#now .section-wrapper {
  column-gap: 8rem;
}
#now .section-title {
}
#now .section-subtitle {
  color: #000;
  font-weight: 400;
  font-size: 16px;
  line-height: 32px;
  margin: -0.5em 0 2em 0;
}
#now .now-items-wrapper {
  width: 100%;
  aspect-ratio: 4.526;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: wrap;
  column-gap: 1.4%;
  row-gap: 1vw;
}
#now .now-item-wrapper {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  padding: 1.7rem 2rem;
  overflow: hidden;
}
#now .now-item-wrapper.big {
  width: 39%;
}
#now .now-item-wrapper.medium {
  width: 33%;
}
#now .now-item-wrapper.small {
  width: 25.2%;
}
#now .now-item-wrapper .now-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: scale 0.5s ease-in-out;
}
#now .now-item-wrapper:hover .now-background{
  scale: 1.05;
}
#now .now-item-wrapper .now-background img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  border-radius: 5px;
}
#now .now-item-wrapper .now-background::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: transparent linear-gradient(180deg, #FFFFFF63 0%, #8E8E8E82 35%, #54545499 50%, #27272799 70%, #3838389E 90%, #4444448C 100%) 0% 0% no-repeat padding-box;
  mix-blend-mode: multiply;
  opacity: 0.9;
}
#now .now-item-wrapper .now-title {
  font-family: "DM Sans";
  color: #fff;
  font-weight: 400;
  font-size: 22px;
  line-height: 32px;
  margin: 0;
  z-index: 1;
}
@media (max-width: 992px) {
  #now {
    padding: 2rem 0 3rem 0;
  }
  #now .now-items-wrapper {
    width: 100%;
    aspect-ratio: unset;
    row-gap: 5vw;
  }
  #now .now-item-wrapper.big, #now .now-item-wrapper.medium, #now .now-item-wrapper.small {
    width: 100%;
    max-width: 600px;
    aspect-ratio: 1;
  }
}

#decouvrir {
  padding: 0 0 8rem 0;
}
#decouvrir h2 {
  color: #000;
  font-weight: 700;
  font-size: 22px;
  line-height: 52px;
  letter-spacing: 0px;
  margin: 0 0 1.5em 0;
}
#decouvrir h3 {
  color: var(--theme-green);
  font-weight: 700;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: 0px;
  margin: 2em 0 0.5em 0;
}
#decouvrir p {
  color: var(--theme-black);
  font-weight: 500;
  font-size: 15px;
  line-height: 25px;
  letter-spacing: 0px;
  margin: 0;
}
#decouvrir a {
  color: var(--theme-green);
}
#decouvrir ul {
  color: var(--theme-black);
  font-weight: 500;
  font-size: 15px;
  line-height: 25px;
  letter-spacing: 0px;
  margin: 0;
  padding-left: 3rem;
  list-style: inherit;
}
@media (max-width: 992px) {
  #decouvrir {
    padding: 0 0 3rem 0;
  }
  #decouvrir .section-left {
    align-items: flex-start;
  }
  #decouvrir .section-right {
    align-items: flex-start;
  }
}
