/* Hero layout refinement: keep the feature summary as the full-width end of the hero. */
.hero {
  padding-bottom: 42px;
}

.hero-grid {
  column-gap: 52px;
  row-gap: 28px;
}

.feature-strip {
  grid-column: 1 / -1;
  width: 100%;
  scroll-margin-top: 96px;
  padding: 24px;
  column-gap: 22px;
  row-gap: 18px;
}

.feature-strip .feature-heading {
  grid-column: 1 / -1;
  display: block;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.feature-heading .eyebrow { margin: 0 0 7px; }
.feature-heading h2 { max-width: 760px; margin: 0; font-size: clamp(24px, 3vw, 36px); }
.feature-strip b { font-size: 15px; line-height: 1.3; }
.feature-strip span { font-size: 14px; line-height: 1.45; }

@media (max-width: 980px) {
  .hero-grid {
    row-gap: 24px;
  }
}

@media (max-width: 720px) {
  .hero {
    padding-bottom: 36px;
  }

  .hero-grid {
    row-gap: 20px;
  }

  .feature-strip { scroll-margin-top: 76px; padding: 20px; gap: 15px; }
  .feature-strip .feature-heading { padding-bottom: 15px; }
  .feature-strip b { font-size: 14px; }
  .feature-strip span { font-size: 13px; }
}