/*
Tokens do design system EQMS v2 — Brand Book aprovado 10/07/2026.
Paleta/tipografia migradas quase 1:1 do eqms-redesign.css (rodada anterior,
ja testado e validado), agora como fundacao formal do tema reconstruido,
nao mais um patch aditivo por cima de outro tema.

Breakpoints de referencia usados em todo o tema (nao da pra usar var() dentro
de media query, entao ficam documentados aqui como padrao a seguir):
  480px  = celular pequeno
  600px  = celular grande
  768px  = tablet retrato
  992px  = tablet paisagem / desktop pequeno
  1200px = desktop
*/

:root{
    /* ===== Cor ===== */
    --cor-mata: #2F4A33;
    --cor-musgo: #5E7355;
    --cor-salvia: #9CB29A;
    --cor-terracota: #BE6E4C;
    --cor-terracota-claro: #D08A66;
    --cor-linho: #F4EFE5;
    --cor-linho-2: #EAE2D2;
    --cor-cacau: #33291F;
    --cor-cacau-70: rgba(51, 41, 31, 0.7);
    --cor-cacau-45: rgba(51, 41, 31, 0.45); /* NUNCA usar como cor de texto — reprova contraste 4.5:1 (testado, 2.6:1). So decorativo/disabled. */
    --cor-branco: #FFFFFF;

    /* ===== Tipografia ===== */
    --fonte-display: 'Spectral', Georgia, serif;
    --fonte-corpo: 'Nunito Sans', Arial, sans-serif;

    /* Escala fluida — cresce suavemente entre mobile (320px) e desktop (1440px) */
    --texto-xs: clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
    --texto-sm: clamp(0.8125rem, 0.78rem + 0.2vw, 0.875rem);
    --texto-base: clamp(0.9375rem, 0.9rem + 0.2vw, 1rem);
    --texto-md: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
    --texto-lg: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
    --texto-xl: clamp(1.5rem, 1.3rem + 1vw, 2rem);
    --texto-2xl: clamp(1.875rem, 1.5rem + 1.5vw, 2.625rem);
    --texto-3xl: clamp(2.25rem, 1.7rem + 2.5vw, 3.5rem);
    --texto-4xl: clamp(2.75rem, 2rem + 3.5vw, 4.5rem);

    /* ===== Espaçamento ===== */
    --espaco-2xs: 0.25rem;
    --espaco-xs: 0.5rem;
    --espaco-sm: 0.75rem;
    --espaco-md: 1rem;
    --espaco-lg: clamp(1.25rem, 1rem + 1vw, 2rem);
    --espaco-xl: clamp(2rem, 1.5rem + 2vw, 3rem);
    --espaco-2xl: clamp(3rem, 2rem + 4vw, 5rem);
    --espaco-secao: clamp(3rem, 2rem + 6vw, 8rem);

    /* ===== Forma ===== */
    --raio-sm: 8px;
    --raio-md: 14px;
    --raio-lg: 24px;
    --raio-pill: 999px;

    /* ===== Sombra — organica, tom quente (nao cinza puro) ===== */
    --sombra-sm: 0 4px 16px -8px rgba(51, 41, 31, 0.25);
    --sombra-md: 0 12px 32px -16px rgba(51, 41, 31, 0.35);
    --sombra-lg: 0 20px 48px -20px rgba(51, 41, 31, 0.4);

    /* ===== Layout ===== */
    --largura-container: 1240px;
    --largura-container-estreito: 800px;

    /* ===== Vidro (glassmorphism) =====
       Extraído de padrão real medido via computed style ao vivo em
       zampas.com.br e quanqton.com.br (21/07/2026, pedido do Ricardo pra
       fechar distância visual): fundo com opacidade baixíssima (2-10%, não
       um preenchimento sólido), blur forte (8-40px conforme o elemento),
       borda clara fina (borda é o que "desenha" o vidro, não o fundo),
       cantos bem arredondados, sombra ausente ou muito suave — a
       profundidade vem do blur, não de sombra pesada. Adaptado pra paleta
       clara/quente da EQMS (o original das referências é 100% dark mode):
       sobre foto/imagem usa tom claro translúcido; sobre o overlay escuro
       do hero usa tom escuro translúcido com borda clara. */
    --vidro-bg-claro: rgba(255, 255, 255, 0.14);
    --vidro-bg-escuro: rgba(20, 15, 10, 0.35);
    --vidro-borda-clara: rgba(255, 255, 255, 0.28);
    --vidro-borda-escura: rgba(51, 41, 31, 0.1);
    --vidro-blur-sm: blur(12px);
    --vidro-blur-md: blur(20px);
    --vidro-blur-lg: blur(32px);
}