/* How It Works: platform-style mobile hero treatment. */
@media (max-width: 899px) {
  .interior-page--how-it-works .page-hero {
    display: flex;
    flex-direction: column;
    background: #f9fbfd;
    border-bottom: 0;
  }

  .interior-page--how-it-works .page-hero__inner {
    order: 1;
    min-height: auto;
    padding-block: 64px 28px;
  }

  .interior-page--how-it-works .page-hero__copy {
    width: 100%;
    max-width: 550px;
  }

  .interior-page--how-it-works .page-hero__art {
    position: relative;
    inset: auto;
    order: 2;
    height: 420px;
    margin-top: -1px;
    z-index: 0;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 24%);
    mask-image: linear-gradient(to bottom, transparent, black 24%);
  }

  .interior-page--how-it-works .page-hero__art::after {
    background: none;
  }

  .interior-page--how-it-works .page-hero__art img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 65% center;
  }
}

@media (max-width: 599px) {
  .interior-page--how-it-works .page-hero__inner {
    padding-block: 44px 14px;
  }

  .interior-page--how-it-works .page-hero__art {
    height: 370px;
  }
}