/* Homepage width correction.
   page-system.css already gives direct sections an 80vw outer measure. The
   legacy homepage stylesheet then added a second max-1100px gutter inside
   Capability and the compact service summaries, making them appear roughly
   one-third width on large displays. Keep the shared 80% outer measure and
   remove only that duplicated inner horizontal constraint. */
.wag-design8-shell .option-3 > .section {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.wag-design8-shell .option-3 > .section:not(.compact) > .section-intro {
  width: 100%;
  max-width: 980px;
}

.wag-design8-shell .option-3 > .section > :is(.service-feature-wall,.pill-grid) {
  width: 100%;
  max-width: none;
}

.wag-design8-shell .option-3 > .section.compact {
  grid-template-columns: minmax(0,1.05fr) minmax(0,1.15fr);
  gap: clamp(48px,5vw,96px);
}

.wag-design8-shell .option-3 > .section.compact > .section-intro {
  width: 100%;
  max-width: none;
}

.wag-design8-shell .option-3 > .section.compact .pill-grid {
  align-items: stretch;
}

.wag-design8-shell .option-3 > .section.compact .pill-grid span {
  padding: 12px 16px;
  font-size: 12px;
}

@media (max-width: 900px) {
  .wag-design8-shell .option-3 > .section.compact {
    grid-template-columns: 1fr;
    gap: 30px;
  }
}

@media (max-width: 600px) {
  .wag-design8-shell .option-3 > .section:not(.compact) > .section-intro {
    max-width: none;
  }

  .wag-design8-shell .option-3 > .section.compact .pill-grid span {
    padding: 9px 12px;
    font-size: 10px;
  }
}
