/* ============================================================
   BLOG POST – layout blocks inside the block grid
   ------------------------------------------------------------
   Grid section / column layout blocks render their own
   .container > .row > .col. The article column is already inside
   a container, so the nested container's padding indented the
   content by 15px. Dropping it lets .row's negative margin cancel
   the column padding, while gutters between columns stay intact.
   ============================================================ */

.blog-article-content .umb-block-grid__layout-item > section > :is(.container, .container-fluid) {
  padding-left: 0;
  padding-right: 0;
}

/* ============================================================
   BLOG POST – headings inside rich text blocks of the block grid
   ------------------------------------------------------------
   Rich text comes from the CMS editor, so headings often carry
   pasted theme classes (d-inline-block, ls-minus-1px, fw-500,
   alt-font …). Several of those are !important, hence the
   !important overrides below.
   ============================================================ */

.blog-article-content .rich-text-block :is(h1, h2, h3, h4, h5, h6) {
  display: block !important;
  font-family: var(--primary-font);
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.3;
  color: var(--dark-gray);
  text-wrap: balance;
  margin-top: 2.5rem;
  margin-bottom: 0.75rem;
}

.blog-article-content .rich-text-block h1 { font-size: 1.875rem; }
.blog-article-content .rich-text-block h2 { font-size: 1.625rem; }
.blog-article-content .rich-text-block h3 { font-size: 1.375rem; margin-top: 2rem; }
.blog-article-content .rich-text-block h4 { font-size: 1.1875rem; margin-top: 2rem; }
.blog-article-content .rich-text-block h5 { font-size: 1.0625rem; margin-top: 1.75rem; }
.blog-article-content .rich-text-block h6 { font-size: 1rem; margin-top: 1.75rem; }

/* No extra gap above the first heading or between stacked headings */
.blog-article-content .rich-text-block > :is(h1, h2, h3, h4, h5, h6):first-child {
  margin-top: 0;
}

.blog-article-content .rich-text-block :is(h1, h2, h3, h4, h5, h6) + :is(h1, h2, h3, h4, h5, h6) {
  margin-top: 0.5rem;
}

@media (max-width: 767px) {
  .blog-article-content .rich-text-block :is(h1, h2, h3, h4, h5, h6) {
    margin-top: 2rem;
  }

  .blog-article-content .rich-text-block h1 { font-size: 1.625rem; }
  .blog-article-content .rich-text-block h2 { font-size: 1.4375rem; }
  .blog-article-content .rich-text-block h3 { font-size: 1.25rem; margin-top: 1.75rem; }
  .blog-article-content .rich-text-block h4 { font-size: 1.125rem; margin-top: 1.75rem; }
}