/* Variant Energo v14 — equal usable content width on desktop pages.
   Preserve v13 desktop gutters, responsive breakpoints and the header.
   1520px is the outer shell; its inner usable width is 1368px after
   76px gutters on both sides. The home page retains full-bleed sections,
   but their content now starts/ends on exactly the same guides. */
@media (min-width: 761px) {
  html:not([data-site-version="phone"]) {
    --ve-page-shell-max: 1520px;
    --ve-page-gutter: clamp(24px, 5.55vw, 76px);
  }

  /* The same centered shell for all conventional routes: catalog, products,
     production, certificates, requests, accounts and administration. */
  html:not([data-site-version="phone"]) body:not(.home-page) .site-page > main.wrap {
    box-sizing: border-box;
    width: 100%;
    max-width: var(--ve-page-shell-max);
    margin-inline: auto;
    padding-inline: var(--ve-page-gutter);
  }

  /* Full-height/full-background home sections may remain full bleed; just
     align actual section content to the identical inner guides above. */
  html:not([data-site-version="phone"]) body.home-page .site-page > main.wrap {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    padding-inline: 0;
  }
  html:not([data-site-version="phone"]) body.home-page .site-page > main.wrap > :is(.hero, .home-section) {
    box-sizing: border-box;
    width: 100%;
    padding-inline: max(var(--ve-page-gutter), calc(50% - 760px + var(--ve-page-gutter)));
  }

  /* Large page workspaces should use the shell instead of their old 1040px
     / 820px caps. Their INNER checkout forms keep their deliberate compact
     widths, and mobile grids retain their original breakpoint rules. */
  html:not([data-site-version="phone"]) body:not(.home-page) .site-page > main.wrap > :is(
    .cart-content, .calculation-content, .catalog-directions
  ) {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
  }
}
