/*
 * Blog container normalization.
 *
 * Blog templates must follow the same container values configured in
 * Advanced > Layout as the WooCommerce archive and product templates.
 */
.nkluck-site .nkluck-blog-archive__grid:not(.nkluck-blog-archive__grid--list) {
  display: grid;
  grid-template-columns: repeat(var(--nkluck-blog-columns-desktop, 3), minmax(0, 1fr));
}
@media (max-width: 960px) {
  .nkluck-site .nkluck-blog-archive__grid:not(.nkluck-blog-archive__grid--list) {
    grid-template-columns: repeat(var(--nkluck-blog-columns-tablet, 2), minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .nkluck-site .nkluck-blog-archive__grid:not(.nkluck-blog-archive__grid--list) {
    grid-template-columns: repeat(var(--nkluck-blog-columns-mobile, 1), minmax(0, 1fr));
  }
}
.nkluck-blog-archive__hero-inner,
.nkluck-blog-archive__container,
.nkluck-single-post__hero-inner,
.nkluck-single-post__layout,
.nkluck-blog-page .arc-container,
.nkluck-single-post .single-header-inner,
.nkluck-single-post .single-layout {
  width: calc(100% - var(--nkluck-gutter, 24px)) !important;
  max-width: var(--nkluck-container, 1110px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box;
}

.nkluck-single-post__layout.no-sidebar,
.nkluck-single-post .single-layout.no-sidebar {
  grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 960px) {
  .nkluck-blog-archive__hero-inner,
  .nkluck-blog-archive__container,
  .nkluck-single-post__hero-inner,
  .nkluck-single-post__layout,
  .nkluck-blog-page .arc-container,
  .nkluck-single-post .single-header-inner,
  .nkluck-single-post .single-layout {
    width: calc(100% - var(--nkluck-gutter, 24px)) !important;
    max-width: var(--nkluck-container-tablet, 960px) !important;
  }
}

@media (max-width: 640px) {
  .nkluck-blog-archive__hero-inner,
  .nkluck-blog-archive__container,
  .nkluck-single-post__hero-inner,
  .nkluck-single-post__layout,
  .nkluck-blog-page .arc-container,
  .nkluck-single-post .single-header-inner,
  .nkluck-single-post .single-layout {
    width: calc(100% - (var(--nkluck-mobile-gutter, 24px) * 2)) !important;
    max-width: var(--nkluck-container, 1110px) !important;
  }
}
