/* Kade · website-5 · blog post articles. Tokens and the header come from ../styles.css. */
.post-page { width: 100%; max-width: 44rem; margin-inline: auto; padding: clamp(2.5rem, 7vh, 5rem) var(--sc-gutter) var(--sc-9); }
.post-page__meta { margin: 0 0 1rem; font-size: var(--sc-t-xs); color: var(--sc-ink-soft); font-variant-numeric: tabular-nums; }
.post-page h1 { margin: 0; font-family: var(--sc-font-display); font-size: var(--sc-t-2xl); font-weight: 620; font-stretch: 84%; line-height: 1; letter-spacing: -0.03em; color: var(--sc-ink); text-wrap: balance; }
.post-page__lede { margin: 1.5rem 0 0; font-size: var(--sc-t-lg); line-height: 1.45; color: var(--text-lead); text-wrap: pretty; }
.post-page h2 { margin: 2.5rem 0 0; font-family: var(--sc-font-display); font-size: var(--sc-t-lg); font-weight: 600; font-stretch: 90%; letter-spacing: -0.02em; line-height: 1.15; color: var(--sc-ink); }
.post-page p { margin: 0.75rem 0 0; max-width: 62ch; line-height: 1.62; color: var(--sc-ink-soft); text-wrap: pretty; }
.post-page p.post-page__lede { color: var(--text-lead); }
.post-page a { color: var(--sc-ink); text-underline-offset: 0.24em; }
.post-page a:focus-visible { outline: 2px solid var(--sc-accent); outline-offset: 3px; border-radius: 2px; }
.post-page__back { margin-top: 2.5rem !important; font-weight: 600; }

/* Centred layout (2026-09-23): the post header and the back link are centred; the article paragraphs stay left-aligned so long text reads easily. */
.post-page__meta, .post-page h1, .post-page__lede, .post-page__back { text-align: center; }
.post-page p.post-page__meta, .post-page p.post-page__lede, .post-page p.post-page__back { margin-inline: auto; }