/* ============================================================
   BOTWISE — DESIGN TOKENS v1.0
   Direção "Sinal" · Julho/2026
   Fonte display: Sora · Fonte texto: Instrument Sans
   Este arquivo é a fonte da verdade de cor, tipo e espaçamento.
   ============================================================ */

:root {
  /* ---------- Cor: marca ---------- */
  --bw-azul-50:  #EEF1FF;
  --bw-azul-100: #DCE3FF;
  --bw-azul-200: #B9C6FF;
  --bw-azul-300: #8FA3FF;
  --bw-azul-400: #6B84FF;
  --bw-azul-500: #4F6BFF;   /* azul claro da marca (gradientes, hover) */
  --bw-azul-600: #2438E8;   /* AZUL BOTWISE — cor principal */
  --bw-azul-700: #1C2CC0;
  --bw-azul-800: #16228F;
  --bw-tinta:    #0B1030;   /* quase-preto da marca (títulos, fundo escuro) */

  --bw-citrico:      #DDF247; /* acento de ação — usar com parcimônia */
  --bw-citrico-hover:#D3EC2A;
  --bw-citrico-100:  #F4FBC4;

  /* ---------- Cor: neutros (viés azul) ---------- */
  --bw-branco:   #FFFFFF;
  --bw-fundo:    #F6F7FB;   /* fundo padrão de página */
  --bw-fundo-2:  #EEF0F6;   /* fundo alternado de seção */
  --bw-linha:    #E4E7F0;   /* bordas e divisores */
  --bw-cinza-400:#9CA3B8;   /* placeholder, ícone inativo */
  --bw-cinza-600:#5C6274;   /* texto secundário */
  --bw-texto:    #2A2E45;   /* texto corrido */
  /* títulos usam --bw-tinta */

  /* ---------- Cor: semânticas ---------- */
  --bw-sucesso: #1F9D61;
  --bw-alerta:  #DB8B1F;
  --bw-erro:    #E5484D;
  --bw-info:    var(--bw-azul-500);

  /* ---------- Gradientes ---------- */
  --bw-gradiente: linear-gradient(135deg, #2438E8 0%, #4F6BFF 100%);
  --bw-glow-hero: radial-gradient(80% 120% at 85% 110%, rgba(79,107,255,.55), transparent 60%);

  /* ---------- Tipografia ---------- */
  --bw-font-display: 'Sora', system-ui, sans-serif;          /* títulos, números, logo */
  --bw-font-texto:   'Instrument Sans', system-ui, sans-serif; /* corpo e interface */

  --bw-fs-hero: clamp(38px, 5.4vw, 60px);  /* Sora 700, lh 1.08, ls -0.02em */
  --bw-fs-h1:   clamp(30px, 4vw, 44px);    /* Sora 700, lh 1.12 */
  --bw-fs-h2:   clamp(24px, 3vw, 32px);    /* Sora 700, lh 1.18 */
  --bw-fs-h3:   21px;                      /* Sora 600, lh 1.25 */
  --bw-fs-corpo-g: 18px;                   /* lead / subtítulo */
  --bw-fs-corpo: 16px;                     /* padrão, lh 1.6 */
  --bw-fs-peq:   14px;                     /* apoio, lh 1.5 */
  --bw-fs-cap:   12px;                     /* CAPS, ls .12em, peso 600 */

  /* ---------- Espaçamento (base 4) ---------- */
  --bw-esp-1: 4px;
  --bw-esp-2: 8px;
  --bw-esp-3: 12px;
  --bw-esp-4: 16px;
  --bw-esp-5: 24px;
  --bw-esp-6: 32px;
  --bw-esp-7: 48px;
  --bw-esp-8: 64px;
  --bw-esp-9: 96px;

  /* ---------- Raios ---------- */
  --bw-raio-campo: 10px;   /* inputs */
  --bw-raio-card:  16px;   /* cards */
  --bw-raio-bloco: 24px;   /* seções, heros, imagens grandes */
  --bw-raio-pill:  999px;  /* botões e badges */

  /* ---------- Sombras (tingidas de azul) ---------- */
  --bw-sombra-1: 0 1px 3px rgba(11,16,48,.08);
  --bw-sombra-2: 0 6px 20px rgba(11,16,48,.10);
  --bw-sombra-3: 0 16px 48px rgba(11,16,48,.16);
  --bw-sombra-cta: 0 6px 24px rgba(36,56,232,.35);

  /* ---------- Movimento ---------- */
  --bw-ease: cubic-bezier(.22,.8,.32,1);
  --bw-t-rapido: 150ms;
  --bw-t-medio:  280ms;
  --bw-t-lento:  520ms;
}

/* ============================================================
   REGRAS DE USO (resumo)
   - Azul 600 é a cor da marca: links, botões primários, destaques.
   - Cítrico é SÓ para o CTA principal e micro-acentos (1 por tela).
     Nunca texto cítrico sobre branco; par oficial: cítrico + tinta.
   - Fundo escuro de seção = tinta (#0B1030), nunca preto puro.
   - Texto corrido nunca em azul; azul é ação, não leitura.
   - Botões e badges são sempre pílula (raio 999).
   ============================================================ */
