.hero-section {
  position: relative;
}
.hero-section video {
  max-width: 100%;
  width: 100%;
  height: 100vh;
  -o-object-fit: cover;
     object-fit: cover;
}
.hero-section h1 {
  text-align: center;
  color: #f9f7f5;
  font-size: 64px;
  font-weight: 400;
  letter-spacing: 0.64px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
  padding: 0 2rem;
  animation: left_to_right 1s forwards;
  z-index: 2;
}
.hero-section #nav {
  padding: 22px;
}
.hero-section #nav .benefit {
  transition: color 0.35s;
  color: rgba(0, 0, 0, 0.41);
  text-decoration: none;
  padding-bottom: 15px;
}
.hero-section #nav .benefit:last-child {
  padding-bottom: 0;
}
.hero-section #nav .benefit.colored {
  color: #4d4d4d;
}

.after-hero {
  position: relative;
  text-align: center;
}
.after-hero:before {
  content: "";
  background-image: url("../img/palm2.jpg");
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-width: 100%;
  height: 100%;
  z-index: -1;
  background-repeat: no-repeat;
  opacity: 0.5;
  transform: rotate(360deg);
  -webkit-mask-image: linear-gradient(to bottom, rgb(0, 0, 0) 70%, rgba(0, 0, 0, 0) 100%);
  mask-image: linear-gradient(to bottom, rgb(0, 0, 0) 70%, rgba(0, 0, 0, 0) 100%);
}
.after-hero h2 {
  font-weight: 400;
  margin-bottom: 0;
}

@keyframes slideUpFade {
  to {
    transform: translateY(0);
  }
}
.gallery {
  padding: 2rem 1rem;
}
.gallery .inner .content .inner-content img {
  margin-bottom: 10px;
}
.gallery .inner .content .heading {
  margin-bottom: 15px;
}
.gallery .inner .content p {
  font-size: 18px;
}
.gallery .inner {
  margin-bottom: 1rem;
}
.gallery .inner .content .inner-content {
  text-align: center;
}
.gallery .inner .content .inner-content img {
  filter: brightness(0) saturate(100%) invert(41%) sepia(8%) saturate(754%) hue-rotate(354deg) brightness(96%) contrast(92%);
}

.wave_video {
  position: relative;
}
.wave_video:before {
  content: "";
  background-image: url("../img/wave2.svg");
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  width: 100%;
  max-width: 100%;
  height: auto;
  top: -1%;
  aspect-ratio: 1/0.225;
  display: block;
}
.wave_video:after {
  content: "";
  background-image: url("../img/wave.svg");
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  width: 100%;
  max-width: 100%;
  height: auto;
  bottom: -1%;
  aspect-ratio: 1/0.225;
  display: block;
}
.wave_video video {
  max-width: 100%;
  width: 100%;
  height: 80vh;
  -o-object-fit: cover;
     object-fit: cover;
}

@media (max-width: 992px) {
  .gallery {
    padding-bottom: 0;
  }
  .gallery .container-fluid {
    padding-bottom: 0;
  }
  .gallery .inner-content, .gallery .inner-images {
    transform: translateY(20%);
    animation: slideUpFade forwards;
    animation-timeline: view();
    animation-range-end: 40%;
  }
  .gallery .inner-images {
    position: relative;
    max-width: 600px;
    margin: 0 auto;
  }
  .gallery .inner-images img {
    border-radius: 500px;
    aspect-ratio: 1/1.5;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .gallery .inner-images.img-2 {
    display: flex;
    margin-bottom: 60px;
    margin-top: calc(20% + 20px);
  }
  .gallery .inner-images.img-2 img {
    max-width: 60%;
  }
  .gallery .inner-images.img-2 img:last-child {
    max-width: 50%;
    position: absolute;
    right: 0;
    top: -20%;
  }
  .gallery .inner-images.img-3 {
    display: flex;
    margin-top: calc(15% + 20px);
    margin-bottom: calc(10% + 60px);
  }
  .gallery .inner-images.img-3 img:first-child {
    max-width: 70%;
  }
  .gallery .inner-images.img-3 img:nth-child(2) {
    max-width: 40%;
    position: absolute;
    right: 0;
    top: -10%;
  }
  .gallery .inner-images.img-3 img:last-child {
    max-width: 50%;
    position: absolute;
    right: 0;
    bottom: -10%;
  }
}