/* ============================================================
   DESIGN TOKENS — שכבת העיצוב הניתנת להחלפה
   כיוון: Modern Dark Cinematic — כהה עמוק, תאורת אווירה,
   ורוד יוצרים + כתום אנרגיה (קהל: יוצרי תוכן TikTok/Reels)
   ============================================================ */
:root {
  /* ---- בסיס כהה (לא שחור טהור — נמנע מ-OLED smear) ---- */
  --color-bg: #0a0812;
  /* גרדיאנט הרקע הנע — סגול עמוק על שחור */
  --gradient-bg: linear-gradient(115deg,
    #0a0812 0%, #120a24 22%, #1f0e3d 42%, #2a1152 52%, #1f0e3d 62%, #120a24 80%, #0a0812 100%);
  --color-surface: #14141d;
  --color-surface-2: #1c1c28;
  --color-border: #27273a;
  --color-border-strong: #3d3d55;
  --color-text: #f5f4f8;
  --color-text-muted: #a5a2b8;
  --color-text-faint: #6d6a80;

  /* ---- מותג: ורוד יוצרים + כתום אנרגיה ---- */
  --color-accent: #ec4899;
  --color-accent-hover: #f866ac;
  --color-accent-2: #f97316;
  --color-on-accent: #ffffff;
  --gradient-cta: linear-gradient(135deg, #f97316 0%, #ec4899 60%, #d946ef 100%);
  --gradient-text: linear-gradient(120deg, #f97316, #ec4899 55%, #a855f7);

  /* ---- סמנטיים ---- */
  --color-success: #34d399;
  --color-danger: #fb4d5c;

  /* ---- טראקים בטיימליין ---- */
  --track-clip: #6366f1;
  --track-caption: #2dd4bf;
  --track-music: #ec4899;

  /* ---- זוהר ואפקטים ---- */
  --glow-accent: 0 0 34px rgba(236, 72, 153, 0.28);
  --glow-soft: 0 8px 30px rgba(0, 0, 0, 0.45);
  --glass-bg: rgba(255, 255, 255, 0.035);
  --glass-blur: 14px;

  /* ---- טיפוגרפיה (Rubik — עברית מלאה) ---- */
  --font-body: 'Rubik', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --fs-xs: 11px;
  --fs-sm: 12.5px;
  --fs-base: 14px;
  --fs-lg: 17px;
  --fs-xl: 30px;

  /* ---- מבנה וריווח ---- */
  --radius: 14px;
  --radius-sm: 8px;
  --space-1: 6px;
  --space-2: 10px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 40px;
  --content-width: 680px;
  --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.4);
}