/* Blog: listing page and articles */
.blog-hero { background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%); }
.blog-tag { display: inline-block; background: rgba(255,255,255,.18); color: #fff; font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; border-radius: 9999px; padding: .25rem .75rem; }
.blog-share { display: inline-flex; align-items: center; border: 1px solid #d1d5db; border-radius: 9999px; padding: .35rem .9rem; color: #374151; font-weight: 600; transition: all .2s; }
.blog-share:hover { border-color: #4f46e5; color: #4f46e5; }
.blog-filter { border: 1px solid #c7d2fe; color: #4338ca; border-radius: 9999px; padding: .4rem 1rem; font-weight: 600; font-size: .875rem; background: #fff; transition: all .2s; }
.blog-filter:hover, .blog-filter.is-active { background: #4f46e5; color: #fff; border-color: #4f46e5; }
.blog-card { background: #fff; border-radius: .75rem; box-shadow: 0 1px 3px rgba(0,0,0,.08); transition: box-shadow .2s, transform .2s; }
.blog-card:hover { box-shadow: 0 10px 20px -5px rgba(0,0,0,.12); transform: translateY(-3px); }
.blog-card-top { height: 6px; border-radius: .75rem .75rem 0 0; }

/* Article typography */
.cd-prose { color: #374151; font-size: 1.075rem; line-height: 1.8; }
.cd-prose > * + * { margin-top: 1.15em; }
.cd-prose h2 { font-size: 1.6rem; font-weight: 800; color: #111827; margin-top: 2.2em; line-height: 1.3; }
.cd-prose h3 { font-size: 1.25rem; font-weight: 700; color: #1f2937; margin-top: 1.8em; }
.cd-prose a { color: #4f46e5; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.cd-prose strong { color: #111827; }
.cd-prose ul, .cd-prose ol { padding-left: 1.4em; }
.cd-prose ul { list-style: disc; }
.cd-prose ol { list-style: decimal; }
.cd-prose li + li { margin-top: .4em; }
.cd-prose li::marker { color: #6366f1; }
.cd-prose blockquote { border-left: 4px solid #6366f1; background: #eef2ff; padding: 1em 1.25em; border-radius: 0 .5rem .5rem 0; font-size: 1.15rem; color: #312e81; }
.cd-prose blockquote p { margin: 0; }
.cd-prose table { width: 100%; border-collapse: collapse; font-size: .95rem; display: block; overflow-x: auto; }
.cd-prose th { background: #eef2ff; color: #312e81; text-align: left; padding: .6em .8em; font-weight: 700; }
.cd-prose td { border-top: 1px solid #e5e7eb; padding: .6em .8em; vertical-align: top; }
.cd-prose em { color: inherit; }
.cd-board { margin: 2em auto; max-width: 380px; text-align: center; }
.cd-board img { width: 100%; height: auto; border-radius: .5rem; box-shadow: 0 6px 18px -6px rgba(49,46,129,.35); }
.cd-board figcaption { margin-top: .7em; font-size: .95rem; font-weight: 600; color: #4b5563; }
.cd-answer { background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: .5rem; padding: .75em 1em; }
.cd-answer summary { cursor: pointer; font-weight: 700; color: #166534; }
.cd-answer[open] summary { margin-bottom: .5em; }
.cd-answer p { margin: 0; }