.hero-search {

  /* Carousel */
  #heroSearchCarousel {
    position: relative;
    background-color: var(--dark);

    .carousel-item {
      transition: opacity 0.8s ease-in-out;
      opacity: 0;
      max-height: 350px;

      &.active {
        opacity: 1;
      }

      img {
        width: 100%;
        height: 550px;
        object-fit: cover;
      }
    }

    .carousel-caption {
      top: 30%;

      h1 {
        text-shadow: 0px 0px 5px var(--dark), 0px 0px 20px var(--primary);
      }
    }
  }

  /* Form */
  .search-form {
    position: relative;
    margin-top: -10rem !important;
    z-index: 2;

    .search-inner {
      box-shadow: 0px 7px 31.3px 0px rgba(80, 80, 80, 0.07);
    }
  }
}