/* ============================================================
   Nova Jandira Odontologia — Blog
   Estilos específicos do blog (usa os tokens de ../styles.css)
   ============================================================ */

/* ---------- Hero do blog / cabeçalho de artigo ---------- */
.blog-hero{background:var(--hero-bg);padding:60px 0 52px;}
.blog-hero h1{font-size:clamp(34px,4.6vw,54px);font-weight:800;color:var(--hero-ink);}
.blog-hero .sub{margin-top:14px;color:var(--hero-muted);font-size:18px;max-width:640px;}

.breadcrumbs{font-size:13.5px;color:var(--muted);margin-bottom:16px;}
.breadcrumbs a{color:var(--accent-deep);}
.breadcrumbs a:hover{text-decoration:underline;}
.breadcrumbs .sep{margin:0 7px;opacity:.6;}

/* ---------- Índice: grade de artigos ---------- */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding:64px 0 96px;}
.post-card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:28px;display:flex;flex-direction:column;box-shadow:var(--shadow-sm);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.post-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:color-mix(in srgb,var(--accent) 40%,var(--line));}
.post-card .pc-tag{
  align-self:flex-start;font-family:var(--hfont);font-weight:700;font-size:11.5px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--accent-deep);
  background:var(--orange-soft);padding:5px 11px;border-radius:var(--radius-pill);
}
.post-card h2{font-size:22px;font-weight:700;margin-top:16px;line-height:1.2;}
.post-card h2 a:hover{color:var(--accent-deep);}
.post-card .pc-excerpt{margin-top:10px;color:var(--muted);font-size:15px;flex:1;}
.post-card .pc-meta{margin-top:18px;font-size:12.5px;color:var(--muted);}
.post-card .pc-link{
  margin-top:8px;display:inline-flex;align-items:center;gap:7px;
  font-family:var(--hfont);font-weight:700;font-size:14.5px;color:var(--accent-deep);
}
.post-card .pc-link svg{width:16px;height:16px;transition:transform .18s ease;}
.post-card:hover .pc-link svg{transform:translateX(3px);}

/* ---------- Artigo ---------- */
article.post{max-width:760px;margin:0 auto;padding:0 0 32px;}
.post-head{padding:52px 0 8px;}
.post-head h1{font-size:clamp(30px,4.2vw,46px);font-weight:800;line-height:1.06;}
.post-meta{margin-top:16px;font-size:13.5px;color:var(--muted);}
.post-meta b{color:var(--heading);}

.prose{margin-top:30px;}
.prose p{margin:0 0 18px;font-size:17px;line-height:1.75;color:var(--ink);}
.prose h2{font-size:clamp(24px,3vw,32px);font-weight:700;margin:40px 0 14px;}
.prose h3{font-size:21px;font-weight:700;margin:28px 0 10px;}
.prose ul,.prose ol{margin:0 0 18px;padding-left:22px;}
.prose ul{list-style:disc;}
.prose ol{list-style:decimal;}
.prose li{margin-bottom:9px;font-size:17px;line-height:1.65;color:var(--ink);}
.prose li::marker{color:var(--accent-deep);}
.prose b,.prose strong{color:var(--heading);}
.prose a{color:var(--accent-deep);text-decoration:underline;text-underline-offset:3px;}

.prose .note{
  background:var(--surface);border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));
  border-radius:var(--radius);padding:18px 20px;margin:0 0 18px;
  font-size:15.5px;color:var(--muted);
}
.prose .note b{color:var(--heading);}

.prose table{width:100%;border-collapse:collapse;margin:0 0 22px;font-size:15.5px;}
.prose th,.prose td{border:1px solid var(--line);padding:12px 14px;text-align:left;vertical-align:top;}
.prose th{background:var(--alt);font-family:var(--hfont);font-weight:700;color:var(--heading);font-size:14.5px;letter-spacing:.02em;}
.prose td{background:var(--surface);color:var(--ink);line-height:1.55;}

/* ---------- CTA do artigo ---------- */
.post-cta{
  background:var(--cta-bg);color:var(--cta-ink);border-radius:var(--radius-lg);
  padding:40px 34px;text-align:center;margin:40px 0 0;
}
.post-cta h2{color:var(--cta-ink);font-size:clamp(24px,3vw,32px);font-weight:800;}
.post-cta p{margin:12px auto 0;max-width:480px;font-size:16.5px;color:color-mix(in srgb,var(--cta-ink) 84%, transparent);}
.post-cta .btn{margin-top:24px;}

/* ---------- Voltar / rodapé do artigo ---------- */
.post-back{padding:36px 0 80px;text-align:center;}

/* ---------- Responsivo ---------- */
@media (max-width:980px){
  .post-grid{grid-template-columns:1fr 1fr;padding:48px 0 72px;}
}
@media (max-width:600px){
  .post-grid{grid-template-columns:1fr;}
  .prose table{display:block;overflow-x:auto;}
}