
.bhero {
  position: relative;
}
.bu {
  --pin-top: calc(var(--header-h) + 58px);
}
.bhero {
  container-type: inline-size;
  --page-x: max(var(--sp-6), (100cqw - var(--container)) / 2 + var(--sp-6));
}
.bhero__cover {
  position: relative;
  margin: var(--sp-6) var(--page-x) 0;
  width: auto;
  aspect-ratio: 1.92;
  overflow: hidden;
  border-radius: var(--radius-lg);
  background: var(--bg-inverse);
}
.bhero__film {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: var(--art-tone);
}
.bhero__cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    var(--scrim-ink-80) 0%,
    var(--scrim-ink-40) 46%,
    var(--scrim-ink-12) 100%
  );
}
.bhero__say {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: 0;
  padding: clamp(24px, 4vw, 72px);
  color: var(--text-on-inverse);
}
.bhero__unit {
  margin: 0 0 var(--sp-3);
  font-size: var(--fs-label);
  font-weight: 600;
  letter-spacing: var(--tracking-label);
  color: var(--text-on-inverse);
  opacity: 0.76;
}
.bhero__title {
  margin: 0;
  max-width: 20ch;
  color: var(--text-on-inverse);
}
.bu .bhero__title,
.ihero .bhero__title {
  max-width: 32ch;
}
.bhero__unit {
  animation: bhero-in 0.7s var(--ease) 80ms both;
}
.bhero__title {
  animation: bhero-in 0.7s var(--ease) 190ms both;
}
@keyframes bhero-in {
  from {
    opacity: 0;
    translate: 0 18px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .bhero__unit,
  .bhero__title {
    animation: none;
  }
}
.bhero__read {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(260px, 26vw, 360px);
  gap: var(--sp-8);
  align-items: start;
  padding-block: var(--sp-8);
}
.bhero__lede {
  margin: 0;
  max-width: 30ch;
  font-size: var(--fs-lede-lg);
  font-weight: 500;
  line-height: 1.5;
  color: var(--text-primary);
}
.bhero__act {
  display: grid;
  gap: var(--sp-5);
  justify-items: start;
}
.bhero__act .cta-row {
  display: grid;
  justify-self: stretch;
}
.bhero__act .btn {
  justify-self: stretch;
}
.bhero__meta {
  margin: 0;
  padding-top: var(--sp-4);
  border-top: 1px solid var(--border-strong);
  width: 100%;
  font-size: var(--fs-xs);
  color: var(--text-muted);
}
@media (max-width: 1080px) {
  .bhero__read {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--sp-6);
  }
  .bhero__lede {
    max-width: 34ch;
  }
}
@media (max-width: 860px) {
  .bhero__cover {
    aspect-ratio: 4 / 3;
  }
}
@media (max-width: 640px) {
  .bhero__cover {
    aspect-ratio: 4 / 5;
  }
  .bhero__title {
    max-width: none;
  }
  .bu .bhero__title,
  .ihero .bhero__title {
    font-size: min(var(--fs-h1), 7.6vw);
  }
}
@media (min-width: 1080px) {
  html.js-stage .bhero__top {
    position: relative;
    height: 150vh;
  }
  html.js-stage .bhero__cover {
    position: sticky;
    top: var(--header-h);
    --q: clamp(0, var(--p, 0) / 0.29, 1);
    margin-block: 0;
    margin-inline: calc(var(--q) * var(--page-x));
    width: auto;
    height: calc(100vh - var(--header-h) - var(--q) * 12vh);
    aspect-ratio: auto;
    border-radius: calc(var(--q) * var(--radius-lg));
    will-change: margin, height;
  }
  html.js-stage .bhero__say {
    padding-inline: calc(
      clamp(24px, 4vw, 72px) + (1 - var(--q)) * var(--page-x)
    );
  }
}
.closing__promise {
  margin-top: var(--sp-4);
}
.scope__boundary {
  margin-top: var(--sp-7);
}
.scope__boundary .eyebrow {
  margin-bottom: var(--sp-4);
}
@media (min-width: 1080px) {
  .faq__grid > .section__head {
    position: sticky;
    top: calc(var(--pin-top, var(--header-h)) + var(--sp-7));
    align-self: start;
  }
}
