/* Specific to the five new article pages; existing published HTML stays intact. */
.blog-article-page .article-content .open-section > h2 { scroll-margin-top: 7rem; }
.blog-article-page .article-cover figcaption { padding-top: .5rem; color: #40565e; font-size: .9rem; line-height: 1.5; }

/* The article follows its available reading canvas at every breakpoint. */
.blog-article-page .article-hero h1 {
  width: 100%;
  max-width: none;
  font-size: clamp(1.875rem, 3.5vw + .6rem, 3.5rem);
  line-height: 1.14;
  text-wrap: wrap;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
}
.blog-article-page .article-layout {
  grid-template-columns: minmax(13rem, 17rem) minmax(0, 1fr);
}
.blog-article-page .article-layout > .article-content {
  width: 100%;
  max-width: none;
}
.blog-article-page .article-content :is(h2,h3,p,li,blockquote,summary,th,td) {
  text-wrap: wrap;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
}
.blog-article-page .article-content a { overflow-wrap: anywhere; }
.blog-article-page .article-table-scroll :is(th,td) {
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
}

/* Continuous reading: section padding and grid gaps must not stack. */
.blog-article-page .article-content .open-section {
  display: block;
  padding-block: 0;
  margin: 0 0 2rem;
}
.blog-article-page .article-content .open-section > h2 {
  margin: 0 0 1rem;
}
.blog-article-page .article-content .article-section-body { padding: 0; }
.blog-article-page .article-content .article-section-body :is(p,ul,ol) {
  margin-block: 0 1rem;
}
.blog-article-page .article-content .article-section-body > :last-child {
  margin-bottom: 0;
}
.blog-article-page .article-content blockquote {
  margin-block: 1.25rem;
  padding-block: 1rem;
}
.blog-article-page .article-content blockquote > p:last-child { margin-bottom: 0; }
.blog-article-page .article-layout { padding-top: 1.5rem; }
.blog-article-page .article-hero .article-meta {
  margin-top: 1rem;
  padding-block: .5rem;
}
.blog-article-page .article-hero .draft-status { margin-block: 1rem; }
@media (max-width: 1100px) {
  .blog-article-page .article-layout {
    width: calc(100% - 2 * var(--layout-gutter));
    display: block;
  }
  .blog-article-page .article-layout .article-toc { position: static; }
}

/* Keep the whole telephone inside the consultation button in narrow sidebars. */
.blog-article-page .article-next-step .primary-action{flex-wrap:wrap;row-gap:.35rem}
