/* CSS Variables for BrandLift */
:root {
    /* Colors */
    --color-primary: #5932EA; /* Exact purple from CTA */
    --color-primary-hover: #4826C6;
    --color-secondary: #3B82F6; /* Blue accent */
    --color-text-dark: #121212;
    --color-text-light: #5B5B5B; /* Slate gray for paragraphs */
    --color-bg-light: #F9F9FC; /* Very light gray/blue background */
    --color-white: #ffffff;
    --color-border: #E5E7EB;
    --color-footer-bg: #0B0E23; /* Very dark blue for footer */
    
    /* Specific section colors */
    --color-badge-ecommerce-bg: #F4E8FF;
    --color-badge-ecommerce-text: #8B41FF;
    --color-badge-healthcare-bg: #FFF3EB;
    --color-badge-healthcare-text: #FF7B25;
    --color-badge-education-bg: #E7FCEF;
    --color-badge-education-text: #1BA95A;
    
    /* Gradients */
    --gradient-text: linear-gradient(90deg, #5932EA, #3B82F6);
    --gradient-stats: linear-gradient(90deg, #5932EA 0%, #B04DF6 50%, #F56F61 100%);
    --gradient-cta: linear-gradient(135deg, #100D2B 0%, #291D6D 100%);

    /* Typography */
    --font-primary: 'Inter', sans-serif;
    
    /* Font Sizes */
    --fs-h1: 4rem;
    --fs-h2: 2.75rem;
    --fs-h3: 1.25rem;
    --fs-body: 1rem;
    --fs-small: 0.875rem;

    /* Spacing */
    --space-xs: 0.5rem;
    --space-sm: 1rem;
    --space-md: 2rem;
    --space-lg: 3rem;
    --space-xl: 5rem;
    --space-xxl: 8rem;

    /* Layout */
    --container-max-width: 1200px;
    --container-padding: 0 2rem;

    /* Borders & Shadows */
    --radius-sm: 8px; /* Standard button radius */
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-pill: 50px;
    
    --shadow-soft: 0 4px 20px rgba(0, 0, 0, 0.04);
    --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.08);
    --shadow-float: 0 20px 40px rgba(89, 50, 234, 0.15);
    
    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
}