/* ============================================================
   variaveis.css — PALETA E TOKENS DO SITE PÚBLICO (HRT Gravações)
   Local: /assets/css/variaveis.css

   Para trocar o visual do site inteiro, edite só esta seção.
   ============================================================ */

:root {

    /* ----------------------------------------------------------
       MARCA
       Primary: vermelho da logo, com o degradê pedido (E20F14 → A61C1F).
       Secondary: azul do pedido (#2c70c2), com saturação/luz ajustadas
       pra ficar mais "aço industrial" e menos elétrico — mesmo tom,
       leve redução de saturação e luminosidade (contraste com
       texto branco ainda > 5:1, acima do mínimo de acessibilidade).
       ---------------------------------------------------------- */

    --primary:        #E20F14;
    --primary-hover:  #A61C1F;
    --primary-light:  #FCE7E8;
    --primary-rgb:    226,15,20;

    --secondary:          #2E6CB8;
    --secondary-dark:     #092042;
    --secondary-light:    #EAF0F8;
    --secondary-rgb:      46,108,184;
    --secondary-gradient: linear-gradient(135deg, #2E6CB8, #255693);

    /* ----------------------------------------------------------
       TONS ESCUROS
       ---------------------------------------------------------- */

    --dark:      #171717;
    --graphite:  #292929;

    /* ----------------------------------------------------------
       FUNDOS
       ---------------------------------------------------------- */

    --background: #F5F5F5;
    --surface:    #FFFFFF;

    /* ----------------------------------------------------------
       TEXTO
       ---------------------------------------------------------- */

    --text:       #242424;
    --text-muted: #6B6B6B;
    --text-inverso: #FFFFFF;

    /* ----------------------------------------------------------
       BORDAS
       ---------------------------------------------------------- */

    --border:       #E2E2E2;
    --border-forte: #D0D0D0;

    /* ----------------------------------------------------------
       FEEDBACK
       ---------------------------------------------------------- */

    --sucesso: #16a34a;
    --erro:    #dc2626;

    /* ----------------------------------------------------------
       SOMBRAS
       ---------------------------------------------------------- */

    --sombra-sm: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
    --sombra-md: 0 4px 16px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.04);
    --sombra-lg: 0 10px 40px rgba(0,0,0,.10), 0 4px 12px rgba(0,0,0,.05);

    /* ----------------------------------------------------------
       RAIOS DE BORDA
       ---------------------------------------------------------- */

    --radius-sm:   6px;
    --radius-md:   10px;
    --radius-lg:   14px;
    --radius-pill: 999px;

    /* ----------------------------------------------------------
       ESPAÇAMENTO (escala de 4px)
       ---------------------------------------------------------- */

    --esp-1:  4px;
    --esp-2:  8px;
    --esp-3:  12px;
    --esp-4:  16px;
    --esp-5:  20px;
    --esp-6:  24px;
    --esp-8:  32px;
    --esp-10: 40px;
    --esp-12: 48px;
    --esp-16: 64px;

    /* ----------------------------------------------------------
       TIPOGRAFIA
       ---------------------------------------------------------- */

    --fonte-sans: 'Inter', system-ui, sans-serif;

    --text-xs:  12px;
    --text-sm:  14px;
    --text-md:  16px;
    --text-lg:  18px;
    --text-xl:  24px;
    --text-2xl: 32px;

    --peso-normal: 400;
    --peso-medio:  500;
    --peso-semi:   600;
    --peso-bold:   700;

    /* ----------------------------------------------------------
       LAYOUT
       ---------------------------------------------------------- */

    --conteudo-max:  1600px;
    --header-altura: 76px;

    /* ----------------------------------------------------------
       TRANSIÇÕES
       ---------------------------------------------------------- */

    --transicao: .18s ease;

}