.hero-bg {
    height: 75svh;
    overflow: hidden;
}

.hero-title .row-flex {
  align-items: flex-end;
  margin-bottom: clamp(2rem, 3vw, 4rem);
}

.hero-title p {
  max-width: 43ch;
}

.hero-heading {
  max-width: 17ch;
  letter-spacing: -.03em;
  margin-top: 0;
  font-weight: 500;
  line-height: 90%;
  font-size: 3.5rem;
}

.title-wrap {
  display: flex;
  justify-content: flex-end;
}

.parallax-wrapper.img-my-rules {
  position: relative;
  margin-top: -100px;
  height: 400px;
}

.advantages-text {
    max-width: 60%;
}

.my-rules-wrap {
    max-width: 75%;
}

.featured-gallery {
    padding-top: 5svh;
}

.featured-gallery .row-flex {
    align-items: flex-start;
}

@media (max-width: 1024px) {
    .parallax-wrapper.img-my-rules {
        margin-top: -70px;
        height: 300px;
    }
    .my-rules-wrap {
        max-width: initial;
    }
}

@media (max-width: 768px) {
    .parallax-wrapper.img-my-rules {
        margin-top: -60px;
    }
    .hero-heading {
        font-size: 1.8rem;
    }

    .parallax-section .hero-bg {
        height: 40svh;
    }
}

@media (max-width: 430px) {
    .parallax-wrapper.img-my-rules {
        margin-top: 0;
    }
    .title-wrap {
        display: block;
    }
    .advantages-text {
         max-width: initial;
    }
    .img-my-rules {
        max-width: initial;
        margin-top: 0;
    }
}