/* COLORS */
/* TYPOGRAPHY */
/* ---- MEDIA QUERIES ----- */
.video-banner {
  position: relative;
}
.video-banner .container {
  grid-column: full-width !important;
}
.video-banner .content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  text-align: center;
  z-index: 1;
}
.video-banner .content .video-icon {
  display: flex;
  justify-content: center;
  margin: 0 0 2.4rem;
}
.video-banner .content .heading {
  margin: 0 0 2.4rem;
}
.video-banner .content .text {
  max-width: 55.1rem;
  margin: 0 auto;
}
.video-banner .video-container video {
  width: 100%;
  height: auto;
  display: block;
}
.video-banner .overlay {
  position: absolute;
  inset: 0;
  background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
}

@media (max-width: 768px) {
  .video-banner .content {
    padding: 2.4rem;
    width: 100%;
  }
  .video-banner .content .video-icon {
    margin: 0 0 4.8rem;
  }
  .video-banner .video-container video {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 375/812;
    object-fit: cover;
    max-height: 100dvh;
  }
}