/* ==========================================================================
   TraidMerce – Design Tokens
   Zentrale Stelle für Farben, Radien, Schatten & Spacing.
   Neue Sektionen/Seiten sollen ausschließlich diese Variablen nutzen,
   damit das Theme an einer Stelle änderbar bleibt.
   ========================================================================== */

:root {
  /* Lila-Skala */
  --purple-950: #1c1033;
  --purple-900: #2a1855;
  --purple-800: #3b2172;
  --purple-700: #5b30a6;
  --purple-600: #7c3aed;
  --purple-500: #9061f9;
  --purple-400: #a78bfa;
  --purple-300: #c4b5fd;

  /* Pastelltöne (Akzente / Übergänge) */
  --pastel-lavender: #e9defc;
  --pastel-pink: #f6d6f0;
  --pastel-peach: #ffe3ec;
  --pastel-blue: #dce9ff;
  --pastel-mint: #dcfce0;

  /* Neutrals */
  --bg-body: #faf8ff;
  --bg-surface: #ffffff;
  --text-main: #241736;
  --text-muted: #6b6280;
  --border-soft: #ece5fb;

  /* Gradients */
  --gradient-hero: linear-gradient(135deg, var(--purple-900) 0%, var(--purple-600) 45%, #b98be0 75%, var(--pastel-peach) 100%);
  --gradient-accent: linear-gradient(120deg, var(--purple-500), var(--pastel-pink));
  --gradient-surface: linear-gradient(180deg, var(--bg-body) 0%, var(--pastel-lavender) 100%);

  /* Typo */
  --font-main: 'Poppins', 'Segoe UI', sans-serif;

  /* Sonstiges */
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --shadow-soft: 0 10px 30px rgba(91, 48, 166, 0.12);
  --shadow-strong: 0 20px 50px rgba(42, 24, 85, 0.25);
  --transition-base: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  --max-width: 1180px;
}