/* ==========================================================================
   TOKENS DO SITE
   Única fonte de verdade para cores, fontes e medidas. Alterar aqui propaga
   para todos os componentes.
   ========================================================================== */

:root {
  /* Cores da marca */
  --cor-laranja: #FF6A00;
  --cor-laranja-escura: #E05D00;
  --cor-laranja-clara: #FF8A33;
  --cor-preto: #252525;
  --cor-preto-profundo: #171717;
  --cor-branco: #FFFFFF;
  --cor-cinza-claro: #F2F2F2;
  --cor-cinza-borda: #E2E2E2;
  --cor-cinza-texto: #7A7A7A;

  /* Tipografia */
  --fonte-ui: 'Montserrat', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fonte-logo: 'Roboto Condensed', 'Arial Narrow', Arial, sans-serif;

  /* Layout */
  --largura-max: 1200px;
  --gutter: 12px;
  --topbar-altura: 28px;
  --header-altura: 56px;
  --busca-altura: 42px;

  /* Banner: mesma proporção das artes de referência (1090 x 505) */
  --banner-proporcao: 1090 / 505;

  /* Formas */
  --raio-pill: 999px;
  --raio-md: 12px;

  /* 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: 68px;
    --busca-altura: 46px;
  }
}