/*
 * core-theme/style.css
 * ─────────────────────
 * Design-Token: CSS Custom Properties (Farben, Typografie, Abstände).
 * Standalone – kein Framework-Import notwendig.
 * In andere Projekte kopieren und Werte in :root anpassen.
 */

:root {
  /* Farben */
  --bg:            #f7f9f5;
  --surface:       #ffffff;
  --surface-tinted:#f2f7f0;
  --forest:        #0e1c10;
  --verdant:       #1a4228;
  --meadow:        #2e7d48;
  --sprout:        #5cb975;
  --mist:          #c8e8d0;
  --fern:          #eaf5ed;
  --sand:          #f5f0e6;
  --stone:         #4a5e50;
  --muted:         #6b7e70;
  --amber:         #c86c28;
  --amber-soft:    #fdeedd;
  --line:          rgba(14, 28, 16, 0.08);
  --line-strong:   rgba(14, 28, 16, 0.15);

  /* Schatten */
  --shadow-xs:   0 1px 4px rgba(14, 28, 16, 0.05);
  --shadow-sm:   0 2px 12px rgba(14, 28, 16, 0.07);
  --shadow-md:   0 8px 32px rgba(14, 28, 16, 0.10);
  --shadow-lg:   0 20px 56px rgba(14, 28, 16, 0.13);
  --shadow-glow: 0 0 48px rgba(46, 125, 72, 0.16);

  /* Radien */
  --radius-xl:   28px;
  --radius-lg:   20px;
  --radius-md:   14px;
  --radius-sm:   9px;
  --radius-pill: 999px;

  /* Layout */
  --container: 1180px;
  --header-h:  72px;

  /* Animationen */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
}