/*
 * texto.css — páginas de texto corrido (privacidade, condições)
 *
 * Carrega-se depois do zeus.css, de quem herda os tokens. Só trata do que
 * um documento longo precisa e o resto do site não tem: hierarquia de
 * títulos, listas, tabelas de dados e a medida de linha.
 *
 * A medida é estreita de propósito — 680px dá 70 a 80 caracteres por
 * linha, que é onde o olho não se perde a mudar de linha. Uma página legal
 * que ninguém consegue ler é uma página legal que não serve para nada.
 */

.documento { max-width: 680px; margin: 0 auto; padding: 48px 24px 64px; }

.documento h1 { font-size: 30px; margin-bottom: 10px; }
.documento .data {
    font-family: var(--f-mono); font-size: 13px; color: var(--muted);
    margin-bottom: 34px; display: block;
}

.documento h2 {
    font-size: 20px; margin: 38px 0 12px;
    padding-top: 22px; border-top: 1px solid var(--border);
}
.documento h2:first-of-type { border-top: 0; padding-top: 0; }
.documento h3 { font-size: 16px; margin: 22px 0 8px; }

.documento p { margin-bottom: 14px; }
.documento ul { margin: 0 0 16px 0; padding-left: 0; list-style: none; }
.documento li {
    position: relative; padding-left: 20px; margin-bottom: 8px;
}
.documento li::before {
    content: "—"; position: absolute; left: 0; color: var(--muted);
}
.documento strong { color: var(--ink); }

/* Tabela do que se recolhe: é o coração da página de privacidade e tem de
   se ler de relance, não a pente fino. */
.documento table { width: 100%; border-collapse: collapse; margin: 6px 0 20px; }
.documento th, .documento td {
    text-align: left; vertical-align: top; padding: 10px 10px 10px 0;
    border-top: 1px solid var(--border); font-size: 14.5px;
}
.documento th {
    font-size: 12px; text-transform: uppercase; letter-spacing: .5px;
    color: var(--muted); font-weight: 600; border-top: 0;
}
.documento td:first-child { color: var(--ink); font-weight: 500; width: 34%; }

/* Caixa para o que não se pode perder de vista no meio do texto. */
.documento .destaque {
    background: var(--warm-soft); border: 1px solid var(--warm-border);
    border-radius: var(--r-card); padding: 16px 18px; margin: 18px 0 22px;
}
.documento .destaque p { margin-bottom: 8px; color: var(--warm); }
.documento .destaque p:last-child { margin-bottom: 0; }
.documento .destaque strong { color: var(--warm); }

.documento .calmo {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--r-card); padding: 16px 18px; margin: 18px 0 22px;
}
.documento .calmo p:last-child { margin-bottom: 0; }

@media (max-width: 600px) {
    .documento { padding: 32px 16px 48px; }
    .documento h1 { font-size: 25px; }
    .documento td:first-child { width: 40%; }
    .documento th, .documento td { font-size: 14px; }
}
