/* ==========================================================================
   Conteúdo jurídico (/privacidade/, /en/privacy/ e 404.html)
   --------------------------------------------------------------------------
   As páginas de conteúdo jurídico passaram a usar o design system v2
   (fontes.css + site-v2.css + rodape.css). Este arquivo só COMPLETA o que
   o v2 não cobre para esse bloco de texto.

   Regra da casa: nada aqui cria token novo. Tudo usa os tokens já
   definidos no design system e documentados em docs/DESIGN_SYSTEM.md.

   O bloco `.legal` do site-v2.css (linha ~1928) já define H1, H2, H3,
   parágrafo, lista e a meta `.updated` com os tokens da escala. O que
   faltava era só a redução progressiva do H1 no mobile, a entrelinha da
   meta e a medida de linha do item de lista — descritas abaixo.
   ========================================================================== */

/* O H1 jurídico fica dentro de `.section`, não de `.hero` — por isso a regra
   global que reduz o H1 no mobile (`.hero h1`) não alcança ele. Sem estas
   duas regras o título ficaria com 48px no celular, acima da escala.

   A redução é progressiva e idêntica à do H1 do hero: 48px → 36px (≤600px)
   → 32px (≤400px). Mesmo par de breakpoints e mesmos tokens do resto do
   site, para o H1 não dar um salto diferente em cada página. */
@media (max-width: 600px) {
  .legal h1 {
    font-size: 2.25rem;
    line-height: 1.18;
  }
}
@media (max-width: 400px) {
  .legal h1 {
    font-size: var(--fs-32);
    line-height: var(--lh-32);
  }
}

/* A meta de atualização é uma legenda (14px), não texto corrido. A
   entrelinha de texto corrido (1,60) deixaria o vão da data grande demais;
   a de título (1,30) apertaria a linha. A de etiqueta (1,40) é o valor
   do briefing para legenda. */
.legal .updated {
  line-height: var(--lh-14);
}

/* A medida de linha do texto corrido (`--measure-corpo`, 34em) é aplicada
   no `p` global, mas o `li` do conteúdo jurídico ficava sem limite: a lista
   ocupava a largura toda do bloco `.legal` (46rem) e dava 88 caracteres por
   linha — acima da faixa de 55–75 do design system.

   Aqui o item da lista recebe o mesmo teto do parágrafo, com o mesmo token.
   O `li` fica com 544px (34em a 16px) e a lista desce para ~70 caracteres
   por linha, igual ao texto corrido. */
.legal li {
  max-width: var(--measure-corpo);
}