/* ==========================================================================
   IDENTIDADE VISUAL — DR. RIBAMAR BANDEIRA 1500
   Tokens compartilhados pelos três produtos do ecossistema digital.

   Landing Page    drribamarbandeira.surge.sh
   Minha Arte      minhaarte-drribamarbandeira.pages.dev
   Time do Ribamar timeribamar.timeribamarbandeira.workers.dev

   Todas as cores foram amostradas do logotipo oficial
   (logo_dr_ribamar_final_003-01) e das molduras de campanha.
   Não invente tons novos: se faltar um, derive dos que estão aqui.

   Só tokens. Os componentes (.rb-botao, .rb-opcao, .rb-cartao, .rb-faixa,
   .rb-destaque, .rb-grifo, .rb-rodape, .rb-secao) foram removidos em
   15/08/2026: nenhum dos três produtos os referenciava, e o arquivo era
   carregado inteiro em toda visita. Cada produto escreve os seus próprios
   componentes consumindo os tokens daqui.

   v2 — 15/08/2026
   ========================================================================== */

:root{

  /* ---- VERDE — cor de marca ------------------------------------------- */
  --rb-verde-100:#64B668;  /* topo do gradiente do "1500". Só decorativo.   */
  --rb-verde-500:#189038;  /* verde de marca. Preenchimento, faixas, ícones.*/
  --rb-verde-700:#006C36;  /* verde de trabalho. Botões e texto sobre claro.*/
  --rb-verde-900:#04532B;  /* títulos e textos longos sobre fundo claro.    */

  /* ATENÇÃO — verde-500 sobre branco dá contraste 4.13:1 e reprova no
     WCAG AA para texto normal. Texto branco em botão ou faixa usa
     verde-700 (6.57:1). O verde-500 só carrega texto a partir de 24px. */

  /* ---- APOIO ----------------------------------------------------------- */
  --rb-amarelo:#FFDA00;    /* das molduras. Ação, destaque, chamada.        */

  /* CORREÇÃO DE PROVENIÊNCIA, 15/08/2026 — não é troca de gosto, não
     "conserte" de volta. O token esteve em #FCD800 por um dia, com a
     justificativa de ter sido amostrado das molduras da campanha. Ao medir
     as três molduras atuais, o amarelo é #FFDA00 em 91–95% dos pixels
     amarelos: #FCD800 vinha da geração ANTERIOR das artes, que o designer
     substituiu. A justificativa apontava para um arquivo que não existe
     mais. #FFDA00 é levemente mais claro e melhora todos os contrastes em
     uso: tinta sobre amarelo 12,09→12,35, amarelo sobre verde-900
     6,57→6,71, sobre verde-700 4,68→4,78. Sobre creme piora de 1,31 para
     1,28 — e continua proibido, como sempre esteve. */
  --rb-laranja:#F0801E;    /* do "BANDEIRA". Acento, nunca fundo de texto.  */
  --rb-vermelho:#D83715;   /* do coração do logo. Uso raro, só alerta.      */

  /* ---- NEUTROS --------------------------------------------------------- */
  --rb-creme:#F6F8F0;      /* fundo de seção, respiro.                      */
  --rb-papel:#FFFFFF;      /* fundo base, cartões.                          */
  --rb-tinta:#12200C;      /* texto corrido.                                */
  --rb-tinta-fraca:#4F5749;/* legendas, apoio, texto secundário.            */
  --rb-borda:rgba(0,108,54,.16);

  /* --rb-tinta-fraca era #5C6B52 (5,33:1 sobre creme). Subiu para #4F5749
     em 15/08/2026: é a cor de TODO o corpo de texto do Minha Arte, e
     5,33:1 fica abaixo do alvo AAA de 7:1 que aquele produto já cumpria.
     #4F5749 dá 7,02:1 sobre creme e 7,52:1 sobre branco. Quem consumia
     #5C6B52 clareia de menos para notar; quem consumia #4F5749 não muda. */

  /* ---- TIPOGRAFIA ------------------------------------------------------ */
  --rb-fonte:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;

  --rb-display:800;        /* títulos de página                             */
  --rb-titulo:700;         /* títulos de seção, botões                      */
  --rb-corpo:500;          /* texto corrido                                 */

  --rb-t-display:clamp(28px,7vw,48px);
  --rb-t-titulo:clamp(20px,4vw,26px);
  --rb-t-secao:13px;       /* caixa alta, letter-spacing .13em              */
  --rb-t-corpo:15px;
  --rb-t-apoio:13px;
  --rb-t-legenda:12px;

  /* ---- ESPAÇO E FORMA -------------------------------------------------- */
  --rb-r-pequeno:8px;
  --rb-r-medio:12px;
  --rb-r-grande:16px;
  --rb-r-pilula:999px;

  --rb-e-1:8px;
  --rb-e-2:16px;
  --rb-e-3:24px;
  --rb-e-4:40px;
  --rb-e-5:56px;

  --rb-sombra:0 10px 28px -18px rgba(18,32,12,.55);
  --rb-largura:1080px;     /* largura máxima de conteúdo                    */

  /* ---- GRANA — textura de fundo dos três produtos ---------------------- */
  --rb-textura:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="4"/></filter><rect width="64" height="64" fill="%23F6F8F0" filter="url(%23n)" opacity="0.05"/></svg>');
}

/* ==========================================================================
   TOKEN DE SOMBRA - nao e cor da paleta.
   Nunca usar como cor de texto nem de fundo. So em box-shadow.
   ========================================================================== */

:root{
  --sombra-tinta: 18, 43, 1;
  --sombra-alfa: .92;

  /* uso: box-shadow: 7px 9px 0 rgba(var(--sombra-tinta), var(--sombra-alfa)); */
}