/* ============================================================
   Contentflow — Design Tokens
   Quelle: cadence_design.md §3–§6
   ============================================================ */

:root {

  /* ----------------------------------------------------------
     Primär (Indigo)
  ---------------------------------------------------------- */
  --c-primary:        #4F46E5;
  --c-primary-hover:  #4338CA;
  --c-primary-active: #3730A3;
  --c-primary-subtle: #EEF2FF;
  --c-primary-border: #C7D2FE;

  /* ----------------------------------------------------------
     Neutral (Slate)
  ---------------------------------------------------------- */
  --c-bg:           #F8FAFC;
  --c-surface:      #FFFFFF;
  --c-border:       #E2E8F0;
  --c-border-strong:#CBD5E1;
  --c-text:         #0F172A;
  --c-text-muted:   #64748B;
  --c-text-faint:   #94A3B8;

  /* ----------------------------------------------------------
     Semantik
  ---------------------------------------------------------- */
  --c-success:        #16A34A;
  --c-success-subtle: #F0FDF4;
  --c-warning:        #D97706;
  --c-warning-subtle: #FFFBEB;
  --c-danger:         #DC2626;
  --c-danger-subtle:  #FEF2F2;
  --c-info:           #2563EB;
  --c-info-subtle:    #EFF6FF;

  /* ----------------------------------------------------------
     Plattform-Markenfarben
  ---------------------------------------------------------- */
  --c-facebook:   #1877F2;
  --c-instagram:  #E1306C;
  --c-youtube:    #FF0000;
  --c-linkedin:   #0A66C2;
  --c-tiktok:     #000000;
  --c-wordpress:  #21759B;

  /* ----------------------------------------------------------
     Typografie
  ---------------------------------------------------------- */
  --font-display: 'Space Grotesk', system-ui, sans-serif;
  --font-body:    'Inter', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', monospace;

  --text-xs:   13px;
  --text-sm:   15px;
  --text-base: 16px;
  --text-h3:   18px;
  --text-h2:   22px;
  --text-h1:   28px;

  --leading-body: 1.5;

  /* ----------------------------------------------------------
     Spacing
  ---------------------------------------------------------- */
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  20px;
  --s-6:  24px;
  --s-8:  32px;
  --s-12: 48px;
  --s-16: 64px;

  /* ----------------------------------------------------------
     Border-Radius
  ---------------------------------------------------------- */
  --r-sm:   6px;
  --r-md:   10px;
  --r-lg:   14px;
  --r-pill: 999px;

  /* ----------------------------------------------------------
     Elevation (Schatten)
  ---------------------------------------------------------- */
  --e-1: 0 1px 2px rgba(15,23,42,.06);
  --e-2: 0 4px 12px rgba(15,23,42,.10);
  --e-3: 0 12px 32px rgba(15,23,42,.18);

  /* ----------------------------------------------------------
     Layout
  ---------------------------------------------------------- */
  --sidebar-width:      240px;
  --sidebar-width-rail: 64px;
  --topbar-height:      56px;
  --content-max:        1200px;
  --content-padding:    32px;
}