.promoHero {
  display: flex;
  min-height: 400px;
  background-color: rgb(var(--background--blue-low-default--light) / var(--blend--medium--light));

  .promoHero__content {
    overflow: hidden;
    display: flex;
    flex-basis: 55%;
    flex-direction: column;
    justify-content: center;

    padding: 48px;

    h1,
    .typography__headline1 {
      overflow: hidden;
      margin-bottom: 16px;
    }

    p {
      overflow: hidden;
      margin-bottom: 24px;
    }
  }

  .promoHero__image {
    display: flex;
    flex-basis: 45%;

    > img,
    > svg {
      width: 100%;
      max-height: 400px;
      object-fit: contain;
      object-position: center;
    }
  }

  .promoHero__image--contain {
    img {
      object-fit: contain;
    }
  }

  .promoHero__image--cover {
    img {
      object-fit: cover;
    }
  }
}

@media only screen and (max-width: 768px) {
  .promoHero {
    display: flex;
    flex-direction: column;
    height: auto;

    .promoHero__content {
      padding: 48px 24px;
    }

    .promoHero__image img,
    .promoHero__image svg {
      max-height: 300px;
    }
  }
}