:root{
  --tinta:#0B1020; --suave:#4B5563; --linha:#E5E7EB; --fundo:#FFFFFF;
  --azul:#2563EB; --ciano:#22D3EE;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--fundo); color:var(--tinta);
  font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--azul)}
.topo{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  max-width:960px; margin:0 auto; padding:24px 20px;
}
.topo nav a{margin-left:20px; color:var(--suave); text-decoration:none; font-size:14px}
.topo nav a:hover{color:var(--tinta)}
main{max-width:960px; margin:0 auto; padding:0 20px 40px}
.hero{padding:48px 0 8px; border-bottom:1px solid var(--linha)}
.hero h1{
  margin:0 0 16px; font-size:clamp(28px,5vw,44px); line-height:1.15; letter-spacing:-.02em;
}
.sub{max-width:60ch; color:var(--suave); font-size:18px; margin:0 0 40px}
.grade{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:32px; padding:40px 0}
.grade h2{font-size:17px; margin:0 0 8px; position:relative; padding-top:12px}
.grade h2::before{
  content:""; position:absolute; top:0; left:0; width:34px; height:3px; border-radius:2px;
  background:linear-gradient(90deg,var(--azul),var(--ciano));
}
.grade p{margin:0; color:var(--suave); font-size:15px}
.como,.contato{padding:32px 0; border-top:1px solid var(--linha)}
.como h2,.contato h2{font-size:20px; margin:0 0 16px}
.como ol{margin:0; padding-left:20px; max-width:70ch; color:var(--suave)}
.como li{margin-bottom:12px}
.como strong{color:var(--tinta)}
footer{
  border-top:1px solid var(--linha); margin-top:24px;
  max-width:960px; margin-left:auto; margin-right:auto; padding:28px 20px 56px;
  color:var(--suave); font-size:13px;
}
footer p{margin:0 0 6px}
footer .fine{margin-top:14px; font-size:12px; color:#9CA3AF}

/* páginas legais */
.legal{max-width:760px}
.legal h1{font-size:28px; margin:40px 0 8px}
.legal .atualizado{color:var(--suave); font-size:14px; margin:0 0 32px}
.legal h2{font-size:18px; margin:32px 0 8px}
.legal p,.legal li{color:#374151}
.legal table{border-collapse:collapse; width:100%; margin:12px 0; font-size:14px}
.legal th,.legal td{border:1px solid var(--linha); padding:8px 10px; text-align:left; vertical-align:top}
.legal th{background:#F9FAFB; font-weight:600}