/*
 * A paleta do ELO Captura.
 *
 * O bordô é a cor da CASA — ele fica na marca, e só. A cor do PRODUTO é este
 * verde-azulado (matiz 187°), e é ela que pinta a tela: botões, abas, o que
 * está ativo. Assim o Captura se reconhece de longe sem deixar de ser da
 * família — é o mesmo que o Emissor fez com o verde e o Portal com o bordô.
 *
 * A escala tem dez degraus com o MATIZ FIXO e só a claridade mudando. Isso
 * não é preciosismo: cores escolhidas uma a uma, "no olho", nunca combinam
 * entre si, e o resultado é uma tela que parece remendada.
 *
 * Os neutros levam um toque do mesmo matiz. Cinza puro ao lado de um teal
 * saturado parece sujo, meio amarelado — o olho compara. Com 8% de matiz eles
 * somem, no bom sentido.
 *
 * Contraste conferido para texto: captura-700 sobre branco dá 6,0:1 e
 * captura-800 dá 8,6:1 — ambos passam no mínimo de 4,5:1 da WCAG AA. Por isso
 * texto colorido usa 700 ou 800, nunca 500 ou 600, que só servem de fundo.
 */
:root{
  /* ---------- a cor do produto ---------- */
  --captura-50:#F3F8F9;
  --captura-100:#E2EFF1;
  --captura-200:#C5DFE2;
  --captura-300:#98C7CD;
  --captura-400:#63ACB6;
  --captura-500:#3E8E98;
  --captura-600:#267882;
  --captura-700:#0E6D79;   /* a cor-mãe: a seta do símbolo */
  --captura-800:#09545D;
  --captura-900:#06393F;

  /* atalhos de uso — o código pede a função, não o número */
  --acao:var(--captura-700);
  --acao-forte:var(--captura-800);
  --acao-fundo:var(--captura-100);
  --acao-borda:var(--captura-200);

  /* ---------- neutros (com o mesmo matiz, bem de leve) ---------- */
  --tinta-0:#FFFFFF;
  --tinta-25:#FBFBFC;
  --tinta-50:#F5F7F7;
  --tinta-100:#ECEEEF;
  --tinta-200:#DBE0E1;
  --tinta-300:#BBC3C4;
  /* Escurecido de propósito: em #6F8385 o contraste sobre branco era 3,99:1,
     e este é o tom do texto secundário, que aparece a 12–13px. Abaixo de
     4,5:1 a leitura já custa a quem enxerga menos. Agora dá 5,03:1. */
  --tinta-500:#617275;
  --tinta-700:#435456;
  --tinta-900:#162022;

  /* ---------- a casa (só a marca, e o vínculo com os irmãos) ---------- */
  --casa:#7A2330;
  --casa-esc:#5A1820;
  --casa-fundo:#F8E4E6;

  /* ---------- estados ----------
     Dessaturados de propósito. Ao lado de um teal forte, um verde e um
     vermelho puros gritam e roubam a atenção de tudo — inclusive do que
     realmente precisa dela. */
  --bom:#2F6B4F;    --bom-fundo:#E6F1EA;   --bom-borda:#C6DCCF;
  --atencao:#8A6A12; --atencao-fundo:#FBF2DA; --atencao-borda:#EEDFB4;
  --ruim:#B03A20;   --ruim-fundo:#FBE9E4;  --ruim-borda:#F2C7BB;

  /* ---------- superfícies ---------- */
  --carta:var(--tinta-0);
  --fundo:var(--tinta-50);
  --borda:rgba(22,32,34,.09);
  --sombra:0 1px 2px rgba(6,57,63,.05),0 8px 24px -12px rgba(6,57,63,.14);
  --sombra-alta:0 2px 4px rgba(6,57,63,.06),0 20px 48px -16px rgba(6,57,63,.22);

  /* ---------- movimento ---------- */
  --mola:cubic-bezier(.16,1,.3,1);
}