/* =========================================================
   ערכת "מעמקים" — פלטה חלופית לבחינה מול הפלטה הקיימת
   נוצר על ידי tools/make_theme.py · אין לערוך ידנית

   מקור: שתי תמונות שיפתח שלח ב-26.8.2026 — דג בטה ועין.
     #FEC4C6 #E8A2F5 #9C79F4 #6473CA #2B74A9 #6EB7CC
     #71DFED #84469C #195AC2 #2C5A7C #111F2C
   שתיהן זוהרות על קרקע כהה, ולכן זו ערכה כהה.

   ⚠️ **חלוקת התפקידים בין שתי משפחות ההדגשה:**
       מה שלוחצים עליו — תכלת.   מה שמתייג — סגול-ורוד.
   כפתורים, קישורים וחצים בתכלת; עינית, מספור, נקודות רשימה והדגשה
   בכותרת בסגול ובוורוד. בלי הכלל הזה שני הצבעים מתחרים על אותו תפקיד
   והעין לא יודעת מה פעולה ומה כותרת.

   נטען אחרון בכוונה — כל מה שכאן נועד לדרוס.
   ========================================================= */

:root{
  --paper:#0D1926;
  --sand:#16293C;
  --tint:#1E3C5C;
  --dark:#2E1B52;
  --line:#27455F;
  --ink:#E9F3F8;
  --ink-2:#9FB8CC;
  --clay:#71DFED;
  --clay-2:#A8ECF6;
  --peach:#E8A2F5;

  /* חדשים בערכה הזאת */
  --orchid:#E8A2F5;
  --violet:#9C79F4;
  --blush:#FEC4C6;
  --plum:#241B45;
  --on-accent:#08131C;

  --shadow:0 1px 2px rgba(0,0,0,.45), 0 16px 40px -20px rgba(0,0,0,.9);
}

/* --- הצבעים שנשארו מקודדים קשיח ב-site.css --- */

/* פס התפריט היה rgba(255,255,255,.94) */
.site-head{ background:rgba(13,25,38,.92); }

/* על צבע פעולה בהיר הטקסט חייב להיות כהה. #fff על #71DFED לא קריא.
   ⚠️ הסלקטור מ-bridge.css הוא (0,2,1) — חייבים להתאים לו, לא רק .btn-primary */
.btn-primary,
header.site-head .btn-primary,
.site-nav .m-cta a,
.skip{ color:var(--on-accent); }

/* "כפתור על רקע כהה" — כל הדף כהה עכשיו, אז הוא הופך למילוי בהיר */
.btn-onDark{ background:var(--ink); color:var(--on-accent); }
.btn-onDark:hover{ background:var(--peach); color:var(--on-accent); }

/* טקסט משני על רצועה כהה: היה #DFD2C8 (בז') */
.band-dark .lead,
.band-dark .muted,
.cta-band p{ color:#C7BEDC; }

/* כרטיסים היו background:var(--paper) — שזה עכשיו רקע הדף עצמו, כלומר
   הם היו נעלמים. מרימים אותם דרגה. */
.card,
.quote{ background:var(--sand); }

/* הרצועה הכהה שוקעת מתחת לרקע במקום לבלוט מעליו — צריך קו שיגדיר אותה */
.band-dark,
.cta-band{ border-block:1px solid var(--line); }

/* הלוגו נבנה מחדש באטימות מלאה, ולכן הוא נושא גודל גדול יותר בלי
   להיראות כבד. פס התפריט הוא 96px, אז 72px משאיר 12px נשימה מכל צד. */
.brand img{ height:58px; }
@media (min-width:64em){ .brand img{ height:72px; } }
.site-foot .brand img{ height:64px; }

/* לוגואי הלקוחות הוחלפו בגרסה בהירה; מרסנים אותם כדי שלא יצעקו */
.logos img{ opacity:.72; }
.logos img:hover{ opacity:1; }

/* טביעת האצבע בשער — נצבעה מחדש במעבר תכלת→סגול, כמו הסנפיר של הדג */
.hero::before{ opacity:.24; }


/* =========================================================
   משפחת התיוג — סגול וורוד
   =========================================================
   כל מה שכאן **מתייג ולא מבצע**: עינית, מספור, נקודות, הדגשה בכותרת.
   כל אלה היו קודם בצבע הפעולה, ולכן הדף כולו נקרא בגוון אחד. */

/* העינית מעל כל כותרת — הסימון הכי חוזר בדף, ולכן הכי משנה */
.eyebrow{ color:var(--orchid); }
.band-dark .eyebrow,
.cta-band .eyebrow{ color:var(--orchid); }

/* מספור: 01 02 03 בכרטיסים, בשלבים וברשימת הסדנאות */
.card .num,
.steps li::before,
.wlist .meta{ color:var(--violet); }

/* נקודות הרשימה */
.ticks li::before{ background:var(--orchid); }
.band-dark .ticks li::before{ background:var(--orchid); }

/* המילה המודגשת בכותרת השער */
.hero h1 em{ color:var(--orchid); }

/* סימן ה-+ ב"שאלות נפוצות" — תיוג של מצב, לא כפתור */
.faq summary::after{ color:var(--orchid); }

/* הניצוץ היחיד של הוורוד: הקו מתחת לדרך שנבחרה בתפריט */
.site-nav a[aria-current="page"]{ color:var(--blush); }


/* =========================================================
   רצועות בגוון אחר, לא רק בבהירות אחרת
   =========================================================
   ⚠️ הרצועות היו כולן כחולות בבהירויות שונות, והדף נקרא כמשטח אחד.
   על רקע כהה העין מבחינה בהפרש בהירות הרבה פחות טוב מאשר על רקע בהיר;
   מה שבאמת מפריד רצועה זה **גוון**. */
.band-tint{ background:var(--plum); }

/* ⚠️ דף הבית לא משתמש ב-band-tint בכלל — שלוש הרצועות שלו הן כולן
   `band-sand`, ולכן כולן יצאו באותו נייבי בדיוק והפאנל הסגול לא הופיע
   באף מקום. במקום להוסיף מחלקה ל-build.py (שהיה משנה גם את הגרסה
   הקיימת), הרצועה האמצעית נבחרת כאן: ‎~‎ בוחר את השנייה ואילך, והכלל
   שאחריו מחזיר את השלישית. התוצאה: נייבי · חול · נייבי · **סגול** ·
   נייבי · חול · **סגול עמוק** (ה-CTA). */
.band-sand ~ .band-sand{ background:var(--plum); }
.band-sand ~ .band-sand ~ .band-sand{ background:var(--sand); }

/* על הפאנל הסגול העינית עוברת לוורוד — הסגול-ורוד היה נבלע בו */
.band-tint .eyebrow,
.band-sand ~ .band-sand .eyebrow{ color:var(--blush); }
.band-sand ~ .band-sand ~ .band-sand .eyebrow{ color:var(--orchid); }

/* הכפתור הבהיר על רצועה כהה — ההובר עובר לורוד ולא לתכלת, כדי שהתכלת
   תישאר שמורה למצב הרגיל של פעולה */
.btn-onDark:hover{ background:var(--blush); color:var(--on-accent); }
.cta-ways a:hover{ border-bottom-color:var(--orchid); color:var(--orchid); }

/* --- הדף המיובא מאלמנטור --- */
/* מנוע ההיפוך כבר טיפל בקובץ עצמו. כאן רק מה שההיפוך לא יכול לדעת: */

/* מסגרת התמונה הייתה קו שיער שחור על קרם. ההיפוך נתן לה לבן, וזה חד מדי
   מול הרקע — הקו במקור היה עדין, לא בולט. */
.about-import .elementor-element-9253029{
  border-color:var(--line) !important;
}

/* כפתורי הפעולה בדף המיובא. ההיפוך עשה את שלו נכון — כפתור כהה על דף
   בהיר הפך לכפתור בהיר על דף כהה — אבל התוצאה היא כחול-אפור עמום, בזמן
   שזה ה-CTA הראשי של העמוד. צבע פעולה הוא החלטה, לא תוצר לוואי. */
.imported-page .elementor-button{
  background-color:var(--clay) !important;
  color:var(--on-accent) !important;
}
.imported-page .elementor-button:hover{
  background-color:var(--clay-2) !important;
}

/* הכותרות בדף המיובא — משפחת התיוג, כמו העינית בשאר האתר.
   מנוע ההיפוך כבר שולח את גוון הזית לסגול-ורוד, וזה מכסה את רובן;
   הכלל הזה מטפל במה שהיה שחור ולכן יצא לבן ניטרלי. */
.imported-page h2 .elementor-heading-title,
.imported-page .elementor-widget-heading .elementor-heading-title{
  color:var(--orchid);
}

/* המילים המודגשות בתוך הפסקאות נשארות בצבע הטקסט — הן דגש טיפוגרפי,
   לא תיוג, ולצבוע אותן היה הופך את הדף לעיסת צבע. */
.imported-page p strong,
.imported-page p b,
.imported-page span strong{ color:inherit; }

/* =========================================================
   ליווי עסקי — שני תיקוני טלפון
   =========================================================
   ⚠️ שני הכללים האלה משנים **טלפון בלבד**, ולא מתוך
   זהירות — נמדד: בדסקטופ `margin-top` הוא 0 וה-`::before`
   חסר רקע לגמרי. שניהם מוגדרים באלמנטור רק בתוך
   `@media(max-width:767px)`, ולכן זה גם הרוחב שבו מתקנים.

   1. **הטקסט טיפס על תמונת השער.** אלמנטור מושך את הבלוק
      למעלה ב-75px בטלפון. נמדד ב-393px: תחתית התמונה 554,
      ראש בלוק הטקסט 543 — חפיפה של 11px. במקום זה מרווח חיובי קטן:
      הבלוק יורד ל-642 והשורה הראשונה ל-667 — כ-59px מתחת לתמונה.

   2. **טביעת האצבע לא נקראה כטביעת אצבע.** הקובץ הוא
      1037×1440, התיבה היא 373×1182, ו-`cover` מותח אותו ל-850px
      רוחב — כלומר רואים 44% ממנו, ומקרוב זה סתם קווים.
      גודל קצוב + עיגון למעלה מחזירים לה צורה, והאטימות
      עולה מ-.10 ל-.17 כדי שיהיה ברור שזו הטביעה ולא רעש. */
/* ⚠️ **ניגודיות — כשל מדוד ברמה AA.** מנוע ההיפוך הוציא
   את כותרות האקורדיון ל-#BEA3C7 על #2D484B — יחס של **4.32**,
   מול דרישה של 4.5 לטקסט בגודל הזה. הגוון והרוויה נשמרים
   בדיוק — רק הבהירות עולה, עד יחס 4.69. ההבדל לא נראה
   לעין, והוא מה שמפריד בין עמידה בתקן לבין כשל. */
.imported-page .e-n-accordion-item-title-text{ color:#C4ABCC; }

@media (max-width:767px){
  .imported-page .elementor-723 .elementor-element.elementor-element-74c1534{
    --margin-top:1.5rem;
    --overlay-opacity:.17;
  }
  .imported-page .elementor-723 .elementor-element.elementor-element-74c1534::before{
    background-size:64% auto;
    background-position:center 1.5rem;
  }
}

/* --- טקסט מעל תמונה --- */
/* ⚠️ הגבול של היפוך הבהירות: התמונה לא מתהפכת. טקסט לבן שישב על
   צילום הפך לכחול כהה ונעלם. 6 המקטעים האלה זוהו אוטומטית לפי
   background-image, ומקבלים בחזרה טקסט בהיר. */
.imported-page .elementor-element-37e4cf0,
.imported-page .elementor-element-4312f48,
.imported-page .elementor-element-4fd7e1f,
.imported-page .elementor-element-74c1534,
.imported-page .elementor-element-9dbb89c,
.imported-page .elementor-element-e897b6b,
.imported-page .elementor-element-37e4cf0 :is(h1,h2,h3,h4,h5,p,span,li,a,strong,em),
.imported-page .elementor-element-4312f48 :is(h1,h2,h3,h4,h5,p,span,li,a,strong,em),
.imported-page .elementor-element-4fd7e1f :is(h1,h2,h3,h4,h5,p,span,li,a,strong,em),
.imported-page .elementor-element-74c1534 :is(h1,h2,h3,h4,h5,p,span,li,a,strong,em),
.imported-page .elementor-element-9dbb89c :is(h1,h2,h3,h4,h5,p,span,li,a,strong,em),
.imported-page .elementor-element-e897b6b :is(h1,h2,h3,h4,h5,p,span,li,a,strong,em){
  color:var(--ink) !important;
}

/* --- כפתור בתוך מקטע תמונה --- */
.imported-page .elementor-element-37e4cf0 .elementor-button,
.imported-page .elementor-element-37e4cf0 .elementor-button span,
.imported-page .elementor-element-4312f48 .elementor-button,
.imported-page .elementor-element-4312f48 .elementor-button span,
.imported-page .elementor-element-4fd7e1f .elementor-button,
.imported-page .elementor-element-4fd7e1f .elementor-button span,
.imported-page .elementor-element-74c1534 .elementor-button,
.imported-page .elementor-element-74c1534 .elementor-button span,
.imported-page .elementor-element-9dbb89c .elementor-button,
.imported-page .elementor-element-9dbb89c .elementor-button span,
.imported-page .elementor-element-e897b6b .elementor-button,
.imported-page .elementor-element-e897b6b .elementor-button span{
  color:var(--on-accent) !important;
}

/* --- הצללה על תצלום --- */
/* ⚠️ **הצללה היא לא דיו, ולכן היא לא מתהפכת.** במקור השכבה
   הזאת שחורה בשקיפות 0.2 ומעמיקה את הניגוד של הצילום. מנוע
   ההיפוך ראה #000000, קרא לזה "דיו", והחזיר #E9F3F8 — כלומר
   צעיף לבן ב-20% מעל התמונה. יפתח תיאר את זה כ"פילטר שגורם
   לה להיראות פחות חדה", וזה בדיוק מה שניגוד נמוך עושה לעין.
   3 מקטעים זוהו אוטומטית: ::before עם --background-overlay
   ועם background-color, שיושב על מקטע עם תמונת רקע. */
.imported-page .elementor-element-4fd7e1f::before,
.imported-page .elementor-element-9dbb89c::before,
.imported-page .elementor-element-e897b6b::before{
  background-color:#000 !important;
}

/* --- מסגרות עבות --- */
/* ⚠️ הצבע שלהן מגיע מ-var() שההקסה שלו יושבת בבלוק הגלובלים של
   אלמנטור, בלי border-width לידה — ולכן מנוע ההיפוך לא יכול לדעת
   שזו מסגרת עבה ומחזיר תכלת רוויה. 19 המקטעים זוהו אוטומטית. */
.imported-page .elementor-element-1a40f17,
.imported-page .elementor-element-1efe2585,
.imported-page .elementor-element-37e4cf0,
.imported-page .elementor-element-42dc9a4f,
.imported-page .elementor-element-4fd7e1f,
.imported-page .elementor-element-52a60f6,
.imported-page .elementor-element-59b6c2c,
.imported-page .elementor-element-5f98dd8,
.imported-page .elementor-element-5fa39cb,
.imported-page .elementor-element-68c11c0,
.imported-page .elementor-element-7b79056,
.imported-page .elementor-element-7fc67be,
.imported-page .elementor-element-835d1f8,
.imported-page .elementor-element-9642762,
.imported-page .elementor-element-9dbb89c,
.imported-page .elementor-element-adf5998,
.imported-page .elementor-element-bd9f8e8,
.imported-page .elementor-element-d47228b,
.imported-page .elementor-element-db8c104{
  border-color:var(--tint) !important;
}

/* --- שקיפות קישוטי הרקע --- */
/* 13 קישוטים שזוהו אוטומטית. הצבע נקבע במנוע, השקיפות כאן. */
.imported-page img[src*="19cb81______-3.png"],
.imported-page img[src*="1bf841______-2-300x300.png"],
.imported-page img[src*="22f2a5______-1-150x150.png"],
.imported-page img[src*="395e1d______-3-150x150.png"],
.imported-page img[src*="46be2c______-1.png"],
.imported-page img[src*="891c19______-1-300x300.png"],
.imported-page img[src*="8ad97f______-2.png"],
.imported-page img[src*="8d1faf______-____-1-1-1.png"],
.imported-page img[src*="8d1faf______-____-1-1-1.png"],
.imported-page img[src*="c120d6______-3-300x300.png"],
.imported-page img[src*="e1979a______.png"],
.imported-page img[src*="e1979a______.png"],
.imported-page img[src*="e7ff6e______-2-150x150.png"]{
  opacity:.5;
}
