/* Review alternative C: installation image above, existing hero copy on black below. */
@media (max-width: 760px) {
  .hero--client-request {
    background: var(--ink);
  }

  .hero--client-request .hero__media {
    bottom: auto;
    height: 53svh;
    background: var(--ink);
  }

  .hero--client-request .hero__media::after {
    background:
      linear-gradient(180deg, rgba(5, 8, 5, 0.34) 0%, transparent 22%),
      linear-gradient(0deg, var(--ink) 0%, rgba(5, 8, 5, 0.55) 4%, transparent 14%);
  }

  .hero--client-request .hero__media img {
    object-fit: cover;
    object-position: 50% 50%;
  }

  .hero--client-request .hero__copy {
    top: 53svh;
    bottom: 0;
    display: flex;
    flex-direction: column;
    padding-block: clamp(17px, 2.4svh, 22px) max(20px, env(safe-area-inset-bottom));
    background: var(--ink);
  }

  .hero--client-request .wordmark {
    position: static;
    margin-inline: 22px;
  }

  .hero--client-request .hero__statement {
    position: static;
    margin: clamp(32px, 4.5svh, 42px) 22px 0;
  }

  .hero--client-request .hero__support {
    position: static;
    margin: clamp(10px, 1.5svh, 14px) 22px 0;
  }

  .hero--client-request .hero__actions {
    position: static;
    width: auto;
    margin: auto 20px 0;
  }
}