/* Nildo Cortes — tokens do design system (spec 2026-09-13 §3.1).
   Tema único claro, de propósito. Mudar uma cor aqui muda todas as telas do cliente. */

@font-face { font-family: "Outfit"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/outfit-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/outfit-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/outfit-latin-600-normal.woff2") format("woff2"); }

:root {
  /* Fundos e linhas */
  --cor-fundo: #FFFFFF;
  --cor-superficie: #F7F6F3;
  --cor-superficie-2: #F0EEEA;
  --cor-linha: #ECEAE5;
  --cor-linha-forte: #DAD6CE;

  /* Texto (grafite quente) */
  --cor-texto: #1C1B19;
  --cor-texto-2: #4A4743;
  --cor-texto-3: #6F6B64;          /* 5,3:1 sobre branco */
  --cor-texto-desabilitado: #8F8B84;
  --cor-desabilitado-fraco: #A29E97;
  --cor-placeholder: var(--cor-texto-3);

  /* Destaque — champagne nunca é texto nem contorno sobre branco (2:1) */
  --cor-champagne: #D2B37C;        /* grafite sobre champagne: 8,6:1 */
  --cor-champagne-hover: #C7A66C;
  --cor-champagne-suave: #F6EFE2;
  --cor-champagne-texto: #7A5E2E;

  /* Ilustração e superfícies invertidas */
  --cor-ilustracao-vazia: #B9AC98;
  --cor-texto-inverso-2: #D9D5CE;
  --cor-toast-sucesso: #9FD3B6;
  --cor-toast-erro: #F2A89F;

  /* Semânticas */
  --cor-sucesso: #2F6B4F;  --cor-sucesso-fundo: #EAF3EE;
  --cor-erro: #B3261E;     --cor-erro-fundo: #FBEAE8;  --cor-erro-linha: #EBC8C4;
  --cor-aviso: #8A5A00;    --cor-aviso-fundo: #FBF1DC;

  /* Tipografia */
  --fonte: "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Espaço (múltiplos de 4) */
  --esp-1: 4px; --esp-2: 8px; --esp-3: 12px; --esp-4: 16px; --esp-5: 24px; --esp-6: 32px; --esp-7: 48px;

  /* Cantos */
  --raio-p: 10px; --raio-m: 14px; --raio-g: 20px; --raio-pilula: 999px;

  /* Sombras: só em elementos flutuantes */
  --sombra-1: 0 1px 2px rgba(28, 27, 25, .04), 0 2px 8px rgba(28, 27, 25, .04);
  --sombra-2: 0 12px 32px rgba(28, 27, 25, .10);

  /* Movimento */
  --mov-rapido: 150ms;
  --mov: 200ms;
  --curva: cubic-bezier(.2, .7, .3, 1);

  /* Layout */
  --largura-max: 1120px;
  --altura-nav: 64px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .btn[aria-busy="true"] .icone { animation-duration: 1.6s !important; animation-iteration-count: infinite !important; }
}