/* ============================================================
   IBooster · Carreiras · design tokens
   Fonte unica de verdade - consumido por design.css e views.css.

   PALETA. Vem do manual de marca da propria IBooster (brandkit/
   IBooster_Manual_de_Marca.pdf) e do SVG oficial do logotipo: vermelho
   #DC2626 no simbolo e nas duas primeiras letras da wordmark, quase-preto
   #111827 no resto. Sao essas duas cores, e nada foi inventado aqui.

     --marca   #111827  o quase-preto dos titulos e da navegacao.
     --brand   #111827  o mesmo quase-preto como ACAO e texto (16,8:1
                        sobre branco). Hover cai para #000000.
     --cta     #DC2626  o VERMELHO da marca. Sobre branco ele da 4,83:1,
                        que passa em AA para texto normal mas nao sobra
                        margem nenhuma - entao aqui ele so aparece como
                        SUPERFICIE de botao primario, sempre com
                        --cta-ink branco por cima. Vermelho como TEXTO
                        de 11-12px (rotulo de KPI, data, legenda) nao
                        entra: e onde 4,83:1 quebra na tela do celular.

   O PROBLEMA DE STATUS QUANDO A MARCA E VERMELHA. Vermelho tambem e a
   cor universal de erro. Como a marca ocupa o vermelho vivo, o status de
   reprovacao desce para um bordo escuro e dessaturado, que nunca se
   parece com o botao:

     vermelho vivo #DC2626 = ACAO (botao primario). Nunca status.
     quase-preto   #111827 = MARCA, NAVEGACAO e texto. Nunca status.
     verde   = aprovado
     ambar   = atencao (tinta escura)
     bordo   = reprovado / violacao (--danger #7A122F: 10,4:1, e
               visivelmente mais escuro e mais roxo que o vermelho vivo)
     dourado = exclusivamente IA

   E, como no resto do produto, cor nunca e o unico sinal: todo estado
   aparece tambem em rotulo ou icone.

   TIPOGRAFIA. Inter, a familia do manual de marca. A interface inteira
   roda nela e o display se distingue por peso (700/800), nao por outra
   fonte. Uma fonte a menos tambem e uma requisicao a menos no celular
   do candidato.

   RAIO. Escala 4/6/10, herdada da base.
   ============================================================ */
:root{
  /* brand - quase-preto de ACAO e de texto, aprovado em AAA */
  --brand:#111827; --brand2:#000000; --brand-ink:#000000;
  --brandsoft:rgba(17,24,39,.07); --brandsoft2:rgba(17,24,39,.14);
  /* rampa monocromatica para a barra de mix de dificuldade (facil/medio/dificil) */
  --brand-200:#C7CAD1; --brand-500:#4B5263;

  /* marca - o quase-preto institucional da assinatura. Superficie e acento. */
  --marca:#111827; --marca2:#2A3244;
  --marca-grad:linear-gradient(180deg,#2A3244 0%,#111827 100%);

  /* CTA - o vermelho da marca. SUPERFICIE apenas, sempre com --cta-ink por cima. */
  --cta:#DC2626; --cta2:#B91C1C; --cta-ink:#FFFFFF;
  --ctasoft:rgba(220,38,38,.12); --ctaline:#B91C1C;

  /* accent - alias de --brand, mantido porque design.css e views.css
     ja falam "accent" para o destaque institucional */
  --accent:#111827; --accent-ink:#000000; --accent2:#2A3244;
  --accentsoft:rgba(17,24,39,.07); --accentsoft2:rgba(17,24,39,.14);

  /* neutros - cinza NEUTRO e muito claro, para o vermelho aparecer sozinho. */
  --bg:#F9FAFB; --bg2:#FCFCFD; --card:#FFFFFF; --card2:#F3F4F6;
  --line:#E5E7EB; --line2:#D4D7DD;
  /* --mut e o cinza de texto secundario do proprio site (rgb 83,83,83).
     --mut2 e o terceiro nivel: estava em #8A8A92, que dava 3,45:1 sobre branco e
     reprovava em AA - e ele carrega 87 pedacos de texto de 11-12px no painel
     (rotulo de KPI, data, subtitulo de vaga). #6E6E6E leva a 5,1:1 e continua
     visivelmente mais claro que o --mut. */
  --txt:#1A1A1C; --mut:#535353; --mut2:#6E6E6E;
  /* tinta de display: o quase-preto da marca */
  --ink:#111827;

  /* semanticos (fill suave + tinta). Cor nunca e o unico sinal:
     todo estado aparece tambem em rotulo ou icone.
     --danger e mais escuro e mais roxo que o --cta de propósito: com a
     marca ocupando o vermelho vivo, reprovacao e botao primario nao
     podem ser lidos como a mesma cor. */
  --ok:#137A43;   --ok-ink:#0E5C32;   --oksoft:rgba(80,167,115,.14);
  --warn:#8A6100; --warn-ink:#6B4B00; --warnsoft:rgba(255,184,0,.18);
  --danger:#7A122F;                   --dangersoft:rgba(122,18,47,.10);

  /* accent IA - deliberadamente fora da familia da marca */
  --gold:#7A6220; --gold-ink:#5E4B18; --goldsoft:rgba(122,98,32,.10);

  /* superficies escuras */
  --code-bg:#17171A; --code-txt:#E8E8EB;
  --scrim:rgba(17,24,39,.88); --scrim-light:rgba(17,24,39,.6);

  /* tipografia - uma familia so (ver cabecalho). O display se separa
     do corpo por peso, nao por outra fonte nem por entressilha apertada. */
  --display:'Inter','Segoe UI',Arial,sans-serif;
  --fs-micro:11px; --fs-xs:12px; --fs-sm:13px; --fs-base:14px;
  --fs-md:16px; --fs-lg:20px; --fs-xl:24px; --fs-display:32px;
  --ls-caps:.08em; --ls-eyebrow:.12em; --ls-tight:0em; --ls-tighter:-.01em;
  --lh-display:1.2; --lh-heading:1.3; --lh-body:1.55; --lh-relaxed:1.7;
  --mono:'Cascadia Code',Consolas,ui-monospace,monospace;

  /* espacamento (base 4) */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px; --s12:48px;
  --gutter:24px; --header-h:64px;

  /* raios - escala 4/6/10. Pilula fica so no chip: num painel com muitos
     botoes juntos, botao pilula vira ruido. */
  --r-sm:4px; --r-md:6px; --r-lg:10px; --r-pill:999px;

  /* sombras - neutras e discretas; a tela se estrutura por filete, nao
     por sombra */
  --shadow:0 1px 3px rgba(17,24,39,.08);
  --shadow-lg:0 10px 30px rgba(17,24,39,.10);
  --shadow-pop:0 8px 30px rgba(17,24,39,.22);

  /* motion */
  --t-fast:.12s; --t-med:.2s;
}

/* Titulo, nome do produto e numero de vitrine no peso de display.
   Mesma familia do corpo: o que muda e o peso. Os titulos do site sao
   600/700, nunca 800. */
h1,h2,h3,.prod,.kpi .v,.big-score .n,.lp-n,.hero h1{
  font-family:var(--display);font-weight:700;letter-spacing:var(--ls-tight)
}
