/* ===== אנימציות כותרות — הירו ואזורים =====
 * מופעל רק כאשר html.mnd-anim קיים (נוסף ב-head כשאין העדפת reduced-motion).
 * mndGuard: רשת ביטחון — אם ה-JS לא רץ, הכל מופיע אחרי 4 שניות.
 */

@keyframes mndGuard {
	to { opacity: 1; }
}

@keyframes mndWordUp {
	from { opacity: 0; transform: translateY(0.7em); }
	to { opacity: 1; transform: none; }
}

@keyframes mndMask {
	from { clip-path: inset(0 -5% 100% -5%); transform: translateY(14px); opacity: 1; }
	to { clip-path: inset(-25% -5% -25% -5%); transform: none; opacity: 1; }
}

/* --- מצב התחלתי מוסתר: הירו דף הבית (דסקטופ + מובייל) --- */
html.mnd-anim .elementor-element-2867bb6 .elementor-heading-title,
html.mnd-anim .elementor-element-031af49 .elementor-heading-title,
html.mnd-anim .elementor-element-2f9b272 .elementor-heading-title,
html.mnd-anim .elementor-element-fe69ac6 .elementor-heading-title,
html.mnd-anim .elementor-element-b813f91 .elementor-heading-title,
html.mnd-anim .elementor-element-b3ad21f .elementor-heading-title {
	opacity: 0;
	animation: mndGuard 0.8s ease 4s forwards;
}

/* --- מצב התחלתי מוסתר: פסקאות ההירו בדף הבית + הירו דף ארגונים --- */
html.mnd-anim .elementor-element-03b97d9,
html.mnd-anim .elementor-element-9d0de3a,
html.mnd-anim .elementor-element-7435e45,
html.mnd-anim .elementor-element-e88bc8d,
html.mnd-anim .elementor-element-429852a,
html.mnd-anim .elementor-element-7322b55,
html.mnd-anim .elementor-element-1dbc2e1,
html.mnd-anim .elementor-element-a5adfba,
html.mnd-anim .elementor-element-0b116ba,
html.mnd-anim .elementor-element-14903f6,
html.mnd-anim .elementor-element-b2e1849,
html.mnd-anim .elementor-element-430ba68,
html.mnd-anim .elementor-element-2fde47a {
	opacity: 0;
	animation: mndGuard 0.8s ease 4s forwards;
}

/* --- אנימציה 3: מילה אחר מילה --- */
html.mnd-anim .mnd-words.mnd-go {
	opacity: 1;
	animation: none;
}

html.mnd-anim .mnd-words.mnd-go .mnd-word {
	display: inline-block;
	opacity: 0;
	animation: mndWordUp 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

/* --- אנימציה 2: חשיפה במסכה --- */
html.mnd-anim .mnd-mask.mnd-go {
	opacity: 1;
	animation: mndMask 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* --- אותה חשיפה לתמונות (הלבבות בדף לתיאום סדנה) ---
 * רצה על ה-img ולא על הווידג'ט: לווידג'ט של הלב הימני יש
 * transform משלו (הטייה של 18°), ו-mndMask הייתה מוחקת אותה.
 */
html.mnd-anim .elementor-element-3760740 img,
html.mnd-anim .elementor-element-d8111cb img {
	opacity: 0;
	animation: mndGuard 0.8s ease 4s forwards;
}

html.mnd-anim .mnd-media.mnd-go img {
	opacity: 1;
	animation: mndMask 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* --- כותרות אזור: חשיפה בגלילה --- */
html.mnd-anim .mnd-sec {
	opacity: 0;
}

html.mnd-anim .mnd-sec.mnd-sec-in {
	opacity: 1;
	animation: mndMask 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* --- כיבוד העדפת הפחתת תנועה --- */
@media (prefers-reduced-motion: reduce) {
	html.mnd-anim .mnd-sec,
	html.mnd-anim [class*="elementor-element-"] .elementor-heading-title,
	html.mnd-anim .elementor-element-3760740 img,
	html.mnd-anim .elementor-element-d8111cb img {
		opacity: 1 !important;
		animation: none !important;
	}
}

/* ===== פסקאות וכפתורים — קונטיינר "הסדנה שלי" וקונטיינר "נעים להכיר" =====
 * עלייה רכה (opacity + translateY בלבד, שתי תכונות שרצות על ה-GPU).
 * שורת "שמחה להכיר" והמשפט הירוק נכנסים אות אחרי אות בדסקטופ בלבד;
 * במובייל הם מקבלים עלייה רכה כמו שאר הטקסט.
 */

html.mnd-anim {
	--mnd-y: 18px;
	--mnd-dur: 0.7s;
	--mnd-ch-y: 6px;
	--mnd-ch-dur: 0.42s;
}

@media (max-width: 767px) {
	html.mnd-anim {
		--mnd-y: 10px;
		--mnd-dur: 0.5s;
	}
}

@keyframes mndRise {
	from { opacity: 0; transform: translateY(var(--mnd-y, 18px)); }
	to { opacity: 1; transform: none; }
}

@keyframes mndCharUp {
	from { opacity: 0; transform: translateY(var(--mnd-ch-y, 6px)); }
	to { opacity: 1; transform: none; }
}

/* --- מצב התחלתי מוסתר + רשת ביטחון של 4 שניות אם ה-JS לא רץ --- */
html.mnd-anim .elementor-element-b43fbab,
html.mnd-anim .elementor-element-cc7e007,
html.mnd-anim .elementor-element-e11d6d2,
html.mnd-anim .elementor-element-40ebd11,
html.mnd-anim .elementor-element-2d36b2b,
html.mnd-anim .elementor-element-f8330e8,
html.mnd-anim .elementor-element-0f0023b {
	opacity: 0;
	animation: mndGuard 0.8s ease 4s forwards;
}

/* --- ה-JS תפס את האלמנטים: מבטלים את רשת הביטחון ---
 * mnd-para ו-mnd-rise נוספות רק אחרי שה-JS עבר את בדיקות mnd-anim
 * ו-IntersectionObserver, ולכן הן סימן ודאי שיש מי שינהל את הכניסה.
 * בלעדי זה הגארד היה מסיים אחרי 4 שניות עוד לפני שגוללים לקונטיינר,
 * הטקסט היה נראה, ואז mnd-in היה מאפס אותו ל-0 ומריץ את האנימציה מחדש.
 */
html.mnd-anim .mnd-para,
html.mnd-anim .mnd-rise {
	opacity: 0;
	animation: none;
}

/* --- עלייה רכה לאלמנט שלם (הכפתורים) --- */
html.mnd-anim .mnd-rise.mnd-in {
	opacity: 0;
	animation: mndRise var(--mnd-dur) cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* --- עלייה רכה ליחידות בתוך ווידג'ט טקסט --- */
html.mnd-anim .mnd-para.mnd-in {
	opacity: 1;
	animation: none;
}

html.mnd-anim .mnd-para.mnd-in .mnd-u {
	opacity: 0;
	animation: mndRise var(--mnd-dur) cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* שורה שהופרדה מ-br: בלוק כדי שאפשר יהיה להזיז אותה, בלי שורה ריקה נוספת */
html.mnd-anim .mnd-para .mnd-u-block {
	display: block;
}

/* --- אות אחרי אות: המילה נשארת שלמה כדי שלא תישבר בסוף שורה --- */
html.mnd-anim .mnd-para .mnd-w {
	display: inline-block;
	white-space: nowrap;
}

html.mnd-anim .mnd-para.mnd-in .mnd-ch {
	display: inline-block;
	opacity: 0;
	animation: mndCharUp var(--mnd-ch-dur) ease-out both;
}

/* --- כיבוד העדפת הפחתת תנועה --- */
@media (prefers-reduced-motion: reduce) {
	html.mnd-anim .mnd-rise,
	html.mnd-anim .mnd-para,
	html.mnd-anim .mnd-para .mnd-u,
	html.mnd-anim .mnd-para .mnd-ch {
		opacity: 1 !important;
		animation: none !important;
	}
}