/* Blog posts published by the blog pipeline (template: src/blog-pipeline-template.njk). */
.post-hero { padding-top: clamp(24px, 3.5vw, 48px); }
.post-hero .lead { max-width: 48rem; margin-top: 16px; }
.post-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin-top: 14px; font-size: .95rem; }
.post-meta > time, .post-meta > span:not(.post-lang) { opacity: .92; }

/* English | हिन्दी switch (only on posts that have both versions) */
.post-lang { display: inline-flex; margin-left: 10px; padding: 3px; border-radius: 999px; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .45); }
.post-lang a { padding: 4px 14px; border-radius: 999px; color: #fff; font-size: .88rem; font-weight: 600; text-decoration: none; line-height: 1.4; }
.post-lang a:hover { background: rgba(255, 255, 255, .18); }
.post-lang a[aria-current="page"] { background: #fff; color: var(--blue-deep, #0049d0); }

/* Hindi pages: Devanagari text in Noto Sans Devanagari, Latin words stay in Inter */
html[lang="hi"] body { font-family: "Inter", "Noto Sans Devanagari", system-ui, sans-serif; }
html[lang="hi"] .post { line-height: 1.85; }

.post-cover { width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: cover; margin: 0 0 28px !important; border-radius: 12px; }
.post table { display: table; }
@media (max-width: 640px) { .post table { display: block; } }

.post-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; margin: 2.2em 0; padding: 22px 24px; border-radius: 14px; background: linear-gradient(135deg, #eef6ff, #f3f0ff); border: 1px solid #d9e6ff; }
.post-cta p { margin: 0; }
.post-cta-title { font-weight: 700; font-size: 1.15rem; color: var(--navy); margin-bottom: 4px !important; }
.post-cta-btns { display: flex; flex-wrap: wrap; gap: 10px; }
.post-cta .btn { white-space: nowrap; }

.post-faq h3 { margin-top: 1.1em; }
.post-sources ul { font-size: .95rem; }
.post-sources a { overflow-wrap: anywhere; }
.post-note { margin-top: 2em !important; padding: 12px 16px; border-radius: 10px; background: #f6f8fc; color: #555; font-size: .92rem; }
.post-tags { display: flex; flex-wrap: wrap; gap: 8px; list-style: none !important; padding: 0 !important; margin: 1.4em 0 0 !important; }
.post-tags li { margin: 0; padding: 4px 12px; border-radius: 999px; background: #eef4ff; color: var(--blue-deep, #0049d0); font-size: .85rem; }
.post-back { margin-top: 1.6em !important; }
.post-back a { display: inline-flex; align-items: center; gap: 8px; text-decoration: none !important; font-weight: 600; }
.post-back svg { transform: rotate(180deg); }

@media (max-width: 560px) {
  .post-lang { margin: 6px 0 0; }
  .post-cta { padding: 18px; }
  .post-cta-btns, .post-cta .btn { width: 100%; }
  .post-cta .btn { justify-content: center; }
}
