/* Use the header's continuous 1320px shell, without Bootstrap's stepped caps.
   Inner forms and reading widths, and the homepage, remain independent. */
body:not(#index) #wrapper .columns-container.container,
body:not(#index) #wrapper .category__intro.container,
body:not(#index) #wrapper > .container,
body:not(#index) #wrapper .wrapper__inner > .container,
body:not(#index) #wrapper .breadcrumb__wrapper > .container,
body:not(#index) #wrapper #notifications > .container,
body:not(#index) #wrapper #content-wrapper > .container,
body:not(#index) #wrapper .ah-product-shell,
body:not(#index) #wrapper .ah-product-details-grid {
  box-sizing: border-box;
  width: 100%;
  max-width: 1320px;
  margin-inline: auto;
  padding-inline: 24px;
}
/* Product content has its own shell; avoid applying the gutter twice. */
body#product.page-product #wrapper .columns-container.container {
  max-width: none;
  padding-inline: 0;
}
@media (max-width: 767.98px) {
  body:not(#index) #wrapper .columns-container.container,
  body:not(#index) #wrapper .category__intro.container,
  body:not(#index) #wrapper > .container,
  body:not(#index) #wrapper .wrapper__inner > .container,
  body:not(#index) #wrapper .breadcrumb__wrapper > .container,
  body:not(#index) #wrapper #notifications > .container,
  body:not(#index) #wrapper #content-wrapper > .container,
  body:not(#index) #wrapper .ah-product-shell,
  body:not(#index) #wrapper .ah-product-details-grid { padding-inline: 16px; }
  body#product.page-product #wrapper .columns-container.container { padding-inline: 0; }
}
/* Auth cards share the outer shell rather than introducing a narrower cap. */
body:is(#authentication, #registration) #wrapper .ah-auth {
  width: 100%;
  max-width: none;
}