/**
 * Shared horizontal grid (header, footer, main sections).
 */
html {
  scrollbar-gutter: stable;
}

:root {
  --site-content-max: 1440px;
  --site-content-pad-x: 28px;
  /* aliases used in custom.css / header strip */
  --site-header-max: var(--site-content-max);
  --site-header-pad-x: var(--site-content-pad-x);
}

@media (max-width: 650px) {
  :root {
    --site-content-pad-x: 16px;
  }
}

/**
 * Centered content band — same inset math as header.site-header.
 */
.site-grid-inset {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  padding-left: max(var(--site-content-pad-x), calc((100% - var(--site-content-max)) / 2));
  padding-right: max(var(--site-content-pad-x), calc((100% - var(--site-content-max)) / 2));
}

/* Core layout rows should follow one shared content grid. */
.services-nav,
.services-title,
.services-options,
.services-hub-intro,
.category-description--below,
.service-content.search-results,
.home-hero-shell .sert-wrapper {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  padding-left: max(var(--site-content-pad-x), calc((100% - var(--site-content-max)) / 2));
  padding-right: max(var(--site-content-pad-x), calc((100% - var(--site-content-max)) / 2));
}
