/* Hero — opening statement over the paper, with the panorama breaking out beneath */

.hero {
  padding: clamp(3rem, 8vw, 6rem) 0 0;
}
.hero__grid {
  display: grid;
  gap: 2rem;
}
.hero__title {
  max-width: 13ch;
}
.hero__lede {
  max-width: 40ch;
  font-size: clamp(1.02rem, 0.4vw + 0.95rem, 1.15rem);
}
.hero__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.75rem;
}

@media (min-width: 1024px) {
  .hero__grid {
    grid-template-columns: 1fr 22rem;
    align-items: end;
    gap: 4rem;
  }
}