/* ============================================================
   CFC ACADEMY · RADAR DE EDITAIS
   Design System — camada 1: tokens
   ------------------------------------------------------------
   Identidade herdada das propriedades CFC Academy:
   landing-pages/cfc-questoes, cfc-express, quiz-cfc.
   Conceito desta plataforma: PAINEL DE MONITORAMENTO.
   Lima fosforescente sobre preto. Nada decorativo sem função.
   Ponto ÚNICO de calibração — não redefinir cor fora daqui.
   ============================================================ */

:root{
  /* ---------- superfícies ----------
     Tema claro (pedido do Patrick, ago/2026): o escuro pesava
     demais para uma página que a pessoa vai ler por minutos.

     Não é branco puro: #FBFCFA tem um toque de verde que casa
     com o acento e cansa menos a vista que #FFF em tela grande. */
  --preto:#FBFCFA;          /* fundo raiz */
  --preto-2:#F2F5EF;        /* elevação 1 — faixas, barras */
  --carvao:#FFFFFF;         /* elevação 2 — cards, painéis */
  --carvao-2:#F7F9F4;       /* elevação 3 — hover / aninhado */
  --carvao-3:#EDF1E8;       /* elevação 4 — inputs, chips */

  /* ---------- acento ----------
     O lima #9FE31A tem contraste de 1,6:1 sobre branco — ilegível.
     Sobre fundo escuro ele funcionava. Aqui o acento é escurecido
     para texto e mantido vivo só onde é PREENCHIMENTO com texto
     escuro por cima (botões), que é onde ele brilha sem prejudicar
     a leitura. */
  /* #4E7A08 dá 4,96:1 sobre o fundo — passa no mínimo de 4,5:1 para
     texto. O #6FA80F que eu tinha escolhido antes dava só 2,8:1:
     bonito, mas ilegível em número e link, que é justamente onde
     este token é usado. Medido, não estimado. */
  --lima:#4E7A08;           /* acento legível sobre claro */
  --lima-esc:#3D5E05;       /* hover / pressionado */
  --lima-claro:#8FCE1C;     /* preenchimento de botão e realce */
  --lima-vivo:#9FE31A;      /* o lima da marca, para blocos e ícones */
  --lima-glow:rgba(111,168,15,.28);
  --lima-wash:rgba(143,206,28,.16);
  --lima-wash-2:rgba(143,206,28,.08);

  /* ---------- tinta ----------
     Azul-marinho do logo. Usar o azul da marca em vez de cinza
     neutro é o que mantém a página reconhecível como CFC Academy
     agora que o fundo preto saiu. */
  --branco:#22344A;         /* texto principal */
  --cinza:#5B6B7C;          /* texto secundário */
  --cinza-esc:#8494A3;      /* texto terciário, legendas */
  --marinho:#2C4159;        /* azul do logo, para títulos */

  /* ---------- papéis ----------
     Estes existem para nada depender do nome literal da cor. O
     `--preto` era usado como contorno de mapa e como texto sobre o
     acento; ao virar o tema ele ficou quase branco e esses dois
     usos sumiram da tela. Nome de papel não quebra na inversão. */
  /* BRANCO, não escuro. No tema escuro o botão era lima claro e
     pedia texto preto; aqui o acento escureceu para ser legível
     como texto, e sobre ele o branco dá 5,1:1 contra 3,3:1 do
     escuro. A regra inverteu junto com o tema. */
  --tinta-sobre-acento:#FFFFFF;
  --traco:#B9C6CF;               /* contorno de mapa e divisórias fortes */

  /* ---------- linhas ---------- */
  --linha:rgba(44,65,89,.14);
  --linha-fraca:rgba(44,65,89,.07);
  --linha-neutra:rgba(44,65,89,.10);

  /* ---------- semânticos ----------
     Regra mantida do tema escuro: o acento é reservado a
     "aberto/ativo"; os demais estados usam âmbar/vermelho/azul
     para não competir com ele. Todos reescurecidos para o fundo
     claro — o âmbar #E3B341 sobre branco era quase invisível. */
  --ok:#4E7A08;             /* inscrições abertas */
  --ok-wash:rgba(111,168,15,.14);
  --warn:#B57A0B;           /* encerrando / previsto */
  --warn-wash:rgba(181,122,11,.13);
  --crit:#C0392B;           /* encerrado */
  --crit-wash:rgba(192,57,43,.10);
  --info:#1F7A99;           /* banca definida / andamento */
  --info-wash:rgba(31,122,153,.11);

  /* ---------- tipografia ---------- */
  --display:'Archivo',ui-sans-serif,system-ui,sans-serif;
  --body:'Sora',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'Cascadia Mono',Consolas,monospace;

  /* escala tipográfica (fluida) */
  --t-hero:clamp(2.6rem,6vw,4.6rem);
  --t-h1:clamp(2rem,4vw,3rem);
  --t-h2:clamp(1.5rem,2.6vw,2.1rem);
  --t-h3:1.18rem;
  --t-body:1rem;
  --t-sm:.88rem;
  --t-xs:.78rem;
  --t-micro:.71rem;

  /* ---------- espaço ---------- */
  --s-1:4px;  --s-2:8px;  --s-3:12px; --s-4:16px;
  --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px;

  /* ---------- raio ---------- */
  --r-xs:6px; --r-sm:10px; --r:14px; --r-lg:20px; --r-pill:999px;

  /* ---------- sombra ---------- */
  /* Sombra azulada e suave: a preta densa do tema escuro vira
     sujeira sobre fundo claro. */
  --sombra-1:0 1px 3px rgba(44,65,89,.10);
  --sombra-2:0 8px 28px -10px rgba(44,65,89,.20);
  --sombra-3:0 24px 60px -16px rgba(44,65,89,.22);
  --sombra-lima:0 14px 34px rgba(159,227,26,.28);

  /* ---------- layout ---------- */
  --max:1240px;
  --max-txt:720px;
  --topbar-h:56px;

  /* ---------- motion ---------- */
  --ease:cubic-bezier(.2,.8,.2,1);
  --dur-1:.18s; --dur-2:.28s; --dur-3:.6s;
}

/* Grid mesh — assinatura visual herdada da CFC.
   Usado como textura de fundo em heros e painéis. */
:root{
  --mesh:linear-gradient(var(--linha) 1px,transparent 1px),
         linear-gradient(90deg,var(--linha) 1px,transparent 1px);
  --mesh-size:52px 52px;
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}
