/* Estilos da página HTML/BLOG/blog-fundos-investimento.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,.post-body ol{margin:0 0 1.2rem 1.3rem}
.post-body table{width:100%;border-collapse:collapse;margin-bottom:1.6rem;font-size:.92rem}
.post-body th,.post-body td{text-align:left;padding:.7rem .8rem;border-bottom:1px solid #E9EFF7}
.post-body th{color:var(--navy);font-weight:700;background:var(--bg-soft)}
.post-body .callout{
  background:var(--bg-soft);border-left:4px solid var(--orange);border-radius:0 12px 12px 0;
  padding:1.2rem 1.4rem;margin:0 0 1.4rem;font-size:.98rem;
}
.post-body .callout a{color:var(--blue);font-weight:700}
.post-body .aviso{
  background:#FDEFE0;border-left:4px solid var(--orange);border-radius:0 12px 12px 0;
  padding:1.2rem 1.4rem;margin:1.8rem 0 0;font-size:.92rem;color:var(--navy);
}
.post-body .aviso strong{display:block;margin-bottom:.3rem}
@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}
  .post-body table{font-size:.82rem}
}
@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}
}
