/* Article body typography. Markdown output carries no classes, so it is
   styled here rather than with utilities. Loaded only on blog pages. */

.blog-body { font-size: 1.125rem; line-height: 1.75; }
.blog-body > * + * { margin-top: 1.25em; }

.blog-body h2 { font-size: 1.6rem; font-weight: 700; line-height: 1.3; margin-top: 2.2em; }
.blog-body h3 { font-size: 1.25rem; font-weight: 600; margin-top: 1.8em; }
.blog-body a { text-decoration: underline; text-underline-offset: 3px; }
.blog-body strong { font-weight: 700; }

.blog-body ul, .blog-body ol { padding-left: 1.4em; }
.blog-body ul { list-style: disc; }
.blog-body ol { list-style: decimal; }
.blog-body li + li { margin-top: 0.4em; }

/* TL;DR and callouts are markdown blockquotes. */
.blog-body blockquote {
  border: 1px solid oklch(0.9 0.05 95);
  background: oklch(0.97 0.03 95);
  border-radius: 0.75rem;
  padding: 1em 1.25em;
}
.blog-body blockquote > * + * { margin-top: 0.6em; }

.blog-body table { width: 100%; max-width: 100%; border-collapse: collapse; font-size: 1rem; display: block; overflow-x: auto; }
.blog-body th, .blog-body td { border-bottom: 1px solid oklch(0.9 0 0); padding: 0.55em 0.75em; text-align: left; white-space: nowrap; }
.blog-body th { font-weight: 600; background: oklch(0.97 0 0); }

.blog-body code { font-size: 0.95em; background: oklch(0.96 0 0); padding: 0.1em 0.35em; border-radius: 0.3em; }
.blog-body pre { background: oklch(0.96 0 0); padding: 1em; border-radius: 0.75rem; overflow-x: auto; }
.blog-body pre code { background: none; padding: 0; }

.blog-body figure img, .blog-body figure video { width: 100%; height: auto; border-radius: 0.75rem; border: 1px solid oklch(0.9 0 0); }
.blog-body figcaption { font-size: 0.9rem; opacity: 0.65; margin-top: 0.5em; text-align: center; }

.blog-cta { background: oklch(0.97 0.03 95); }