/* =========================================================
   גשר בין הדף המיובא לבין האתר
   ========================================================= */

/* --- הקרוסלה: גלילה נייטיבית במקום ספריית Swiper --- */
/* .swiper נשאר overflow:hidden כמו במקור, כדי שהשקופית הבאה לא תציץ.
   הגלילה עוברת ל-.swiper-wrapper. */
.imported-page .swiper-wrapper{
  display:flex;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  transform:none !important;      /* Swiper מזיז ב-transform; כאן גוללים */
  scrollbar-width:none;
}
.imported-page .swiper-wrapper::-webkit-scrollbar{ display:none }
.imported-page .swiper-slide{
  flex:0 0 100%;
  scroll-snap-align:center;
  height:auto;
}

/* נקודות הניווט */
.imported-page .swiper-pagination{
  position:static; display:flex; gap:.25rem; justify-content:center;
  margin-top:1.25rem; width:auto;
}
.imported-page .swiper-pagination-bullet{
  width:44px; height:44px; padding:0; border:0; background:transparent;
  border-radius:0; opacity:1; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
}
.imported-page .swiper-pagination-bullet::before{
  content:""; width:9px; height:9px; border-radius:999px;
  background:#BEA3C7; opacity:.3;
}
.imported-page .swiper-pagination-bullet-active::before{ opacity:1 }

.imported-page .elementor-swiper-button{
  cursor:pointer; z-index:5;
  min-width:44px; min-height:44px;
  display:inline-flex; align-items:center; justify-content:center;
}

/* --- המפריד שמעל "שאלות נפוצות" --- */
/* במקור המקטע שקדם לו היה "נעים מאוד" ברקע קרם, ולכן המפריד צויר בקרם.
   הסרנו את המקטע ההוא, והמקטע שמעליו עכשיו לבן — אז הקרם נראה כמשולש
   תלוש. צובעים את המפריד באותו לבן, כך שנשאר רק הקרע. */
.imported-page .elementor-element-db8c104 .elementor-shape-top svg path{
  fill:#0E1A27 !important;
}

/* --- הגנה על שלד האתר --- */
header.site-head, header.site-head *,
footer.site-foot, footer.site-foot *{
  font-family:Heebo,"Segoe UI",system-ui,sans-serif;
}
header.site-head .btn-primary{ color:#0D1926 }
header.site-head a, footer.site-foot a{ text-decoration:none }

/* כותרת h1 לנגישות ול-SEO — הדף המיובא בנוי מפסקאות בלבד */
.visually-hidden{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}

/* --- מסגרת השער --- */
/*
   שתי בעיות שונות, שתיהן נובעות מכך שהכותרת שלנו אינה זהה לזו של המקור:

   1. גובה. בדף המקור התפריט **שקוף** ומרחף מעל התמונה, ולכן השער תופס
      מסך מלא. כאן הכותרת אטומה, 73px. משיכת השער למעלה ב-margin שלילי
      אכן מיישרת את אזור התמונה למקור — אבל דוחפת את הכיתוב מתחת לפס
      האטום, ושתי השורות הראשונות נעלמות. לכן: השער מתחיל מתחת לכותרת,
      וגובהו מסך פחות הכותרת. פריים פתיחה של מסך אחד בדיוק, כמו במקור,
      בלי שאף פיקסל מהתמונה מוסתר.

   2. יישור אנכי. השער במקור הוא flex עם **שני** ילדים: הלוגו הפנימי
      למעלה והכיתוב למטה, ו-space-between מפריד ביניהם. הסרנו את הלוגו
      הפנימי (יש לנו כותרת אתר), ואז space-between עם ילד יחיד מצמיד
      אותו לראש. לכן מחליפים ביישור מפורש לתחתית.
      ⚠️ כלל: הסרת ילד מתוך מכולת flex משנה את מיקום שאר הילדים.
*/
.imported-page .elementor-element-e897b6b{
  margin-top:0 !important;
  justify-content:flex-end !important;
}
@media (min-width:768px){
  .imported-page .elementor-element-e897b6b{
    --min-height:calc(100vh - var(--hdr-h) - 1px) !important;
    min-height:calc(100vh - var(--hdr-h) - 1px) !important;
  }
}
@supports (height:100svh){
  @media (min-width:768px){
    .imported-page .elementor-element-e897b6b{
      --min-height:calc(100svh - var(--hdr-h) - 1px) !important;
      min-height:calc(100svh - var(--hdr-h) - 1px) !important;
    }
  }
}
/* 3. גזירת התמונה. ברוחב 1367px ומעלה המקור נותן לרקע
      background-attachment:fixed — כלומר התמונה נצבעת ביחס ל**חלון הדפדפן**,
      לא ביחס לקופסה. לכן הזזת הקופסה לא מזיזה אותה במילימטר, והכותרת האטומה
      פשוט מכסה את 73 הפיקסלים העליונים שלה. מה שכן מזיז אותה הוא
      background-position: חצי מגובה הכותרת (36.5px) מטה ממרכז החלון —
      וכך התמונה חוזרת להיות ממורכזת בתוך השטח שבאמת נראה.
      ⚠️ כלל: עם background-attachment:fixed, שטח המיקום הוא ה-viewport.
      אין טעם להזיז את האלמנט — מזיזים את ה-position. */
@media (min-width:1367px){
  .imported-page .elementor-element-e897b6b{
    background-position:center calc(50% + (var(--hdr-h) + 1px) / 2) !important;
  }
}
/* במובייל המקור נותן לשער 60vh עם padding-bottom אפס — הכיתוב היה נצמד
   לקצה התחתון ברגע שהיישור עבר לתחתית. */
@media (max-width:767px){
  .imported-page .elementor-element-e897b6b{ padding-bottom:44px !important; }
}

/* --- לשונית "מי אני" --- */
/* בדף המקור המקטע יושב מתחת למקטע לבן, ומשולש מפריד חותך ביניהם. כאן הוא
   הדבר הראשון בדף — אין ממה להפריד, והמשולש נראה כמו חיתוך אקראי בפינה.
   מורידים אותו, והרקע הקרמי מתחיל ישר מתחת לתפריט העליון.
   בעקבות זה גם המרווח העליון של המקור (100px) נהיה גדול מדי — הוא בא
   לפצות על 40px של משולש שכבר לא שם. */
.about-import .elementor-element-adf5998 > .e-con-inner > .elementor-shape-top{
  display:none !important;
}
.about-import .elementor-element-adf5998 > .e-con-inner{
  padding-top:56px !important;
}

/* יישור התמונה לראש הטקסט.
   במקור התמונה `align-self:center` בתוך שורת flex, ובמקרה — כי הטקסט שם
   קצר — היא יצאה מיושרת לראש הכותרת (פער 2.5px בלבד, נמדד).
   המלל כאן ארוך בהרבה, העמודה גבוהה יותר, והמירכוז מפיל את התמונה
   154px נמוך יותר. אז מיישרים לראש במפורש.
   ⚠️ המספר לא שרירותי: ווידג'ט התמונה יושב 25px פנימה מהמסגרת ועוד 1px
   של קו המסגרת. margin שלילי בדיוק בגודל הזה מחזיר את **התמונה** (לא את
   המסגרת) לגובה ראש הטקסט — וזה מה שהעין רואה במקור. */
@media (min-width:768px){
  .about-import .elementor-element-9253029{
    align-self:flex-start !important;
    margin-top:calc(-25px - 1px) !important;
  }
}
@media (max-width:767px){
  .about-import .elementor-element-adf5998 > .e-con-inner{
    padding-top:32px !important;
  }
}

/* --- דליפה מ-site.css אל תוך הדף המיובא --- */
/* site.css מגדיר `h1,h2,h3,h4{letter-spacing:-.015em}` על תגיות ערומות,
   ואלמנטור לא מגדיר letter-spacing בכלל — ולכן הכלל שלנו חלחל פנימה
   וכיווץ כל כותרת בדף המיובא. "נעים מאוד" יצא 187px במקום 193px.
   ⚠️ כלל: כלל גלובלי על תגית ערומה בגיליון של האתר נכנס גם לדף המיובא.
   כל מאפיין שאלמנטור לא מגדיר בעצמו — צריך לאפס אותו כאן במפורש. */
.imported-page h1, .imported-page h2, .imported-page h3,
.imported-page h4, .imported-page h5, .imported-page h6{
  letter-spacing:normal;
}

/* --- אנימציית כניסה --- */
/* אלמנטור מסתיר widget עם אנימציה (visibility:hidden) ומסיר את הסימון
   ב-JS כשגוללים אליו. כאן אין את מנוע האנימציות שלו, ולכן הכלי מסמן את
   שם האנימציה ב-data-anim ו-IntersectionObserver זעיר עושה את השאר.
   ⚠️ ההסתרה תלויה במחלקה `anim-ready` שה-JS מוסיף. בלי JS — הכל נראה.
   ויש גם רשת ביטחון: אחרי 3 שניות המחלקה יורדת בכל מקרה. */
.imported-page.anim-ready [data-anim]{ visibility:hidden; }
@media (prefers-reduced-motion: reduce){
  .imported-page.anim-ready [data-anim]{ visibility:visible; }
}
