/* ============================================
   DESIGN SYSTEM — VARIÁVEIS GLOBAIS
   Paleta Premium: Navy + Dourado + Branco
   ============================================ */

:root {
    /* === CORES PRINCIPAIS === */
    /* Azul-marinho profundo — base da identidade */
    --color-primary:        #0f1a2e;
    --color-primary-mid:    #162236;
    --color-primary-light:  #1e3050;
    --color-primary-lighter:#253a60;

    /* Dourado / Âmbar — accent e destaques */
    --color-gold:           #d4a843;
    --color-gold-dark:      #b8892e;
    --color-gold-light:     #e8c06e;
    --color-gold-pale:      #fdf3dc;

    /* Verde esmeralda — sucesso / positivo */
    --color-green:          #10b981;
    --color-green-dark:     #059669;
    --color-green-light:    #d1fae5;

    /* Vermelho — perigo / atenção */
    --color-danger:         #ef4444;
    --color-danger-light:   #fee2e2;

    /* Neutros */
    --color-white:          #ffffff;
    --color-gray-50:        #f9fafb;
    --color-gray-100:       #f3f4f6;
    --color-gray-200:       #e5e7eb;
    --color-gray-400:       #9ca3af;
    --color-gray-500:       #6b7280;
    --color-gray-700:       #374151;
    --color-gray-900:       #111827;

    /* === SEMÂNTICO === */
    --color-text-primary:   #0f1a2e;
    --color-text-secondary: #4b5563;
    --color-text-tertiary:  #9ca3af;
    --color-text-on-dark:   rgba(255,255,255,0.92);
    --color-text-muted:     rgba(255,255,255,0.60);

    --color-bg-primary:     #ffffff;
    --color-bg-secondary:   #f9fafb;
    --color-bg-tertiary:    #f3f4f6;
    --color-bg-dark:        #0a1220;
    --color-bg-dark-mid:    #0f1a2e;

    /* Accent aliases para componentes herdados */
    --color-accent:         var(--color-gold);
    --color-accent-dark:    var(--color-gold-dark);
    --color-accent-light:   var(--color-gold-light);
    --color-success:        var(--color-green);

    /* === GRADIENTES REUTILIZÁVEIS === */
    --gradient-hero:        linear-gradient(135deg, #0a1220 0%, #0f1a2e 50%, #162236 100%);
    --gradient-gold:        linear-gradient(135deg, var(--color-gold) 0%, var(--color-gold-dark) 100%);
    --gradient-green:       linear-gradient(135deg, #10b981 0%, #059669 100%);
    --gradient-dark-card:   linear-gradient(135deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%);

    /* === GLASSMORPHISM === */
    --glass-bg:             rgba(255,255,255,0.06);
    --glass-border:         rgba(255,255,255,0.12);
    --glass-blur:           blur(20px);
    --glass-bg-light:       rgba(255,255,255,0.80);
    --glass-border-light:   rgba(255,255,255,0.50);

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

    --font-size-xs:   0.75rem;
    --font-size-sm:   0.875rem;
    --font-size-base: 1rem;
    --font-size-lg:   1.125rem;
    --font-size-xl:   1.25rem;
    --font-size-2xl:  1.5rem;
    --font-size-3xl:  1.875rem;
    --font-size-4xl:  2.25rem;
    --font-size-5xl:  3rem;

    --font-weight-normal:    400;
    --font-weight-medium:    500;
    --font-weight-semibold:  600;
    --font-weight-bold:      700;
    --font-weight-extrabold: 800;
    --font-weight-black:     900;

    --line-height-tight:   1.2;
    --line-height-normal:  1.5;
    --line-height-relaxed: 1.75;

    /* === ESPAÇAMENTO (Sistema 8pt) === */
    --space-1:  0.25rem;
    --space-2:  0.5rem;
    --space-3:  0.75rem;
    --space-4:  1rem;
    --space-5:  1.25rem;
    --space-6:  1.5rem;
    --space-8:  2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;
    --space-32: 8rem;

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

    /* === SOMBRAS === */
    --shadow-sm:   0 1px 3px rgba(0,0,0,0.08);
    --shadow-base: 0 4px 12px rgba(0,0,0,0.08);
    --shadow-md:   0 8px 24px rgba(0,0,0,0.12);
    --shadow-lg:   0 16px 48px rgba(0,0,0,0.16);
    --shadow-xl:   0 24px 64px rgba(0,0,0,0.20);
    --shadow-gold: 0 8px 32px rgba(212,168,67,0.30);
    --shadow-glow: 0 0 40px rgba(212,168,67,0.15);

    /* === TRANSIÇÕES === */
    --transition-fast: 150ms cubic-bezier(0.4,0,0.2,1);
    --transition-base: 250ms cubic-bezier(0.4,0,0.2,1);
    --transition-slow: 400ms cubic-bezier(0.4,0,0.2,1);

    /* === Z-INDEX === */
    --z-sticky:         1020;
    --z-modal-backdrop: 1040;
    --z-modal:          1050;

    /* === BREAKPOINTS === */
    --breakpoint-sm: 640px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 1024px;
    --breakpoint-xl: 1280px;
}