html,
body {
  max-width: 100%;
  overflow-x: clip;
}

.hero-layout,
.hero-copy,
.hero-visual,
.section-heading > * {
  min-width: 0;
}

.hero-copy h1,
.hero-copy p {
  max-width: 100%;
  overflow-wrap: break-word;
}

@media (max-width: 700px) {
  .hero-copy h1 {
    font-size: clamp(38px, 11vw, 45px);
  }

  .public-eyebrow {
    font-size: 9px;
    letter-spacing: .12em;
    line-height: 1.6;
  }

  .hero-visual {
    width: 100%;
  }
}