/* ── CSS Custom Properties ────────────────────────────────────────────────────
   Zentrale Design-Tokens. Eingebunden von allen Seiten.
   Änderungen hier wirken sich auf die gesamte Website aus.
──────────────────────────────────────────────────────────────────────────── */
:root {
    /* Farben (Dark Mode Standard) */
    --color-bg:               #0a0a0a;
    --color-surface:          #1a1a1a;
    --color-surface-elevated: #252525;
    --color-text:             #e8e8e8;
    --color-text-muted:       #a0a0a0;
    --color-accent:           #f4f4f4;
    --color-accent-warm:      #0875C3;
    --color-border:           #333;
    --color-error:            #ff6b6b;
    --color-success:          #51cf66;

    /* Typografie */
    --font-display: 'Playfair Display', serif;
    --font-mono:    'IBM Plex Mono', monospace;
    --font-body:    'Work Sans', sans-serif;

    /* Animationen */
    --transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Light Mode */
[data-theme="light"] {
    --color-bg:               #f5f5f0;
    --color-surface:          #ffffff;
    --color-surface-elevated: #ebebeb;
    --color-text:             #1a1a1a;
    --color-text-muted:       #5a5a5a;
    --color-accent:           #1a1a1a;
    --color-accent-warm:      #0875C3;
    --color-border:           #d0d0d0;
    --color-error:            #d63031;
    --color-success:          #00b894;
}

/* Reset */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}