/* ============================================================================
   תיקוני רספונסיביות רוחביים — נטען בכל עמוד (ראו wire_nav ב-app.py).
   כל תיקון כאן נובע ממדידה בפועל בדפדפן ב-375/414/768/1024/1366/1920,
   ולא משיפוץ עיוור. 1089px = נקודת השבירה של הכותרת (ראו cms-nav.css).
   ========================================================================== */

/* ---------------------------------------------------------------------------
   1. גלילה אופקית ב-375/414/768 בעמוד הבית.
   שתי תמונות דקורטיביות ממוקמות אבסולוטית "בורחות" מהמקטע שלהן
   (elementor-element-7e514b5 עם left:-4px, ו-f9e3404 עם right:-37.5px)
   ויצרו גלילה של 4px. המקטע האח 5373ab7 כבר מוגדר overflow:clip visible —
   כאן משלימים את אותו טיפול לשני המקטעים שנשכחו.
   clip (ולא hidden) לא יוצר מיכל גלילה ולא שובר sticky.
   ------------------------------------------------------------------------- */
@media (max-width:1089px){
  .elementor-25 .elementor-element.elementor-element-04b8fbd,
  .elementor-25 .elementor-element.elementor-element-f07c9d2{
    overflow-x:clip;overflow-y:visible;
  }
}

/* ---------------------------------------------------------------------------
   2. עמוד מאמר, 768–1024: רשימת "מאמרים נוספים" (elementor-element-540618d)
   מוגדרת elementor-grid-tablet-2 — שתי עמודות של ~180px — בתוך עמודה צדדית
   ברוחב 210–279px בלבד. נמדדה גלילה אופקית של 105–141px בכל עמודי המאמרים.
   מתחת ל-1090 מכריחים עמודה אחת (מתחת ל-768 זה ממילא המצב).
   ------------------------------------------------------------------------- */
@media (max-width:1089px){
  .elementor-element-540618d .elementor-loop-container.elementor-grid{
    grid-template-columns:1fr !important;
  }
}

/* ---------------------------------------------------------------------------
   3. קישורי הפוטר נמדדו בגובה 13px בכל רוחב — נכשלים בגודל יעד מינימלי
   בכל מכשיר, לא רק בנייד. לכן זה מחוץ למדיה-קוורי.
   ------------------------------------------------------------------------- */
footer .elementor-icon-list-item > a{
  display:flex;align-items:center;min-height:44px;
}

/* ---------------------------------------------------------------------------
   4. יעדי מגע קטנים מ-44px במצב נייד/טאבלט (WCAG 2.5.5).
   נמדדו: כפתור "יצירת קשר" בכותרת 40px, צ'יפים של שנה בעמוד העדכונים 36px,
   צ'יפים של נושא בעמוד ההרצאות 41px, תוכן העניינים בעמודים המשפטיים 24px,
   טלפון/מייל בכרטיסי הצוות 34px, ניווט המפה 36px, "הקודם/הבא" במאמר 30px.
   ------------------------------------------------------------------------- */
@media (max-width:1089px){
  .elementor-button{min-height:44px}
  .upd-chip,.vp-chip{min-height:44px}
  .lgl-toc a{padding-block:10px;min-height:44px}
  .lgl-toc li{margin-bottom:2px}
  .lgl-toc-head{min-height:44px}
  .elementor-icon-list-item > a[href^="tel:"],
  .elementor-icon-list-item > a[href^="mailto:"],
  .elementor-icon-list-item > a[href^="https://wa.me"]{
    display:inline-flex;align-items:center;min-height:44px;
  }
  .ck-map__nav{min-height:44px}
  .elementor-post-navigation a{display:flex;align-items:center;min-height:44px}
}

/* ---------------------------------------------------------------------------
   5. רצפת קריאות לטופס "יצירת קשר".
   הקנבס .ck מוקטן ליניארית מ-1920 (1u = 1px בעיצוב), והמעבר לפריסת נייד
   קורה רק ב-860px. לכן בטווח 861–1089px הכל מוצג ב-45%–57% מהגודל:
   נמדד ב-1024px — תוויות 9.4px ושדות 10px, כלומר לא קריא.
   max() משאיר את ערכי העיצוב המקוריים ברוחב מלא ומציב רצפה רק מתחתם,
   בלי לגעת בגיאומטריה (גובה השדות, .ck-info, המיקומים האבסולוטיים).
   16px בשדות הקלט מונע גם את הזום האוטומטי של iOS בפוקוס.
   הסלקטור כולל .ck כדי לגבור על ה-<style> הפנימי של העמוד.
   ------------------------------------------------------------------------- */
.ck .ck-field label{font-size:max(calc(17.9 * var(--u)), 13px)}
.ck .ck-field input,
.ck .ck-field textarea{font-size:max(calc(19 * var(--u)), 16px)}
.ck .ck-send{font-size:max(calc(24.6 * var(--u)), 16px)}

/* ---------------------------------------------------------------------------
   6. ניווט בין מאמרים: הכותרות נחתכו ל-118px ברוחב נייד.
   ------------------------------------------------------------------------- */
@media (max-width:600px){
  .elementor-post-navigation .post-navigation__prev--title,
  .elementor-post-navigation .post-navigation__next--title{
    white-space:normal;overflow:visible;text-overflow:clip;line-height:1.35;
  }
}

/* ---------------------------------------------------------------------------
   7. עמוד "אודות" — מקטע "היתרונות שלנו" (.ab-s6 / ABOUT_CARDS).
   הכל כאן חיצוני בכוונה: site/about.html נבנה מ-ABOUT_SECTION ו-ABOUT_CARDS
   שבתוך build_content_page.py, וכל שינוי בקובץ עצמו היה חייב שכפול מדויק
   לקבוע — כאן אין צורך, הגנרטור לא נוגע בגיליון הזה.

   שני באגים נמדדו, שניהם באותו מקטע:

   א. 861–1300px: הקנבס של 1920 מוקטן ליניארית (--u = 0.45–0.68), ולכן טקסט
      הכרטיסים ירד ל-10.3px ב-861, 12.3px ב-1024, 14.4px ב-1200.

   ב. עד 860px: בבלוק הנייד של העמוד יש .ab-cardbox{width:auto} בסגוליות
      (0,1,0), אבל .ab-cardbox.c1{width:calc(554 * var(--u))} היא (0,2,0)
      ולכן מנצחת — הכרטיסים נשארים ברוחב הדסקטופ. ב-RTL הגלישה יוצאת שמאלה
      ו-.ab{overflow:hidden} בולע אותה בשקט: נמדד חיתוך של 93px לכרטיס ב-375,
      190px ב-768 ו-213px ב-860. בלי גלילה אופקית, ולכן זה לא נתפס בביקורת
      הקודמת.

   הפתרון: מתחת ל-1300 המקטע עובר לרשת זורמת עם גובה אוטומטי, ורק אז אפשר
   להציב רצפת גופן בלי שהטקסט יגלוש מכרטיס בגובה קבוע.
   כל הסלקטורים מתחילים ב-.ab כדי לגבור על ה-<style> הפנימי של העמוד, שמופיע
   אחרי ה-<link> הזה ב-DOM; .ab .ab-s6 .ab-card הוא (0,3,0) ולכן גובר גם על
   .ab-cardbox.c1 .ab-card, ו-transform דורש !important כי שם יש תיקו.
   ------------------------------------------------------------------------- */
@media (max-width:1300px){
  .ab .ab-canvas--cards{height:auto;padding-bottom:clamp(20px,3vw,40px)}
  .ab .ab-s6{
    position:static;height:auto;
    display:grid;grid-template-columns:1fr;
    gap:clamp(14px,1.8vw,22px);
    padding:clamp(24px,3.4vw,48px) clamp(16px,2.4vw,28px) 0;
    max-width:1180px;margin:0 auto;align-items:stretch;
  }
  .ab .ab-s6 h2{
    position:static;grid-column:1/-1;margin:0 0 clamp(6px,1vw,14px);
    text-align:center;white-space:normal;
    font-size:clamp(30px,4.6vw,68px);line-height:1;
  }
  .ab .ab-arrow2{display:none}
  .ab .ab-s6 .ab-cardbox{
    position:static;display:block;left:auto;top:auto;
    width:auto;max-width:none;height:auto;margin:0;
  }
  .ab .ab-s6 .ab-card{
    transform:none !important;width:auto;height:100%;
    padding:clamp(20px,2.6vw,30px) clamp(18px,2.2vw,26px);
    border-radius:clamp(20px,2.4vw,32px);
    display:flex;flex-direction:column;gap:clamp(8px,1vw,12px);
  }
  .ab .ab-s6 .ab-card b,
  .ab .ab-s6 .ab-card p{
    position:static;width:auto;margin:0;top:auto;left:auto;right:auto;
    text-align:center;
  }
  /* clamp() ולא max(): מתחת ל-861 --u נגזר מ-460 ולא מ-1920, ובלי תקרה
     הכותרת בכרטיס הגיעה ל-58px והטקסט ל-38px ב-768. */
  .ab .ab-s6 .ab-card b{font-size:clamp(18px,calc(35 * var(--u)),30px);line-height:1.15}
  .ab .ab-s6 .ab-card p{font-size:clamp(16px,calc(23 * var(--u)),22px);line-height:1.4}
}
/* שתי עמודות בטאבלט, ארבע כשיש מקום — מעל 1300 חוזרת פריסת הפיגמה המקורית */
@media (min-width:701px) and (max-width:1100px){
  .ab .ab-s6{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:1101px) and (max-width:1300px){
  .ab .ab-s6{grid-template-columns:repeat(4,minmax(0,1fr))}
}
