/* Shared spacing and readable line wrapping for all six homepage sections. */
body[data-hp] .hp-main-frame,
body[data-hp] .hp-content,
body[data-hp] .hp-content :is(.bh-card, .wp-card, .vm-card, .bh-masthead-copy) {
  min-width: 0;
}

body[data-hp] .hp-content :is(h1, h2, h3) {
  text-wrap: balance;
  overflow-wrap: break-word;
  hyphens: auto;
}

body[data-hp] .hp-content :is(p, li, dd, figcaption) {
  overflow-wrap: break-word;
  hyphens: auto;
  text-wrap: pretty;
}

body[data-hp] .hp-content p {
  max-width: 78ch;
}

body[data-hp] .hp-content :is(.hp-start-intro, .bh-hero) > p {
  margin-inline: auto;
}

body[data-hp] .hp-content :is(.reading-section, .bh-home-feature) +
  :is(.reading-section, .bh-home-feature) {
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
}

body[data-hp] .hp-content :is(.bh-actions, .wp-actions, .vm-actions, .button-row) {
  flex-wrap: wrap;
  gap: 12px;
}

body[data-hp] .hp-content :is(.bh-button, .wp-button, .vm-button) {
  max-width: 100%;
  white-space: normal;
  text-align: center;
  overflow-wrap: break-word;
}

body[data-hp] .hp-content :is(img, video, iframe) {
  max-width: 100%;
}

@media screen and (max-width: 900px) {
  body[data-hp] .hp-content .bh-grid.hp-grid-two {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media screen and (max-width: 640px) {
  body[data-hp] .hp-content :is(h2, h3) {
    line-height: 1.3;
  }

  body[data-hp] .hp-content :is(.bh-actions, .wp-actions, .vm-actions, .button-row) > a {
    min-width: 0;
    flex: 1 1 12rem;
  }
}