.sw26b-hero {
  padding: 4rem 0;
  overflow: hidden;

  .sw19s-std-wrap {
    gap: 0 64px;
    max-width: 1280px;
    display: flex;
    flex: 1 1 0;
    width: 120vw;
    padding: 0 0 0 1.5rem;
  }

  .content {
    margin: 0;
    max-width: 608px;
    width: 100%;

    .title {
      margin-bottom: 16px;

      :is(h1, h2, h3, h4, h5, h6, p) {
        color: #111;
        font-family: "Roboto", sans-serif;
        font-size: 60px;
        font-weight: 700;
        line-height: 68px;
        letter-spacing: 0;
        margin: 0;
      }
    }

    .subtitle {
      margin-bottom: 2rem;

      :is(h1, h2, h3, h4, h5, h6, p) {
        color: #444;
        font-family: "Roboto Slab", sans-serif;
        font-size: 20px;
        font-weight: 400;
        line-height: 28px; /* 140% */
        letter-spacing: 0;
        margin: 0;
      }
    }

    .cta {
      border-radius: 100px;
      background: #111;
      color: #fff;
      padding: 16px 24px;
      gap: 4px;
      text-align: center;
      font-family: Roboto, sans-serif;
      font-size: 18px;
      font-weight: 700;
      line-height: 24px; /* 133.333% */
      letter-spacing: 0;
      text-decoration: none;
      max-width: 231px;
      display: block;

      &:hover {
        background-color: #ff6200;
        color: #111;
      }

      &:active {
        background-color: #ff9b66;
        color: #111;
      }
    }

    .trust {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
      margin-top: 40px;
    }

    .trust__image img {
      max-height: 32px;
      width: auto;
      display: block;
    }

    .trust__text {
      color: #416879;
      font-family: "Roboto", sans-serif;
      font-size: 14px;
      line-height: 24px;
    }
  }
  .media {
    margin: 0;
    max-width: 559px;
    width: 100%;

    .hero-img {
      width: 100%;
      height: auto;
      display: block;
    }

    .video,
    .hero-video {
      width: 100%;
    }

    .video .wistia-responsive-container {
      position: relative;
      width: 100%;
      padding-top: 56.25%;
      overflow: hidden;
    }

    /* webm videos render at their natural aspect ratio instead of being
       cropped into the 16:9 box used for the Wistia embed, so the height
       doesn't get cut off. */
    .hero-video .wistia-responsive-container {
      position: static;
      width: 100%;
      padding-top: 0;
      overflow: visible;
    }

    .feature-video {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .hero-video .feature-video {
      position: static;
      width: 100%;
      height: auto;
      object-fit: contain;
    }
  }

  @media screen and (max-width: 1280px) {
    .title {
      :is(h1, h2, h3, h4, h5, h6, p) {
        font-size: 56px;
        line-height: 66px;
      }
    }
  }

  @media screen and (max-width: 998px) {
    .content {
      max-width: 344px;
    }
    .title {
      :is(h1, h2, h3, h4, h5, h6, p) {
        font-size: 48px;
        line-height: 58px;
      }
    }
  }

  @media screen and (max-width: 700px) {
    padding: 3rem 0;

    .sw19s-std-wrap {
      flex-direction: column;
      gap: 64px 0;
      padding: 0 1.5rem;
      width: 100%;
    }

    .content {
      max-width: 100%;
    }

    .title {
      :is(h1, h2, h3, h4, h5, h6, p) {
        line-height: 60px;
      }
    }

    .subtitle {
      :is(h1, h2, h3, h4, h5, h6, p) {
        font-size: 18px;
        line-height: 28px;
      }
    }
  }
}