:root {
  --fundo: #ffffff;
  --fundo-caixa: #f6f8fa;
  --fundo-destaque: #eef4ff;
  --texto: #1a1d21;
  --texto-suave: #55606b;
  --borda: #d8dee5;
  --acento: #0b5cad;
  --largura: 46rem;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --fundo: #14171a;
    --fundo-caixa: #1c2126;
    --fundo-destaque: #182430;
    --texto: #e8eaed;
    --texto-suave: #a4aeb8;
    --borda: #2c333a;
    --acento: #6fb3f2;
  }
}
:root[data-theme="dark"] {
  --fundo: #14171a;
  --fundo-caixa: #1c2126;
  --fundo-destaque: #182430;
  --texto: #e8eaed;
  --texto-suave: #a4aeb8;
  --borda: #2c333a;
  --acento: #6fb3f2;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--fundo);
  color: var(--texto);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif;
  font-size: 17px;
  line-height: 1.65;
  -webkit-text-size-adjust: 100%;
}
.envelope { max-width: var(--largura); margin: 0 auto; padding: 2.5rem 1.25rem 4rem; }
header.capa { border-bottom: 2px solid var(--borda); padding-bottom: 1.5rem; margin-bottom: 2rem; }
.rotulo {
  font-size: .75rem; letter-spacing: .09em; text-transform: uppercase;
  color: var(--texto-suave); font-weight: 600; margin: 0 0 .4rem;
}
h1 { font-size: 1.9rem; line-height: 1.25; margin: 0 0 .6rem; font-weight: 700; }
.subtitulo { color: var(--texto-suave); margin: 0; font-size: .95rem; }
.resumo {
  background: var(--fundo-destaque);
  border: 1px solid var(--borda);
  border-radius: 10px;
  padding: 1.1rem 1.25rem;
  margin: 2rem 0;
}
.resumo h2 { font-size: .8rem; text-transform: uppercase; letter-spacing: .07em;
             margin: 0 0 .75rem; color: var(--texto-suave); border: 0; padding: 0; }
.resumo dl { margin: 0; display: grid; grid-template-columns: minmax(9rem, auto) 1fr; gap: .45rem 1rem; }
.resumo dt { font-weight: 600; color: var(--texto-suave); font-size: .9rem; }
.resumo dd { margin: 0; font-size: .95rem; overflow-wrap: anywhere; }
/* Alvo de toque isolado precisa de 24px, pela WCAG 2.5.8. Estes links ficavam
   com 18px de altura: a caixa clicavel era menor que a polpa do dedo, e errar
   o e-mail do encarregado num documento de privacidade e falha de acesso a
   direito. Links dentro de frase corrida sao isentos pela propria norma e
   continuam como estao. */
.resumo dd a { display: inline-block; min-height: 24px; line-height: 24px; }
@media (max-width: 34rem) {
  .resumo dl { grid-template-columns: 1fr; gap: .15rem; }
  .resumo dd { margin-bottom: .5rem; }
}
h2 {
  font-size: 1.2rem; margin: 2.5rem 0 .85rem; padding-top: .4rem;
  border-top: 1px solid var(--borda); font-weight: 700;
}
h3 { font-size: 1rem; margin: 1.6rem 0 .5rem; font-weight: 650; }
p { margin: 0 0 .9rem; }
ul { margin: 0 0 1rem; padding-left: 1.3rem; }
li { margin-bottom: .35rem; }
a { color: var(--acento); }
.caixa {
  background: var(--fundo-caixa); border: 1px solid var(--borda);
  border-radius: 8px; padding: 1rem 1.15rem; margin: 1rem 0;
}
.caixa p:last-child { margin-bottom: 0; }
.nota { font-size: .9rem; color: var(--texto-suave); }
table { width: 100%; border-collapse: collapse; margin: 1rem 0; font-size: .93rem; }
th, td { text-align: left; padding: .6rem .7rem; border-bottom: 1px solid var(--borda);
         vertical-align: top; }
th { font-weight: 650; color: var(--texto-suave); font-size: .82rem;
     text-transform: uppercase; letter-spacing: .04em; }
.rolagem { overflow-x: auto; }
footer.rodape {
  margin-top: 3rem; padding-top: 1.25rem; border-top: 1px solid var(--borda);
  font-size: .88rem; color: var(--texto-suave);
}
@media print {
  body { font-size: 11pt; background: #fff; color: #000; }
  .envelope { max-width: none; padding: 0; }
  h2 { page-break-after: avoid; }
}
