/* Paginas de texto do site (seguro, download, artigos), 01/10/2026. Mesmas cores e fontes da pagina inicial,
   sem o fundo animado: leve para ler no celular. */
:root{
  --fundo:#070A12; --fundo2:#0B1120; --superficie:#0F1526; --borda:#1B2438;
  --texto:#EAEEF8; --suave:#98A0B4; --apagado:#5D6580;
  --roxo:#8B5CF6; --ciano:#22D3EE; --verde:#25D366; --ambar:#FBBF24; --vermelho:#F43F5E;
  --grad:linear-gradient(120deg,#8B5CF6,#22D3EE);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0; background:var(--fundo); color:var(--texto); font-family:'Manrope',system-ui,Arial,sans-serif;
  line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden}
a{color:var(--ciano)}
img{max-width:100%; display:block}
.env{max-width:760px; margin:0 auto; padding:0 16px}
.ic{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:none}

nav{border-bottom:1px solid var(--borda); background:rgba(7,10,18,.9); position:sticky; top:0; z-index:5; backdrop-filter:blur(8px)}
nav .env{max-width:1100px; display:flex; align-items:center; justify-content:space-between; gap:12px; height:60px}
.marca{display:flex; align-items:center; gap:10px; color:var(--texto); text-decoration:none}
.marca b{font-family:'Chakra Petch',sans-serif; letter-spacing:.12em; font-size:14px}
.selo{width:30px; height:30px; border-radius:9px; background:var(--grad); display:grid; place-items:center}

.btn{display:inline-flex; align-items:center; gap:8px; border-radius:12px; padding:12px 18px; font-weight:700;
  text-decoration:none; font-size:15px; border:1px solid transparent}
.btn-p{background:var(--verde); color:#06210f}
.btn-z{border-color:var(--borda); color:var(--texto); background:var(--superficie)}
.btn.mini{padding:8px 14px; font-size:14px}

main{padding:40px 0 56px}
.trilha{font-size:13px; color:var(--apagado); margin:0 0 18px}
.trilha a{color:var(--suave); text-decoration:none}
h1{font-family:'Chakra Petch',sans-serif; font-size:clamp(28px,6vw,42px); line-height:1.15; margin:0 0 14px}
h2{font-family:'Chakra Petch',sans-serif; font-size:clamp(21px,4.4vw,26px); line-height:1.25; margin:38px 0 10px}
h3{font-size:17px; margin:24px 0 6px}
.grad{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent}
.lead{font-size:18px; color:var(--suave); margin:0 0 8px}
p,li{color:#C9CFDD}
li{margin:6px 0}
b,strong{color:var(--texto)}
code{font-family:'JetBrains Mono',monospace; font-size:.92em; background:var(--superficie); border:1px solid var(--borda);
  border-radius:6px; padding:1px 6px; overflow-wrap:anywhere}

.caixa{background:var(--superficie); border:1px solid var(--borda); border-radius:16px; padding:18px 20px; margin:20px 0}
.caixa.alerta{border-color:rgba(251,191,36,.35)}
.caixa h3{margin-top:0}
.passos{counter-reset:p; list-style:none; padding:0}
.passos li{counter-increment:p; position:relative; padding-left:44px; margin:14px 0}
.passos li::before{content:counter(p); position:absolute; left:0; top:0; width:30px; height:30px; border-radius:50%;
  background:var(--grad); color:#fff; font-weight:700; display:grid; place-items:center; font-size:14px}

.tabela{width:100%; overflow-x:auto; margin:18px 0}
table{border-collapse:collapse; width:100%; min-width:420px; font-size:15px}
th,td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--borda)}
th{color:var(--suave); font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:.04em}
td.num{font-family:'JetBrains Mono',monospace; font-variant-numeric:tabular-nums}
tr.bom td{color:var(--verde)}
tr.ruim td{color:var(--vermelho)}

.cta{margin-top:40px; text-align:center; background:var(--fundo2); border:1px solid var(--borda); border-radius:20px; padding:28px 20px}
.cta h2{margin-top:0}
.cta .acoes{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:16px}

footer{border-top:1px solid var(--borda); padding:26px 0 40px; color:var(--apagado); font-size:14px}
footer .env{max-width:1100px; display:flex; flex-wrap:wrap; gap:10px 20px; align-items:center; justify-content:space-between}
footer a{color:var(--suave); text-decoration:none}
footer .links{display:flex; flex-wrap:wrap; gap:8px 18px}

@media (max-width:520px){
  nav .btn.mini span{display:none}
  .lead{font-size:16px}
}