/* Estilo compartilhado de /blog/ e /crm-para-consorcio/.
   Mesma identidade da landing e da /operacao-digital/: fundo lavanda,
   cards brancos, Sora nos titulos, Manrope no corpo. Pagina de leitura,
   entao a coluna de texto e estreita (68ch) e o corpo e maior. */
:root{
  --bg:#F1EDFB; --surface:#ffffff; --sunk:#E7E2F3; --chip:#EDE4FF;
  --ink:#17131F; --ink-2:#4B4459; --ink-3:#6B6480;
  --line:#d6c9f5; --roxo:#7C3AED; --roxo-escuro:#5B21B6; --roxo-noite:#4C1D95;
  --r-md:18px; --r-lg:28px; --r-pill:999px;
  --sombra:0 10px 34px rgba(124,58,237,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:17px; font-weight:500; line-height:1.7; -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto}
a{color:var(--roxo-escuro)}
h1,h2,h3{font-family:"Sora",sans-serif; line-height:1.25; color:var(--ink); letter-spacing:-.01em}
h1{font-size:clamp(28px,5vw,42px); font-weight:800; margin:0 0 16px}
h2{font-size:clamp(22px,3.4vw,28px); font-weight:700; margin:44px 0 12px}
h3{font-size:19px; font-weight:700; margin:28px 0 8px}

.topo{background:var(--surface); border-bottom:1px solid var(--line)}
.topo .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:14px; padding-bottom:14px}
.marca{font-family:"Sora",sans-serif; font-weight:800; font-size:22px; color:var(--ink); text-decoration:none}
.marca i{font-style:normal; color:var(--roxo)}
.topo nav{display:flex; align-items:center; gap:18px; font-weight:700; font-size:15px}
.topo nav a{color:var(--ink-2); text-decoration:none}
.btn{display:inline-block; background:var(--roxo); color:#fff !important; text-decoration:none;
  font-weight:800; padding:12px 22px; border-radius:var(--r-pill); box-shadow:var(--sombra)}
.btn:hover{background:var(--roxo-escuro)}
.topo .btn{padding:9px 16px; font-size:14px}

.wrap{max-width:1120px; margin:0 auto; padding-left:16px; padding-right:16px}
.leitura{max-width:740px; margin:0 auto; padding:32px 16px 64px}
.migalha{font-size:14px; color:var(--ink-3); margin-bottom:18px}
.migalha a{color:var(--ink-3)}
.kicker{display:inline-block; font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.08em;
  color:var(--roxo-escuro); background:var(--chip); padding:4px 12px; border-radius:var(--r-pill); margin-bottom:14px}
.intro{font-size:19px; color:var(--ink-2)}
.meta{font-size:14px; color:var(--ink-3); margin:-4px 0 24px}
p,li{color:var(--ink-2)}
strong{color:var(--ink)}
ul,ol{padding-left:22px}
li{margin:6px 0}

.caixa{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
  padding:20px 22px; margin:24px 0; box-shadow:var(--sombra)}
.caixa p:first-child{margin-top:0} .caixa p:last-child{margin-bottom:0}
.caixa h3{margin-top:0}
.msg{background:#E9FBEF; border:1px solid #c7ecd3; border-radius:14px 14px 14px 4px; padding:12px 14px;
  margin:10px 0; color:#1f3d2a; font-size:16px; max-width:560px}
.msg b{display:block; font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:#3d7a52; margin-bottom:2px}

table{width:100%; border-collapse:collapse; background:var(--surface); border-radius:var(--r-md); overflow:hidden;
  margin:20px 0; font-size:15px; box-shadow:var(--sombra)}
th,td{text-align:left; padding:11px 14px; border-bottom:1px solid var(--sunk); vertical-align:top}
th{background:var(--chip); font-family:"Sora",sans-serif; font-size:14px; color:var(--ink)}
.tabela-rola{overflow-x:auto}

.cta{background:var(--roxo-noite); color:#fff; border-radius:var(--r-lg); padding:28px 26px; margin:44px 0 0; text-align:center}
.cta h2{color:#fff; margin:0 0 8px}
.cta p{color:#e9d5ff; margin:0 0 18px}
.cta .btn{background:#fff; color:var(--roxo-noite) !important}
.cta small{display:block; margin-top:12px; color:#c4b5fd; font-size:13px}

.relacionados{margin-top:40px}
.relacionados ul{list-style:none; padding:0}
.relacionados li{margin:8px 0}

.lista-artigos{display:grid; gap:18px; margin-top:24px}
.card-artigo{display:block; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
  padding:20px 22px; text-decoration:none; box-shadow:var(--sombra)}
.card-artigo h2{font-size:21px; margin:0 0 6px}
.card-artigo p{margin:0}
.card-artigo:hover{border-color:var(--roxo)}

footer{border-top:1px solid var(--line); padding:28px 0; font-size:14px; color:var(--ink-3); text-align:center}
footer a{color:var(--ink-3)}

@media (max-width:600px){
  body{font-size:16px}
  .topo nav a.esconde-mobile{display:none}
  .intro{font-size:17px}
}