/* ============================================================
   BLOG
   ============================================================ */
.blog-featured { display:grid; grid-template-columns: 1.4fr 1fr; gap: 0; border:1px solid var(--line); border-radius: var(--radius-lg); overflow:hidden; }
@media (max-width:820px){ .blog-featured { grid-template-columns:1fr; } }
.blog-featured__img { min-height: 340px; background: linear-gradient(135deg,#0a1f5c,#163a9e); position:relative; isolation:isolate; }
.blog-featured__img .blueprint--dark { position:absolute; inset:0; }
.blog-featured__body { padding: clamp(1.8rem,4vw,3rem); display:flex; flex-direction:column; justify-content:center; }
.blog-featured__body h2 { font-size: var(--step-3); margin: .8rem 0 1rem; }
.blog-featured__body p { color:var(--muted); margin-bottom: 1.6rem; }
.post-meta { display:flex; align-items:center; gap:.8rem; font-family:var(--font-mono); font-size:.72rem; color:var(--slate-400); letter-spacing:.05em; }
.tag-pill { background: var(--blue-50); color: var(--blue-700); font-family:var(--font-mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; padding:.3rem .6rem; border-radius:100px; font-weight:500; }
.blog-grid { display:grid; gap:1.4rem; grid-template-columns: repeat(auto-fill,minmax(300px,1fr)); }
.post-card { background:#fff; border:1px solid var(--line); border-radius: var(--radius-lg); overflow:hidden; display:flex; flex-direction:column; transition: transform .45s var(--ease), box-shadow .45s; }
.post-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }
.post-card__img { aspect-ratio: 16/10; position:relative; isolation:isolate; }
.post-card__img .blueprint--dark { position:absolute; inset:0; }
.post-card__img .tag-pill { position:absolute; top:1rem; left:1rem; background:rgba(255,255,255,.92); }
.post-card__body { padding:1.4rem; display:flex; flex-direction:column; gap:.7rem; flex:1; }
.post-card__body h3 { font-size: var(--step-1); }
.post-card__body p { color:var(--muted); font-size: var(--step--1); flex:1; }
.post-card__foot { display:flex; align-items:center; justify-content:space-between; margin-top:.4rem; padding-top:.8rem; border-top:1px solid var(--slate-100); }

/* blog category tints (usadas quando o post não tem imagem de capa) */
.bg-b1{ background:linear-gradient(135deg,#0a1f5c,#163a9e);}
.bg-b2{ background:linear-gradient(135deg,#081540,#0e297f);}
.bg-b3{ background:linear-gradient(135deg,#0e297f,#2f57bd);}
.bg-b4{ background:linear-gradient(135deg,#0a1f5c,#163a9e);}

/* Capa real (upload feito pelo painel) */
.blog-featured__img img,
.post-card__img img {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}

/* Estado vazio / erro na listagem do blog */
.blog-empty { text-align:center; padding:3rem; color:var(--muted); }

/* ============================================================
   POST DETAIL (artigo individual, #/blog?post=slug)
   ============================================================ */
.post-detail { max-width: 74ch; margin-inline:auto; }
.post-detail__back { display:inline-flex; align-items:center; gap:.5rem; color:var(--blue-700); font-weight:600; font-size:.92rem; margin-bottom:1.6rem; }
.post-detail__back svg { width:1em; height:1em; flex:none; }
.post-detail__cover { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:var(--radius-lg); margin:1.6rem 0 2rem; }
.post-detail__head h1 { font-size: var(--step-3); margin:.9rem 0 1rem; }
.post-detail__body { color:var(--slate-700); font-size:var(--step-0); line-height:1.75; }
.post-detail__body h2 { font-size: var(--step-2); margin:2rem 0 .8rem; }
.post-detail__body h3 { font-size: var(--step-1); margin:1.6rem 0 .6rem; }
.post-detail__body p { margin-bottom:1.1rem; }
.post-detail__body ul, .post-detail__body ol { margin:0 0 1.1rem 1.4rem; }
.post-detail__body ul { list-style: disc; }
.post-detail__body ol { list-style: decimal; }
.post-detail__body li { margin-bottom:.4rem; }
.post-detail__body img { max-width:100%; border-radius:var(--radius); margin:1.2rem 0; }
.post-detail__body a { color:var(--blue-700); text-decoration:underline; }
.post-detail__body blockquote { border-left:3px solid var(--yellow); padding-left:1.2rem; color:var(--muted); font-style:italic; margin:1.4rem 0; }

