:root {
  --content-gutter: 12px;
}

.content-shell {
  width: 100%;
  max-width: 100%;
  padding-left: var(--content-gutter);
  padding-right: var(--content-gutter);
  box-sizing: border-box;
}

.content-shell > :last-child,
.wysiwyg-content > :last-child {
  margin-bottom: 0;
}

.content-section,
.page-content,
.post-content {
  width: 100%;
  max-width: 100%;
}

@media (min-width: 768px) {
  :root {
    --content-gutter: 20px;
  }
}

@media (max-width: 991.98px) {
  .site-container,
  .site-main.site-container,
  #content.site-main,
  .site-main {
    width: 100%;
    max-width: 100%;
  }

  /* Plain text pages/posts: gutter only from content-shell */
  article.page-content,
  article.page,
  article.post,
  article.type-page,
  article.type-post,
  .content-section,
  .entry-content,
  .wysiwyg-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0;
    margin-right: 0;
  }

  .hero-block > .content-shell,
  .content-section > .content-shell,
  .page-content > .content-shell,
  .post-content > .content-shell {
    padding-left: var(--content-gutter) !important;
    padding-right: var(--content-gutter) !important;
  }

  /* Full-bleed outer commerce/media wrappers */
  .catalog-page,
  .catalog-page.site-container,
  .catalog-page__header,
  .catalog-toolbar-wrap,
  .catalog-toolbar,
  .catalog-toolbar__row,
  .woocommerce ul.products,
  .woocommerce-page ul.products,
  .catalog-grid,
  .product-gallery,
  .woocommerce-product-gallery,
  .related.products,
  .upsells.products,
  .products.related,
  .products.upsells,
  .single-product-layout.site-container,
  .single-product-page,
  .single-product-main,
  .single-product-hero,
  .single-product-hero__gallery,
  .single-product-hero__summary,
  .hero-block,
  .hero-block--bleed {
    width: 100%;
    max-width: 100%;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Headings outside cards still need readable gutters */
  .related > h2,
  .upsells > h2,
  .single-product-main > h2,
  .single-product-page > h1,
  .single-product-page > h2,
  .single-product-page > h3,
  .single-section-head,
  .single-product-description > h2,
  .single-product-tabs > h2,
  h2.single-product-related__title,
  h2.single-product-upsell__title,
  h2.single-product-section__title,
  .single-product-related__title,
  .single-product-upsell__title,
  .single-product-section__title,
  .single-product-related > h2,
  .single-product-upsell > h2,
  .single-product-main > section > h2,
  .single-product-main > div > h2 {
    padding-left: var(--content-gutter) !important;
    padding-right: var(--content-gutter) !important;
    box-sizing: border-box;
  }
  /* Plain home/blog text outside modules */
  .home.blog .site-main > :not(.hero-block):not(.catalog-page):not(.single-product-main):not(.single-product-hero):not(.woocommerce),
  .blog .site-main > :not(.hero-block):not(.catalog-page):not(.single-product-main):not(.single-product-hero):not(.woocommerce) {
    padding-left: var(--content-gutter);
    padding-right: var(--content-gutter);
    box-sizing: border-box;
  }
}