/* Componentes das páginas do gerar.py. Só acrescenta: as 3 páginas-modelo nem carregam este arquivo. */
.rel-topo.sem-barra .nota-capa { grid-column: 1 / -1; }
.nota-capa .sobretitulo { margin: 0 0 12px; }
.capa-intro { margin-top: 28px; max-width: 760px; font-size: 19px; line-height: 29px; }
.capa-intro p { margin-bottom: .8em; }
.alerta { color: var(--erro); font-weight: 600; }
.alerta strong { color: inherit; }
.seta-c { color: var(--c10); }
.t-mini { font-family: var(--sans); font-size: 15px; line-height: 22px; font-weight: 600; color: var(--tinta); margin: 28px 0 6px; }
.corpo > .t-mini:first-child, .corpo > .ancora:first-child + .t-mini { margin-top: 0; }
.corpo .t-sub { margin: 32px 0 10px; }
.conteudo .t-mini { margin-top: 20px; }
.conteudo figure { margin: 12px 0; }
.img-corpo { max-width: 100%; }
.lista-texto { margin: 0 0 1em; padding-left: 22px; }
.lista-texto li { margin-bottom: .35em; }
ol.lista-texto { list-style: decimal; }
.corpo > .acao, .simples .acao { margin-top: 20px; }
.corpo > .texto + .texto { margin-top: 1em; }
pre { font-family: Consolas, monospace; font-size: 14px; white-space: pre-wrap; overflow-wrap: anywhere; }

/* páginas curtas: uma coluna, sem trilho, alinhada à folha do site */
.simples { max-width: calc(var(--folha) + 2 * var(--margem)); margin: 0 auto; }
.simples > .folha { max-width: calc(800px + 2 * var(--margem)); margin: 0; padding-bottom: 72px; }
.simples > .folha > * + * { margin-top: 20px; }
.simples .duas { margin-top: 24px; }
.simples .form-cadastro { margin-top: 8px; }
.simples .feat .botao { margin-top: 12px; }
.simples .embed { aspect-ratio: 16 / 9; }
.cit-corpo, .texto { overflow-wrap: anywhere; }
.cit-corpo { margin: 24px 0; padding-left: 20px; border-left: 3px solid var(--tinta); font-size: 19px; line-height: 30px; color: var(--tinta-2); }
.corpo .duas { margin-top: 20px; }
.duas .feat > *:first-child { margin-top: 0; }
.duas.tres { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.duas figure { max-width: 320px; }
.sociais { list-style: none; display: flex; gap: 24px; font-family: var(--sans); font-size: 15px; }
.campo-linha { display: flex; }
.campo-linha .pref { display: flex; align-items: center; padding: 0 12px; font-family: var(--sans); background: var(--faixa); border: 1px solid var(--borda-campo); border-right: 0; }
.marca-campo { grid-column: 1 / -1; font-family: var(--sans); font-size: 14px; color: var(--tinta-2); }

.simples .alertbar { padding-left: 0; border-left: 0; max-width: 420px; }
.simples .alertbar .folha { padding: 0; }

/* sumário do manual */
.sumario { margin-bottom: 8px; }
.sumario .rotulo { margin: 0 0 8px; }
.sumario ol { list-style: decimal; margin: 0; padding-left: 24px; font-family: var(--sans); font-size: 15px; line-height: 26px; }
.sumario ol ol { list-style: lower-alpha; }
.sumario a { color: var(--tinta); text-decoration: none; }
.sumario a:hover { color: var(--acento); text-decoration: underline; }

/* gráfico desenhado a partir dos dados da própria página */
.grafico { margin: 16px 0 24px; max-width: 760px; }
.graf-svg { display: block; width: 100%; height: auto; }
.g-grade { stroke: var(--fio); stroke-width: 1; }
.g-eixo { font-family: var(--sans); fill: var(--rotulo); }
.g-legenda { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 10px; font-family: var(--sans); font-size: 13px; line-height: 20px; color: var(--tinta-2); }
.g-cor { display: inline-block; width: 22px; height: 3px; margin-right: 8px; vertical-align: middle; }

/* tabelas */
.tabela { margin: 16px 0 8px; font-family: var(--sans); font-variant-numeric: lining-nums tabular-nums; }
.tabela table { width: 100%; border-collapse: collapse; border-top: 1px solid var(--tinta); table-layout: fixed; }
.tabela th { text-align: left; font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .04em; color: var(--rotulo); padding: 10px 12px 10px 0; border-bottom: 1px solid var(--tinta); }
.tabela td { font-size: 14px; line-height: 20px; color: var(--tinta); padding: 9px 12px 9px 0; border-bottom: 1px solid var(--fio); overflow-wrap: anywhere; }
.tabela th:last-child, .tabela td.t-mais { width: 96px; text-align: right; padding-right: 0; }
.mais { width: 44px; height: 32px; cursor: pointer; font-family: var(--sans); font-size: 16px; line-height: 1; color: var(--tinta); background: var(--papel); border: 1px solid var(--borda-campo); border-radius: 2px; }
.mais:hover { border-color: var(--tinta); color: var(--acento); }
tr.det > td { padding: 8px 0 20px; background: var(--faixa); }
tr.det dl { margin: 0; padding: 0 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
.det-item { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--fio); }
.det-item dt { font-size: 13px; color: var(--rotulo); }
.det-item dd { margin: 0; font-size: 14px; }
.det-item img { max-height: 48px; width: auto; }
.det-largo { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr); }
.det-largo img { max-height: none; width: 100%; max-width: 640px; }
.filtros { display: flex; flex-wrap: wrap; gap: 12px 20px; margin-bottom: 14px; }
.filtro { display: block; flex: 1 1 200px; font-size: 13px; line-height: 18px; font-weight: 600; color: var(--tinta); }
.filtro span { display: block; margin-bottom: 4px; }
.filtro select { width: 100%; min-height: 40px; padding: 8px; font-family: var(--sans); font-size: 15px; background: var(--papel); border: 1px solid var(--borda-campo); border-radius: 2px; color: var(--tinta); }

/* assinatura por e-mail (MailPoet) */
.assina { max-width: 640px; }
.assina figure { max-width: 80px; margin-bottom: 12px; }
.assina .t-sub { margin: 0 0 6px; }
.form-email { display: flex; gap: 12px; margin: 16px 0 12px; }
.form-email input[type=email] { flex: 1 1 auto; min-width: 0; min-height: 48px; padding: 11px 12px; font-family: var(--sans); font-size: 16px; border: 1px solid var(--borda-campo); border-radius: 2px; }
.form-email .oculto { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 900px) {
  .capa-intro { margin-top: 20px; font-size: 18px; line-height: 28px; }
  .simples > .folha { padding-bottom: 48px; max-width: none; }
  .duas.tres { grid-template-columns: minmax(0, 1fr); }
  tr.det dl { grid-template-columns: minmax(0, 1fr); }
  .tabela th:last-child, .tabela td.t-mais { width: 64px; }
  .mais { height: 44px; }
  .form-email { flex-direction: column; }
  .sociais a, .sumario a { display: inline-block; padding: 8px 0; }
}