/* Single articles only. Existing site fonts, palette and glass tokens are reused. */
.jn-article { --jn-article-padding: clamp(16px,3vw,32px); position: relative; min-width: 0; }
.jn-article__content { min-width: 0; }
.jn-article__editorial { position: relative; isolation: isolate; min-width: 0; padding: var(--jn-article-padding); border: 1px solid var(--glass-edge); border-radius: 20px; box-shadow: var(--glass-shadow); color: var(--ink); }
/* Keep blur on an empty layer, so it cannot trap fixed descendants in article content. */
.jn-article__editorial::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; border-radius: inherit; background-color: var(--glass-fill); background-image: var(--glass-sheen); }
.jn-article__story { min-width: 0; }
.jn-article__editorial .jn-article__bottom { margin-bottom: 0; }
.jn-article__editorial .jn-article__bottom:empty { display: none; }
.jn-article__body { font-size: clamp(16px, 15px + .18vw, 18px); font-weight: 400; line-height: 1.75; }
.jn-article__body :where(p, li) { font-size: inherit; font-weight: 400; line-height: inherit; }
.jn-article__body p { margin-block: 0 1.2em; }
.jn-article__body :is(h2,h3,h4) { font-family: 'Plus Jakarta Sans', sans-serif; line-height: 1.3; font-weight: 700; margin-block: 1.7em .7em; }
.jn-article__body h2 { font-size: 1.65em; }
.jn-article__body h3 { font-size: 1.35em; }
.jn-article__body h4 { font-size: 1.12em; }
.jn-article__body :is(ul,ol) { padding-inline-start: 1.5em; margin-block: 1em; }
.jn-article__body li + li { margin-top: .35em; }
.jn-article__body :is(img,video,iframe,figure) { max-width: 100%; }
.jn-article__body img { height: auto; }
.jn-article__body figure { margin-inline: 0; }
.jn-article__body :is(pre,table,.wp-block-table) { max-width: 100%; overflow-x: auto; }
.jn-article__body pre { padding: 1em; font-size: .9em; }
.jn-article__body blockquote { font-size: 1.05em; margin-inline: 0; padding-inline-start: 1em; }
.jn-article__body figcaption { color: var(--muted); font-size: .85em; }
.jn-share { display: flex; gap: 8px; max-width: 900px; margin: -12px auto 24px; flex-wrap: wrap; }
.jn-share :is(a,button), .jn-article-neighbor, .jn-comments, .jn-related .jn-card { background-color: var(--glass-fill); background-image: var(--glass-sheen); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); color: var(--ink); }
.jn-share :is(a,button) { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; padding: 10px; cursor: pointer; }
.jn-share :is(a,button):focus-visible, .jn-comments :is(a,input,textarea,button):focus-visible, .jn-article-neighbor:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.jn-share :is(a,button):hover { color: var(--accent-text); }
.jn-share .jn-icon { width: 20px; height: 20px; }
.jn-article-navigation, .jn-related, .jn-comments { max-width: 900px; margin: 40px auto; }
.jn-article-navigation { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.jn-article-neighbor { display: flex; gap: 14px; align-items: center; border-radius: var(--radius); padding: 18px; min-width: 0; text-decoration: none; overflow-wrap: anywhere; }
.jn-article-neighbor img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; flex-shrink: 0; }
.jn-article-neighbor small, .jn-article-neighbor strong { display: block; }
.jn-article-neighbor small { color: var(--muted); margin-bottom: 6px; }
.jn-related__grid { display: grid; grid-template-columns: minmax(0,1fr); grid-auto-rows: 1fr; gap: 18px; }
.jn-related .jn-card { min-width: 0; display: flex; flex-direction: column; }
.jn-related .jn-card__image { flex: none; aspect-ratio: 16 / 10; }
.jn-related .jn-card__content { display: flex; flex-direction: column; flex: 1; gap: 10px; padding: 16px; }
.jn-related .jn-tag { align-self: flex-start; font-size: var(--text-label); }
.jn-related .jn-card__title { font-size: var(--title-card); line-height: 1.3; margin: 0; }
.jn-related .jn-card__title a, .jn-related .jn-card__excerpt { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; hyphens: none; word-break: normal; overflow-wrap: anywhere; }
.jn-related .jn-card__title a { -webkit-line-clamp: 3; line-clamp: 3; }
.jn-related .jn-card__excerpt { -webkit-line-clamp: 2; line-clamp: 2; font-size: var(--text-sm); line-height: 1.6; margin: 0; }
.jn-related .jn-card__content time { margin-top: auto; padding-top: 4px; }
.jn-related .jn-carousel--enhanced .jn-carousel__track { --carousel-visible: 1; }
.jn-related .jn-carousel--enhanced .jn-carousel__track > .jn-card { flex: 0 0 calc((100% - (var(--carousel-visible) - 1) * var(--carousel-gap)) / var(--carousel-visible)); }
.jn-comments { border-radius: var(--radius); padding: clamp(16px,3vw,32px); overflow-wrap: anywhere; }
.jn-comments__list, .jn-comments .children { list-style: none; padding: 0; }
.jn-comments .children { padding-inline-start: clamp(12px,3vw,28px); border-inline-start: 1px solid var(--glass-edge); }
.jn-comments .comment-body { padding-block: 20px; border-bottom: 1px solid var(--glass-edge); font-size: 16px; line-height: 1.65; }
.jn-comments .avatar { float: left; margin-inline-end: 12px; border-radius: 50%; }
.jn-comments .comment-metadata, .jn-comments .comment-notes, .jn-comments .logged-in-as { color: var(--muted); font-size: .875rem; }
.jn-comments :is(input:not([type=checkbox]):not([type=submit]),textarea) { display: block; width: 100%; min-width: 0; color: var(--ink); background: var(--glass-soft); border: 1px solid var(--input-border); border-radius: 10px; padding: 12px; font: inherit; }
.jn-comments label { display: inline-block; margin-bottom: 6px; }
.jn-comments textarea { min-height: 150px; resize: vertical; }
.jn-comments input[type=checkbox] { accent-color: var(--action); }
.jn-comment-submit { color: var(--on-media); background: var(--action); border: 0; border-radius: 999px; padding: 12px 22px; font: inherit; cursor: pointer; }
.jn-comments .comment-awaiting-moderation, .jn-comments__notice { padding: 12px; border-inline-start: 3px solid var(--accent); background: var(--glass-soft); }
@supports (backdrop-filter: blur(1px)) {
    .jn-share :is(a,button), .jn-article-neighbor, .jn-comments { backdrop-filter: blur(var(--glass-blur-quiet)); -webkit-backdrop-filter: blur(var(--glass-blur-quiet)); }
    .jn-article__editorial::before { backdrop-filter: blur(var(--glass-blur-quiet)); -webkit-backdrop-filter: blur(var(--glass-blur-quiet)); }
}
@media (max-width: 959px) {
    /* One external share rail occupies the row between the heading and story, even without JS. */
    .jn-article--share { display: grid; grid-template-columns: minmax(0,1fr); }
    .jn-article--share > .jn-article__content { display: grid; grid-template-rows: subgrid; grid-column: 1; grid-row: 1 / span 4; }
    .jn-article--share .jn-article__editorial { display: grid; grid-template-rows: subgrid; grid-row: 1 / span 3; }
    .jn-article--share .jn-article__head { grid-row: 1; width: 100%; }
    .jn-article--share .jn-article__story { grid-row: 3; }
    .jn-article--share .jn-article__after { grid-row: 4; min-width: 0; }
    .jn-article--share > .jn-share { grid-column: 1; grid-row: 2; z-index: 1; max-width: none; margin: 0 var(--jn-article-padding) 24px; }
}
@media (min-width: 960px) {
    .jn-article--share { display: grid; grid-template-columns: 42px minmax(0,1fr); column-gap: 22px; align-items: start; }
    .jn-article--share > .jn-article__content { grid-column: 2; grid-row: 1; }
    .jn-article--share > .jn-share { grid-column: 1; grid-row: 1; align-self: start; flex-direction: column; margin: 0; }
    .jn-article--share > .jn-share--sticky { position: sticky; top: var(--jn-share-top,96px); }
}
@media (min-width: 640px) { .jn-related__grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .jn-related .jn-carousel--enhanced .jn-carousel__track { --carousel-visible: 2; } }
@media (min-width: 1100px) { .jn-related__grid { grid-template-columns: repeat(3,minmax(0,1fr)); } .jn-related .jn-carousel--enhanced .jn-carousel__track { --carousel-visible: 3; } }
@media (max-width: 700px) { .jn-article-navigation { grid-template-columns: 1fr; } }
@media (prefers-reduced-transparency: reduce) { .jn-share :is(a,button), .jn-article-neighbor, .jn-comments, .jn-article__editorial::before { backdrop-filter: none; -webkit-backdrop-filter: none; } }
