/* Shared content width. Section backgrounds and full-bleed banners stay intact. */
:root {
  --site-content-max: 1600px;
  --site-content-gutter: 80px;
}

/* These elements own the section background, so constrain their content box
   with padding rather than constraining the section itself. */
:is(.about-sec, .hp-sec, .svc-sec-hd, .svc-cards,
    .abx-inner, .om-inner, .hz-inner, .wy-inner, .sol-inner,
    .om-hero, .hz-hero, .wy-hero, .sol-hero,
    .ess-inner, .ess-hero, .ess-arch--photo,
    .cdz-sec, #cdz-types, .ct-sec, .case-page,
    .pv-intro, .lv-sec, .page-loc__inner) {
  box-sizing: border-box;
  padding-left: max(var(--site-content-gutter), calc((100% - var(--site-content-max)) / 2)) !important;
  padding-right: max(var(--site-content-gutter), calc((100% - var(--site-content-max)) / 2)) !important;
}

/* Existing inner wrappers must not receive a second set of section gutters. */
.lv-container, .pv-scenes {
  width: 100%;
  max-width: var(--site-content-max) !important;
  margin-left: auto;
  margin-right: auto;
}
.nd-wrap, .nl-wrap, .mp-wrap {
  box-sizing: border-box;
  width: calc(100% - var(--site-content-gutter) * 2) !important;
  max-width: var(--site-content-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Retain navigation/footer markup and full-width background strips. */
.site-header__inner, .site-footer__inner {
  max-width: var(--site-content-max);
  margin-left: auto;
  margin-right: auto;
}

/* The storage opening previously included its own left page gutter. */
.ess-hero .ess-hero__copy { padding-left: 0; }

@media (max-width: 1100px) {
  :root { --site-content-gutter: 40px; }
}
@media (max-width: 760px) {
  :root { --site-content-gutter: 20px; }
}