/* Article-only additions; legacy global article typography stays outside these components. */
.article-sidebar { grid-column: 8 / -1; grid-row: 1; min-inline-size: 0; align-self: start; }
.article-sidebar__stack { display: flex; flex-direction: column; gap: 1rem; }
.article-sidebar.is-sticky-allowed .article-sidebar__stack { position: sticky; inset-block-start: var(--article-sidebar-top, 10rem); }
.article-sidebar .article-table-of-content { position: static !important; inset-block-start: auto !important; max-block-size: none; max-inline-size: none; overflow: visible !important; margin: 0; order: 0; }
.article-sidebar .article-table-of-content__navigation,
.article-sidebar .article-table-of-content > .kamatoc,
.article-sidebar .article-toc-links { overflow: visible; max-block-size: none; }
.article-sidebar [hidden], .article-cta [hidden] { display: none !important; }
.article-toc-toggle { align-self: flex-start; margin-block-start: .75rem; padding: .6rem .9rem; border: 1px solid #878787; border-radius: .25rem; background: #fff; color: #111; font: inherit; cursor: pointer; }
.article-toc-toggle:focus-visible, .article-cta__button:focus-visible { outline: 3px solid #58b2e6; outline-offset: 4px; }
.article-hero__content .article-body { display: flex; flex-direction: column; row-gap: inherit; min-inline-size: 0; }
.article-body :is(h1,h2,h3,[id]) { scroll-margin-block-start: var(--article-sidebar-top, 10rem); }
.article-layout--without-toc .article-sidebar { grid-column: 1 / -1; grid-row: 1; block-size: auto !important; }
.article-layout--without-toc .article-hero__content { grid-row: 2; }
.article-cta, .article-hero__content .article-cta { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; min-block-size: 15rem; padding: 1.5rem; border-radius: .5rem; background: #26343c; color: #fff; overflow: hidden; row-gap: 0; }
.article-cta::before { content: ''; position: absolute; inset: 0; z-index: -1; background: rgb(0 0 0 / .68); }
.article-cta .article-cta__image { position: absolute; inset: 0; z-index: -2; inline-size: 100%; block-size: 100%; max-block-size: none; object-fit: cover; }
.article-cta .article-cta__content { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; min-inline-size: 0; }
.article-cta .article-cta__title { margin: 0; color: inherit; font-size: 1.5rem; line-height: 1.3; font-weight: 600; overflow-wrap: anywhere; }
.article-cta .article-cta__text { margin: 0; color: inherit; font-size: 1rem; line-height: 1.5; overflow-wrap: anywhere; }
.article-cta .article-cta__button { display: inline-flex; align-items: center; justify-content: center; max-inline-size: 100%; min-block-size: 2.75rem; padding: .9rem 1.25rem; border: 1px solid #58b2e6; border-radius: .25rem; background: #58b2e6; color: #111; text-decoration: none; text-align: center; font-family: inherit; font-size: 1rem; font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; cursor: pointer; }
.article-cta .article-cta__button:hover { background: #baddf1; border-color: #baddf1; }
.article-cta--sidebar { min-block-size: 14rem; order: 1; }
@media (width <= 1024px) {
    /* PL legacy article-heroNew pins content to grid row 1 with higher specificity. */
    .article-heroNew .article-hero__container > .article-hero__content { grid-row: auto; order: 2; }
    .article-sidebar { order: 1; grid-column: 1 / -1; grid-row: auto; block-size: auto !important; }
    .article-sidebar .article-sidebar__stack { position: static !important; }
    .article-hero__content .article-body { row-gap: 1rem; }
    .article-layout--without-toc .article-sidebar, .article-layout--without-toc .article-hero__content { grid-row: auto; }
    .article-cta { padding: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
    .article-toc-toggle, .article-cta__button { transition: none; }
}
