/* Shared desktop content edges; backgrounds keep spanning the viewport. */
@media (min-width: 1181px) {
  :root {
    --content-width: 1440px;
    --page-pad: max(clamp(22px, 5.6vw, 104px), calc((100% - var(--content-width)) / 2));
  }
  .site-header,
  .page-section,
  .site-footer,
  .hero {
    padding-inline: var(--page-pad);
  }
  .hero-bottom {
    left: var(--page-pad);
    right: var(--page-pad);
  }
}

/* Center small introductory labels within the content block they introduce. */
main .section-kicker,
.detail-dialog .section-kicker {
  display: block;
  width: 100%;
  max-width: none;
  margin-inline: auto;
  text-align: center;
}
.hero .eyebrow {
  justify-content: center;
  text-align: center;
}
.breadcrumbs {
  justify-content: center;
  flex-wrap: wrap;
  text-align: center;
}
.guide-crumb,
.legal-document > nav {
  text-align: center;
}