/* ==========================================================================
   Cogniva.Lab · Design tokens
   Fonte: pasta "ID VISUAL COGNIVA LAB". Ver DESIGN-SYSTEM.md.
   ========================================================================== */

:root {
  /* ---- Cores da marca ---------------------------------------------------- */
  --azul-profundo: #1E3A8A;   /* títulos, botão principal, fundos escuros */
  --azul-principal: #2563EB;  /* links, ícones, destaques */
  --azul-suave: #BFE0FF;      /* ondas, fundos de apoio */
  --lavanda: #CDB6FF;         /* ondas, estrelas, acentos */
  --lavanda-suave: #EBE3FF;   /* pílulas, cartões de apoio, tiles de ícone */
  --branco: #FFFFFF;

  /* ---- Derivadas (misturas da paleta, sem cor nova) ----------------------- */
  --nevoa: #F6F3FF;           /* fundo de seção alternada */
  --nevoa-azul: #F3F7FF;      /* fundo frio de apoio */
  --azul-noite: #172C6B;      /* hover do azul profundo */
  --lavanda-forte: #A98BF5;   /* estrelas e ícones sobre branco */

  /* ---- Texto -------------------------------------------------------------- */
  --texto-titulo: var(--azul-profundo);
  --texto: #334155;
  --texto-suave: #5B6781;
  --texto-inverso: #FFFFFF;
  --texto-inverso-suave: #DCE6FF;

  /* ---- Linhas e superfícies ---------------------------------------------- */
  --borda: #E2DAF8;
  --borda-forte: #CDB6FF;
  --superficie: #FFFFFF;
  --superficie-vidro: rgba(255, 255, 255, .78);

  /* ---- Estado (só para classificação e alertas, como na planilha) --------- */
  --sucesso: #22C55E;
  --atencao: #F59E0B;
  --erro: #EF4444;

  /* ---- Gradientes --------------------------------------------------------- */
  --grad-marca: linear-gradient(100deg, #2563EB 0%, #CDB6FF 100%);
  --grad-botao: linear-gradient(100deg, #1E3A8A 0%, #2563EB 100%);
  --grad-escuro: linear-gradient(140deg, #1E3A8A 0%, #2350C4 55%, #2563EB 100%);
  --grad-ceu: linear-gradient(160deg, #BFE0FF 0%, #EBE3FF 55%, #CDB6FF 100%);

  /* ---- Tipografia --------------------------------------------------------- */
  --fonte-display: "Fraunces", "Iowan Old Style", Georgia, serif;   /* headlines */
  --fonte-titulo: "Sora", "Inter", system-ui, sans-serif;           /* subtítulos, rótulos, botões */
  --fonte-corpo: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  --t-hero: clamp(2.35rem, 1.3rem + 4.4vw, 4.25rem);
  --t-h2: clamp(1.85rem, 1.2rem + 2.6vw, 3rem);
  --t-h3: clamp(1.15rem, 1.05rem + .5vw, 1.375rem);
  --t-lead: clamp(1.0625rem, 1rem + .35vw, 1.25rem);
  --t-corpo: 1.0625rem;
  --t-pequeno: .9375rem;
  --t-micro: .8125rem;
  --t-rotulo: .75rem;

  /* ---- Espaço (base 4) ---------------------------------------------------- */
  --e-1: .25rem;
  --e-2: .5rem;
  --e-3: .75rem;
  --e-4: 1rem;
  --e-5: 1.5rem;
  --e-6: 2rem;
  --e-7: 3rem;
  --e-8: 4rem;
  --e-9: 6rem;
  --secao: clamp(4rem, 2.5rem + 6vw, 7.5rem);
  --gutter: clamp(1rem, .4rem + 2.6vw, 2rem);
  --largura: 72.5rem;
  --largura-texto: 44rem;

  /* ---- Raios -------------------------------------------------------------- */
  --r-sm: .75rem;
  --r-md: 1.25rem;
  --r-lg: 1.75rem;
  --r-xl: 2.5rem;
  --r-pill: 999px;

  /* ---- Sombras (tingidas de azul, nunca cinza) ---------------------------- */
  --sombra-1: 0 1px 2px rgba(30, 58, 138, .06), 0 4px 14px rgba(30, 58, 138, .06);
  --sombra-2: 0 2px 6px rgba(30, 58, 138, .07), 0 18px 40px -12px rgba(30, 58, 138, .2);
  --sombra-3: 0 30px 70px -20px rgba(30, 58, 138, .38);
  --sombra-botao: 0 10px 22px -10px rgba(23, 44, 107, .55);

  /* ---- Movimento ---------------------------------------------------------- */
  --ease: cubic-bezier(.22, .8, .24, 1);
  --rapido: 160ms;
  --medio: 320ms;
  --lento: 700ms;
}
