/* ==========================================================================
   Roteiro FLH - paleta nova (18/09) para páginas de conteúdo simples
   Depende de tokens.css e styles.css, carrega por último. Usado por
   páginas fora do fluxo pago (contato.html por ora) que devem ter a
   MESMA identidade visual da capa: off-white dominante, verde-floresta
   como estrutura (cabeçalho e cartões), terracota como destaque/CTA.

   Diferente de landing.css (que faz index.html alternar seções claras e
   escuras), aqui a página inteira é clara — só os cartões ficam escuros,
   igual ao resto do site.
   ========================================================================== */

:root {
  --surface-0: #f8f9fa;
  --surface-1: #eef1ec;
  --surface-2: #113227;
  --surface-3: #16241c;

  --text-primary: #16241c;
  --text-secondary: #46554c;
  --text-muted: #6b7a6d;

  --border: #dfe6de;
  --border-strong: #c9d6c0;
  --border-amarelo: rgba(166, 58, 43, 0.32);

  --amarelo-300: #8f2f22;
  --amarelo-400: #a63a2b;
  --amarelo-500: #a63a2b;
  --amarelo-600: #8f2f22;
  --amarelo-700: #6e2419;
  --text-on-amarelo: #fdf6f4;

  background: var(--surface-0);
  color: var(--text-primary);
}

/* .header (styles.css) tem um fundo translúcido fixo, pensado pro tema
   escuro original — compartilhado com roteiro.html (que tem sua própria
   paleta em questionario-paleta.css), tabela.html etc. Este arquivo só
   carrega nas páginas que o referenciam explicitamente. */
.header {
  background: rgba(17, 50, 39, 0.9);
}