/* ==========================================================================
   TOKENS DO SITE · Selo Brindes
   Única fonte de verdade para cores, fontes e medidas. Alterar aqui propaga
   para todos os componentes. Para outra marca: troque as cores e a fonte.
   ========================================================================== */

:root {
  /* Cores da marca */
  --cor-marca: #1C2D5A;            /* azul tinta: cabeçalho, rodapé, faixas */
  --cor-marca-profunda: #121E40;
  --cor-destaque: #E2482D;         /* vermelho carimbo: botões e chamadas */
  --cor-destaque-escura: #C23A21;
  --cor-destaque-clara: #F06A4F;
  --cor-destaque-rgb: 226, 72, 45;
  --cor-mostarda: #F2B33D;         /* selos e faixa superior */
  --cor-papel: #FAF5EC;            /* fundo creme das seções */
  --cor-papel-escuro: #F1E8D8;
  --cor-tinta: #1D2233;            /* texto principal */
  --cor-tinta-profunda: #11141F;
  --cor-branco: #FFFFFF;
  --cor-cinza-claro: #F3F2EF;
  --cor-cinza-borda: #E4E1DA;
  --cor-cinza-texto: #6F6B63;
  --cor-verde: #17834A;            /* preço no Pix */

  /* Tipografia: Archivo variável (largura 62 a 125) */
  --fonte-ui: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fonte-titulo: 'Archivo', system-ui, sans-serif;
  --largura-titulo: 116%;

  /* Layout */
  --largura-max: 1200px;
  --gutter: 16px;
  --topbar-altura: 30px;
  --header-altura: 60px;
  --busca-altura: 44px;

  /* Banner: proporção das artes (1090 x 505) */
  --banner-proporcao: 1090 / 505;

  /* Formas */
  --raio-pill: 999px;
  --raio-md: 10px;
  --raio-sm: 6px;

  /* Movimento */
  --transicao-rapida: 160ms ease;
  --transicao-slide: 550ms cubic-bezier(0.22, 0.61, 0.36, 1);
}

@media (min-width: 768px) {
  :root {
    --gutter: 24px;
    --header-altura: 72px;
    --busca-altura: 46px;
  }
}