:root {
    /* Skill Development Course Color Palette */
    --primary-color: #2563eb; /* Professional blue - trustworthy */
    --secondary-color: #7c3aed; /* Purple - creativity & innovation */
    --accent-color: #059669; /* Green - growth & success */
    --accent-warm: #ea580c; /* Orange - energy & enthusiasm */
    --text-primary: #1f2937; /* Dark gray */
    --text-secondary: #4b5563; /* Medium gray */
    --text-light: #6b7280; /* Light gray */
    
    /* Backgrounds */
    --background-primary: #ffffff;
    --background-secondary: #f8fafc;
    --background-accent: #f1f5f9;
    --background-gradient: linear-gradient(135deg, #2563eb 0%, #7c3aed 100%);
    --background-hero: linear-gradient(135deg, #2563eb 0%, #7c3aed 50%, #059669 100%);
    
    /* Professional effects */
    --glass-bg: rgba(255, 255, 255, 0.1);
    --glass-border: rgba(255, 255, 255, 0.2);
    --glass-shadow: 0 8px 32px 0 rgba(37, 99, 235, 0.15);
    
    /* Shadows */
    --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --shadow-colored: 0 8px 25px -8px rgba(37, 99, 235, 0.25);
    
    /* Border radius */
    --radius-sm: 0.375rem;
    --radius-md: 0.5rem;
    --radius-lg: 0.75rem;
    --radius-xl: 1rem;
    --radius-2xl: 1.25rem;
    
    /* Status colors */
    --success-color: #059669;
    --warning-color: #d97706;
    --error-color: #dc2626;
    --info-color: #2563eb;
    
    /* Border colors */
    --border-light: #e5e7eb;
    --border-medium: #d1d5db;
    --border-dark: #9ca3af;
    
    /* Typography */
    --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-heading: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    
    /* Spacing */
    --spacing-xs: 0.5rem;
    --spacing-sm: 1rem;
    --spacing-md: 1.5rem;
    --spacing-lg: 2rem;
    --spacing-xl: 3rem;
    --spacing-2xl: 4rem;
    
    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;
}