/* Blog pages, built from blog/posts by scripts/build-blog.mjs. Adds to legal.css. */
.blog { padding-top: 2.5rem; padding-bottom: 2rem; }
.blog h2 { margin-top: 2rem; }
.blog ol { padding-left: 1.4rem; margin: 0 0 1rem; }
.blog blockquote { margin: 1.25rem 0; padding: 0.75rem 1rem; background: var(--soft); border-left: 4px solid var(--teal); border-radius: 0 0.75rem 0.75rem 0; }
.blog blockquote p { margin: 0; }
.blog-back { font-size: 1rem; margin-bottom: 1.25rem; }
.blog-date { color: var(--muted); font-size: 1rem; margin-bottom: 2rem; }
.blog-intro { color: var(--muted); margin-bottom: 2rem; }
.blog .blog-list { list-style: none; padding: 0; margin: 0; }
.blog .blog-list li { margin: 0 0 1rem; }
.blog-list a { display: block; padding: 1.1rem 1.25rem; text-decoration: none; color: var(--text);
  background: var(--surface); border: 1px solid var(--border); border-left: 4px solid var(--teal); border-radius: 0.75rem; }
.blog-list a:hover { border-color: var(--accent); }
.blog-list-title { display: block; font-weight: 700; font-size: 1.2rem; line-height: 1.3; margin-bottom: 0.35rem; color: var(--accent); }
.blog-list-desc { display: block; margin-bottom: 0.35rem; }
.blog-list time { color: var(--muted); font-size: 0.95rem; }
.blog-cta { margin-top: 2.5rem; padding: 1.25rem; background: var(--surface); border: 1px solid var(--border); border-left: 4px solid var(--teal); border-radius: 0.75rem; }
.blog-cta p:last-child { margin-bottom: 0; }
.blog-button { display: inline-block; padding: 0.6rem 1.2rem; border-radius: 999px; background: var(--teal); color: #fff; font-weight: 700; text-decoration: none; }
.blog-button:hover { background: var(--teal-dark); }