/* ==========================================================================
   IDENTIDADE VISUAL — BLOCO ÚNICO
   Para trocar cores e fontes do site inteiro, altere SOMENTE este arquivo:
   1) as variáveis dentro de :root e
   2) a constante FONTES_URL em _ferramentas/gerar-paginas.mjs (famílias do Google Fonts).
   Dica: o seletor de identidade (canto inferior esquerdo da tela) tem o botão
   "Copiar bloco CSS", que gera este bloco pronto com a combinação escolhida.
   ========================================================================== */

:root {
  /* ---------- Cores (paleta "Verde & Ouro", tirada da logo) ---------- */
  --cor-marca: #374a13;            /* verde da logo: barra de categorias, banners, botões secundários */
  --cor-marca-profunda: #263510;   /* verde mais escuro: rodapé e hover */
  --cor-destaque: #f3aa1c;         /* dourado da logo: destaques e botões de apoio */
  --cor-destaque-viva: #ffc044;    /* dourado claro: hover */
  --cor-destaque-texto: #7a5200;   /* dourado escuro: único dourado permitido em TEXTO sobre fundo claro */
  --cor-fundo: #ffffff;            /* fundo geral */
  --cor-superficie: #ffffff;       /* cabeçalho (a logo tem fundo branco) e cartões */
  --cor-palco: #f3f5ee;            /* faixas claras e fundo de apoio */
  --cor-texto: #1c2211;            /* texto principal */
  --cor-texto-suave: #565d48;      /* texto de apoio */
  --cor-linha: #dfe3d6;            /* bordas */
  --cor-sobre-marca: #ffffff;      /* texto sobre o verde */
  --cor-sobre-marca-suave: #dbe3c8;/* texto de apoio sobre o verde */
  --cor-sobre-destaque: #1c2211;   /* texto sobre o dourado */

  /* Botões de WhatsApp: verde do próprio WhatsApp, igual em qualquer paleta */
  --cor-whats: #25d366;
  --cor-whats-viva: #3fe27c;
  --cor-sobre-whats: #06280f;

  /* ---------- Fontes (par "Montserrat + Mulish") ---------- */
  --fonte-titulo: 'Montserrat', 'Segoe UI', system-ui, sans-serif;
  --fonte-texto: 'Mulish', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --peso-titulo: 800;              /* peso dos títulos */
  --titulo-entrelinha: 1.1;
  --titulo-espacamento: -0.02em;

  /* ---------- Logo (trocar a imagem não quebra o layout) ---------- */
  --logo-altura: 44px;             /* altura no celular */
  --logo-altura-grande: 60px;      /* altura no desktop */
  --logo-largura-maxima: 200px;
}
