/* ══════════════════════════════════════════════════════════════════
   SayMe Business — páginas legais
   Um documento para ser lido, não uma peça de marketing.
══════════════════════════════════════════════════════════════════ */
:root{
  --tinta:#0d1f3c;
  --tinta-70:#3d4f6b;
  --tinta-45:#7c8ba3;
  --papel:#fbfcfd;
  --linha:#e3e9f0;
  --ciano:#00c2e0;
  --ciano-esc:#0086a0;
  --ambar:#f59e0b;
  --ambar-fundo:#fff8ec;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
@media(prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }
body{
  margin:0;background:var(--papel);color:var(--tinta);
  font:400 16px/1.65 Inter,system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;
}

/* ── topo ── */
.topo{
  position:sticky;top:0;z-index:20;background:var(--tinta);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.topo-in{
  max-width:1120px;margin:0 auto;padding:14px 28px;
  display:flex;align-items:center;gap:18px;
}
.topo img{height:26px;display:block}
.topo nav{margin-left:auto;display:flex;gap:22px;flex-shrink:0}
.topo nav a{
  color:rgba(255,255,255,.72);text-decoration:none;font-size:.88rem;
  padding:4px 0;border-bottom:1.5px solid transparent;
}
.topo nav a:hover,.topo nav a:focus-visible{color:#fff;border-color:var(--ciano)}
.topo nav a[aria-current]{color:#fff;border-color:var(--ciano)}

/* ── estrutura ── */
.folha{max-width:1120px;margin:0 auto;padding:0 28px 96px;
  display:grid;grid-template-columns:236px 1fr;gap:56px}

.capa{grid-column:1/-1;padding:64px 0 34px;border-bottom:1px solid var(--linha)}
.capa h1{
  font:600 clamp(2.1rem,4.4vw,3.1rem)/1.08 Newsreader,Georgia,serif;
  letter-spacing:-.015em;margin:0 0 14px;max-width:20ch;
}
.capa p{font-size:1.02rem;color:var(--tinta-70);max-width:62ch;margin:0}
.capa .datas{margin-top:22px;display:flex;gap:26px;flex-wrap:wrap;
  font-size:.82rem;color:var(--tinta-45)}
.capa .datas b{color:var(--tinta);font-weight:600}

/* ── índice ── */
.indice{position:sticky;top:104px;align-self:start;padding-top:40px}
.indice ol{list-style:none;margin:0;padding:0;border-left:1px solid var(--linha)}
.indice a{
  display:block;padding:7px 0 7px 15px;margin-left:-1px;
  border-left:2px solid transparent;
  color:var(--tinta-70);text-decoration:none;font-size:.85rem;line-height:1.35;
}
.indice a:hover{color:var(--tinta)}
.indice a.ativo{color:var(--tinta);font-weight:600;border-left-color:var(--ciano)}

/* ── documento ── */
.doc{padding-top:40px;max-width:70ch}
.doc section{margin-bottom:52px;scroll-margin-top:96px}
.doc h2{
  font:600 1.42rem/1.25 Newsreader,Georgia,serif;letter-spacing:-.01em;
  margin:0 0 4px;display:flex;gap:14px;align-items:baseline;
}
.doc h2 .num{
  font:500 .95rem/1 Inter,sans-serif;color:var(--ciano-esc);
  flex-shrink:0;width:22px;
}
.resumo{
  font:400 1.06rem/1.6 Newsreader,Georgia,serif;color:var(--tinta-70);
  margin:0 0 18px 36px;padding-left:14px;border-left:2px solid var(--linha);
}
.doc h3{font:600 .96rem/1.4 Inter,sans-serif;margin:24px 0 6px 36px}
.doc p,.doc ul,.doc ol.itens{margin:0 0 13px 36px;font-size:.94rem;color:var(--tinta-70)}
.doc li{margin-bottom:5px}
.doc b,.doc strong{color:var(--tinta);font-weight:600}
.doc a{color:var(--ciano-esc)}

.destaque{
  margin:0 0 18px 36px;padding:15px 18px;border-radius:2px;
  background:var(--ambar-fundo);border-left:3px solid var(--ambar);
  font-size:.93rem;color:var(--tinta);
}
.destaque b{display:block;margin-bottom:5px}

.tabela{width:100%;border-collapse:collapse;margin:0 0 16px 36px;font-size:.9rem}
.tabela th,.tabela td{text-align:left;padding:9px 12px 9px 0;
  border-bottom:1px solid var(--linha);vertical-align:top}
.tabela th{font-weight:600;font-size:.8rem;color:var(--tinta-45)}

.pe{grid-column:1/-1;border-top:1px solid var(--linha);padding-top:26px;
  font-size:.84rem;color:var(--tinta-45);display:flex;gap:28px;flex-wrap:wrap}
.pe a{color:var(--ciano-esc)}

@media(max-width:560px){
  .topo-in{padding:12px 20px;gap:12px}
  .topo img{height:22px}
  .topo nav{gap:14px}
  .topo nav a{font-size:.8rem}
}
@media(max-width:900px){
  .folha{grid-template-columns:1fr;gap:0;padding:0 20px 72px}
  .indice{position:static;padding:26px 0 0}
  .indice ol{display:flex;flex-wrap:wrap;gap:4px 0;border-left:none;
    border-top:1px solid var(--linha);padding-top:14px}
  .indice a{padding:5px 12px 5px 0;border-left:none;font-size:.82rem}
  .indice a.ativo{border-left:none;text-decoration:underline;text-decoration-color:var(--ciano)}
  .doc{padding-top:26px}
  .doc h2{gap:10px}
  .resumo,.doc p,.doc ul,.doc h3,.destaque,.tabela{margin-left:0}
  .capa{padding-top:42px}
}