/* ===================================================================
   activity-hero.css — אזור הפתיחה של עמוד פעילות
   ===================================================================
   נבנה מול הפריים בפיגמה (node 1069:248, 1920×1129.58). כל המידות
   כאן הן המרה ישירה של ערכי הפיגמה ליחידות יחסיות: מה שהיה px
   על בסיס 1920 הפך ל-% או ל-vw באותו יחס. לכן כל מספר בקובץ הזה
   ניתן להצלבה מול הפיגמה.

   העיקרון שמחזיק את האזור: הווידאו, הכפתור וחצי הניווט הם שכבות
   נייחות. רק כרטיסי התמונות זזים, והם שכבה נפרדת שמשאירה במרכז
   חלון ריק קבוע. לכן הווידאו לא זז אף פיקסל בזמן מעבר.
   =================================================================== */

:root{
  --ah-lift: 36px;
  --ah-clear: 92px;
  --ah-fit-scale: 1;
  --ah-fit-shell-height: 985.58px;
}
@media (max-width: 1024px){ :root{ --ah-lift: 60px; --ah-clear: 112px; } }
@media (max-width: 720px){  :root{ --ah-lift: 86px; --ah-clear: 100px; } }

.ah{
  position: relative;
  background: var(--cream);
  margin-block-start: calc(-1 * var(--ah-lift));
  padding-block-start: var(--ah-clear);
  padding-block-end: clamp(16px, 2vw, 34px);
  overflow: clip;
}

/* מעטפת ניטרלית כברירת מחדל. בדסקטופ של עמודי הפעילות היא
   הופכת לקנבס מוקטן; כך נקודת השבירה של המובייל נשארת זהה. */
.ah-fit-shell,
.ah-fit-canvas{
  position: relative;
  width: 100%;
}

/* ===================== הרצועה העליונה =====================
   רוחב מרבי 1465px לפי המפרט, ממורכזת. התמונה בפנים עם שכבת
   חום מעליה, כי כל הטקסט בתוכה לבן (‎#fffefb‎ בפיגמה). */
.ah-band{
  position: relative;
  width: min(1465px, calc(100% - clamp(28px, 4vw, 60px)));
  margin-inline: auto;
  border-radius: clamp(20px, 1.6vw, 30px);
  overflow: hidden;
  isolation: isolate;
  /* 1465 × 346 בפיגמה */
  aspect-ratio: 1465 / 346;
  min-height: 200px;
  display: grid;
  place-items: center;
  text-align: center;
}
.ah-band-bg{
  position: absolute; inset: 0; z-index: -2;
  width: 100%; height: 100%;
  object-fit: cover;
}
.ah-band::after{
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg,
    rgba(67,31,16,.82) 0%, rgba(67,31,16,.70) 48%, rgba(67,31,16,.84) 100%);
}
.ah-band-in{ padding-inline: clamp(16px, 3vw, 48px); }

/* פירורים — Regular 20px, החלק הראשון ב-68% שקיפות */
.ah-crumb{
  margin: 0 0 clamp(6px, .8vw, 14px);
  font-weight: 400;
  font-size: clamp(12px, 1.04vw, 20px);
  line-height: 1.3;
  color: #fffefb;
}
.ah-crumb a{ color: rgba(255,254,251,.68); text-decoration: none; }
.ah-crumb a:hover{ color: #fffefb; }
.ah-crumb i{ font-style: normal; color: rgba(255,254,251,.68); margin-inline: 5px; }

/* כותרת — UltraBold 90px על בסיס 1920 = 4.69vw */
.ah-title{
  margin: 0 0 clamp(10px, 1.1vw, 22px);
  font-weight: 800;
  font-size: clamp(30px, 4.69vw, 90px);
  line-height: 1.06;
  color: #fffefb;
}
.ah-title .is-accent{ color: #F16A2C; }

/* ===================== המספרים ברצועה =====================
   שני זוגות עם קו מפריד אנכי. Black 35px למספר, Regular 15px
   לתווית. ‎--ah-num-gap‎ נגזר מהמרווח בפיגמה. */
.ah-stats{
  display: flex; align-items: center; justify-content: center;
  gap: clamp(14px, 2.2vw, 42px);
}
.ah-stat{ text-align: center; }
.ah-stat b{
  display: block;
  font-weight: 900;
  font-size: clamp(18px, 1.82vw, 35px);
  line-height: 1.15;
  color: #fffefb;
  direction: ltr; unicode-bidi: isolate;
}
.ah-stat span{
  display: block; margin-top: 4px;
  font-weight: 400;
  font-size: clamp(10px, .78vw, 15px);
  line-height: 1.33;
  color: #fefcf9;
}
.ah-divider{
  width: 1px; align-self: stretch;
  min-height: clamp(30px, 3.8vw, 73.5px);
  background: rgba(255,254,251,.34);
  flex: 0 0 1px;
}

/* ===================== הפסקה =====================
   Regular 24px / line-height 32px, רוחב 908px, ממורכזת. */
.ah-lead{
  width: min(908px, calc(100% - clamp(28px, 4vw, 60px)));
  margin: clamp(16px, 1.8vw, 34px) auto 0;
  text-align: center;
  font-weight: 400;
  font-size: clamp(14px, 1.25vw, 24px);
  line-height: 1.34;
  color: #000;
}
.ah-lead b{ font-weight: 700; }

/* ===================== הבמה =====================
   אזור הגלריה בפיגמה: y 592.73→1129.58 מתוך רוחב 1920.
   היחס נשמר ב-aspect-ratio, וכל המיקומים בפנים באחוזים. */
.ah-stage{
  position: relative;
  width: 100%;
  margin-top: clamp(14px, 1.6vw, 30px);
  aspect-ratio: 1920 / 536.85;

  /* --- x, כאחוז מ-1920 --- */
  --x1:  12.46%;   /* 239.23  */
  --x2:  27.91%;   /* 535.87  */
  --xv:  42.74%;   /* 820.52  */
  --x4:  58.79%;   /* 1128.87 */
  --x5:  74.20%;   /* 1424.56 */
  --w-card: 14.31%;   /* 274.714 */
  --w-vid:  15.54%;   /* 298.422 */
  /* מחוץ לבמה — נקודות כניסה ויציאה */
  --x-off-r: 89.6%;
  --x-off-l: -2.9%;

  /* --- y, כאחוז מגובה הבמה (536.85) --- */
  --y-tall: 15.27%;  --h-tall: 84.11%;   /* כרטיס גבוה */
  --y-top:   0.55%;  --h-top:  66.47%;   /* כרטיס עליון בעמודה חיצונית */
  --y-bot:  68.87%;  --h-bot:  31.07%;   /* כרטיס תחתון */
  --y-vid:  22.97%;  --h-vid:  76.91%;

  /* --- צורת החיתוך, נמדדה מערוץ האלפא של נכס ה-Union --- */
  --cut-w: clamp(22px, 3.43vw, 66px);
  --cut-h: clamp(17px, 2.70vw, 52px);
  --r:     clamp(12px, 1.56vw, 30px);
}

/* ===================== שכבת התמונות ===================== */
.ah-rail{ position: absolute; inset: 0; }

.ah-img{
  position: absolute;
  margin: 0;
  will-change: left, top, width, height;
  transition:
    left   var(--ah-dur, .58s) cubic-bezier(.3,.72,.24,1),
    top    var(--ah-dur, .58s) cubic-bezier(.3,.72,.24,1),
    width  var(--ah-dur, .58s) cubic-bezier(.3,.72,.24,1),
    height var(--ah-dur, .58s) cubic-bezier(.3,.72,.24,1),
    opacity .3s ease;
}

/* --- הצורה: איחוד של שני מלבנים מעוגלים, כמו ה-Union בפיגמה ---
   חלק א: רוחב מלא, מתחיל בגובה --cut-h
   חלק ב: גובה מלא, מתחיל ב---cut-w
   כל חלק נושא עותק של התמונה שממוקם לרנדר את *הכרטיס המלא*,
   ולכן שני החצאים מתלכדים לתמונה אחת בלי תפר. */
.ah-p{ position: absolute; overflow: hidden; background:#EDE4DA; border-radius: var(--r); }
.ah-p img{ position: absolute; object-fit: cover; display: block; }
.ah-p-a{ inset: var(--cut-h) 0 0 0; }
.ah-p-a img{ left:0; top: calc(-1 * var(--cut-h)); width:100%; height: calc(100% + var(--cut-h)); }
.ah-p-b{ inset: 0 0 0 var(--cut-w); }
.ah-p-b img{ top:0; left: calc(-1 * var(--cut-w)); width: calc(100% + var(--cut-w)); height:100%; }

/* החיתוכים פונים פנימה, אל הווידאו. בפיגמה שתי העמודות השמאליות
   נושאות rotate(180deg) scaleY(-1) — שהוא שיקוף אופקי. השיקוף הוא
   תכונה של *המיקום* ולא של הכרטיס, כי כרטיס עובר בין המיקומים. */
.ah-img[data-pos="4"],
.ah-img[data-pos="5"],
.ah-img[data-pos="6"],
.ah-img[data-pos="7"]{ transform: scaleX(-1); }
.ah-img[data-pos="4"] img,
.ah-img[data-pos="5"] img,
.ah-img[data-pos="6"] img,
.ah-img[data-pos="7"] img{ transform: scaleX(-1); }

/* הכרטיסים התחתונים בעמודות החיצוניות — מלבן מעוגל רגיל, בלי חיתוך */
.ah-img[data-pos="2"] .ah-p-b,
.ah-img[data-pos="6"] .ah-p-b{ display: none; }
.ah-img[data-pos="2"] .ah-p-a,
.ah-img[data-pos="6"] .ah-p-a{ inset: 0; }
.ah-img[data-pos="2"] .ah-p-a img,
.ah-img[data-pos="6"] .ah-p-a img{ top: 0; height: 100%; }

/* --- שישה מיקומים: 5 נראים + נקודות כניסה/יציאה --- */
.ah-img[data-pos="1"]{ left:var(--x5); top:var(--y-top);  width:var(--w-card); height:var(--h-top);  opacity:1; }
.ah-img[data-pos="2"]{ left:var(--x5); top:var(--y-bot);  width:var(--w-card); height:var(--h-bot);  opacity:1; }
.ah-img[data-pos="3"]{ left:var(--x4); top:var(--y-tall); width:var(--w-card); height:var(--h-tall); opacity:1; }
.ah-img[data-pos="4"]{ left:var(--x2); top:var(--y-tall); width:var(--w-card); height:var(--h-tall); opacity:1; }
.ah-img[data-pos="5"]{ left:var(--x1); top:var(--y-top);  width:var(--w-card); height:var(--h-top);  opacity:1; }
.ah-img[data-pos="6"]{ left:var(--x1); top:var(--y-bot);  width:var(--w-card); height:var(--h-bot);  opacity:1; }
.ah-img[data-pos="0"]{ left:var(--x-off-r); top:var(--y-top); width:var(--w-card); height:var(--h-top); opacity:0; }
.ah-img[data-pos="7"]{ left:var(--x-off-l); top:var(--y-top); width:var(--w-card); height:var(--h-top); opacity:0; }
.ah-img[data-pos="park"]{
  left:var(--x-off-r); top:var(--y-top); width:var(--w-card); height:var(--h-top);
  opacity:0; visibility:hidden; transition:none;
}

/* ===================== הווידאו הקבוע =====================
   לוח קרם ברוחב 298.42 שמאחוריו, מסגרת מקווקוות 288.48×351.23
   ברדיוס 30, והווידאו עצמו 265.22×331.20. */
.ah-video{
  position: absolute;
  left: var(--xv); top: var(--y-vid);
  width: var(--w-vid); height: var(--h-vid);
  background: var(--cream);
  z-index: 3;
  display: flex; flex-direction: column; align-items: center;
  padding: 1.2% 1.8%;
}
.ah-video-frame{
  position: relative;
  width: 96.7%;                       /* 288.48 / 298.42 */
  flex: 1 1 auto;
  border: clamp(1.5px, .134vw, 2.6px) dashed #431F10;
  border-radius: clamp(14px, 1.56vw, 30px);
  display: grid; place-items: center;
  padding: 1%;
}
.ah-video-inner{
  position: relative;
  width: 92%;                         /* 265.22 / 288.48 */
  height: 94%;
  border-radius: clamp(14px, 1.56vw, 30px);
  overflow: hidden;
  background: #EDE4DA;
}
.ah-video video{ width:100%; height:100%; object-fit: cover; display:block; }

.ah-play{
  position: absolute; inset: 0; margin: auto;
  width: clamp(34px, 2.84vw, 55px); height: clamp(34px, 2.84vw, 55px);
  display: grid; place-items: center;
  border: 0; padding: 0; cursor: pointer;
  border-radius: 50%;
  background: rgba(255,255,255,.18);
  box-shadow: 0 4px 4px rgba(0,0,0,.25);
  backdrop-filter: blur(2px);
  transition: transform .2s ease, background .2s ease;
}
.ah-play::before{
  content: ""; position: absolute; inset: 0;
  border: 2px solid #fff; border-radius: 50%;
}
.ah-play svg{ width: 36%; height: 36%; fill: #fff; margin-inline-start: 8%; }
.ah-play:hover{ transform: scale(1.07); background: rgba(255,255,255,.32); }
.ah-video.is-playing .ah-play{ opacity: 0; pointer-events: none; }

/* כפתור התרומה — 261.22×40.93, רדיוס 100, בתחתית לוח הקרם */
.ah-give{
  position: relative;
  margin-top: 1.4%;
  /* בפיגמה 261.22 מתוך 298.42 = 87.5%. הטקסט שלנו ארוך מזה
     שבמוקאפ, ולכן הכפתור מנצל את כל רוחב הלוח והריפוד מהודק —
     אחרת הטקסט גולש החוצה. */
  width: 100%;
  min-height: clamp(26px, 2.13vw, 41px);
  padding: 4px 10px 4px 6px;
  display: inline-flex; align-items: center; justify-content: center;
  gap: clamp(4px, .42vw, 8px);
  white-space: nowrap;
  border-radius: 100px;
  text-decoration: none;
  font-weight: 700;
  font-size: clamp(9px, .74vw, 14px);
  color: #fff;
  z-index: 4;
}
.ah-give .arrow-circle{
  display: grid; place-items: center;
  width: 1.9em; height: 1.9em; flex: 0 0 auto;
  background: #fff; border-radius: 50%;
}
.ah-give .arrow-circle svg{ width: 55%; height: 55%; }

/* ===================== חצי הניווט =====================
   בפיגמה 55.97px, ממוקמים מעל אזור הווידאו. */
.ah-nav{
  position: absolute;
  left: var(--xv); width: var(--w-vid);
  top: 0; height: var(--y-vid);
  display: flex; align-items: center; justify-content: center;
  gap: clamp(8px, .9vw, 16px);
  z-index: 4;
  flex-direction: row-reverse;
}
.ah-nav .vl-nav{ --vl-arrow: clamp(30px, 2.91vw, 56px); }

/* ===================== טאבלט ונייד =====================
   פריסה אמיתית ולא הקטנה יחסית של המסך הרחב. מתחת ל-1024 חמש
   עמודות הופכות את הווידאו לצר מכדי להכיל את כפתור התרומה, ולכן
   כאן הווידאו מתרחב למרכז ומשני צדדיו מציצות התמונות הפנימיות. */
@media (max-width: 1024px){
  .ah-band{ aspect-ratio: auto; padding-block: 28px; min-height: 0; }
  .ah-stage{
    aspect-ratio: 390 / 340;
    --w-card: 30%;  --w-vid: 70%;
    --xv: 15%;
    --x4: 87%;   --x5: 122%;
    --x2: -17%;  --x1: -52%;
    --x-off-r: 158%; --x-off-l: -88%;
    --y-tall: 2%;  --h-tall: 96%;
    --y-top:  2%;  --h-top:  96%;
    --y-bot:  2%;  --h-bot:  96%;
    --y-vid:  0%;  --h-vid: 100%;
  }
  .ah-nav{ display: none; }          /* במגע מחליקים */
}

/* ל-‎.cta-btn‎ יש ב-site.css כלל נייד בסלקטור ‎body:not(.desktop-preview)‎
   שמחזיר לו ריפוד ופונט של כפתור ההירו. כאן הכפתור צר בהרבה, ולכן
   הכלל הזה גובר עליו במשקל גבוה יותר במקום ב-‎!important‎. */
.ah .ah-video .ah-give{
  padding: 4px 10px 4px 6px;
  gap: clamp(4px, .42vw, 8px);
  font-size: clamp(9px, .74vw, 14px);
}
@media (max-width: 1024px){
  .ah .ah-video .ah-give{ font-size: clamp(9.5px, 2.35vw, 15px); padding: 5px 10px 5px 6px; }
  .ah .ah-video .ah-give .arrow-circle{ width: 1.7em; height: 1.7em; }
}

/* ===================================================================
   עמודי הפעילות — עיצוב דסקטופ משותף לפי עמוד אולם האוכל
   ===================================================================
   זהו מקור האמת החזותי היחיד לכל ארבעת עמודי הפעילות. הכותרות,
   המלל והמדיה משתנים בכל עמוד, אך המבנה, המידות והמסכות זהים.
   הכול תחום מעל 1024px, לכן הטאבלט והמובייל אינם משתנים. */
@media (min-width: 1025px){
  .activity-page{
    --hd-logo: 128px;
    --hd-logo-gap: 110px;
    --hd-nav-inset: 141px;
    --hd-pill-x: 22px;
    --nav-fs: 18.091px;
    --nav-gap: 52px;
  }

  /* ההידר המקורי בפיגמה בגובה חזותי 144px; בכיוונון הדסקטופ
     הוא נסגר ב-120px כדי שכל קומפוזיציית הפעילות תעלה כיחידה. */
  .activity-page .site-header:not(.is-stuck){
    top: 0;
    max-width: 1680px;
    min-height: 120px;
    padding-block: 0;
  }
  .activity-page .site-header:not(.is-stuck)::before{
    left: 50%; right: auto; top: 0;
    width: 100vw; height: 120px;
    transform: translateX(-50%);
    border: 0; border-radius: 0;
    /* במצב העליון ההידר נטמע במשטח העמוד. רק לאחר גלילה
       חוזר גוון הקרם של הגלולה הצפה מהכללים המשותפים. */
    background: var(--cream);
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    opacity: 1;
  }
  .activity-page .site-header::before{
    transition: opacity .34s ease, background-color .2s ease;
  }
  .activity-page .site-header:not(.is-stuck) .logo-badge{
    transform: translate(-50%, calc(-50% + 37.15px));
  }
  .activity-page .site-header:not(.is-stuck) .logo-plate{
    width: 152.705px;
    height: 152.705px;
    margin: -76.3525px 0 0 -76.3525px;
    background: var(--cream);
    pointer-events: none;
  }

  /* בגלילה שני חצאי הניווט מתקבצים מעט. כך כפתור התרומה
     נשאר בתוך הגלולה עם מרווח נקי, בלי להקטין את שטח הלחיצה שלו. */
  .activity-page .site-header.is-stuck{
    --nav-fs: 16.5px;
    --nav-gap: 36px;
  }
  .activity-page .site-header:not(.is-stuck) .donate-pill{
    top: calc(50% - .78px);
    width: 169px;
    min-height: 49px;
    justify-content: center;
    padding: 0 17px;
    font-size: 18.091px !important;
  }

  /* כל משטח האזור הראשון משתמש באותו קרם של האתר; בתוך רצועת
     הכותרת בלבד מוצגות התמונה ושכבת ההכהיה החומה. */
  .activity-page .ah{
    background: var(--cream);
    min-height: 100svh;
    padding-block-end: 0;
  }
  .activity-page .ah-fit-shell{
    position: relative;
    width: 100%;
    height: var(--ah-fit-shell-height, 985.58px);
  }
  .activity-page .ah-fit-canvas{
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    width: 100%;
    transform: scale(var(--ah-fit-scale, 1));
    transform-origin: top center;
  }
  .activity-page .ah-band{
    /* אותו רוחב מקסימלי של ההירו בעמוד אודות, כדי שכל עמודי
       הפעילות ירגישו כמו קומפוננטה אחת. */
    /* הקנבס כולו מוקטן בגבהי דסקטופ קצרים. מחלקים את רוחב
       המקור בסקייל כדי שהרוחב הנצפה יישאר זהה להירו באודות. */
    width: calc(min(1465px, calc(100% - 80px)) / var(--ah-fit-scale, 1));
    position: relative;
    left: 50vw;
    transform: translateX(-50%);
    margin-inline: 0;
    min-height: 0;
    height: 294px;
    aspect-ratio: auto;
    border-radius: 30px;
  }
  .activity-page .ah-band-bg{ display: block; }
  .activity-page .ah-band::after{ display: block; }
  /* הטקסטים בפריים אינם בלוק ממורכז אחד: לכל שכבה מיקום אנכי
     עצמאי. מיקום מוחלט מונע מהכותרת הגבוהה לדחוף את הפירורים
     והמספרים ומחזיר את הקואורדינטות המקוריות של Figma. */
  .activity-page .ah-band-in{
    position: absolute;
    inset: 0;
    padding: 0;
  }
  .activity-page .ah-crumb{
    position: absolute;
    top: 72.4px;
    left: calc(50% - 11.65px);
    width: 260px;
    height: 22px;
    margin: 0;
    transform: translateX(-50%);
    font-size: 14px;
    line-height: 32px;
    z-index: 2;
  }
  .activity-page .ah-title{
    position: absolute;
    top: 122px;
    left: calc(50% + 5.95px);
    width: 613.027px;
    height: 45.606px;
    margin: 0;
    transform: translateX(-50%);
    font-size: 90px;
    line-height: 50px;
    white-space: nowrap;
    pointer-events: none;
  }
  .activity-page .ah-title .is-accent{
    display: inline;
    padding-block: .28em;
    padding-inline: .035em;
    color: transparent;
    background: var(--grad-accent);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
  }
  .activity-page .ah-stats{
    position: absolute;
    top: 198px;
    left: calc(50% - 3px);
    width: 420px;
    height: 64px;
    transform: translateX(-50%);
  }
  .activity-page .ah-stat b{ font-size: 30px; }
  .activity-page .ah-stat span{
    margin-top: 3px;
    font-size: 14px;
  }
  .activity-page .ah-divider{
    min-height: 64px;
    background: #F16A2C;
  }

  /* בפיגמה הפסקה מתחילה ב-y=502 ונשברת לשתי שורות; הבמה
     מתחילה ב-y≈593. */
  .activity-page .ah-lead{
    margin-top: 24px;
    position: relative;
    left: -14px;
    top: 5px;
  }
  .activity-page .ah-stage{
    margin-top: 0;
    height: min(536.85px, 27.96vw);
    aspect-ratio: auto;

    /* חמשת הטורים נפתחים כיחידה אחת: כל כרטיס רחב ב-24px,
       והרווחים המקוריים בין הטורים נשמרים כמעט פיקסל לפיקסל. */
    --x1: 9.3349%;
    --x2: 26.0349%;
    --xv: 42.1104%;
    --x4: 59.4203%;
    --x5: 76.0708%;
    --w-card: 15.5580%;
    --w-vid: 16.7928%;
  }

  /* ארבעת נכסי ה-Union אינם סימטריים: שני הכרטיסים בצד שמאל
     משוקפים יחד עם התמונה, ולכל כרטיס גובה/היסט מעט שונה. */
  .activity-page .ah-img[data-pos="4"] img,
  .activity-page .ah-img[data-pos="5"] img{
    transform: none;
  }
  .activity-page .ah-img[data-pos="1"]{
    top: .5514%;
    height: 66.0649%;
  }
  .activity-page .ah-img[data-pos="2"]{
    top: 68.807%;
    height: 31.073%;
  }
  .activity-page .ah-img[data-pos="3"]{
    top: 15.7931%;
    height: 84.0879%;
  }
  .activity-page .ah-img[data-pos="4"]{
    top: 15.2706%;
    height: 84.1071%;
  }
  .activity-page .ah-img[data-pos="5"]{
    top: 0;
    height: 66.8915%;
  }
  .activity-page .ah-img[data-pos="6"]{
    top: 68.9268%;
    height: 31.073%;
  }

  /* צללית 1:1 שנשלפה מערוץ האלפא של Union 1056:149 בפיגמה
     (275×452). התמונה עצמה נשארת נכס מקומי; המסכה קובעת רק
     את קו המתאר והאנטי־אליאסינג המדויקים של שני הכרטיסים הגבוהים. */
  .activity-page .ah-img[data-pos="3"],
  .activity-page .ah-img[data-pos="4"]{
    overflow: hidden;
    -webkit-mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARMAAAHECAMAAAAtTD4dAAAAUVBMVEVMaXH////////////////////////////////////////////////////////////////////////////////////////////////////////JzkR1AAAAGnRSTlMAn+Bv3yDvv2AQP1+Pz3+vH09A0JAvgKAwUCGM1j8AAAAJcEhZcwAAA+gAAAPoAbV7UmsAAAPuSURBVHja7dsBUuIwGIDRlJbWUiiC4rq5/0FX19WhrboOBEfS992AN8mftENDuEDtqiw2Vfzh1ZtmvbsN31FbNnW8njblxVna/ppAXipWRKZtL7dWdtcp8tzDhRbJOl5x1SWWyvIuXnXVIT3JIl57HZJpic+fuwxIYp10pqxjFlVtOpIuZtLaMLngSOmzIYmbVMskZlSiA7nMyaRJY7LIySTNRFllRRLv3U2md5QUJpu8TGKKy2xmJClOnsfcTHojdvp69nyTGyb5myS4tRVMsj+KE5gsI5OsHwATmSyYZH87SWBSMMl/wp5vUjCZ/JEgMsn/0DnbpI9M5rBzzjNZLpiM/5aUKckZJu1dZDIXkpNNMiY51STX8XqGSVdHJhn9D/YiJmUdmQzfITUxMhl8hrKJkckRyK6oY2TyynHo1k2cS80Hn66tt031VpxXzbV/uvYNJqttnH1Dk0NDZGiS+/30BJOsn+tOM+lqGiOTksXYBMnEZEdibGK8Tk2QTEx6DmMTO2dqUmAYmywpTEw6CsO2Gf4POp798ZutM660dSbtg5cm43bBq7Xp3qkgxPF3XgyYfOXOxoAJEyZMmDBhwoQJEyZMmDAREyZMmDBhwoQJEyZMmDBhIiZMmDBhwoQJEyZMmDBhwoQJAyZMmDBhwoQJEyZMmDBhwkRMmDBhwoQJEyZMmDBhwoSJmDBhwoQJEyZMmDBhwoQJEyYMmDBhwoQJEyZMmDBhwoQJEzFhwoQJEyZMmDBhwoQJEyZiwoQJEyZMmDBhwoQJEyZMmDBgwoQJEyZMmDBhwoQJEyZMxIQJEyZMmDBhwoQJEyZMmIgJEyZMmDBhwoQJEyZMmDBhwoAJEyZMmDBhwoQJEyZMmDAREyZMmDBhwoQJEyZMmDBhIiZMmDBhwoQJEyZMmDBhwoQJAyZMmDBhwoQJEyZMmDBhwkRMmDBhwoQJEyZMmDBhwoSJmDBhwoQJEyZMmDBhwoQJEyYMmDBhwoQJEyZMmDBhwoQJEzFhwoQJEyZMmDBhwoQJEyZiwoQJEyZMmDBhwoQJEyZMmDBgwoQJEyZMmDBhwoQJEyZMxIQJEyZMmDBhwoQJEyZMmIgJEyZMmDBhwoQJEyZMmDBhwoAJEyZMmDBh8tNMagijilBBGHUfthBGlaGEMGofVhCG1SG0huywbQihwDCoezKxeQZV7ZNJaEAMbifPdSCOuv1rYqEc9fBCYqIcTZPw2hrGvw5vJnbPaOc81y54/H36O24JJcZfIUD5nORp+2zNkmn9rA/hfXi35XyXyn0bPqrbzPMZ5zZ81r6Y2/uUum/Df/tdzGa11E2/D1/tcX+Tf/vl+z/+Dz1hmAc5diM7AAAAAElFTkSuQmCC");
    mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARMAAAHECAMAAAAtTD4dAAAAUVBMVEVMaXH////////////////////////////////////////////////////////////////////////////////////////////////////////JzkR1AAAAGnRSTlMAn+Bv3yDvv2AQP1+Pz3+vH09A0JAvgKAwUCGM1j8AAAAJcEhZcwAAA+gAAAPoAbV7UmsAAAPuSURBVHja7dsBUuIwGIDRlJbWUiiC4rq5/0FX19WhrboOBEfS992AN8mftENDuEDtqiw2Vfzh1ZtmvbsN31FbNnW8njblxVna/ppAXipWRKZtL7dWdtcp8tzDhRbJOl5x1SWWyvIuXnXVIT3JIl57HZJpic+fuwxIYp10pqxjFlVtOpIuZtLaMLngSOmzIYmbVMskZlSiA7nMyaRJY7LIySTNRFllRRLv3U2md5QUJpu8TGKKy2xmJClOnsfcTHojdvp69nyTGyb5myS4tRVMsj+KE5gsI5OsHwATmSyYZH87SWBSMMl/wp5vUjCZ/JEgMsn/0DnbpI9M5rBzzjNZLpiM/5aUKckZJu1dZDIXkpNNMiY51STX8XqGSVdHJhn9D/YiJmUdmQzfITUxMhl8hrKJkckRyK6oY2TyynHo1k2cS80Hn66tt031VpxXzbV/uvYNJqttnH1Dk0NDZGiS+/30BJOsn+tOM+lqGiOTksXYBMnEZEdibGK8Tk2QTEx6DmMTO2dqUmAYmywpTEw6CsO2Gf4POp798ZutM660dSbtg5cm43bBq7Xp3qkgxPF3XgyYfOXOxoAJEyZMmDBhwoQJEyZMmDAREyZMmDBhwoQJEyZMmDBhIiZMmDBhwoQJEyZMmDBhwoQJAyZMmDBhwoQJEyZMmDBhwkRMmDBhwoQJEyZMmDBhwoSJmDBhwoQJEyZMmDBhwoQJEyYMmDBhwoQJEyZMmDBhwoQJEzFhwoQJEyZMmDBhwoQJEyZiwoQJEyZMmDBhwoQJEyZMmDBgwoQJEyZMmDBhwoQJEyZMxIQJEyZMmDBhwoQJEyZMmIgJEyZMmDBhwoQJEyZMmDBhwoAJEyZMmDBhwoQJEyZMmDAREyZMmDBhwoQJEyZMmDBhIiZMmDBhwoQJEyZMmDBhwoQJAyZMmDBhwoQJEyZMmDBhwkRMmDBhwoQJEyZMmDBhwoSJmDBhwoQJEyZMmDBhwoQJEyYMmDBhwoQJEyZMmDBhwoQJEzFhwoQJEyZMmDBhwoQJEyZiwoQJEyZMmDBhwoQJEyZMmDBgwoQJEyZMmDBhwoQJEyZMxIQJEyZMmDBhwoQJEyZMmIgJEyZMmDBhwoQJEyZMmDBhwoAJEyZMmDBh8tNMagijilBBGHUfthBGlaGEMGofVhCG1SG0huywbQihwDCoezKxeQZV7ZNJaEAMbifPdSCOuv1rYqEc9fBCYqIcTZPw2hrGvw5vJnbPaOc81y54/H36O24JJcZfIUD5nORp+2zNkmn9rA/hfXi35XyXyn0bPqrbzPMZ5zZ81r6Y2/uUum/Df/tdzGa11E2/D1/tcX+Tf/vl+z/+Dz1hmAc5diM7AAAAAElFTkSuQmCC");
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
  }
  .activity-page .ah-img[data-pos="3"] .ah-p-a,
  .activity-page .ah-img[data-pos="4"] .ah-p-a{
    inset: 0;
    border-radius: 0;
  }
  .activity-page .ah-img[data-pos="3"] .ah-p-a img,
  .activity-page .ah-img[data-pos="4"] .ah-p-a img{
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
  .activity-page .ah-img[data-pos="3"] .ah-p-b,
  .activity-page .ah-img[data-pos="4"] .ah-p-b{
    display: none;
  }

  /* לכל כרטיס חיצוני מסכת Union מקורית משלו: הימני 275×355,
     והשמאלי 275×360. מסכת השמאל הוכנה לפני השיקוף של המיקום,
     כדי שהטרנספורמציה הקיימת תשקף יחד את התמונה ואת הצללית. */
  .activity-page .ah-img[data-pos="1"]{
    --ah-outer-union-mask: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARMAAAFjCAMAAAApVR9LAAAAUVBMVEVMaXH////////////////////////////////////////////////////////////////////////////////////////////////////////JzkR1AAAAGnRSTlMA7z9fECB/v5/gjx/fL2/PT6/QYJAwQKCAUFXxt5UAAAAJcEhZcwAAA+gAAAPoAbV7UmsAAAN+SURBVHja7dsJctowGIBRgTcwBgLZWt3/oE2naRtLSZsZ7E4tv+8GefNrsYlDmKF6e9qdh/iftzl3/d0h/IvqqtvE5XQ+zc5St0sC+dFuS+QdlflmZbuPS+3LTCR9XHDDHKNSd3HRDcfJSZp9XHibI5LZUa6xgDaT7iltLKKhno6kioXUT2eyL8Ukbq2crM6ZM9ugVAWRTDUoJY3JRIOyLYpkmqfBviyTYQqTriyTOMW9rTCSeHc7yWNpJidbbP4i8naTeyblm3SO4jlMzkyyB8DIpOgHwIlMzkyKv7FNYLJjUv4Oe7vJjskaxuRWkz2Tgn/DmMqkyJVzm0mzZ1L6e9gJTPrIZBX7600mz5FJWf/PN4PJcR+ZjDvFyGT8e841Mhlf1C4xMhnNSBcjkzcd2jWIfN7kUPVDXEnvm9THqu13v+pWw/GRyXYlS+TTJvVp5SCZyVI/XZvRZLsHMjapexyJSWNIUpMjktSksbmmJhZOZlIjyUycOJlJxSEzsXIyE2OSmxiTzMSYJF1CuFCIyTcINYSktrzPb+Lt33m1EDIT7xpj9u3bGULSQ/CSID93GOT3Ewb5PZYBEyZMmDBhwoQJEyZMmDBhIiZMmDBhwoQJEyZMmDBhwkRMmDBhwoQJEyZMmDBhwoQJEwZMmDBhwoQJEyZMmDBhwoSJmDBhwoQJEyZMmDBhwoQJEzFhwoQJEyZMmDBhwoQJEyZMGDBhwoQJEyZMmDBhwoQJEyZiwoQJEyZMmDBhwoQJEyZMxIQJEyZMmDBhwoQJEyZMmDBhwIQJEyZMmDBhwoQJEyZMmIgJEyZMmDBhwoQJEyZMmDAREyZMmDBhwoQJEyZMmDBhwoQBEyZMmDBhwoQJEyZMmDBhIiZMmDBhwoQJEyZMmDBhwkRMmDBhwoQJEyZMmDBhwoQJEwZMmDBhwoQJEyZMmDBhwoSJmDBhwoQJEyZMmDBhwoQJEzFhwoQJEyZMmDBhslyTDYSkXRggJD2EC4SkU+ghJD2FOwhJIdQ22fTYCaHDMKp6MbF4xh1eTNxQktvJ91oQ6ZiEek8iGZMQtih+NhxeTdzbRodOsHrGjzq/a5w937uGtx2hvN1MXlEsn2tC8rJ81o7yXIesZrfytybvVq13VLpj+KCmXafKUIU/1KxwVrqv4W899ef1eGy6UxM+Vf103+6Kr2/vH9/9878B/egId6Tp6wQAAAAASUVORK5CYII=");
  }
  .activity-page .ah-img[data-pos="5"]{
    --ah-outer-union-mask: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARMAAAFoCAMAAABDku+IAAAASFBMVEVMaXH///////////////////////////////////////////////////////////////////////////////////////////8Pr8ZAAAAAF3RSTlMAH48/3+9fvyCff88Qb6+A4E+QQC9QMN2rYdYAAAAJcEhZcwAAA+gAAAPoAbV7UmsAAANtSURBVHja7duNcqIwFIDRgCIigtq6m/d/0/2rnUra3bbCTk3O9wY9k3uDTAlhic5D3a7jF69Zj/WmCv+lVfflOV7K1KvFRTb3BPKndkMk7bjcWan6eK+122VIhibeb80iR+UQ77vd/CR1jFByI5kd5RBzaJj1OS3m0Yy3z77JxOQ4n0kXc2lncpabnjYjk84xWeqgPGRlMs+P5CYrk97oLDM8h8xM5hieMTOTegaTdWYm7QwmmZHE9QwvHHMziUyWMFkxyfwpdh6Tnkn+6yR6il3ApGEy7RSZ5PyKbSaTHI/JjSb7NZMCLp1bTc6RSRGTc5tJF5kUsUxuMtlEJsWQfNpkiExK2SWfNqnGyCSLf5Ze0KTqYmRyJXJoIpPrM7KOkckLkE0bi+i9Hqu6EJA3Tc6nYdddGtu+iSX12oiMZRH802TTxuIr62ns4yZVz2NiMtCYmtQwJiZ7czM1QZKauIETE7skMTlxmJrsGw5TE5OTmFQUEpMHClMT2yQ18TMnJt9leFyL0w8CjU5MvjBeQYjTz/Otk5h8++YmTvdJB2FSE0YIyfOJq5gJEyZMmDBhwoQJEyZMmDAREyZMmDBhwoQJEyZMmDBhIiZMmDBhwoQJEyZMmDBhwoQJEyZMmDBhwoQJEyZMmDBhwkRMmDBhwoQJEyZMmDBhwoSJmDBhwoQJEyZMmDBhwoQJEyZMmDBhwoQJEyZMmDBhwoQJEzFhwoQJEyZMmDBhwoQJEyZiwoQJEyZMmDBhwoQJEyZMmDBhwoQJEyZMmDBhwoQJEyZMxIQJEyZMmDBhwoQJEyZMmIgJEyZMmDBhwoQJEyZMmDBhwoQJEyZMmDBhwoQJEyZMmDAREyZMmDBhwoQJEyZMmDBhIiZMmDBhwoQJEyZMmDBhwoQJEyZMmDBhwoQJEyZMmDBhwkRMmDBhwoQJEyZMmDBhwoSJmDBhwoQJEyZMmDBhwoQJEyZMUpORQWLSMZi0DjsIk/pwgjCpCxWESUMIawrXbYMlm6zYEB4xXLX7aWJ4rtv/MtlweFEbgoOSblgH5bo6POXquXTcX0wq0/PUKjxXNTie7+FLVkpCAuVqv146NU5J0rnsRdsM4ZX2DyVfwtvweo+lvrA+bsLbFanyV5HfKnVZy7YZv4V39H3o+iJg+nH3GD7SNvfe/Mt/ANW2PzzyimmuAAAAAElFTkSuQmCC");
  }
  .activity-page .ah-img[data-pos="1"],
  .activity-page .ah-img[data-pos="5"]{
    overflow: hidden;
    -webkit-mask-image: var(--ah-outer-union-mask);
    mask-image: var(--ah-outer-union-mask);
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
  }
  .activity-page .ah-img[data-pos="1"] .ah-p-a,
  .activity-page .ah-img[data-pos="5"] .ah-p-a{
    inset: 0;
    border-radius: 0;
  }
  .activity-page .ah-img[data-pos="1"] .ah-p-a img,
  .activity-page .ah-img[data-pos="5"] .ah-p-a img{
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
  .activity-page .ah-img[data-pos="1"] .ah-p-b,
  .activity-page .ah-img[data-pos="5"] .ah-p-b{
    display: none;
  }

  /* מבנה לוח הווידאו נמדד ישירות מהפריים: המסגרת מתחילה 5px
     פנימה, המדיה 11px בתוך המסגרת, והכפתור 18.6px מהקצה. */
  .activity-page .ah-video{
    display: block;
    padding: 0;
    background: transparent;
  }
  .activity-page .ah-nav{
    top: 28px;
    height: 56px;
    gap: 11.5px;
    transform: translateX(4.6px);
  }
  .activity-page .ah-video-frame{
    position: absolute;
    left: 1.803%; top: 1.249%;
    width: 96.67%; height: 85.07%;
    padding: 0;
  }
  .activity-page .ah-video-inner{
    position: absolute;
    left: 3.10%; top: 1.92%;
    width: 93.64%; height: 95.68%;
  }
  .activity-page .ah-video .ah-give{
    position: absolute;
    left: 6.23%; top: 89.77%;
    width: 87.53%; height: 9.91%;
    min-height: 0;
    margin: 0;
    padding: 0 14px 0 48px;
    justify-content: center;
    font-size: 18px;
  }
  .activity-page .ah-video .ah-give .arrow-circle{
    position: absolute;
    left: 7px;
    top: 50%;
    width: 33px;
    height: 33px;
    flex: 0 0 33px;
    transform: translateY(-50%);
  }
  .activity-page .ah-video .ah-give .arrow-circle svg{
    width: 72%;
    height: 72%;
  }

  /* אזורי הלחיצה מתרחבים בשקיפות כדי שגם בסקייל המינימלי
     יישאר יעד אפקטיבי של 44px, בלי לשנות את הגרפיקה עצמה. */
  .activity-page .ah-nav .vl-nav{
    position: relative;
  }
  .activity-page .ah-nav .vl-nav::after,
  .activity-page .ah-play::after,
  .activity-page .ah-give::after{
    content: "";
    position: absolute;
  }
  .activity-page .ah-nav .vl-nav::after{
    inset: -1px;
    border-radius: 50%;
  }
  .activity-page .ah-play::after{
    inset: -1.5px;
    border-radius: 50%;
  }
  .activity-page .ah-give::after{
    inset-block: -8.25px;
    inset-inline: 0;
    border-radius: inherit;
  }
}

/* דסקטופ צר: שומרים על אותו הידר מלא, אך מקרבים את התפריטים
   ללוגו ומכניסים מעט את כפתור התרומה כדי למנוע חפיפה. */
@media (min-width: 1025px) and (max-width: 1279px){
  .activity-page .site-header.is-stuck{
    --hd-nav-inset: 86px;
    --hd-pill-x-stuck: 30px;
    --nav-fs: 15.5px;
  }
  .activity-page .site-header.is-stuck .nav-menu{
    gap: 28px;
  }
}

@media (prefers-reduced-motion: reduce){
  .ah-img{ transition: opacity .2s ease; }
  .ah-play{ transition: none; }
}

/* ===================================================================
   עמודי הפעילות — אזור ראשון במובייל ובטאבלט
   ===================================================================
   פריים המקור: Figma 1074:2, ברוחב 390px. כל ארבעת עמודי
   הפעילות משתמשים באותו DOM ובאותו קובץ, ולכן העיצוב נשאר זהה
   בעוד הכותרת, המלל והמדיה ממשיכים להגיע מנתוני כל פעילות.
   =================================================================== */
@media (max-width: 1024px){
  /* צבע הקנבס משתמש בשמנת המשותפת של האתר ושומר
     על חיבור רציף בין ההידר, מסכת הלוגו והרקע של האזור. */
  body.activity-page,
  .activity-page .ah{
    background-color: var(--cream);
  }

  .activity-page .ah{
    margin-block-start: 0;
    padding-block-start: 0;
    background: var(--cream);
    overflow: clip;
  }

  .activity-page .ah-fit-shell,
  .activity-page .ah-fit-canvas{
    width: 100%;
    height: auto;
  }

  .activity-page .ah-fit-canvas{
    display: flow-root;
  }










  /* בפיגמה גרסת המובייל של אולם האוכל משתמשת ברקע ייעודי,
     ולא בחיתוך של תמונת הבאנר בדסקטופ. */
  .activity-dining .ah-band-bg{
    content: url("/assets/img/hero-background-mobile.webp");
  }




  .activity-page .ah-band{
    position: relative;
    top: -16px;
    min-height: 0;
    margin-block: 0 -16px;
    margin-inline: auto;
    padding: 0;
    aspect-ratio: auto;
    overflow: hidden;
  }

  .activity-page .ah-band::after{
    background: rgba(67, 31, 16, .70);
  }

  .activity-page .ah-band-in{
    position: absolute;
    inset: 0;
    padding: 0;
  }

  .activity-page .ah-crumb,
  .activity-page .ah-title,
  .activity-page .ah-stats{
    position: absolute;
    left: 16px;
    width: calc(100% - 32px);
    margin: 0;
    transform: none;
  }

  .activity-page .ah-crumb{
    z-index: 2;
    opacity: .78;
    text-align: center;
    white-space: nowrap;
  }

  .activity-page .ah-crumb a,
  .activity-page .ah-crumb i{
    color: inherit;
  }

  .activity-page .ah-title{
    z-index: 2;
    color: #fffefb;
    text-align: center;
    white-space: nowrap;
    pointer-events: none;
  }

  .activity-page .ah-title .is-accent{
    display: inline;
    padding-block: .16em;
    padding-inline: .025em;
    color: transparent;
    background: var(--grad-accent);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
  }

  .activity-page .ah-stats{
    display: grid;
    grid-template-columns: minmax(0, 1fr) 1.5px minmax(0, 1fr);
    align-items: stretch;
    column-gap: 12px;
    row-gap: 0;
  }

  .activity-page .ah-stat{
    min-width: 0;
    padding-top: 5px;
  }

  .activity-page .ah-stat span{
    margin-top: -4px;
    white-space: nowrap;
  }

  .activity-page .ah-divider{
    width: 1.5px;
    min-height: 0;
    height: 100%;
    align-self: stretch;
    background: #f16a2c;
  }

  .activity-page .ah-lead{
    position: relative;
    left: auto;
    top: auto;
    color: #130e0b;
    text-align: center;
  }
}

/* מובייל 390px — קואורדינטות ישירות מפריים Figma 1074:2. */
@media (max-width: 599px){







  .activity-page .ah-band{
    width: calc(100% - 32px);
    top: -16px;
    height: 230.65px;
    margin-block-end: -16px;
    border-radius: 32px;
  }

  /* החיתוך העליון הוא חלק מהפאנל עצמו. העיגול זהה בגודלו
     לצלחת הלוגו ומסתיר את שפת התמונה בלי להשאיר קצוות כפולים. */
  .activity-page .ah-band::before{
    content: "";
    position: absolute;
    z-index: 1;
    left: 50%;
    top: -64.35px;
    width: 91.35px;
    height: 91.35px;
    transform: translateX(-50%);
    border-radius: 50%;
    background: var(--cream);
    pointer-events: none;
  }

  .activity-page .ah-crumb{
    top: 42px;
    height: 20px;
    font-size: 14px;
    line-height: 20px;
  }

  .activity-page .ah-title{
    top: 74px;
    height: 52px;
    font-size: min(12.31vw, 48px);
    line-height: 52px;
  }

  .activity-page .ah-stats{
    left: 20px;
    top: 138px;
    width: calc(100% - 40px);
    height: 66px;
    column-gap: 8.25px;
  }

  .activity-page .ah-stat b{
    font-size: 25px;
    line-height: 34px;
  }

  .activity-page .ah-stat span{
    margin-top: -4px;
    font-size: 11px;
    line-height: 18px;
  }

  .activity-page .ah-lead{
    width: calc(100% - 48px);
    min-height: 88px;
    margin: 27.35px auto 0;
    font-size: 16px;
    line-height: 22px;
  }

  /* רק המרווח אל האזור הבא מותאם; מבנה הגלריה עצמה לא משתנה. */
  .activity-page .ah-stage{
    margin-top: 27px;
  }
}

/* במסכים צרים מפריים המקור הרכיבים מתכווצים יחד. כך הלוגו אינו
   מכסה את כפתור התרומה, אך הכפתורים עצמם שומרים יעד מגע של 44px. */
@media (max-width: 389px){









  .activity-page .ah-band{
    top: -4.1026vw;
    width: calc(100% - 8.2052vw);
    height: 59.141vw;
    margin-block-end: -4.1026vw;
    border-radius: 8.2052vw;
  }

  .activity-page .ah-band::before{
    top: -16.5vw;
    width: 23.4231vw;
    height: 23.4231vw;
  }

  .activity-page .ah-crumb,
  .activity-page .ah-title{
    left: 4.1026vw;
    width: calc(100% - 8.2052vw);
  }

  .activity-page .ah-crumb{
    top: 10.7692vw;
    height: 5.1282vw;
    font-size: clamp(11.5px, 3.5897vw, 14px);
    line-height: clamp(16px, 5.1282vw, 20px);
  }

  .activity-page .ah-title{
    top: 18.9744vw;
    height: 13.3333vw;
    font-size: 12.31vw;
    line-height: 13.3333vw;
  }

  .activity-page .ah-stats{
    left: 5.1282vw;
    top: 35.3846vw;
    width: calc(100% - 10.2564vw);
    height: 16.9231vw;
    column-gap: 2.1154vw;
  }

  .activity-page .ah-stat{
    padding-top: 1.0256vw;
  }

  .activity-page .ah-stat b{
    font-size: clamp(18px, 6.4103vw, 25px);
    line-height: clamp(25px, 8.7179vw, 34px);
  }

  .activity-page .ah-stat span{
    margin-top: -1.0256vw;
    font-size: clamp(9px, 2.8205vw, 11px);
    line-height: clamp(14px, 4.6154vw, 18px);
  }

  .activity-page .ah-lead{
    width: 87.6923vw;
    min-height: 0;
    margin-top: 7.0128vw;
    font-size: 14px;
    line-height: 19px;
  }

  .activity-page .ah-stage{
    margin-top: 6.9231vw;
  }
}

/* לטאבלט אין בפרויקט פריים Figma נפרד. אותה קומפוזיציה נשמרת
   ומתרחבת באופן רציף, עם תקרות טיפוגרפיה שמונעות ניפוח. */
@media (min-width: 600px) and (max-width: 1024px){





  .activity-page .ah-band{
    width: min(calc(100% - 48px), 720px);
    top: -16px;
    height: clamp(254px, 35.5vw, 314px);
    margin-block-end: -16px;
    border-radius: 36px;
  }

  .activity-page .ah-band::before{
    top: -78px;
    width: 104px;
    height: 104px;
  }

  .activity-page .ah-crumb{
    top: calc(22% - 8px);
    font-size: clamp(15px, 2.1vw, 18px);
    line-height: 24px;
  }

  .activity-page .ah-title{
    top: calc(34% - 8px);
    font-size: clamp(52px, 8.4vw, 72px);
    line-height: 1.08;
  }

  .activity-page .ah-stats{
    top: calc(60% - 8px);
    height: 70px;
    column-gap: 20px;
  }

  .activity-page .ah-stat b{
    font-size: clamp(26px, 3.6vw, 32px);
    line-height: 38px;
  }

  .activity-page .ah-stat span{
    margin-top: -3px;
    font-size: clamp(12px, 1.75vw, 15px);
    line-height: 20px;
  }

  .activity-page .ah-lead{
    width: min(calc(100% - 64px), 660px);
    margin: 18px auto 0;
    font-size: 18px;
    line-height: 27px;
  }

  .activity-page .ah-stage{
    margin-top: 28px;
  }
}

/* ===================================================================
   גלריית הפעילות במובייל — Figma 1085:254 + 1085:267
   ===================================================================
   הקואורדינטות נמדדו על קנבס 390px. ארבע התמונות ממשיכות להיות
   כרטיסי הקרוסלה הקיימת; data-pos מחליף ביניהן, בעוד צורת כל תא
   נשארת קבועה לפי מסכות האלפא המקוריות של Figma.
   =================================================================== */
@media (max-width: 1024px){
  .activity-page .ah-stage{
    width: min(100%, 390px);
    height: auto;
    aspect-ratio: 390 / 590.2;
    margin-inline: auto;
    overflow: visible;
    --ah-dur: .42s;
  }

  .activity-page .ah-rail{
    inset: 0;
    z-index: 1;
    touch-action: pan-y;
  }

  .activity-page .ah-img,
  .activity-page .ah-img[data-pos="0"],
  .activity-page .ah-img[data-pos="5"],
  .activity-page .ah-img[data-pos="6"],
  .activity-page .ah-img[data-pos="7"],
  .activity-page .ah-img[data-pos="park"]{
    left: 50%;
    top: 35.22%;
    width: 1px;
    height: 1px;
    opacity: 0;
    visibility: hidden;
    transform: none;
    pointer-events: none;
  }

  .activity-page .ah-img[data-pos="1"],
  .activity-page .ah-img[data-pos="2"],
  .activity-page .ah-img[data-pos="3"],
  .activity-page .ah-img[data-pos="4"]{
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
    overflow: hidden;
    border-radius: 0;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
  }

  /* שמאל עליון — Union רך, 176.721×179.912. */
  .activity-page .ah-img[data-pos="1"]{
    left: 12.2979%;
    top: 35.2233%;
    width: 45.3131%;
    height: 30.4836%;
    -webkit-mask-image: url("/assets/img/gallery-tile-top-left.webp");
    mask-image: url("/assets/img/gallery-tile-top-left.webp");
  }

  /* ימין עליון — 111.608×144.667. */
  .activity-page .ah-img[data-pos="2"]{
    left: 59.0846%;
    top: 35.2233%;
    width: 28.6174%;
    height: 24.5115%;
    -webkit-mask-image: url("/assets/img/gallery-tile-top-right.webp");
    mask-image: url("/assets/img/gallery-tile-top-right.webp");
  }

  /* שמאל תחתון — מלבן מעוגל, 143.165×142.245. */
  .activity-page .ah-img[data-pos="3"]{
    left: 12.2979%;
    top: 66.8545%;
    width: 36.7089%;
    height: 24.1003%;
    border-radius: 15px;
    -webkit-mask-image: none;
    mask-image: none;
  }

  /* ימין תחתון — Union, 143.587×177.912. */
  .activity-page .ah-img[data-pos="4"]{
    left: 50.8849%;
    top: 60.8107%;
    width: 36.8172%;
    height: 30.1444%;
    -webkit-mask-image: url("/assets/img/gallery-tile-bottom-right.webp");
    mask-image: url("/assets/img/gallery-tile-bottom-right.webp");
  }

  .activity-page .ah-img[data-pos="1"] .ah-p-a,
  .activity-page .ah-img[data-pos="2"] .ah-p-a,
  .activity-page .ah-img[data-pos="3"] .ah-p-a,
  .activity-page .ah-img[data-pos="4"] .ah-p-a{
    inset: 0;
    border-radius: inherit;
  }

  .activity-page .ah-img[data-pos="1"] .ah-p-b,
  .activity-page .ah-img[data-pos="2"] .ah-p-b,
  .activity-page .ah-img[data-pos="3"] .ah-p-b,
  .activity-page .ah-img[data-pos="4"] .ah-p-b{
    display: none;
  }

  .activity-page .ah-img[data-pos="1"] img,
  .activity-page .ah-img[data-pos="2"] img,
  .activity-page .ah-img[data-pos="3"] img,
  .activity-page .ah-img[data-pos="4"] img{
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: none;
  }

  /* הסרטון האופקי: הקבוצה כולה 298.422×211.650. */
  .activity-page .ah-video{
    left: 11.7408%;
    top: 0;
    width: 76.5185%;
    height: 35.8608%;
    padding: 0;
    background: transparent;
    display: block;
    z-index: 3;
  }

  .activity-page .ah-video-frame{
    position: absolute;
    left: 3.3316%;
    top: 4.5596%;
    width: 92.8204%;
    height: 82.6788%;
    padding: 0;
    border: 1.5px dashed #431f10;
    border-radius: 30px;
    display: block;
  }

  .activity-page .ah-video-inner{
    position: absolute;
    left: 2.4032%;
    top: 3.9737%;
    width: 95.7476%;
    height: 92.5560%;
    border-radius: 30px;
  }

  .activity-page .ah-video video{
    object-position: center center;
  }

  /* כל המדיה נשארת לחיצה להפעלה, ללא אייקון שאינו מופיע בפריים. */
  .activity-page .ah-play{
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    border-radius: 30px;
    box-shadow: none;
    backdrop-filter: none;
  }

  .activity-page .ah-play::before{
    display: none;
  }

  .activity-page .ah-video .ah-give,
  .activity-page .ah .ah-video .ah-give{
    position: absolute;
    left: 20.7255%;
    top: 0;
    width: 61.2120%;
    height: 13.5243%;
    min-height: 0;
    margin: 0;
    padding: 0 8px 0 5px;
    gap: 4px;
    justify-content: center;
    border-radius: 100px;
    font-size: clamp(7px, 2.55vw, 10px);
    line-height: 1;
    box-shadow: 0 4px 10px rgba(241,106,44,.20);
  }

  .activity-page .ah-video .ah-give .arrow-circle{
    position: static;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    transform: none;
  }

  .activity-page .ah-video .ah-give .arrow-circle svg{
    width: 68%;
    height: 68%;
  }

  /* חצי הסליידר המקוריים, 35.253px, במיקומי Figma. */
  .activity-page .ah-nav{
    display: block;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: none;
    z-index: 5;
    pointer-events: none;
  }

  .activity-page .ah-nav .vl-nav{
    position: absolute;
    top: 93.906%;
    width: 9.0393% !important;
    height: auto !important;
    inline-size: 9.0393% !important;
    block-size: auto !important;
    min-width: 0;
    min-height: 0;
    aspect-ratio: 1 / 1;
    padding: 0;
    border: 0;
    background-color: transparent;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    pointer-events: auto;
  }

  .activity-page .ah-nav [data-ah="prev"]{
    left: 40.9232%;
    background-image: url("/assets/activity-mobile/gallery/arrow-prev.svg");
  }

  /* 5.10.2026: arrow-next.svg holds the very same chevron as arrow-prev.svg —
     only its opacity differs — so on a phone both buttons pointed left. The
     drawing is mirrored here, which gives the right-hand button a right-facing
     arrow and matches how the pair looks on a desktop. The circle behind it is
     symmetrical, so nothing else changes. */
  .activity-page .ah-nav [data-ah="next"]{
    left: 60.8461%;
    background-image: url("/assets/activity-mobile/gallery/arrow-next.svg");
    transform: scaleX(-1);
  }

  .activity-page .ah-nav .vl-nav svg{
    display: none;
  }

  /* 44px נגישים בלי לשנות את העיגולים החזותיים. */
  .activity-page .ah-nav .vl-nav::after{
    inset: 50% auto auto 50%;
    width: max(44px, 100%);
    height: max(44px, 100%);
    transform: translate(-50%, -50%);
    border-radius: 50%;
  }
}

/* בטאבלט אותה קומפוזיציה גדלה כיחידה אחת אך נעצרת לפני שהיא
   הופכת לגוש גדול מדי; המדיה והתוכן נשארים שונים בין העמודים. */
@media (min-width: 600px) and (max-width: 1024px){
  .activity-page .ah-stage{
    width: min(72vw, 560px);
  }
}

/* ===================================================================
   5.10.2026 · טלפונים בלבד — הקומפוזיציה תופסת הרבה יותר מהמסך
   -------------------------------------------------------------------
   הווידאו וארבע התמונות גדלים ב-24.66% סביב שוליים של 3%: כאן משתנים
   רק הרוחב והמיקום האופקי, הגבהים והמיקום האנכי נשארים, והבמה גבוהה
   באותו שיעור. כך היחסים ומסכות האלפא של התמונות לא נמתחות בכלל —
   הכול פשוט גדול יותר. טאבלט (600–1024) נשאר בגודל שלו.
   =================================================================== */
@media (max-width: 599px){
  /* body. מעלה את המשקל מעל כלל רוחב מאוחר יותר בקובץ, כך שגם במסך
     טלפון רחב במיוחד הקומפוזיציה לא גדלה בלי גבול */
  body.activity-page .ah-stage{
    width: min(100%, 440px);
    aspect-ratio: 390 / 735.76;
  }
  .activity-page .ah-video{ left: 2.3055%;  width: 95.3895%; }
  .activity-page .ah-img[data-pos="1"]{ left: 3%;       width: 56.4882%; }
  .activity-page .ah-img[data-pos="2"]{ left: 61.3252%; width: 35.675%;  }
  .activity-page .ah-img[data-pos="3"]{ left: 3%;       width: 45.762%;  }
  .activity-page .ah-img[data-pos="4"]{ left: 51.1033%; width: 45.8971%; }
}

/* תיקוני ממשק לגלריית הפעילות במובייל ובטאבלט. הכללים תחומים
   לעמודי הפעילות כדי שטוקני המגע הכלליים של דף הבית לא ינפחו
   את הכפתור והחצים החזותיים של קומפוזיציית Figma. */
@media (max-width: 1024px){
  /* אייקון ההפעלה זהה לשפה של הדסקטופ: זכוכית עדינה, מסגרת
     לבנה ומשולש לבן. שטח הלחיצה נשאר לפחות 44px. */
  .activity-page .ah-play{
    inset: 0;
    margin: auto;
    width: clamp(34px, 10.7692vw, 42px);
    height: clamp(34px, 10.7692vw, 42px);
    opacity: 1;
    border-radius: 50%;
    background: rgba(255,255,255,.18);
    box-shadow: 0 4px 4px rgba(0,0,0,.25);
    backdrop-filter: blur(2px);
  }

  .activity-page .ah-play::before{
    display: block;
    border-width: 2px;
  }

  .activity-page .ah-play::after{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: max(44px, 100%);
    height: max(44px, 100%);
    transform: translate(-50%, -50%);
    border-radius: 50%;
  }

  .activity-page .ah-play svg{
    display: block;
    width: 36%;
    height: 36%;
  }

  /* טקסט קריא יותר ורוחב תואם, בלי להגדיל את גובה הסרטון.
     ::after ממשיך לספק יעד מגע של לפחות 44px. */
  .activity-page .ah-video .ah-give,
  .activity-page .ah .ah-video .ah-give,
  body:not(.desktop-preview).activity-page .ah-video .ah-give{
    left: 10%;
    width: 80% !important;
    inline-size: 80% !important;
    height: 13.5243% !important;
    block-size: 13.5243% !important;
    min-height: 0 !important;
    min-block-size: 0 !important;
    padding: 0 8px 0 4px !important;
    gap: 4px !important;
    font-size: clamp(10px, 3.0769vw, 12px) !important;
    line-height: 1 !important;
  }

  .activity-page .ah-video .ah-give .arrow-circle{
    width: clamp(15px, 4.6154vw, 18px);
    height: clamp(15px, 4.6154vw, 18px);
    flex-basis: clamp(15px, 4.6154vw, 18px);
  }

  .activity-page .ah-video .ah-give::after{
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: max(44px, 100%);
    transform: translateY(-50%);
    border-radius: inherit;
  }

  /* החץ הכהה נשאר במיקומו; החץ העדין מתקרב אליו עד לפער
     חזותי של כ-11.5px ברוחב הייחוס 390px. */
  .activity-page .ah-nav [data-ah="next"]{
    left: 52.9232%;
  }

  /* שני השותפים הם שורה אחת מאוזנת. כל צד מקבל אותו רוחב,
     וגובה האייקון והטיפוגרפיה של המיזם מכוילים ללוגו המשרד. */
  .activity-page .act-partners .partners{
    display: flex !important;
    flex-flow: row wrap !important;
    align-items: center;
    justify-content: center;
    width: min(100%, 370px);
    margin-inline: auto;
    padding-inline: 0;
    column-gap: 3px;
    box-sizing: border-box;
  }

  .activity-page .act-partners-label{
    display: block;
    order: -1;
    flex: 0 0 100%;
    margin: 0 0 5px;
    color: #9f938b;
    font-size: clamp(11px, 3.3333vw, 13px);
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
  }

  .activity-page .act-partners .partner-welfare,
  .activity-page .act-partners .partner-mizam{
    flex: 1 1 0 !important;
    min-width: 0;
    min-height: 44px;
    align-items: center;
  }

  /* שתי גרסאות לוגו המשרד חולקות תא ומידות: אנימציית הצבע
     מחליפה רק את החשיפה, בלי להזיז את הלוגו ביחס למיזם. */
  .activity-page .act-partners .partner-welfare{
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  body.activity-page .act-partners .partner-welfare img{
    position: static;
    inset: auto;
    grid-area: 1 / 1;
    justify-self: end;
    width: calc(clamp(26px, 8.7179vw, 34px) * 3.875);
    transform: none;
  }

  .activity-page .act-partners .partner-welfare img,
  .activity-page .act-partners .partner-mizam .mizam-icon{
    height: clamp(26px, 8.7179vw, 34px) !important;
    max-width: 100%;
    object-fit: contain;
  }

  .activity-page .act-partners .partner-mizam{
    justify-content: flex-start;
    gap: clamp(4px, 1.5385vw, 6px);
  }

  .activity-page .act-partners .partner-mizam .mizam-text{
    flex: 0 1 auto;
    font-size: clamp(9px, 2.8205vw, 11px) !important;
    line-height: 1.13 !important;
    white-space: nowrap;
  }

  .activity-page .act-partners .p-divider{
    flex: 0 0 1px;
    height: clamp(27px, 8.2051vw, 32px);
    margin-inline: 2px;
  }














  .activity-page .ah-crumb{
    font-size: clamp(10.5px, 3.0769vw, 12px);
    opacity: 1;
    color: #fffefb;
  }

  .activity-page .ah-crumb a,
  .activity-page .ah-crumb i{
    color: rgba(255, 254, 251, .68);
  }

  .activity-page .ah-crumb i{
    margin-inline: 2px;
  }

  .activity-page .ah-crumb [aria-current="page"]{
    color: #fffefb;
    opacity: 1;
  }

  /* נכתב בסוף שכבת המובייל בכוונה: כללי המיקום של הקולאז'
     מוגדרים מוקדם יותר ועלולים לאפס transform ו-border-radius. */
  .activity-page .ah-img[data-pos="1"],
  .activity-page .ah-img[data-pos="2"],
  .activity-page .ah-img[data-pos="3"],
  .activity-page .ah-img[data-pos="4"]{
    border-radius: 22px;
  }

  .activity-page .ah-img[data-pos="2"]{
    transform: scaleX(-1);
  }

  .activity-page .ah-img[data-pos="2"] img{
    transform: scaleX(-1);
  }
}

/* ===================== לופ רך של הקרוסלה (10.9.2026) =====================
   הקרוסלה מתקדמת לבד צעד אחר צעד, בדיוק כמו לחיצה על החץ, אבל
   בגלישה איטית ורכה (1.2s) ובקצב קבוע. אינטראקציה משהה אותה לרגע. */
.ah-stage.is-auto .ah-img{
  --ah-dur: 1.2s;
  transition-timing-function: cubic-bezier(.45,.05,.2,1);
}