/* Páginas institucionais — quem-somos, privacidade, termos.
   Antes cada uma trazia ~2,3 KB de CSS inline, copiado três vezes, com o
   `--verde-medio` antigo (#648267) que reprovava AA sobre branco. Aqui é uma
   folha só: o que era triplicado vira base, e o que é próprio de cada página
   entra por classe no `<body>`.

   Medida de leitura: 590px. Medido com canvas sobre a fonte real, dá ~74
   caracteres por linha. O `max-width:72ch` que existia dava 843px e 104
   caracteres — a linha mais longa do site inteiro. */

:root{
  /* A paleta, os raios, o movimento e as sombras vêm de `/tokens.css`, que
     estas páginas carregam ANTES desta folha. Aqui fica só o que é próprio da
     família institucional: a medida de leitura. */
  --doc-medida:590px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
body{background:var(--papel);color:var(--tinta);font-family:var(--font-sans);
  line-height:1.65;min-height:100vh;display:flex;flex-direction:column}
::selection{background:var(--verde-muito-claro)}
:focus-visible{outline:2px solid var(--verde);outline-offset:2px;border-radius:var(--radius-md)}
a{color:var(--verde);text-underline-offset:3px}
a:hover{color:var(--verde-fundo)}
.container{width:100%;max-width:1120px;margin:0 auto;padding:0 1.5rem}
.logo-link img{border-radius:var(--radius-xl)}
main{flex:1;padding:2.2rem 0 4.5rem}

/* ── A COLUNA ───────────────────────────────────────────────────────────
   `.doc` é a medida; tudo que é texto mora nela. As páginas legais usam só
   isto. O quem-somos acrescenta a capa e a faixa das recusas por cima. */
.doc{max-width:var(--doc-medida);margin:0 auto}
.doc > *{max-width:100%}

h1{font-family:var(--font-serif);font-size:clamp(1.7rem,4vw,2.3rem);font-weight:500;
  letter-spacing:-.025em;line-height:1.2;margin-bottom:.6rem;text-wrap:balance}
h1 em{font-style:italic;color:var(--verde)}
.lead{font-size:1.02rem;color:var(--tinta-70);margin-bottom:2rem;
  padding-bottom:1.25rem;border-bottom:1px solid var(--linha);text-wrap:pretty}
.atualizado{font-size:.8rem;color:var(--tinta-55);margin-bottom:2rem;
  padding-bottom:1.25rem;border-bottom:1px solid var(--linha)}

h2{font-family:var(--font-serif);font-size:1.25rem;font-weight:600;
  margin:2.25rem 0 .7rem;letter-spacing:-.01em;scroll-margin-top:100px}
h3{font-size:.95rem;font-weight:700;margin:1.5rem 0 .4rem;scroll-margin-top:100px}
p{margin-bottom:.9rem;text-wrap:pretty}
ul{margin:0 0 1rem 1.15rem}
li{margin-bottom:.45rem}

/* ── CAIXAS ─────────────────────────────────────────────────────────────
   Três papéis de cor, os mesmos do resto do site: atenção, confirmação e
   pendência. Nenhuma cor nova. */
.recusa{border:1px solid var(--leitura-borda);background:var(--leitura-bg);
  border-radius:var(--radius-md);padding:1rem 1.15rem;margin:1.25rem 0}
.recusa p{margin-bottom:.5rem;color:var(--leitura);font-size:.9rem}
.recusa p:last-child{margin-bottom:0}
.recusa b{font-weight:700}

/* `.campo` saiu daqui em 31/10: era a caixa do bloco "A preencher pelo
   responsável" do quem-somos, que saiu da página por ser nota interna e não
   conteúdo de leitor. O `fila.html` tem o seu próprio `.campo`, em `fila.css`. */

.ok{background:var(--confirma-bg);border:1px solid var(--confirma-borda);
  border-radius:var(--radius-md);padding:1rem 1.15rem;margin:1.25rem 0;
  font-size:.9rem;color:var(--confirma);line-height:1.6}
.ok b{font-weight:700}

.destaque{background:var(--leitura-bg);border:1px solid var(--leitura-borda);
  border-radius:var(--radius-md);padding:1rem 1.15rem;margin:1.25rem 0;
  font-size:.9rem;color:var(--leitura);line-height:1.6}
.destaque b{font-weight:700}

table{width:100%;border-collapse:collapse;margin:1rem 0 1.25rem;font-size:.86rem}
th,td{text-align:left;padding:.6rem .7rem;border-bottom:1px solid var(--linha);vertical-align:top}
th{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--tinta-55);font-weight:700}
td:first-child{font-weight:600;white-space:nowrap}

/* ── QUEM SOMOS ─────────────────────────────────────────────────────────
   Esta é a página que diz o que o site é. Ela não podia ter a mesma cara de
   um contrato de uso. Duas coisas mudam aqui, e só elas:

   1. A capa escura — o mesmo gesto de abertura de conteúdo do carrossel da
      home, do índice de guias e das páginas de guia.
   2. As recusas ganham a superfície pesada. É o conteúdo mais próprio do
      site: o que ele se recusa a fazer. Antes eram três parágrafos num
      retângulo bege, do mesmo tamanho de tudo o mais. */

.eyebrow{display:inline-block;line-height:1;position:relative;padding-left:26px;
  font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--verde)}
.eyebrow::before{content:'';position:absolute;left:0;top:50%;width:18px;height:1px;
  margin-top:-.5px;background:currentColor}

.capa{position:relative;overflow:hidden;
  max-width:var(--doc-medida);margin:0 auto 2.6rem;
  background:var(--verde-fundo);border-radius:var(--radius-lg);
  padding:2.6rem 2.8rem 2.4rem}
.capa::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 110% at 100% 0%,rgba(198,169,114,.14),transparent 62%)}
.capa > *{position:relative;z-index:1}
.capa .eyebrow{color:var(--ouro-claro);margin-bottom:1rem}
.capa .eyebrow::before{background:currentColor}
.capa h1{font-size:clamp(1.85rem,4.1vw,2.55rem);font-weight:500;line-height:1.15;
  letter-spacing:-.03em;color:#fff;margin-bottom:0;text-wrap:balance}
.capa h1 em{font-style:italic;color:var(--ouro-claro)}
.capa .lead{font-size:1rem;line-height:1.62;color:rgba(244,239,228,.72);max-width:none;
  margin:1rem 0 0;padding:0;border-bottom:0;text-wrap:pretty}

/* A faixa. Escura, na mesma medida da coluna, com o rótulo dentro — o h2
   deixou de ser um título solto em cima de uma caixa. */
.recusas{position:relative;overflow:hidden;
  max-width:var(--doc-medida);margin:2.6rem auto;
  background:var(--verde-fundo);border-radius:var(--radius-lg);
  padding:2.1rem 2.4rem 2.2rem;counter-reset:recusa}
.recusas::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 110% at 0% 0%,rgba(198,169,114,.12),transparent 60%)}
.recusas > *{position:relative;z-index:1}
.recusas h2{font-size:1.15rem;font-weight:600;margin:0 0 1.35rem;
  color:#fff;letter-spacing:-.012em}
.recusas .recusa{background:none;border:0;border-radius:0;
  padding:0;margin:0;counter-reset:none}
/* Cada recusa é uma linha numerada. O número em mono é a voz de dado da casa,
   a mesma do preço e do card de guia — aqui ela marca uma posição, não uma
   quantidade. */
.recusas .recusa p{counter-increment:recusa;
  position:relative;padding-left:2.5rem;margin:0 0 1.15rem;
  font-size:.92rem;line-height:1.62;color:rgba(244,239,228,.72)}
.recusas .recusa p:last-child{margin-bottom:0}
.recusas .recusa p::before{content:counter(recusa,decimal-leading-zero);
  position:absolute;left:0;top:.12rem;
  font-family:var(--font-data);font-size:.72rem;font-weight:700;
  letter-spacing:.05em;color:var(--ouro-claro);font-variant-numeric:tabular-nums}
.recusas .recusa p + p{padding-top:1.15rem;
  border-top:1px solid rgba(255,255,255,.13)}
.recusas .recusa b{font-weight:700;color:#fff}

@media (max-width:700px){
  main{padding:1.4rem 0 3.5rem}
  .capa{padding:1.9rem 1.35rem 1.75rem;margin-bottom:1.9rem}
  .capa h1{font-size:1.62rem}
  .recusas{padding:1.6rem 1.3rem 1.7rem;margin:1.9rem auto}
  .recusas .recusa p{padding-left:2.1rem;font-size:.88rem}
}
@media (max-width:600px){
  td:first-child{white-space:normal}
}

/* O rodapé destas páginas é mais estreito que a vitrine (1360px): a
   coluna de leitura tem 1120px. Antes isto vinha de um
   `<style>:root{...}</style>` inline em cada página; virou regra aqui
   para o CSP poder fechar `style-src-elem`. */
:root{--rodape-largura:1120px}