:root{
  --papel:#FFFFFF; --fundo:#F4F3F1; --tinta:#1C1B1A; --tinta-2:#5C5955; --tinta-3:#8B8783;
  --linha:#E2DFDB; --linha-forte:#CFCAC4; --acento:#3A3734; --acento-texto:#FFFFFF; --marca:#7A2130;
  --raio:6px; --fonte:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --t-micro:11px; --t-peq:13px; --t-base:15px; --t-med:17px; --t-g:22px; --t-gg:32px;
  --e1:4px; --e2:8px; --e3:14px; --e4:22px; --e5:34px; --e6:52px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--fonte);background:var(--fundo);color:var(--tinta);font-size:var(--t-base);line-height:1.62;-webkit-font-smoothing:antialiased}

.barra{position:sticky;top:0;z-index:10;background:rgba(244,243,241,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--linha);display:flex;align-items:center;gap:var(--e3);padding:0 var(--e4);height:52px}
.voltar{color:var(--tinta-2);text-decoration:none;font-size:var(--t-peq)}
.voltar::before{content:"← ";}
.voltar:hover{color:var(--tinta)}
.atual{font-size:var(--t-peq);color:var(--tinta-3)}
.atual::before{content:"/ ";color:var(--linha-forte)}
.interno{margin-left:auto;font-size:var(--t-peq);display:none}
body[data-visao="admin"] .interno{display:block}
.interno a{color:var(--marca);text-decoration:none;border-bottom:1px solid currentColor}
.interno .sem-notion{color:#a3402f;border-bottom:1px dashed currentColor;cursor:help}

.documento{max-width:1060px;margin:0 auto;padding:var(--e5) var(--e4) var(--e6)}
.capa{padding-bottom:var(--e4);border-bottom:1px solid var(--linha);margin-bottom:var(--e5)}
.onde{font-size:var(--t-micro);letter-spacing:1.6px;text-transform:uppercase;color:var(--tinta-3);margin-bottom:var(--e2)}
.capa h1{font-size:var(--t-gg);font-weight:600;letter-spacing:-.5px;line-height:1.15;margin-bottom:var(--e2)}
.promessa{color:var(--tinta-2);max-width:640px;margin-bottom:var(--e3)}
.tags{display:flex;gap:6px;flex-wrap:wrap}
.tag{font-size:var(--t-micro);color:var(--tinta-2);background:var(--papel);border:1px solid var(--linha);border-radius:3px;padding:4px 9px}

.corpo > *{margin-bottom:var(--e3)}
.corpo h3,.corpo h4,.corpo h5{margin:var(--e5) 0 var(--e3);line-height:1.3;font-weight:600;letter-spacing:-.2px}
.corpo h3{font-size:var(--t-g)}
.corpo h4{font-size:var(--t-med)}
.corpo h5{font-size:var(--t-base)}
.corpo h3.secao{background:var(--acento);color:var(--acento-texto);padding:12px var(--e4);border-radius:var(--raio);font-size:var(--t-med)}
.corpo h3.secao-alt,.corpo h4.secao-alt{border-left:0;padding-left:0}
.corpo hr{border:0;border-top:1px solid var(--linha);margin:var(--e5) 0}
.corpo ul,.corpo ol{padding-left:var(--e4);display:grid;gap:var(--e1)}
.corpo li{color:var(--tinta-2)}
.corpo li > strong{color:var(--tinta)}
.corpo p{max-width:none}
.destaque{font-style:normal;color:var(--marca);font-weight:500}
u{text-decoration-color:var(--linha-forte);text-underline-offset:3px}

.callout{background:var(--papel);border:1px solid var(--linha);border-left:3px solid var(--linha-forte);
  border-radius:var(--raio);padding:var(--e3) var(--e4);display:grid;gap:var(--e2)}
.callout > *{margin:0;max-width:none}
.callout h4,.callout h5{margin:0 0 var(--e1)}
.callout.alerta{border-left-color:var(--marca)}

.colunas{display:flex;gap:var(--e3);align-items:flex-start}

/* Blocos lado a lado: passo a passo curto (3 a 4 itens) e listas que ficariam extensas. */
.blocos{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--e3)}
.blocos.duas{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
/* Quando um bloco e bem mais longo que os outros: os curtos empilham numa coluna e o longo fica na outra. */
.blocos.pilhas{grid-template-columns:1fr 1fr;align-items:start}
.pilha{display:grid;gap:var(--e3);align-content:start}
.bloco{background:var(--papel);border:1px solid var(--linha);border-radius:var(--raio);padding:var(--e4);display:grid;gap:var(--e2);align-content:start}
.bloco > *{margin:0;max-width:none}
.bloco h4,.bloco h5{margin:0;font-size:var(--t-med);line-height:1.3}
.bloco p,.bloco li{color:var(--tinta-2)}
.bloco p strong{color:var(--tinta)}
.coluna{min-width:0;display:grid;gap:var(--e2)}
.coluna > *{margin:0}

.dobra{background:var(--papel);border:1px solid var(--linha);border-radius:var(--raio);padding:var(--e3) var(--e4)}
.dobra summary{cursor:pointer;font-weight:600;list-style:none;display:flex;align-items:center;gap:var(--e2)}
.dobra summary::-webkit-details-marker{display:none}
.dobra summary::before{content:"▸";color:var(--tinta-3);font-size:11px}
.dobra[open] summary::before{content:"▾"}
.dobra-corpo{margin-top:var(--e3);padding-top:var(--e3);border-top:1px solid var(--linha);display:grid;gap:var(--e3)}
.dobra-corpo > *{margin:0}

.tabela{overflow-x:auto;border:1px solid var(--linha);border-radius:var(--raio);background:var(--papel)}
.tabela table{border-collapse:collapse;width:100%;font-size:var(--t-peq)}
.tabela th,.tabela td{padding:var(--e3) var(--e4);text-align:left;vertical-align:top;
  border-bottom:1px solid var(--linha);border-right:1px solid var(--linha);line-height:1.55;color:var(--tinta-2)}
.tabela th{background:var(--fundo);color:var(--tinta);font-weight:600;font-size:var(--t-micro);
  letter-spacing:1.2px;text-transform:uppercase}
.tabela tr:last-child td{border-bottom:0}
.tabela th:last-child,.tabela td:last-child{border-right:0}
.tabela tr.destacada td{background:var(--fundo);color:var(--tinta);font-weight:500}
.tabela td strong{color:var(--tinta)}

figure{margin:0}
figure img{display:block;max-width:100%;width:auto;max-height:520px;border:1px solid var(--linha);border-radius:var(--raio);background:var(--papel)}
.coluna figure img{max-height:640px}

.pe{margin-top:var(--e6);padding-top:var(--e4);border-top:1px solid var(--linha);font-size:var(--t-peq);color:var(--tinta-3)}

@media (max-width:760px){
  .colunas{flex-direction:column;gap:var(--e3)}
  .blocos,.blocos.duas,.blocos.pilhas{grid-template-columns:1fr}
  .documento{padding:var(--e4) var(--e3) var(--e5)}
}