/* ARTYKULY-001. Editorial styles stay inside their own content containers. */
.articles-layout { grid-template-columns: minmax(0, 1fr); }
.articles-main { container: articles / inline-size; min-inline-size: 0; }
.articles-heading { margin-block-end: 1.5rem; }
.article-back { display: inline-flex; align-items: center; gap: .4rem; min-block-size: 2.75rem; margin-block-end: 1rem; font-size: .875rem; text-underline-offset: .2em; }
.article-back .ft-icon { inline-size: 1rem; block-size: 1rem; transform: rotate(180deg); }
.articles-filters { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; margin-block-end: 1.25rem; padding: 1rem; border: 1px solid var(--ft-border); border-radius: var(--ft-radius-medium); background: var(--ft-surface); }
.articles-filters label { display: grid; gap: .35rem; min-inline-size: 0; font-size: .875rem; font-weight: 600; }
.articles-filters :is(input, select) { inline-size: 100%; min-inline-size: 0; min-block-size: 2.75rem; font-size: 1rem; }
.articles-filters__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .875rem; }
.articles-filters__actions .ft-button { min-block-size: 2.75rem; padding: .625rem 1.1rem; font-size: .875rem; }
.articles-filters__actions > a { display: inline-flex; align-items: center; min-block-size: 2.75rem; font-size: .875rem; text-underline-offset: .2em; }
.articles-result-count { color: var(--ft-muted); font-size: .875rem; margin-block: 0 1rem; }
.articles-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; align-items: start; min-inline-size: 0; }
.article-card { position: relative; display: grid; min-inline-size: 0; border: 1px solid var(--ft-border); border-radius: var(--ft-radius-medium); background: var(--ft-surface); overflow-wrap: anywhere; scroll-margin-block-start: calc(var(--ft-app-header, 4.5rem) + 1.5rem); }
.article-card__cover { display: block; overflow: hidden; aspect-ratio: 16 / 9; border-radius: calc(var(--ft-radius-medium) - 1px) calc(var(--ft-radius-medium) - 1px) 0 0; background: var(--ft-lilac); }
.article-card__cover img { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; }
.article-card__body { display: grid; align-content: start; gap: .625rem; min-inline-size: 0; padding: 1.125rem; }
.article-card__labels, .article-single__labels { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; min-inline-size: 0; }
.article-topic { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: .3rem; min-block-size: 2rem; max-inline-size: 100%; padding: .25rem .625rem; border-radius: var(--ft-radius-small); background: var(--topic-bg, var(--ft-lilac)); color: var(--topic-text, var(--ft-ink)); font-size: .75rem; line-height: 1.5; font-weight: 600; text-decoration: none; }
.article-topic:hover { color: var(--topic-text, var(--ft-ink)); text-decoration: underline; }
.article-featured { color: var(--ft-primary); font-size: .75rem; font-weight: 600; }
.article-card__title { margin: 0; font-size: 1.1875rem; line-height: 1.4; letter-spacing: -.015em; }
.article-card__link { color: var(--ft-ink); text-decoration: none; }
.article-card__link::after { content: ''; position: absolute; inset: 0; border-radius: var(--ft-radius-medium); }
.article-card__link:hover { color: var(--ft-primary); }
.article-card:focus-within { outline: 3px solid var(--ft-focus); outline-offset: 3px; }
.article-card__lead { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin: 0; color: var(--ft-muted); font-size: .875rem; line-height: 1.6; }
.article-card__time { margin: .125rem 0 0; color: var(--ft-muted); font-size: .8125rem; }
.articles-empty { padding: 1.5rem; border: 1px solid var(--ft-border); border-radius: var(--ft-radius-medium); background: var(--ft-surface); }
.articles-empty h2 { margin-block-end: .5rem; font-size: 1.125rem; }
.articles-empty p { margin: 0; color: var(--ft-muted); }
.articles-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .5rem; margin-block-start: 1.75rem; }
.articles-pagination :is(a, span) { display: inline-flex; align-items: center; justify-content: center; min-inline-size: 2.75rem; min-block-size: 2.75rem; padding: .5rem .75rem; border-radius: var(--ft-radius-small); font-size: .875rem; }
.articles-pagination a { border: 1px solid var(--ft-border); color: var(--ft-ink); background: var(--ft-surface); text-decoration: none; }
.articles-pagination a:hover { border-color: var(--ft-primary); color: var(--ft-primary); }
.articles-pagination [aria-current] { background: var(--ft-primary); color: var(--ft-surface); font-weight: 600; }
.articles-pagination__gap { color: var(--ft-muted); }

.article-single { max-inline-size: 44rem; margin-inline: auto; min-inline-size: 0; }
.article-single__header { margin-block-end: 1.5rem; }
.article-single__labels { margin-block-end: .875rem; }
.article-single__title { margin: 0 0 1rem; font-size: clamp(1.75rem, 1.5rem + .7vw, 2.25rem); line-height: 1.25; letter-spacing: -.035em; overflow-wrap: anywhere; }
.article-single__lead { margin-block: 0 1rem; font-size: 1.125rem; line-height: 1.65; overflow-wrap: anywhere; }
.article-single__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .75rem; margin: 0; color: var(--ft-muted); font-size: .8125rem; line-height: 1.6; }
.article-single__meta > span { min-inline-size: 0; overflow-wrap: anywhere; }
.article-single__cover { margin: 0 0 1.75rem; }
.article-single__cover img { display: block; inline-size: 100%; block-size: auto; max-block-size: 32rem; object-fit: contain; border-radius: var(--ft-radius-medium); background: var(--ft-surface); }
.article-single__cover figcaption { color: var(--ft-muted); font-size: .8125rem; line-height: 1.5; margin-block-start: .5rem; }
.article-content { display: flow-root; min-inline-size: 0; font-size: 1.0625rem; line-height: 1.65; overflow-wrap: anywhere; }
.article-content > :first-child { margin-block-start: 0; }
.article-content > :last-child { margin-block-end: 0; }
.article-content :is(p, ul, ol, blockquote, figure, pre, table, .wp-block-table) { margin-block: 0 1.4rem; }
.article-content :is(h2, h3, h4, h5, h6, [id]) { scroll-margin-block-start: calc(var(--ft-app-header, 4.5rem) + 2.5rem); }
.article-content :is(h2, h3) { margin-block: 2rem .75rem; letter-spacing: -.02em; }
.article-content h2 { font-size: 1.5rem; line-height: 1.35; }
.article-content h3 { font-size: 1.25rem; line-height: 1.4; }
.article-content :is(h4, h5, h6) { font-size: 1.125rem; line-height: 1.45; }
.article-content :is(ul, ol) { padding-inline-start: 1.5rem; }
.article-content li + li { margin-block-start: .4rem; }
.article-content li > :last-child { margin-block-end: 0; }
.article-content blockquote { margin-inline: 0; padding: .75rem 1.25rem; border-inline-start: 3px solid var(--ft-primary); background: var(--ft-pink); border-radius: 0 var(--ft-radius-small) var(--ft-radius-small) 0; }
.article-content blockquote > :last-child { margin-block-end: 0; }
.article-content :is(cite, figcaption) { display: block; color: var(--ft-muted); font-size: .875rem; line-height: 1.6; }
.article-content a { text-underline-offset: .18em; text-decoration-thickness: .08em; }
.article-content :is(img, video) { max-inline-size: 100%; block-size: auto; }
.article-content :is(iframe, embed, object) { max-inline-size: 100%; }
.article-content figure { margin-inline: 0; }
.article-content figure img { border-radius: var(--ft-radius-small); }
.article-content figcaption { margin-block-start: .5rem; text-align: start; }
.article-content .wp-block-table { max-inline-size: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.article-content table { display: block; inline-size: 100%; max-inline-size: 100%; overflow-x: auto; border-collapse: collapse; font-size: .9375rem; }
.article-content :is(td, th) { padding: .65rem .75rem; border: 1px solid var(--ft-border); text-align: start; }
.article-content th { background: var(--ft-lilac); font-weight: 600; }
.article-content pre { max-inline-size: 100%; padding: 1rem; overflow: auto; background: var(--ft-lilac); border-radius: var(--ft-radius-small); font-size: .875rem; white-space: pre; }
.article-content code { font-size: .9em; }
.article-content hr { margin-block: 2rem; border: 0; border-block-start: 1px solid var(--ft-border); }
.article-content mark { color: var(--ft-ink); background: var(--ft-peach); }
.article-content .alignwide, .article-content .alignfull { max-inline-size: 100%; margin-inline: 0; }
.article-content :is(.alignleft, .alignright) { float: none; margin-inline: 0; }
.article-toc { margin-block: 1.5rem; padding: .75rem 1rem; border: 1px solid var(--ft-border); border-radius: var(--ft-radius-medium); background: var(--ft-surface); font-size: .9375rem; }
.article-toc summary { min-block-size: 2.75rem; padding-block: .5rem; cursor: pointer; font-weight: 600; }
.article-toc ol { margin: .5rem 0 0; padding-inline-start: 1.25rem; }
.article-toc a { display: inline-block; padding-block: .25rem; }
.article-single__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-block-start: 2rem; padding-block: 1rem; border-block: 1px solid var(--ft-border); }
.article-single__actions .publication-share { display: inline-flex; align-items: center; gap: .4rem; min-block-size: 2.75rem; padding: .5rem .75rem; background: var(--ft-surface); border: 1px solid var(--ft-border); border-radius: var(--ft-radius-small); font-size: .875rem; color: var(--ft-primary); }
.article-single__actions .publication-share[hidden] { display: none; }
.article-single__actions .publication-share > span { position: static; inline-size: auto; block-size: auto; overflow: visible; clip-path: none; }
.article-single__actions .publication-share .ft-icon { inline-size: 1.125rem; block-size: 1.125rem; }
.article-single__actions .share-copy { flex-basis: 100%; min-inline-size: 0; max-inline-size: 100%; }
.article-conversation { margin-block-start: 2rem; padding: 1.25rem; border-radius: var(--ft-radius-medium); background: var(--ft-lilac); }
.article-conversation h2 { font-size: 1.25rem; margin-block: 0 .5rem; }
.article-conversation p { margin-block: .5rem; overflow-wrap: anywhere; }
.article-conversation__title { font-weight: 600; }
.article-conversation__count { color: var(--ft-muted); font-size: .875rem; }
.article-conversation a { display: inline-flex; align-items: center; gap: .4rem; min-block-size: 2.75rem; margin-block-start: .375rem; font-size: .9375rem; font-weight: 600; text-underline-offset: .2em; }
.article-conversation a .ft-icon { inline-size: 1rem; block-size: 1rem; }
.articles-related { margin-block-start: 2rem; }
.articles-related > h2 { margin-block-end: 1rem; font-size: 1.25rem; }
.articles-related .article-card__title { font-size: 1.0625rem; }
.article-preview-notice { margin-block: 0 1.25rem; padding: .75rem 1rem; border: 1px solid var(--ft-control-border); border-radius: var(--ft-radius-small); color: var(--ft-muted); font-size: .875rem; }
.discover-editorial { margin-block-start: 1.75rem; }
.discover-editorial__heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 1rem; margin-block-end: .875rem; }
.discover-editorial__heading h2 { margin: 0; }
.discover-editorial__heading a, .discover-editorial__link { display: inline-flex; align-items: center; gap: .4rem; min-block-size: 2.75rem; font-size: .875rem; font-weight: 600; text-underline-offset: .2em; }
.discover-editorial .ft-icon { inline-size: 1rem; block-size: 1rem; }
.discover-editorial .articles-grid { gap: .75rem; }
.article-card--compact { grid-template-columns: 5.5rem minmax(0, 1fr); gap: .75rem; padding: .75rem; }
.article-card--compact .article-card__cover { align-self: start; aspect-ratio: 4 / 3; border-radius: var(--ft-radius-small); }
.article-card--compact .article-card__body { padding: 0; gap: .3rem; }
.article-card--compact .article-card__title { font-size: 1rem; line-height: 1.45; }
.article-card--compact .article-card__lead { display: none; }
.article-card--compact.article-card--text { grid-template-columns: minmax(0, 1fr); }

@media (min-width: 48rem) {
 .articles-layout { grid-template-columns: var(--ft-app-sidebar) minmax(0, 1fr); }
 .article-content { font-size: 1.125rem; }
}
@container articles (min-width: 35rem) {
 .articles-filters { grid-template-columns: minmax(10rem, .8fr) minmax(0, 1.2fr); gap: 1rem; }
 .articles-filters__actions { grid-column: 1 / -1; }
 .articles-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .articles-related .articles-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container articles (min-width: 54rem) {
 .articles-filters { grid-template-columns: minmax(10rem, .8fr) minmax(0, 1.2fr) auto; align-items: end; }
 .articles-filters__actions { grid-column: auto; }
 .articles-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 47.999rem) {
 .articles-layout.app-container { inline-size: calc(100% - 2rem); }
 .article-single__cover img { max-block-size: 22rem; }
 .articles-related .article-card:has(.article-card__cover) { grid-template-columns: 5.5rem minmax(0, 1fr); gap: .75rem; padding: .75rem; }
 .articles-related .article-card__cover { align-self: start; aspect-ratio: 4 / 3; border-radius: var(--ft-radius-small); }
 .articles-related .article-card:has(.article-card__cover) .article-card__body { padding: 0; }
 .articles-related .article-card__lead { display: none; }
}
@media (max-width: 23rem) {
 .article-card--compact { grid-template-columns: 4.25rem minmax(0, 1fr); }
 .article-single__title { font-size: 1.625rem; }
}