/* O blog da Max Life: HTML estático, com as cores e a letra da landing page. */
:root {
  --marinho: #0f2d4a; --teal: #1e8a82; --teal-texto: #16706a; --agua: #5cc9b8; --agua-50: #effaf8;
  --papel: #fbfdfd; --tinta: #13283d; --tinta-2: #4a5d6e; --linha: #dde8ec; --alerta: #b4532a;
  --gradiente: linear-gradient(135deg, #0f2d4a, #1e8a82 60%, #5cc9b8);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--papel); color: var(--tinta); font-family: "Poppins", ui-sans-serif, system-ui, sans-serif; font-size: 17px; line-height: 1.7; }
a { color: var(--teal-texto); }
img { max-width: 100%; height: auto; display: block; }
.caixa { width: 100%; max-width: 760px; margin: 0 auto; padding: 0 20px; }

.topo { border-bottom: 1px solid var(--linha); background: #fff; position: sticky; top: 0; z-index: 5; }
.topo .caixa { max-width: 1100px; }
.topo-linha { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 72px; }
.marca img { height: 44px; width: auto; }
.topo nav { display: flex; align-items: center; gap: 22px; font-size: 15px; font-weight: 500; }
.topo nav a { color: var(--tinta-2); text-decoration: none; }
.topo nav a:hover { color: var(--marinho); }
.botao { display: inline-block; background: var(--gradiente); color: #fff !important; text-decoration: none; font-weight: 600; border-radius: 999px; padding: 11px 22px; font-size: 15px; }
@media (max-width: 680px) { .topo nav a:not(.botao) { display: none; } }

.trilha { font-size: 14px; color: var(--tinta-2); margin: 28px 0 12px; }
.trilha a { color: var(--tinta-2); text-decoration: none; }
.trilha span { margin: 0 6px; color: var(--linha); }

.artigo h1 { font-size: clamp(28px, 5vw, 40px); line-height: 1.18; color: var(--marinho); letter-spacing: -0.02em; margin: 0 0 12px; }
.meta { font-size: 14px; color: var(--tinta-2); margin: 0 0 24px; }
.capa { border-radius: 20px; aspect-ratio: 16 / 9; object-fit: cover; width: 100%; margin-bottom: 28px; }
.texto h2 { font-size: 24px; line-height: 1.3; color: var(--marinho); margin: 40px 0 12px; letter-spacing: -0.01em; }
.texto ul, .texto ol { padding-left: 22px; }
.texto li { margin: 6px 0; }
.lide { font-size: 19px; color: var(--tinta); }
.alerta { border-left: 4px solid var(--alerta); background: #fdf3ee; border-radius: 0 14px 14px 0; padding: 14px 18px; margin: 24px 0; font-size: 16px; }
.tabela { overflow-x: auto; margin: 20px 0; }
.tabela table { border-collapse: collapse; width: 100%; font-size: 15px; min-width: 520px; }
.tabela th, .tabela td { border-bottom: 1px solid var(--linha); padding: 10px 12px; text-align: left; vertical-align: top; }
.tabela th { color: var(--marinho); }

.perguntas { margin-top: 44px; }
.perguntas h2 { font-size: 24px; color: var(--marinho); }
.perguntas details { border: 1px solid var(--linha); border-radius: 14px; padding: 14px 18px; margin: 10px 0; background: #fff; }
.perguntas summary { font-weight: 600; cursor: pointer; color: var(--marinho); }
.perguntas details p { margin: 10px 0 0; color: var(--tinta-2); }
.aviso { font-size: 14px; color: var(--tinta-2); margin-top: 28px; }

.chamada { background: var(--marinho); color: #fff; border-radius: 22px; padding: 28px; margin: 40px 0; }
.chamada p { margin: 0 0 14px; color: rgba(255, 255, 255, 0.82); }
.chamada .chamada-titulo { font-size: 22px; font-weight: 700; color: #fff; line-height: 1.3; }
.chamada .botao { background: #fff; color: var(--marinho) !important; }

.leia h2 { font-size: 20px; color: var(--marinho); }
.leia li { margin: 8px 0; }

.titulo-blog { font-size: clamp(30px, 5vw, 44px); color: var(--marinho); margin: 0; letter-spacing: -0.02em; }
.sub-blog { color: var(--tinta-2); margin: 6px 0 28px; }
.cartoes { list-style: none; padding: 0; margin: 0; display: grid; gap: 18px; }
.cartao a { display: grid; grid-template-columns: 220px 1fr; gap: 18px; text-decoration: none; color: var(--tinta); background: #fff; border: 1px solid var(--linha); border-radius: 20px; overflow: hidden; }
.cartao a:hover { border-color: var(--agua); }
.cartao img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 16 / 10; }
.cartao-texto { padding: 16px 18px 16px 0; display: flex; flex-direction: column; gap: 6px; }
.cartao-texto strong { color: var(--marinho); font-size: 18px; line-height: 1.35; }
.cartao-texto span { font-size: 15px; color: var(--tinta-2); line-height: 1.5; }
.cartao-texto em { font-style: normal; font-size: 13px; color: var(--teal-texto); font-weight: 600; }
@media (max-width: 620px) { .cartao a { grid-template-columns: 1fr; } .cartao-texto { padding: 0 18px 18px; } }

.rodape { background: var(--marinho); color: rgba(255, 255, 255, 0.75); margin-top: 60px; }
.rodape .caixa { max-width: 1100px; }
.rodape-linha { padding: 40px 20px; display: grid; gap: 16px; font-size: 14px; }
.rodape img { height: 40px; width: auto; }
.rodape p { margin: 0; }
.rodape strong { color: #fff; }
.rodape nav { display: flex; flex-wrap: wrap; gap: 18px; }
.rodape nav a { color: rgba(255, 255, 255, 0.85); text-decoration: none; }