/* Responsive bull film supplied for the homepage hero. */
.studio-video-hero {
  min-height: clamp(620px, calc(100svh - 108px), 780px);
  isolation: isolate;
  background: #07111e;
}

.studio-video-hero::before,
.studio-video-hero::after {
  display: none;
}

.studio-hero__media,
.studio-hero__media picture,
.studio-hero__media img,
.studio-hero__media video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.studio-hero__media {
  z-index: -2;
  overflow: hidden;
  background: #07111e;
}

.studio-hero__media img,
.studio-hero__media video {
  display: block;
  object-fit: cover;
  object-position: center;
  filter: saturate(1) brightness(.98);
}

.studio-hero__media video {
  z-index: 1;
  opacity: 0;
  transition: opacity .55s ease;
}

.studio-video-hero.video-visible .studio-hero__media video {
  opacity: 1;
}

.studio-hero__media::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(5, 10, 18, .84) 0%, rgba(5, 10, 18, .64) 35%, rgba(5, 10, 18, .15) 59%, rgba(5, 10, 18, .02) 78%),
    linear-gradient(0deg, rgba(5, 10, 18, .24), transparent 38%);
}

.studio-video-hero .studio-hero__inner {
  position: relative;
  z-index: 2;
  display: block;
  min-height: clamp(620px, calc(100svh - 108px), 780px);
  padding-block: clamp(58px, 8vh, 94px);
}

.studio-video-hero .studio-hero__copy {
  width: min(64%, 720px);
  padding: 0;
  text-shadow: 0 3px 28px rgba(0, 0, 0, .42);
}

.studio-video-hero .studio-hero__lead {
  color: #f0f2f5;
}

@media (max-width: 800px) {
  .studio-video-hero,
  .studio-video-hero .studio-hero__inner {
    min-height: 620px;
  }

  .studio-hero__media img,
  .studio-hero__media video {
    object-position: center bottom;
    filter: saturate(1) brightness(.96);
  }

  .studio-hero__media::after {
    background:
      linear-gradient(180deg, rgba(7, 17, 30, .88) 0%, rgba(7, 17, 30, .78) 34%, rgba(7, 17, 30, .52) 49%, rgba(7, 17, 30, .08) 70%, rgba(7, 17, 30, .2) 100%),
      linear-gradient(90deg, rgba(7, 17, 30, .3), transparent 72%);
  }

  .studio-video-hero .studio-hero__inner {
    padding-top: 34px;
    padding-bottom: 28px;
  }

  .studio-video-hero .studio-hero__copy {
    width: 100%;
  }

  .studio-video-hero .studio-hero__lead {
    max-width: 38rem;
  }

}

@media (max-width: 430px) {
  .studio-video-hero,
  .studio-video-hero .studio-hero__inner {
    min-height: 620px;
  }

  .studio-video-hero .studio-hero__inner {
    padding-top: 34px;
    padding-bottom: 28px;
  }

  .studio-video-hero .studio-hero__lead {
    max-width: 52%;
    font-size: 16px;
    line-height: 1.48;
  }

  .studio-video-hero .studio-hero__phone {
    max-width: 52%;
    margin-top: 16px;
    font-size: 15px;
  }

  .studio-video-hero .hero__actions {
    width: 52%;
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
  }

  .studio-video-hero .hero__actions .button {
    width: 100%;
  }

}

@media (prefers-reduced-motion: reduce) {
  .studio-hero__media video {
    transition: none;
  }
}
