/* ==========================================================================
   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 "Navy & Ouro", Pantone Neon Navy 20-0142 TPM + Pantone 7407 C) ----------
     Regra de uso: branco e palco como base, navy no cabeçalho, vitrine e rodapé,
     dourado SÓ em ação e destaque (botões principais, palavra do título, barrinha
     de seção, selos). Dourado não é cor de fundo de bloco. */
  --cor-marca: #131936;            /* Neon Navy: barra de categorias, banners, botões secundários */
  --cor-marca-profunda: #0b0f24;   /* navy profundo: rodapé e hover */
  --cor-destaque: #c5a253;         /* ouro Pantone 7407 C: cor de AÇÃO (botões principais, inclusive os de WhatsApp) e destaque */
  --cor-destaque-viva: #d6b86a;    /* ouro claro: hover e brilhos da logo */
  --cor-destaque-texto: #7d6324;   /* ouro escuro: único dourado permitido em TEXTO sobre fundo claro (contraste 5,5:1 no branco) */
  --cor-fundo: #ffffff;            /* fundo geral */
  --cor-superficie: #ffffff;       /* cabeçalho (a logo tem fundo branco) e cartões */
  --cor-palco: #f6f3eb;            /* faixas claras e fundo de apoio: marfim quente, do ouro */
  --cor-texto: #161a2b;            /* texto principal: quase navy */
  --cor-texto-suave: #5b6070;      /* texto de apoio */
  --cor-linha: #e4dfd2;            /* bordas */
  --cor-sobre-marca: #ffffff;      /* texto sobre o navy */
  --cor-sobre-marca-suave: #c9cede;/* texto de apoio sobre o navy */
  --cor-sobre-destaque: #131936;   /* texto sobre o dourado: navy, nunca branco */

  /* Verde do próprio WhatsApp: SÓ no botão flutuante, igual em qualquer paleta.
     Os demais botões de WhatsApp usam o dourado da marca (ver .botao--whats em site.css). */
  --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;
}