/* ==========================================================================
   Sindicom Itabuna — tokens do sistema de design
   Cores medidas nas referências geradas (não estimadas):
   cobalto #01337E · dourado #CE9326 · off-white #FBFAF8
   ========================================================================== */

:root {
  /* --- Marca ------------------------------------------------------------ */
  --cobalto:            #01337E;
  --cobalto-escuro:     #012259;   /* hover de botão, rodapé profundo */
  --cobalto-claro:      #0A47A0;   /* foco, links sobre claro */
  --dourado:            #CE9326;   /* grafismo: chanfro, ícone, borda, botão */
  --dourado-escuro:     #A9761A;   /* hover de botão dourado */
  --dourado-claro:      #E3AF48;   /* dourado sobre cobalto/foto */
  /* Variante só para TEXTO PEQUENO sobre fundo claro. O dourado de marca
     (#CE9326) dá 2.6:1 e o --dourado-escuro dá 3.8:1 sobre off-white — os dois
     reprovam em texto de 13px, que exige 4.5:1. Este dá 5.2:1.
     O grafismo continua no dourado de marca; quem escurece é a letra. */
  --dourado-texto:      #8A6415;

  /* --- Neutros ---------------------------------------------------------- */
  --branco:             #FFFFFF;
  --off-white:          #FBFAF8;
  --cinza-borda:        #E4E2DE;
  --cinza-fraco:        #F1EFEC;
  --cinza-texto:        #55524D;   /* 7.4:1 sobre branco */
  --preto-texto:        #1A1A1A;   /* 16.1:1 sobre branco */

  /* --- Papéis ----------------------------------------------------------- */
  --fundo:              var(--branco);
  --fundo-alt:          var(--off-white);
  --texto:              var(--preto-texto);
  --texto-suave:        var(--cinza-texto);
  --borda:              var(--cinza-borda);

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

  /* escala fluida — o piso é grande de propósito: o público tem 45-70 anos */
  --t-hero:   clamp(2.5rem, 1.35rem + 4.6vw, 4.75rem);
  --t-h1:     clamp(2rem,   1.35rem + 2.6vw, 3.25rem);
  --t-h2:     clamp(1.6rem, 1.25rem + 1.4vw, 2.25rem);
  --t-h3:     clamp(1.2rem, 1.08rem + 0.5vw, 1.45rem);
  --t-corpo:  clamp(1.0625rem, 1.02rem + 0.2vw, 1.1875rem);
  --t-leitura: clamp(1.125rem, 1.06rem + 0.3vw, 1.25rem);
  --t-peq:    0.9375rem;
  --t-kicker: 0.8125rem;

  --lh-hero: 1.06;
  --lh-tit:  1.14;
  --lh-corpo: 1.62;

  --tr-kicker: 0.16em;   /* letter-spacing do kicker */
  --tr-hero:  -0.022em;

  /* --- Espaço ----------------------------------------------------------- */
  --e-1: 0.25rem;  --e-2: 0.5rem;   --e-3: 0.75rem;  --e-4: 1rem;
  --e-5: 1.5rem;   --e-6: 2rem;     --e-7: 3rem;     --e-8: 4rem;
  --e-9: 5.5rem;   --e-10: 7rem;

  --secao-y: clamp(3.5rem, 2rem + 5vw, 6.5rem);

  /* --- Layout ----------------------------------------------------------- */
  --largura:     1280px;
  --largura-txt: 68ch;      /* coluna de leitura */
  --gutter:      clamp(1.25rem, 0.5rem + 3vw, 3rem);
  --raio:        6px;
  --raio-g:      10px;

  /* --- Elevação e movimento --------------------------------------------- */
  --sombra:   0 1px 2px rgba(1, 51, 126, .05), 0 4px 16px rgba(1, 51, 126, .06);
  --sombra-f: 0 2px 6px rgba(1, 51, 126, .09), 0 12px 32px rgba(1, 51, 126, .10);
  --transicao: 160ms cubic-bezier(.2, .6, .3, 1);

  /* --- Chanfro (assinatura da marca) ------------------------------------ */
  --chanfro: clamp(48px, 7vw, 116px);
}

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