/* A readable issue: long-form, cultural objects, field notebook, film essay. */
.section-intro { display:grid; grid-template-columns: 1.25fr 1fr; gap:3rem; padding-block:1rem 3rem; border-bottom:2px solid var(--ink); }
.section-intro h1 { margin:0; }
.section-intro .deck { margin:0; align-self:end; }
.issue-navigation { display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; padding:1.1rem 0; border-bottom:1px solid var(--line); font:.75rem/1.5 var(--mono); }
.issue-navigation a { text-decoration:none; }
.contents-list { margin:2.5rem 0 4rem; }
.contents-row { display:grid; grid-template-columns:4rem 9rem 1.35fr 1fr; gap:1.5rem; border-bottom:1px solid var(--line); padding:1.5rem 0; text-decoration:none; align-items:baseline; }
.contents-row>span { font:.7rem/1.6 var(--mono); }
.contents-row .contents-number { font:800 2.5rem/1 var(--display); color:var(--wine); letter-spacing:-.08em; }
.contents-row h2 { margin:0; font-size:1.65rem; }
.contents-row p { margin:0; font-size:1rem; }
.contents-row:hover h2 { text-decoration:underline; text-underline-offset:.25em; }
.article-head { display:grid; grid-template-columns:1fr 22rem; gap:3rem; border-bottom:2px solid var(--ink); padding:1rem 0 2.5rem; }
.article-head h1 { margin-top:0; max-width:15ch; }
.article-head h1 { text-wrap:balance; }
html[lang=zh] .article-head h1 { max-width:none; }
.article-head .deck { max-width:38ch; margin-bottom:1rem; }
.article-meta { align-self:end; font:.75rem/1.8 var(--mono); }
.article-meta strong { display:block; font-size:1rem; color:var(--wine); margin-bottom:.8rem; }
.article-meta p { margin:.4rem 0; }
.article-layout { display:grid; grid-template-columns:13rem minmax(0,44rem); justify-content:center; gap:5rem; margin:3.5rem auto; }
.article-rail { font:.75rem/1.7 var(--mono); }
.article-rail p { margin-top:0; }
.article-rail a { display:block; margin:0 0 1rem; }
.article-body { min-width:0; }
.article-body p { line-height:1.95; margin:0 0 1.5rem; }
.article-body h2 { margin:3rem 0 1.4rem; }
.article-body h2:first-child { margin-top:0; }
.article-body .lede { font-size:1.4rem; line-height:1.75; }
.article-body blockquote { margin:2.5rem -2rem; padding:2rem; border-block:2px solid var(--wine); font:700 1.9rem/1.5 var(--sans); color:var(--wine); }
.article-body blockquote p { margin:0; line-height:1.5; }
.article-figure { margin:3rem 0; }
.article-figure img { display:block; width:100%; height:auto; }
.article-figure figcaption { max-width:65rem; }
.object-feature { display:grid; grid-template-columns:1.2fr 1fr; background:var(--ink); color:var(--paper); margin:3rem 0; }
.object-feature img { width:100%; height:100%; object-fit:cover; }
.object-feature>div { padding:3rem; align-self:center; }
.object-feature h2 { font:800 clamp(2rem,4vw,4rem)/1.15 var(--display); margin:1rem 0 1.5rem; }
.object-feature .kicker { color:#b8c6ff; }
.object-feature a:hover { color:#cbd5ff; }
.object-feature .text-link { border-color:var(--paper); }
.object-labels { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; border-block:1px solid var(--line); padding:2rem 0; margin:2rem 0; }
.object-labels h3 { font:750 1.15rem/1.5 var(--sans); margin:0 0 .7rem; }
.object-labels p { font-size:1rem; margin:0; }
.object-labels .kicker { margin-bottom:.75rem; }
.article-end { border-top:2px solid var(--ink); padding-top:1.5rem; margin-top:4rem; }
.article-end>p { font:.75rem/1.6 var(--mono); }
.article-end .index-stories { border:0; }
.notebook { display:grid; grid-template-columns:4rem 1fr; gap:1rem 2rem; padding:2rem 0; border-bottom:1px solid var(--line); }
.notebook>span { color:var(--wine); font:800 3rem/1 var(--display); }
.notebook h2 { margin:0 0 1rem; }
.notebook p { margin:0 0 1rem; }
.reading-note { background:#e0e4dd; padding:1.5rem; margin:2rem 0; font-size:1rem; }
.reading-note h3 { margin-top:0; }
.reading-note p:last-child { margin-bottom:0; }
.film-strip { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; border-block:1px solid var(--line); padding:2rem 0; }
.film-strip span { font:.7rem/1.5 var(--mono); color:var(--wine); }
.film-strip h2 { font-size:1.5rem; }
.film-strip p { font-size:1rem; }
.issue-card { background:var(--wine); color:white; padding:3rem; margin:2rem 0; }
.issue-card .kicker { color:white; }
.issue-card h2 { font:800 clamp(3rem,6vw,6rem)/1.05 var(--display); margin:1rem 0; }
.issue-card .text-link { border-color:white; }
.issue-card a:hover { color:#dce4ff; }
.site-header nav { flex-wrap:wrap; }
@media(max-width:1000px) {
 .contents-row { grid-template-columns:3rem 7rem 1fr; }
 .contents-row p { grid-column:3; }
 .article-head { grid-template-columns:1fr 15rem; gap:2rem; }
 .article-layout { grid-template-columns:10rem minmax(0,1fr); gap:2rem; }
 .object-feature>div { padding:2rem; }
}
@media(max-width:700px) {
 .section-intro,.article-head,.article-layout,.object-feature { display:block; }
 .section-intro { padding-bottom:1.5rem; }
 .section-intro .deck { margin-top:1.5rem; }
 .contents-list { margin-block:1.5rem 2.5rem; }
 .contents-row { grid-template-columns:2.5rem 1fr; gap:.7rem 1rem; }
 .contents-row h2,.contents-row p { grid-column:2; }
 .contents-row .contents-number { grid-row:1/4; font-size:2rem; }
 .contents-row h2 { font-size:1.5rem; }
 .contents-row p { font-size:.95rem; }
 .article-head { padding-block:0 1.5rem; }
 .article-head h1 { max-width:none; }
 .article-meta { border-top:1px solid var(--line); padding-top:1rem; }
 .article-layout { margin:2rem 0; }
 .article-rail { border-bottom:1px solid var(--line); margin-bottom:2rem; padding-bottom:.5rem; }
 .article-rail a { display:inline-block; margin-right:1rem; }
 .article-body .lede { font-size:1.2rem; }
 .article-body blockquote { margin:2rem 0; padding:1.5rem 0; font-size:1.5rem; }
 .article-figure { margin-block:2rem; }
 .object-feature img { aspect-ratio:1.3; }
 .object-feature>div { padding:1.5rem; }
 .object-labels,.film-strip { grid-template-columns:1fr; gap:1.5rem; }
 .object-labels>div+div,.film-strip>div+div { border-top:1px solid var(--line); padding-top:1.5rem; }
 .notebook { grid-template-columns:2rem 1fr; gap:1rem; }
 .notebook>span { font-size:2rem; }
 .issue-card { padding:1.5rem; }
 .article-end { margin-top:2.5rem; }
 .site-header nav { gap:.4rem 1rem; justify-content:flex-start; font-size:.65rem; }
}
@media print { .article-layout { display:block; } .article-rail { display:none; } .article-body blockquote { margin-inline:0; } }
