/* Por Dentro da Coisa · páginas legais (/termos/, /privacidade/ e /cookies/), montadas por 8-funil\ferramentas\gerar-paginas-legais.js.
   Layout de leitura da marca: título no escuro, texto no papel, na medida de leitura (62 caracteres).
   O cabeçalho fixo e o rodapé vêm do venda.css e do componentes.css, os mesmos da página de venda. */

.leg-logo { display: flex; margin-right: auto; }
.leg-logo picture { margin-right: 0; }

.leg-topo { padding-block: 40px 48px; }
.leg-topo .pdc-titulo { margin-top: 14px; }
.leg-data { margin-top: 16px; font: 500 12px/1.5 var(--pdc-f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--pdc-cinza); }
.leg-docs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.leg-docs a { display: inline-flex; align-items: center; min-height: 36px; padding: 6px 14px; border: 1px solid var(--pdc-linha); border-radius: 999px; font: 700 12px/1 var(--pdc-f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--pdc-texto-2); text-decoration: none; }
.leg-docs a:hover { border-color: var(--pdc-cinza); }
.leg-docs a[aria-current="page"] { border-color: var(--pdc-vermelho); color: var(--pdc-branco); background: var(--pdc-vermelho-suave); }

.leg-texto { max-width: var(--pdc-medida); font-size: 17px; line-height: 1.7; }
.leg-texto > * + * { margin-top: 1em; }
.leg-texto h2 { margin-top: 2.2em; font: 800 21px/1.25 var(--pdc-f-texto); color: var(--pdc-cor-titulo); }
.leg-texto > h2:first-child { margin-top: 0; }
.leg-texto h3 { margin-top: 1.6em; font: 700 17px/1.35 var(--pdc-f-texto); color: var(--pdc-cor-titulo); }
.leg-texto h2 + *, .leg-texto h3 + * { margin-top: .6em; }
.leg-texto b { color: var(--pdc-cor-titulo); font-weight: 700; }
.leg-texto ul, .leg-texto ol { padding-left: 1.3em; }
.leg-texto ul { list-style: disc; }
.leg-texto ol { list-style: decimal; }
.leg-texto li + li, .leg-texto li > ul { margin-top: .45em; }
.leg-texto li::marker { color: var(--pdc-vermelho-tinta); }
.leg-texto code { font: 500 .86em/1.4 var(--pdc-f-mono); padding: .1em .35em; border-radius: 4px; background: rgba(11, 11, 15, .06); overflow-wrap: anywhere; }

/* tabela: no celular, cada linha vira um cartão (o nome da coluna em cima de cada parte); no computador, tabela normal */
.leg-tabela table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.5; }
.leg-tabela thead { display: none; }
.leg-tabela tr { display: block; padding: 6px 0; border: 1px solid var(--pdc-linha-papel); border-radius: 12px; background: var(--pdc-papel-2); }
.leg-tabela tr + tr { margin-top: 10px; }
.leg-tabela td { display: block; padding: 7px 16px; }
.leg-tabela td::before { content: attr(data-rotulo); display: block; margin-bottom: 2px; font: 700 11px/1.3 var(--pdc-f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--pdc-tinta-apoio); }
.leg-tabela td + td { border-top: 1px dashed var(--pdc-linha-papel); }

/* pendência: o que ainda falta confirmar aparece marcado e sai antes de publicar */
.pdc-pendente { padding: 0 .3em; border-radius: 4px; outline: 1px dashed currentColor; outline-offset: 1px; background: rgba(255, 59, 48, .1); color: var(--pdc-vermelho-tinta); font: 700 .8em/1.5 var(--pdc-f-mono); letter-spacing: .02em; }
.pdc-escuro .pdc-pendente { color: var(--pdc-vermelho); }

@media (min-width: 900px) {
  .leg-topo { padding-block: 64px 72px; }
  .leg-texto { font-size: 18px; }
  .leg-texto h2 { font-size: 24px; }
  .leg-tabela { overflow: hidden; border: 1px solid var(--pdc-linha-papel); border-radius: 12px; background: var(--pdc-papel-2); }
  .leg-tabela thead { display: table-header-group; }
  .leg-tabela tr { display: table-row; padding: 0; border: 0; border-radius: 0; background: none; }
  .leg-tabela td { display: table-cell; }
  .leg-tabela td::before { content: none; }
  .leg-tabela th, .leg-tabela td { padding: 12px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--pdc-linha-papel); }
  .leg-tabela td + td { border-top: 0; }
  .leg-tabela tbody tr:last-child td { border-bottom: 0; }
  .leg-tabela thead th { font: 700 11px/1.3 var(--pdc-f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--pdc-tinta-apoio); background: var(--pdc-papel); }
}
