/**
 * CSS Variables (Design Tokens)
 * Zentrale Definition aller Farben, Abstände und anderen Designwerte
 */

:root {
    /* Colors */
    --primary-color: #1a1a1a;
    --secondary-color: #ffffff;
    --accent-color: #8b8b8b;
    --text-color: #2d2d2d;
    --light-text: #6a6a6a;
    --border-color: #e5e5e5;
    --overlay-color: rgba(0, 0, 0, 0.65);
    --bg-light: #fafafa;
    
    /* Spacing */
    --spacing-xs: 8px;
    --spacing-sm: 16px;
    --spacing-md: 24px;
    --spacing-lg: 32px;
    --spacing-xl: 48px;
    --spacing-2xl: 60px;
    
    /* Typography */
    --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-heading: 'Playfair Display', serif;
    
    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    
    /* Breakpoints (für Media Queries) */
    --breakpoint-tablet: 768px;
    --breakpoint-desktop: 1024px;
    --breakpoint-wide: 1600px;
}