/* Folha compartilhada pelas páginas /termos e /privacidade.
   Mesmos tokens da landing, só que sem nada de animação: aqui o que importa é
   ler. Servida estática pelo nginx, antes do catch-all do SPA. */
:root{
  --maxw:1180px;
  --bg:#fff; --bg-soft:#f6f7f9; --bg-tile:#fbfbfc;
  --ink:oklch(0.2178 0.0129 237.5); --ink-2:oklch(0.3407 0.0117 236.9);
  --muted:oklch(0.5288 0.0083 230.88);
  --line:oklch(0.9235 0.0017 230.69); --line-2:oklch(0.8744 0.0036 230.7);
  --brand:oklch(0.624 0.185 257); --brand-ink:oklch(0.52 0.19 257);
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:oklch(0.1794 0.0171 248.4); --bg-soft:oklch(0.2188 0.0176 248.2);
    --bg-tile:oklch(0.2062 0.0176 248.3);
    --ink:oklch(0.9612 0.0054 247.9); --ink-2:oklch(0.8604 0.0098 247.8);
    --muted:oklch(0.6761 0.0167 247.6);
    --line:oklch(0.3011 0.0197 248); --line-2:oklch(0.3677 0.0216 248);
    --brand:oklch(0.707 0.159 257); --brand-ink:oklch(0.78 0.14 257);
  }
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }
body{margin:0;background:var(--bg);color:var(--ink);line-height:1.62;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  -webkit-font-smoothing:antialiased}
a{color:var(--brand-ink);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

header{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--bg) 86%,transparent);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid transparent;transition:border-color .25s ease}
header.scrolled{border-bottom-color:var(--line)}
.nav{display:flex;align-items:center;gap:16px;height:64px}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;letter-spacing:-.02em;
  font-size:17px;color:var(--ink)}
.logo:hover{text-decoration:none}
.logo img{width:26px;height:26px;display:block}
.nav .sp{margin-left:auto}
.nav a.back{font-size:14px;font-weight:600;color:var(--muted)}

main{padding:46px 0 10px}
.doc{max-width:74ch;margin:0 auto}
.eyebrow{display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--brand-ink);margin:0 0 10px}
h1{font-size:clamp(30px,5vw,46px);line-height:1.08;letter-spacing:-.035em;
  font-weight:800;margin:0 0 14px}
.lead{font-size:18px;color:var(--muted);margin:0 0 10px}
.upd{font-size:13px;color:var(--muted);margin:0 0 30px}
.upd b{color:var(--ink-2);font-weight:650}

/* índice */
.toc{border:1px solid var(--line);border-radius:14px;background:var(--bg-tile);
  padding:16px 20px;margin:0 0 40px}
.toc p{margin:0 0 9px;font-size:12px;font-weight:800;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted)}
.toc ol{margin:0;padding-left:20px;columns:2;column-gap:28px;font-size:14.5px}
.toc li{margin:0 0 5px;break-inside:avoid}
.toc a{color:var(--ink-2)}
@media(max-width:620px){ .toc ol{columns:1} }

h2{font-size:21px;line-height:1.25;letter-spacing:-.02em;font-weight:750;
  margin:40px 0 12px;scroll-margin-top:84px}
h2 .n{color:var(--muted);font-weight:650;margin-right:9px}
h3{font-size:16px;font-weight:700;margin:24px 0 8px}
p{margin:0 0 14px;color:var(--ink-2)}
ul{margin:0 0 14px;padding-left:22px;color:var(--ink-2)}
li{margin:0 0 7px}
strong{color:var(--ink);font-weight:650}

/* destaque: o que a gente NÃO faz, que é o que mais importa aqui */
.note{border:1px solid var(--line);border-left:3px solid var(--brand);
  border-radius:0 12px 12px 0;background:var(--bg-soft);padding:14px 18px;margin:0 0 18px}
.note p:last-child{margin:0}

table{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:14.5px;display:block;overflow-x:auto}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:var(--muted);white-space:nowrap}
td{color:var(--ink-2)}
td code{font-size:13px}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13.5px;
  background:var(--bg-soft);border:1px solid var(--line);border-radius:5px;padding:1px 5px}

footer{border-top:1px solid var(--line);margin-top:56px;padding:26px 0 40px;
  font-size:13.5px;color:var(--muted)}
footer .fl{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center}
footer .sp{margin-left:auto}
@media(max-width:620px){ footer .sp{margin-left:0;width:100%} }
