/* Public website geometry. Keep this after page-specific styles. */
:root {
  --site-content-max: 1400px;
  --site-gutter: 32px;
  --site-content-width: min(var(--site-content-max), calc(100% - 2 * var(--site-gutter)));
}
html { scrollbar-gutter: stable; }

/* Navigation, footer, catalogue, product and information page wrappers. */
.site-container,
.constructor-site-chrome .site-container {
  box-sizing: border-box;
  width: var(--site-content-width);
  max-width: none;
  margin-inline: auto;
}

/* Full-width section backgrounds stay outside these content containers. */
.legacy-home .main-top_block,
.legacy-home .main-about,
.legacy-home .main-about_bottom,
.legacy-home .main-advantages-block,
.legacy-home .main-products,
.legacy-home .main-gifts,
.legacy-home .main-callback-block,
.legacy-home .main-video_title,
.legacy-home .main-video_block,
.legacy-home .main-delivery,
.legacy-home .main-guarantee,
.legacy-home .main-reviews {
  box-sizing: border-box;
  width: var(--site-content-width);
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}

/* The editor and compact checkout share the same outer edges. */
.constructor-page .constructor-hero,
.constructor-page .constructor-layout,
.constructor-page .ready-checkout-heading,
.constructor-page .ready-edit-toolbar {
  box-sizing: border-box;
  width: var(--site-content-width);
  max-width: none;
  margin-inline: auto;
}
.constructor-page .constructor-hero,
.constructor-page .constructor-layout {
  padding-inline: 0;
}

/* Legacy public document, tracking and payment-result page wrappers. */
.legal-page .header_line,
.legal-page .footer_block,
.legal-page .legal-content,
.tracking-page .header_line,
.tracking-page .footer_block,
.tracking-page .tracking-shell,
.payment-return-page .header_line,
.payment-return-page .footer_block,
.payment-return-page .payment-return-hero {
  box-sizing: border-box;
  width: var(--site-content-width);
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}

/* Reading columns are internal to the common page wrapper. */
.legal-content > * { max-width: 960px; }
.site-container.faq > * { max-width: 880px; }

@media (max-width: 760px) {
  :root { --site-gutter: 18px; }
}