/* ========================================
   VARIÁVEIS CSS - FCC BRASIL PREMIUM
   Paleta Institucional Byte Play / FCC Brasil
   ======================================== */

:root {
    /* Cores Principais FCC Brasil */
    --azul-profundo: #0A1A3A;
    --azul-tecnico: #163A63;
    --dourado-premium: #D4A857;
    --branco: #FFFFFF;
    --cinza-leve: #E8ECF2;
    
    /* Cores Complementares */
    --azul-escuro-hover: #081428;
    --dourado-hover: #C29847;
    --cinza-medio: #6B7280;
    --cinza-escuro: #374151;
    
    /* Cores de Estado */
    --success: #10B981;
    --warning: #F59E0B;
    --error: #EF4444;
    --info: #3B82F6;
    
    /* Gradientes */
    --gradient-azul: linear-gradient(135deg, var(--azul-profundo), var(--azul-tecnico));
    --gradient-dourado: linear-gradient(135deg, var(--dourado-premium), #C29847);
    --gradient-overlay: linear-gradient(135deg, rgba(10, 26, 58, 0.95), rgba(22, 58, 99, 0.9));
    
    /* Sombras Premium */
    --shadow-sm: 0 2px 8px rgba(10, 26, 58, 0.08);
    --shadow-md: 0 4px 20px rgba(10, 26, 58, 0.12);
    --shadow-lg: 0 10px 40px rgba(10, 26, 58, 0.15);
    --shadow-xl: 0 20px 60px rgba(10, 26, 58, 0.20);
    --shadow-dourado: 0 8px 30px rgba(212, 168, 87, 0.3);
    
    /* Bordas */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-full: 50px;
    
    /* Espaçamentos */
    --spacing-xs: 8px;
    --spacing-sm: 16px;
    --spacing-md: 24px;
    --spacing-lg: 40px;
    --spacing-xl: 60px;
    --spacing-xxl: 80px;
    --spacing-xxxl: 120px;
    
    /* Transições */
    --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    
    /* Tipografia */
    --font-xs: 0.75rem;      /* 12px */
    --font-sm: 0.875rem;     /* 14px */
    --font-base: 1rem;       /* 16px */
    --font-lg: 1.125rem;     /* 18px */
    --font-xl: 1.25rem;      /* 20px */
    --font-2xl: 1.5rem;      /* 24px */
    --font-3xl: 2rem;        /* 32px */
    --font-4xl: 2.5rem;      /* 40px */
    --font-5xl: 3rem;        /* 48px */
    --font-6xl: 4rem;        /* 64px */
    
    /* Container */
    --container-max: 1400px;
    --container-padding: 40px;
    
    /* Z-index */
    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal-backdrop: 1040;
    --z-modal: 1050;
    --z-popover: 1060;
    --z-tooltip: 1070;
}

/* Utilitários de Cor */
.text-azul-profundo { color: var(--azul-profundo); }
.text-azul-tecnico { color: var(--azul-tecnico); }
.text-dourado { color: var(--dourado-premium); }
.text-branco { color: var(--branco); }

.bg-azul-profundo { background-color: var(--azul-profundo); }
.bg-azul-tecnico { background-color: var(--azul-tecnico); }
.bg-dourado { background-color: var(--dourado-premium); }
.bg-cinza-leve { background-color: var(--cinza-leve); }