/* Hallmark · macrostructure: Long Document (blog post template) · tone: grounded, direct, dignified · anchor hue: brick 29°
 * page: every post, generated by tools/build_posts.py · system: design.md "limestone and brick" (locked; inner page of the Split Studio site)
 * eyebrows: none · nav: N1b (shared) · footer: Ft3 (shared) · tokens only (tokens.css) · motion: none
 * Hallmark · pre-emit critique: P4 H5 E4 S4 R5 V4
 * Post bodies are the client's own words, rendered verbatim; this file only sets them for long reading.
 */


/* ── Head: titles are the client's and run long (46–102 characters), so one step below an inner-page h1 ── */
.article-head { padding-block: var(--space-lg) var(--space-xl); }
.article-head h1 { font-size: var(--text-xl); line-height: 1.12; max-width: 30ch; }
.article-meta { font-size: var(--text-sm); color: var(--color-text-muted); font-variant-numeric: tabular-nums; }
@media (min-width: 60rem) { .article-head { padding-block: var(--space-xl) var(--space-2xl); } }

/* ── Body ── */
.article-body { padding-block: var(--space-xl) var(--space-3xl); }
.article-body .prose { overflow-wrap: break-word; }
/* FAQ: each question is a heading (design rule), set in rows like the shared .faq accordion, all answers visible */
.prose > .faq-title { margin-top: var(--space-2xl); padding-bottom: var(--space-sm); border-bottom: var(--rule-strong) solid var(--color-ink); }
.prose > .faq-q {
  margin-top: var(--space-md); padding-top: var(--space-md); border-top: var(--rule-hair) solid var(--color-rule);
  font-family: var(--font-display); font-weight: var(--weight-h3); font-size: var(--text-md); line-height: var(--leading-snug);
}
.prose > .faq-title + .faq-q { border-top: 0; padding-top: 0; }


/* ── After the article: more on the same topic (the closing call band sits between) ── */
.more-reading h2 { font-size: var(--text-lg); }
.more-reading .article-list { margin-block: var(--space-lg) var(--space-md); }