/* ============================================================
   VARIÁVEIS CSS — PALETA NGC - CONGÁS
   Identidade visual oficial do projeto.

   🔴 Vermelho: #D4000F
   🔵 Azul:     #044AA6
   🟩 Verde:    #00FF00
   ⚪ Branco:   #FFFFFF
   ⚫ Preto:    #000000
   ⚙️ Cinza:    #BBBCBC

   @author Roka Digital - https://rokadigital.com.br/contato/
   ============================================================ */

:root {
    /* ===== VERMELHO NGC (Cor Primária) ===== */
    --color-primary:     #D4000F;
    --color-primary-50:  #FDF2F2;
    --color-primary-100: #FBD5D7;
    --color-primary-200: #F7AAAE;
    --color-primary-300: #F17A81;
    --color-primary-400: #EB4851;
    --color-primary-500: #D4000F;
    --color-primary-600: #B3000C;
    --color-primary-700: #8F0009;
    --color-primary-800: #6B0006;
    --color-primary-900: #4A0004;
    --color-primary-rgb: 212, 0, 15;

    /* ===== AZUL NGC (Cor Secundária / Destaque) ===== */
    --color-secondary:     #044AA6;
    --color-secondary-50:  #EEF4FC;
    --color-secondary-100: #D5E4F8;
    --color-secondary-200: #A6C4EF;
    --color-secondary-300: #74A1E5;
    --color-secondary-400: #427CDA;
    --color-secondary-500: #044AA6;
    --color-secondary-600: #033C87;
    --color-secondary-700: #022F6A;
    --color-secondary-800: #02224C;
    --color-secondary-900: #01152F;
    --color-secondary-rgb: 4, 74, 166;

    /* ===== VERDE (Ação / WhatsApp / Sucesso) ===== */
    --color-tertiary:     #25D366;
    --color-tertiary-50:  #E8F5E9;
    --color-tertiary-100: #C8E6C9;
    --color-tertiary-200: #A5D6A7;
    --color-tertiary-300: #81C784;
    --color-tertiary-400: #66BB6A;
    --color-tertiary-500: #25D366;
    --color-tertiary-600: #128C7E;
    --color-tertiary-700: #075E54;
    --color-tertiary-800: #064E3B;
    --color-tertiary-900: #03291F;

    /* ===== CORES ESPECIAIS ===== */
    --color-whatsapp:      #25D366;
    --color-whatsapp-dark: #128C7E;
    --color-phone:         #044AA6;
    --color-accent:        #D4000F;

    /* ===== TEXTO (Preto e Cinza) ===== */
    --color-text:       #000000;
    --color-text-dark:  #000000;
    --color-text-light: #374151;
    --color-text-muted: #BBBCBC;

    /* ===== FUNDO ===== */
    --color-background:      #FFFFFF;
    --color-background-alt:  #F6F6F6;
    --color-background-dark: #EFEFEF;

    /* ===== BORDAS ===== */
    --color-border:       #DFDFDF;
    --color-border-light: #DFDFDF;
    --color-border-dark:  #DFDFDF;

    /* ===== STATUS ===== */
    --color-success:       #25D366;
    --color-success-light: #E8F5E9;
    --color-warning:       #F59E0B;
    --color-warning-light: #FEF3C7;
    --color-error:         #D4000F;
    --color-error-light:   #FDF2F2;
    --color-info:          #044AA6;
    --color-info-light:    #EEF4FC;

    /* ===== GRADIENTES NGC - CONGÁS ===== */
    --gradient-primary:    linear-gradient(90deg, #D4000F, #044AA6);
    --gradient-secondary:  linear-gradient(90deg, #044AA6, #D4000F);
    --gradient-blue-cyan:  linear-gradient(90deg, #044AA6, #427CDA);
    --gradient-green-cyan: linear-gradient(90deg, #25D366, #044AA6);
    --gradient-hero:       linear-gradient(135deg, rgba(212,0,15,0.92) 0%, rgba(4,74,166,0.88) 100%);

    /* ===== SOMBRAS ===== */
    --shadow-soft:    0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
    --shadow-medium:  0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
    --shadow-strong:  0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
    --shadow-glow:    0 0 40px rgba(212, 0, 15, 0.3);
    --shadow-glow-cyan:  0 0 20px rgba(4, 74, 166, 0.3);
    --shadow-glow-green: 0 0 20px rgba(0, 255, 0, 0.3);

    /* ===== TIPOGRAFIA ===== */
    --font-family:   'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-display:  'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;

    /* ===== ESPAÇAMENTO ===== */
    --spacing-xs:  0.25rem;
    --spacing-sm:  0.5rem;
    --spacing-md:  1rem;
    --spacing-lg:  1.5rem;
    --spacing-xl:  2rem;
    --spacing-2xl: 3rem;
    --spacing-3xl: 4rem;

    /* ===== BORDER RADIUS ===== */
    --radius-sm:   0.25rem;
    --radius-md:   0.5rem;
    --radius-lg:   0.75rem;
    --radius-xl:   1rem;
    --radius-2xl:  1.5rem;
    --radius-full: 9999px;

    /* ===== TRANSIÇÕES ===== */
    --transition-fast:   150ms ease;
    --transition-base:   300ms ease;
    --transition-slow:   500ms ease;
    --transition-bounce: 300ms cubic-bezier(0.68, -0.55, 0.265, 1.55);

    /* ===== Z-INDEX ===== */
    --z-dropdown:       1000;
    --z-sticky:         1020;
    --z-fixed:          1030;
    --z-modal-backdrop: 1040;
    --z-modal:          1050;
    --z-popover:        1060;
    --z-tooltip:        1070;
}
