/* ── Nav gradient override for blog pages ── */
#siteNav { background:linear-gradient(135deg,#3730a3 0%,#6c63ff 50%,#a78bfa 100%) !important; border-bottom:none !important; box-shadow:none !important; }
#siteNav .navbar-brand { color:#fff !important; }
#siteNav .navbar-brand:hover { color:rgba(255,255,255,.85) !important; }
#siteNav .nav-link { color:rgba(255,255,255,.85) !important; }
#siteNav .nav-link:hover, #siteNav .nav-link.active { background:rgba(255,255,255,.15) !important; color:#fff !important; }
#siteNav .nav-btn-signin { color:#fff !important; }
#siteNav .nav-btn-signin:hover { background:rgba(255,255,255,.15) !important; color:#fff !important; }
#siteNav .nav-btn-cta { background:#fff !important; color:#6c63ff !important; }
#siteNav .nav-btn-cta:hover { background:rgba(255,255,255,.9) !important; }
#siteNav .navbar-toggler { color:#fff !important; }

/* ── Shared badge ── */
.post-cat-badge { display:inline-block; background:#f0eeff; color:#6c63ff; border-radius:20px; padding:.22rem .85rem; font-size:.78rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; margin-bottom:1rem; text-decoration:none; }
.post-cat-badge:hover { background:#e5e1ff; color:#4a42cc; }

/* ── Single post ── */
.blog-post-header {
  padding: 3rem 0 3rem;
  background: linear-gradient(135deg, #3730a3 0%, #6c63ff 55%, #a78bfa 100%);
  color: #fff;
}
.blog-post-header .breadcrumb { font-size:.85rem; margin-bottom:1.5rem; opacity:.85; }
.blog-post-header .breadcrumb-item a { color:#fff; text-decoration:none; }
.blog-post-header .breadcrumb-item a:hover { text-decoration:underline; }
.blog-post-header .breadcrumb-item.active { color:rgba(255,255,255,.7); }
.blog-post-header .breadcrumb-item+.breadcrumb-item::before { color:rgba(255,255,255,.5); }
.blog-post-header h1 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,4vw,2.8rem); line-height:1.25; max-width:820px; color:#fff; }
.blog-post-header .post-meta { font-size:.85rem; color:rgba(255,255,255,.75); }
.blog-post-header .post-cat-badge { background:rgba(255,255,255,.18); color:#fff; border:1px solid rgba(255,255,255,.3); margin-bottom:1rem; }
.blog-post-header .post-cat-badge:hover { background:rgba(255,255,255,.28); color:#fff; }
.blog-featured-img { width:100%; max-height:480px; object-fit:cover; border-radius:16px; margin-bottom:2.5rem; }
.blog-content { max-width:780px; margin:0 auto; font-size:1.05rem; line-height:1.85; color:#2d2926; }
.blog-content h2 { font-family:'Playfair Display',serif; font-size:1.55rem; font-weight:700; margin:2.4rem 0 .9rem; color:#1a1a1a; }
.blog-content h3 { font-size:1.15rem; font-weight:700; margin:1.8rem 0 .7rem; color:#2d2926; }
.blog-content p { margin-bottom:1.2rem; }
.blog-content a { color:#6c63ff; text-decoration:underline; text-underline-offset:3px; }
.blog-content a:hover { color:#4a42cc; }
.blog-content ul, .blog-content ol { padding-left:1.4rem; margin-bottom:1.2rem; }
.blog-content li { margin-bottom:.4rem; }
.blog-content strong { color:#1a1a1a; }
.blog-content blockquote { border-left:4px solid #6c63ff; margin:1.8rem 0; padding:.8rem 1.4rem; background:#f8f7ff; border-radius:0 8px 8px 0; font-style:italic; color:#555; }
.related-card { transition:.2s; }
.related-card:hover { transform:translateY(-3px); }

/* ── Blog listing ── */
.blog-hero { padding:60px 0 60px; background:linear-gradient(135deg,#3730a3 0%,#6c63ff 50%,#a78bfa 100%); color:#fff; }
.blog-hero h1 { font-family:'Playfair Display',serif; font-size:clamp(2rem,5vw,3rem); color:#fff; }
.blog-card { transition:.2s; border-radius:16px; overflow:hidden; }
.blog-card:hover { transform:translateY(-4px); box-shadow:0 12px 32px rgba(108,99,255,.15) !important; }
.blog-card-img { height:200px; object-fit:cover; width:100%; background:#f0eeff; }
.blog-card-img-placeholder { height:200px; display:flex; align-items:center; justify-content:center; background:#f0eeff; color:#a78bfa; font-size:2.5rem; }
.cat-filter-btn { border:1.5px solid #dee2e6; background:#fff; color:#495057; border-radius:20px; padding:.3rem 1rem; font-size:.83rem; font-weight:600; cursor:pointer; text-decoration:none; transition:.15s; }
.cat-filter-btn:hover, .cat-filter-btn.active { background:#6c63ff; border-color:#6c63ff; color:#fff; }
.blog-card-title { font-size:1rem; font-weight:700; line-height:1.35; color:#1a1a1a; }

/* ── GEO: TL;DR quick-answer block ── */
.tldr-box {
  background: #f0eeff;
  border-left: 4px solid #6c63ff;
  border-radius: 0 10px 10px 0;
  padding: 1rem 1.4rem;
  margin: 0 0 2rem;
  font-size: .97rem;
  color: #2d2d2d;
  line-height: 1.6;
}
.tldr-box strong {
  color: #6c63ff;
  margin-right: .3rem;
}