/*
  Estilo das páginas de documento (privacidade, termos, aviso ao morador).

  Separado do index.html de propósito: a página de vendas é uma peça só, com
  seções largas e cores fortes; documento jurídico quer o contrário — coluna
  estreita, muito respiro entre parágrafos e contraste alto. Misturar os dois
  faria a política herdar animações e gradientes que atrapalham a leitura.

  A paleta e a fonte são as MESMAS do site (mesmas variáveis, mesma Inter
  servida daqui), para o documento não parecer de outra empresa.
*/

@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fontes/inter-400.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fontes/inter-500.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('/fontes/inter-600.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fontes/inter-700.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 800; font-display: swap; src: url('/fontes/inter-800.woff2') format('woff2'); }

:root {
  --verde: #25d366;
  --verde-escuro: #128c7e;
  --verde-profundo: #075e54;
  --tinta: #0b1a17;
  --tinta-suave: #3d514c;
  --fundo: #ffffff;
  --fundo-suave: #f2f7f5;
  --borda: #dbe7e3;
  --raio: 14px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: 'Inter', -apple-system, 'Segoe UI', sans-serif;
  color: var(--tinta);
  background: var(--fundo);
  /* 1.7 e generoso de proposito: texto juridico e denso, e linha apertada faz
     o olho perder a linha no meio de um paragrafo longo. */
  line-height: 1.7;
  font-size: 17px;
}

.topo {
  border-bottom: 1px solid var(--borda);
  background: var(--fundo);
  padding: 18px 0;
}

.envelope { max-width: 760px; margin: 0 auto; padding: 0 22px; }

.topo .envelope { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.topo img { height: 46px; width: auto; display: block; }
.topo nav { display: flex; gap: 18px; font-size: 15px; flex-wrap: wrap; }
.topo nav a { color: var(--tinta-suave); text-decoration: none; }
.topo nav a:hover, .topo nav a[aria-current="page"] { color: var(--verde-escuro); text-decoration: underline; }

main { padding: 46px 0 80px; }

h1 { font-size: 34px; line-height: 1.25; margin: 0 0 6px; letter-spacing: -.02em; }
h2 { font-size: 22px; line-height: 1.3; margin: 44px 0 12px; letter-spacing: -.01em; }
h3 { font-size: 18px; margin: 28px 0 8px; }

.data { color: var(--tinta-suave); font-size: 15px; margin: 0 0 30px; }

p, li { color: var(--tinta); }
ul, ol { padding-left: 22px; }
li { margin: 7px 0; }

a { color: var(--verde-escuro); }

strong { font-weight: 600; }

/* Blocos de destaque. O `.chave` e para a informacao que a pessoa veio
   procurar e nao deveria ter que cacar no meio do texto. */
.chave {
  background: var(--fundo-suave);
  border-left: 4px solid var(--verde);
  border-radius: 0 var(--raio) var(--raio) 0;
  padding: 16px 20px;
  margin: 22px 0;
}
.chave p:first-child { margin-top: 0; }
.chave p:last-child { margin-bottom: 0; }

table {
  width: 100%;
  border-collapse: collapse;
  margin: 18px 0;
  font-size: 15.5px;
}
th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--borda); vertical-align: top; }
th { background: var(--fundo-suave); font-weight: 600; }

/* Tabela larga em tela estreita rola dentro da propria caixa — a pagina nunca
   rola de lado, que e o defeito classico de documento com tabela no celular. */
.rolavel { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.rolavel table { min-width: 520px; }

footer {
  border-top: 1px solid var(--borda);
  padding: 30px 0 50px;
  color: var(--tinta-suave);
  font-size: 15px;
}
footer nav { display: flex; gap: 18px; flex-wrap: wrap; margin-bottom: 12px; }

@media (max-width: 640px) {
  body { font-size: 16px; }
  h1 { font-size: 27px; }
  h2 { font-size: 20px; }
  main { padding: 32px 0 60px; }
}

/* Impressao: sindico e advogado imprimem documento juridico. Sem isto o
   cabecalho de navegacao e o rodape de links vao para o papel sem serventia. */
@media print {
  .topo nav, footer nav, .nao-imprime { display: none; }
  body { font-size: 12pt; line-height: 1.5; }
  a { color: inherit; text-decoration: none; }
  h2 { page-break-after: avoid; }
  table { page-break-inside: avoid; }
}
