/* ============================================================
   ErgoKid — טוקנים
   ------------------------------------------------------------
   הערכים לקוחים ישירות מהמשתנים של קובץ הפיגמה.
   ============================================================ */

:root {
  /* --- צבעים (Figma variables) --- */
  --blue:   #1B6FA3;   /* כחול — כפתורים, כותרות קלפים, קישורים. הוכהה מ-#217FBA לניגודיות AA (5.4:1 על הרקע) */
  --blue-dark: #155A86; /* ריחוף על כפתורים כחולים */
  --orange: #E6781F;   /* כתום — קלפי הפרומו, אייקונים */
  --green:  #7AB259;   /* ירוק */
  --red:    #D33227;   /* אדום */
  --yellow: #F2BD33;   /* צהוב — "מומלץ!" */
  --ink:    #2E2E2F;   /* שחור — טקסט */
  --gray:   #485356;   /* אפור טקסטים — פוטר */
  --paper:  #FFFDFA;   /* לבן בסיס — רקע */

  /* גוונים עדינים של הטבעות ברקע */
  --tint-green: #EAF3E3;
  --tint-blue:  #E6F0F6;
  --tint-peach: #FAECE6;

  /* --- אפקטים --- */
  --shadow: 0 15px 30px rgba(46, 46, 47, 0.10);   /* "הצללה עדינה" */
  --radius-lg: 5rem;    /* 50px */
  --radius-md: 2.5rem;  /* 25px */

  /* --- מרווחים (אחידים לכל האתר; בנייד מוגדרים מחדש ב-style.css) --- */
  --section-space: 20rem;  /* בין מסך למסך — מהתוכן הגלוי של אחד לתוכן של הבא */
  --head-gap: 5rem;        /* מכותרת המסך (+ פסקת פתיחה) אל התוכן */
  --title-gap: 2.5rem;     /* מכותרת אל הטקסט שמתחתיה */
  --text-gap: 1.6rem;      /* בין פסקה לפסקה */
  --cta-gap: 5rem;         /* מהטקסט אל הכפתור */

  /* --- טיפוגרפיה --- */
  --font: 'OZMezakh', 'Segoe UI', Arial, sans-serif;
}