.landing main { max-width: 980px; }
.hero { display: grid; gap: 0; }
.hero img { width: 100%; max-height: 82vh; object-fit: cover; object-position: top; }
.hero-copy { padding: 28px var(--pad) 8px; }
.cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.cta [hidden] { display: none; }
@media (min-width: 820px) {
  .hero { grid-template-columns: 420px 1fr; align-items: center; padding: 40px var(--pad) 0; gap: 48px; }
  .hero img { max-height: none; }
  .hero-copy { padding: 0; }
}