/* Journal index + article pages */

/* ---------- Index ---------- */
.journal-index__head .section-head p { justify-self: start; }
@media (min-width: 800px) { .journal-index__head .section-head p { justify-self: end; text-align: right; } }
.journal-index__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-3) var(--s-4); margin-top: var(--s-7); padding-block: var(--s-4); border-block: 1px solid var(--line); }
.journal-index__bar .chip { min-height: 38px; padding-inline: 1rem; }
@media (pointer: coarse) { .journal-index__bar .chip { min-height: var(--tap); } }
.journal-index__count { color: var(--ink-3); margin-left: auto; }

.journal-index__list { display: grid; gap: var(--s-8); }

/* Featured story: image left, text right */
.journal-feat { display: grid; gap: var(--s-5); }
@media (min-width: 900px) { .journal-feat { grid-template-columns: 7fr 5fr; gap: var(--s-8); align-items: center; } }
.journal-feat__media { display: block; }
.journal-feat__media img { transition: transform 1.2s var(--ease-out), opacity var(--t-slow) var(--ease-out); }
.journal-feat:hover .journal-feat__media img { transform: scale(1.03); }
.journal-feat__text { display: grid; gap: var(--s-4); justify-items: start; }
@media (min-width: 900px) { .journal-feat__text { padding-right: var(--s-7); } }
.journal-feat__text h2 { max-width: 18ch; }
.journal-feat__text h2 a { transition: color var(--t-fast); }
.journal-feat__text h2 a:hover { color: var(--ink-2); }
.journal-feat__text p { max-width: 44ch; }

/* Remaining stories: static grid (not the home-page scroller) */
.journal-index__grid { display: grid; gap: var(--s-7) var(--s-5); padding-top: var(--s-8); border-top: 1px solid var(--line); }
@media (min-width: 720px) { .journal-index__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.journal-index__grid.is-first { padding-top: 0; border-top: 0; }
.journal-index__item .mono { margin-bottom: var(--s-2); }
.journal-index__item p { margin-top: var(--s-2); font-size: var(--text-sm); color: var(--ink-2); }
.journal-index__empty { padding: var(--s-9) 0; text-align: center; color: var(--ink-2); }

/* ---------- Article ---------- */
.article { --article-col: 40rem; --article-wide: 54rem; }
.article__hero { margin-top: var(--s-5); }
.article__title { display: grid; gap: var(--s-4); justify-items: center; text-align: center; max-width: var(--article-wide); margin: var(--s-7) auto 0; }
.article__lede { max-width: var(--article-col); }

.article__body { margin-top: var(--s-8); font-size: var(--text-md); line-height: 1.7; }
.article__body > * { max-width: var(--article-col); margin-inline: auto; }
.article__body > * + * { margin-top: var(--s-5); }
.article__body > h2 { margin-top: var(--s-7); }
.article__body > h2 + * { margin-top: var(--s-4); }
.article__body > figure, .article__body > blockquote { margin-top: var(--s-8); }
.article__body > figure + *, .article__body > blockquote + * { margin-top: var(--s-8); }
.article__figure { max-width: var(--article-wide); }
.article__figure figcaption { margin-top: var(--s-3); }
.article__quote { display: grid; gap: var(--s-4); justify-items: start; }
.article__quote p { font-size: var(--text-xl); line-height: 1.15; letter-spacing: var(--tracking-snug); font-weight: 450; max-width: 24ch; text-wrap: balance; }
.article__quote cite { font-style: normal; }

.article__share { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); max-width: var(--article-col); margin: var(--s-8) auto 0; padding-top: var(--s-5); border-top: 1px solid var(--line); }
.article__share > .mono { margin-right: auto; }
.article__share .btn svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 1.5; }

.article__more { display: grid; gap: var(--s-6) var(--s-5); }
@media (min-width: 720px) { .article__more { grid-template-columns: repeat(3, minmax(0, 1fr)); } }