/* Estilos da página HTML/BLOG/blog-cet-comparar-propostas.html.
   Carregado depois do efeitos.css, do base.css e do artigo.css. */
.post-wrap{padding:4rem 0 5rem}
.post-body .capa{border-radius:20px;overflow:hidden;margin-bottom:2.6rem;max-height:360px;background:linear-gradient(135deg,#DDE9F6,#B9CDE6)}
.post-body .capa img{width:100%;height:100%;object-fit:cover}
.post-body ul{margin:0 0 1.2rem 1.3rem}

/* ---------- Tabela comparativa ilustrativa ---------- */
.post-body .tabela-wrap{overflow-x:auto;margin:0 0 .6rem;border-radius:14px;border:1px solid #E9EFF7}
.post-body table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:480px}
.post-body table caption{caption-side:top;text-align:left;font-weight:700;color:var(--navy);padding:1rem 1.2rem .2rem;font-size:.85rem;background:var(--bg-soft)}
.post-body thead th{background:var(--bg-soft);color:var(--navy);text-align:left;padding:.85rem 1.2rem;font-weight:700;border-bottom:1px solid #E9EFF7}
.post-body tbody td{padding:.85rem 1.2rem;border-bottom:1px solid #EFF3F9}
.post-body tbody tr:last-child td{border-bottom:none}
.post-body tbody th{padding:.85rem 1.2rem;text-align:left;font-weight:600;color:var(--navy);border-bottom:1px solid #EFF3F9;white-space:nowrap}
.post-body tbody tr.destaque td,.post-body tbody tr.destaque th{background:var(--orange-soft);font-weight:700}
.nota-ilustrativa{display:block;font-size:.85rem;color:#6B7690;font-style:italic;margin:.6rem 0 1.8rem}

.callout{background:var(--bg-soft);border-left:4px solid var(--orange);border-radius:10px;padding:1.2rem 1.4rem;margin:0 0 1.6rem}
.callout p{margin-bottom:0;font-size:.98rem}
.checklist{list-style:none;margin:0 0 1.2rem;display:flex;flex-direction:column;gap:.7rem}
.checklist li{padding-left:2rem;position:relative}
.checklist li::before{content:"✓";position:absolute;left:0;top:0;color:var(--orange);font-weight:800}
@media (max-width:620px){
  header .nav{gap:.7rem}
  header .logo img{height:38px}
  header .nav-right{gap:.6rem}
  header .nav-right .btn{padding:.55rem .9rem;font-size:.8rem;gap:.3rem}
  header .nav-right .btn .arrow{display:none}
  /* a tabela rola dentro do proprio bloco em vez de esticar a pagina */
  .post-body table{display:block;width:100%;overflow-x:auto}
  .post-body table tbody{display:table;width:100%}
  .foot-grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .conversao{padding:2.2rem 1.4rem}
}
@media (max-width:400px){
  header .nav{gap:.5rem}
  header .logo img{height:33px}
  header .nav-right{gap:.45rem}
  header .nav-right .btn{padding:.5rem .75rem;font-size:.75rem}
}