/* The same content grid on the two test sites. */
:root {
  --do-page-gutter: 24px;
  --do-page-width: min(1216px, calc(100% - 2 * var(--do-page-gutter)));
}

.do-header .do-header__container,
.do-footer .do-footer__content,
.do-legacy-page,
.do-home-page .do-section-inner,
.do-basket-page .do-basket__container,
.do-checkout .do-checkout__container,
.do-maker-page .do-maker-page__inner,
.do-catalog-a3 .do-catalog__container,
.do-catalog-a3 .do-catalog-cta__inner,
.do-contacts .do-contacts__container,
main.do-sections,
.do-product-page main.do-product > .do-product__container,
.do-product-page main.do-product > section > .do-product__container {
  box-sizing: border-box;
  width: var(--do-page-width);
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}

.do-footer .do-footer__logo img { max-width: 100%; height: auto; }

:is(.do-kz-page, .do-legacy-page, .do-generic-rich, .do-sections__seo) {
  min-width: 0;
  overflow-wrap: anywhere;
}
:is(.do-kz-page, .do-legacy-page, .do-generic-rich, .do-sections__seo) :is(img, video, iframe, input, select) {
  max-width: 100%;
}
:is(.do-kz-page, .do-legacy-page, .do-generic-rich, .do-sections__seo) :is(img, video) {
  height: auto;
}
:is(.do-kz-page, .do-legacy-page, .do-generic-rich, .do-sections__seo) :is(pre, .table-responsive) {
  max-width: 100%;
  overflow-x: auto;
}

@media (max-width: 760px) {
  :root { --do-page-gutter: 16px; }
  :is(.do-kz-page, .do-legacy-page, .do-generic-rich, .do-sections__seo) table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }
}

/* Keep all three touch targets within the narrow mobile header. */
@media (max-width: 360px) {
  .do-header__mobile-bar .do-header__mobile-logo {
    flex: 0 1 160px;
    min-width: 0;
  }
  .do-header__mobile-bar .do-header__mobile-logo img {
    max-width: 100%;
    height: auto;
  }
  .do-header__mobile-bar .do-header__mobile-actions { flex-shrink: 0; }
}