/* All page-layout rules are scoped to responses containing an active banner. */
.site-banners-enabled .site-banner-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 2rem;
  align-items: center;
}
.site-banners-enabled .site-banner-heading > * { min-width: 0; }
.site-banners-enabled .site-banner-heading > .archive-list-heading-copy { width: 100%; }
.site-banner { display: grid; justify-items: center; gap: .4rem; width: 300px; max-width: 100%; margin: 0 auto; color: #534e46; }
.site-banner-creative { width: 300px; height: 250px; }
.site-banner-frame { display: block; width: 100%; height: 100%; border: 0; background: #00645f; }
.site-banner-creative noscript :is(a, picture, img) { display: block; width: 100%; height: 100%; }
.site-banner-creative noscript img { object-fit: contain; }
.site-banner--article { margin: 0 auto; }
.site-banner-creative:has(noscript img) > .site-banner-frame { display: none; }
@media (min-width: 810px) {
  .site-banner--listing { width: 728px; }
  .site-banner--listing .site-banner-creative { width: 728px; height: 90px; }
}
@media (min-width: 1024px) {
  /* Reserve the full creative width without changing the sidebar's sticky behavior. */
  .site-banners-enabled .story-article-body { grid-template-columns: minmax(0, 3fr) minmax(300px, 1fr); }
}
@media (min-width: 1440px) {
  .site-banners-enabled .site-banner-heading { grid-template-columns: minmax(0, 1fr) 728px; column-gap: 2rem; align-items: start; }
  .site-banners-enabled .site-banner-heading > .site-banner { position: relative; gap: 0; margin: 0; justify-self: end; transform: translateY(-4px); }
  .site-banners-enabled .site-banner-heading .archive-list-heading-copy { grid-template-columns: minmax(0, 1fr); row-gap: .25rem; }
  .site-banners-enabled .site-banner-heading .category-page-count { grid-column: 1; grid-row: 2; text-align: left; }
  .site-banners-enabled .site-banner-heading .category-page-range { grid-column: 1; }
}
@media (max-width: 339px) {
  .site-banner { max-width: none; }
  .site-banner--listing { justify-self: center; }
  .site-banner--article { position: relative; left: 50%; margin-left: -150px; margin-right: 0; }
}
