/* Blog additions on top of styles.css — same tokens, quiet by design.
   Hand-written (not generated); build-blog.mjs pages link styles.css then this. */

/* ── index ───────────────────────────────────────────────────────────────── */
.blog-index { padding: 24px 0 80px; }
.blog-head { text-align: center; padding: 32px 0 48px; }
.blog-head h1 {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(36px, 7vw, 60px); line-height: 1.06; margin: 14px 0 16px;
}
.blog-head .lede { max-width: 520px; margin: 0 auto; }

.post-list { display: flex; flex-direction: column; gap: 16px; max-width: 720px; margin: 0 auto; }
.post-card {
  display: block; text-decoration: none; color: var(--text);
  background: var(--glass); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 26px 28px;
  transition: border-color 0.12s ease, background 0.12s ease;
}
.post-card:hover { border-color: var(--border-strong); background: var(--glass-strong); }
.post-card h2 {
  font-family: var(--serif); font-weight: 400; font-size: 26px;
  text-align: left; margin: 6px 0 8px; line-height: 1.2;
}
.post-card-meta { color: var(--faint); font-size: 13px; }
.post-card-desc { color: var(--muted); font-size: 15px; line-height: 1.55; }

/* ── post ────────────────────────────────────────────────────────────────── */
.blog-post h3 { font-size: 18px; margin: 26px 0 8px; font-weight: 600; }
.blog-post blockquote {
  border-left: 2px solid var(--border-strong); margin: 18px 0; padding: 2px 0 2px 18px;
}
.blog-post blockquote p { font-family: var(--serif); font-size: 19px; color: var(--text); }
.blog-post ol { padding-left: 22px; }
.blog-post ol li, .blog-post ul li { margin-bottom: 8px; }

.sources { margin-top: 40px; padding-top: 8px; }
.sources h2 { margin: 0 0 10px; }
.sources li { font-size: 14px; color: var(--muted); overflow-wrap: anywhere; }

.disclaimer {
  color: var(--faint); font-size: 13px; line-height: 1.5;
  border-top: 1px solid var(--border); margin-top: 28px; padding-top: 16px;
}

.post-cta {
  text-align: center; background: var(--glass); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 34px 26px; margin-top: 36px;
}
.post-cta-line {
  font-family: var(--serif); font-size: 22px; color: var(--text) !important;
  margin-bottom: 20px !important;
}
