/* ============================================================
   Blog (index + post) — CustoCasa
   Tokens, resets, blobs, .glass, botões, .post-card, header e
   footer ficam em theme.css. Aqui só o específico do blog.
   ============================================================ */

/* ===================== BLOG HERO ===================== */
.blog-hero { padding: 48px 0 32px; }
.blog-hero h1 {
  font-size: clamp(1.8rem, 4.4vw, 2.6rem); font-weight: 800;
  color: var(--cc-primary); letter-spacing: -.02em; line-height: 1.15; margin-bottom: 12px;
}
.blog-hero p { color: var(--cc-text-muted); font-size: 1.05rem; margin-bottom: 22px; max-width: 560px; }
.search-box {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px; max-width: 440px; border-radius: var(--radius-md);
}
.search-box input { border: none; outline: none; background: transparent; flex: 1; font-size: .95rem; }
.search-box input:focus { box-shadow: none; }

/* ===================== ARTIGO ===================== */
.article { padding: 40px 0 24px; }
.article-wrap { max-width: 760px; }
.article-back { display: inline-block; color: var(--cc-secondary); font-weight: 600; font-size: .9rem; margin-bottom: 18px; }
.article-meta { display: flex; align-items: center; gap: 12px; font-size: .82rem; color: var(--cc-text-muted); margin-bottom: 14px; }
.article-wrap h1 {
  font-size: clamp(1.6rem, 4vw, 2.3rem); font-weight: 800; color: var(--cc-primary);
  letter-spacing: -.02em; line-height: 1.2; margin-bottom: 20px;
}
.article-hero { overflow: hidden; padding: 8px; margin-bottom: 28px; }
.article-hero img { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; border-radius: var(--radius-md); }
.article-body p { font-size: 1.04rem; color: var(--cc-text); margin-bottom: 18px; line-height: 1.75; }

/* blocos do artigo */
.block {
  border-radius: var(--radius-md); padding: 18px 20px; margin: 24px 0; font-size: .96rem;
  display: flex; gap: 12px; align-items: flex-start;
}
.block p { margin: 0; }
.block-atencao { background: #FFF7ED; border: 1px solid #FED7AA; }
.block-insight { background: #F0FDF4; border: 1px solid #BBF7D0; }
.block-ferramenta { background: #EFF6FF; border: 1px solid #BFDBFE; }
.block-checklist { background: rgba(255,255,255,.75); border: 1px solid rgba(15,23,42,.1); }
.block-icon { font-size: 1.15rem; flex-shrink: 0; }
.block ul { list-style: none; width: 100%; }
.block li { padding: 6px 0 6px 28px; position: relative; color: var(--cc-text); font-size: .95rem; }
.block li::before { content: "✓"; position: absolute; left: 0; color: var(--cc-secondary); font-weight: 700; }

/* CTA interno (fim do artigo) — sem popup */
.article-cta { text-align: center; padding: 32px 26px; margin: 40px 0 8px; }
.article-cta h3 { font-size: 1.3rem; font-weight: 800; color: var(--cc-primary); margin-bottom: 8px; }
.article-cta p { color: var(--cc-text-muted); font-size: .98rem; margin-bottom: 20px; }
.article-cta .btn-cta { display: inline-block; }