/* CSS Variables - Zentrale Farbdefinitionen */
:root {
    /* Hauptfarben */
    --primary: #FF6B35;
    --primary-light: #fff0f0;
    --secondary: #00BFA6;
    --accent: #FFD23F;
    
    /* Hintergrundfarben */
    --dark: #1A1A2E;
    --dark-soft: #2D2D44;
    --light: #F8F9FA;
    --white: #FFFFFF;
    
    /* Gradienten */
    --gradient-warm: linear-gradient(135deg, #ff7543 0%, #ff7b47 100%);
    --gradient-cool: linear-gradient(135deg, #00BFA6 0%, #00D4B8 100%);
    --gradient-accent: linear-gradient(135deg, #FFD23F 0%, #FFE66D 100%);
    
    /* Schatten */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 10px 30px rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.2);
    
    /* Übergänge */
    --transition-fast: 0.2s ease;
    --transition-medium: 0.3s ease;
    --transition-slow: 0.5s ease;
    
    /* Abstände */
    --spacing-xs: 0.5rem;
    --spacing-sm: 1rem;
    --spacing-md: 2rem;
    --spacing-lg: 4rem;
    --spacing-xl: 6rem;
    
    /* Border Radius */
    --radius-sm: 10px;
    --radius-md: 20px;
    --radius-lg: 30px;
    --radius-full: 50px;
}