.section-hero-three-frames {
  text-align: center;
  padding: 2.1875rem 0 2.8125rem;
}
@media (min-width: 1200px) {
  .section-hero-three-frames {
    padding: 6.875rem 0 3.625rem;
  }
}
@media (max-width: 767px) {
  .section-hero-three-frames h1,
  .section-hero-three-frames .h1 {
    font-size: 2.625rem;
    line-height: 1.2380952381;
    margin: 0 0 1.4375rem;
  }
}
@media (min-width: 1200px) {
  .section-hero-three-frames h1,
  .section-hero-three-frames .h1 {
    margin: 0 0 2.375rem;
  }
}
.section-hero-three-frames .container {
  max-width: 76.25rem;
}
.section-hero-three-frames .three-frames-holder {
  margin: 0 0 1.5625rem;
}
@media (min-width: 768px) {
  .section-hero-three-frames .three-frames-holder {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .section-hero-three-frames .three-frames-holder {
    gap: 1.875rem;
  }
}
.section-hero-three-frames .media-block {
  position: relative;
}
@media (max-width: 767px) {
  .section-hero-three-frames .media-block {
    aspect-ratio: 357/201;
  }
}
.section-hero-three-frames .media-block:before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.32);
}
.section-hero-three-frames .media-block img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.section-hero-three-frames .bg-video {
  z-index: -1;
}
@media (min-width: 768px) {
  .section-hero-three-frames .text-wrap {
    margin: 0 auto;
    max-width: 55.9375rem;
  }
}