/* News article page (single.php). No prototype page exists for articles, so
   this is deliberately restrained: the hero comes from parts/page-hero, the
   date in the hero lede is styled like the design's news-card dates, and the
   body is a narrow readable column inheriting crayon.css typography. */

.page-hero .article-date {
  font-size: 13px; font-weight: 800;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: rgba(26,20,16,0.6);
}

.article-body { max-width: 720px; margin: 0 auto; }
.article-body p { font-size: 17px; line-height: 1.7; max-width: none; color: rgba(26,20,16,0.85); }
.article-body h2 { font-size: 30px; margin: 40px 0 14px; }
.article-body h3 { font-size: 24px; margin: 32px 0 12px; }
.article-body ul, .article-body ol { margin: 0 0 1em; padding-left: 26px; font-size: 17px; line-height: 1.7; color: rgba(26,20,16,0.85); }
.article-body li { margin-bottom: 6px; }
.article-body a { color: var(--ink); font-weight: 700; text-decoration-thickness: 3px; text-decoration-color: var(--yellow); }
.article-body img {
  max-width: 100%; height: auto;
  border: 3px solid var(--ink); border-radius: 22px;
  box-shadow: 6px 6px 0 var(--ink);
  margin: 8px 0 24px;
}
.article-body blockquote {
  margin: 24px 0; padding: 18px 22px;
  background: var(--soft-yellow);
  border: 3px solid var(--ink); border-radius: 22px;
}
.article-body blockquote p:last-child { margin-bottom: 0; }

.article-back { max-width: 720px; margin: 48px auto 0; }