/* ==========================================================================
   Defender — שכבת העמודים הפנימיים (מאמר · Hub · אודות · צור קשר · נחיתה)

   נטענת אחרי v2.css ורק בתבניות page-article / page-landing. כל ערך כאן
   נגזר מהטוקנים של `.v2` — אפס הקסים חדשים, אפס מדרגות חדשות. החוזה:
   ART-DIRECTION חלק ד'.

   מה הקובץ מוסיף: נעיצת ההדר במצב הלבן (אין וידאו מתחתיו), ראש עמוד
   קריאה, גריד מאמר + תוכן עניינים דביק, בלוקי הספרייה של האיפיון (טבלה,
   הדגשה, השורה-התחתונה, ציטוט, דיאגרמה), רצועת הקרובים, פאנל הליד,
   אינדקס ה-Hub, ודפי הנחיתה.
   ========================================================================== */

/* --------------------------------------------------------------------------
   האקסנט החי של העמוד — אותו מנגנון כמו .state--gold: הטוקן מוצהר על
   אותו אלמנט שנושא את המחלקה (מלכודת §5.11 ב-HANDOFF), ויורש פנימה.
   -------------------------------------------------------------------------- */

.v2 .acc-brand { --acc: var(--brand); --acc-ink: var(--blue-600); }
.v2 .acc-gold  { --acc: var(--gold-fill); --acc-ink: var(--gold); }
.v2 .acc-teal  { --acc: var(--teal-fill); --acc-ink: var(--teal); }
.v2 .acc-coral { --acc: var(--coral-fill); --acc-ink: var(--coral); }

/* --------------------------------------------------------------------------
   ההדר, נעוץ לבן

   אותו header-overlay של דף הבית — אבל בעמוד פנימי אין וידאו מתחתיו,
   ולכן הוא נולד במצב הסופי שלו: לבן, מכווץ, לוגו כחול. `--hdr: 1` מזין
   את כל השרשרת (רקע, צל, החלפת לוגו, גובה) בלי לגעת ברכיב עצמו.

   body.hdr-solid מגיע מ-functions.php לפי התבנית. הספציפיות ‎(0,3,0)‎
   גוברת על הצהרת הבסיס ועל ה-fallback של @supports.
   -------------------------------------------------------------------------- */

body.v2.hdr-solid .site-header--overlay {
	--hdr: 1;
	animation: none;
}

/* המיין יושב מתחת להדר קבוע. בדף הבית ההירו זולג תחתיו בכוונה; כאן
   התוכן חייב לרדת בדיוק בגובהו.

   ⚠️ לא מספר קבוע: ההדר הנעוץ (hdr-solid) מכווץ לפי
   ‎clamp(10px, 1.9vw, 28px)‎ — הנוסחה של cinema.css — וכל קיבוע (68px)
   מדויק רק ברוחב אחד ופוער פס לבן בכל השאר (הבאג שג'וני תפס). אותה
   נוסחה כאן = צמוד בכל רוחב מסך, דסקטופ ומובייל. אם משנים את הכיווץ
   ב-cinema.css — לשנות גם כאן. */
.v2 .site-main--inner {
	margin-block-start: 0;
	padding-block-start: calc(var(--header-h, 96px) - clamp(10px, 1.9vw, 28px));
}

/* --------------------------------------------------------------------------
   פירורי לחם — מיקרו, שקטים, עם חץ הכיוון של האתר
   -------------------------------------------------------------------------- */

.v2 .crumbs ol {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--s1) var(--s3);
	margin: 0 0 var(--s5);
	padding: 0;
	list-style: none;
	font-size: var(--fs-micro);
	color: var(--muted);
}
.v2 .crumbs a { color: var(--blue-600); text-decoration: none; }
.v2 .crumbs a:hover { text-decoration: underline; }
.v2 .crumbs li[aria-current] { color: var(--body); font-weight: 500; }
/* המפריד — אותו חץ שמוביל קדימה בכל האתר. ויזואלי בלבד. */
.v2 .crumbs li + li::before {
	content: "←";
	margin-inline-end: var(--s3);
	color: var(--line);
}

/* --------------------------------------------------------------------------
   ראש עמוד קריאה — מיושר להתחלה, קו הכובע מעל הכותרת
   -------------------------------------------------------------------------- */

.v2 .art-head {
	position: relative;
	overflow: hidden;
	padding-block: var(--s6) var(--s5);
}
@media (min-width: 900px) { .v2 .art-head { padding-block: var(--s7) var(--s6); } }

.v2 .art-head .shield-mark {
	inset-block-start: -34%;
	inset-inline-end: -10%;
	inline-size: 34%;
	color: var(--acc, var(--brand));
	opacity: 0.05;
}
.v2 .art-head > .shell { position: relative; z-index: 1; }

.v2 .art-head h1 {
	position: relative;
	max-inline-size: 24ch;
	padding-block-start: var(--s3);
	font-size: clamp(2rem, 1.4rem + 2.6vw, 3.3rem);
	font-weight: 600;
}
/* הכובע הצבוע — האידיום של הצעדים והרצועות, על כותרת העמוד. */
.v2 .art-head h1::before {
	content: "";
	position: absolute;
	inset-block-start: 0;
	inset-inline-start: 0;
	inline-size: 52px;
	block-size: 3px;
	background: var(--acc, var(--brand));
}
.v2 .art-head .lead { margin-block-start: var(--s4); }

/* --------------------------------------------------------------------------
   גריד המאמר — עמודת קריאה + תוכן עניינים

   סדר ה-DOM: תוכן העניינים לפני הפרוזה. במובייל הוא בלוק קומפקטי לפני
   הטקסט; בדסקטופ הוא נשלח לעמודה השנייה (השמאלית ב-RTL) ונדבק.
   -------------------------------------------------------------------------- */

.v2 .art-body { padding-block: 0 var(--s7); }

.v2 .art-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--s5);
}
@media (min-width: 1020px) {
	.v2 .art-grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 16rem);
		gap: clamp(2rem, 5vw, 4.5rem);
		align-items: start;
	}
	/* סדר ה-DOM הוא סייד-בר → פרוזה (כדי שבמובייל תוכן העניינים יבוא
	   אחרי הליד) — ולכן ההצבה בדסקטופ חייבת להיות מפורשת: בלי זה ההשמה
	   האוטומטית שולחת את הסייד-בר לעמודה הרחבה. נתפס בצילום הראשון.

	   ⚠️ ההצבה על .art-toc חייבת להיות מוגבלת לילד ישיר של הגריד
	   (השימוש הישן — אודות/צור קשר): כשה-toc מקונן בתוך .art-side,
	   `grid-column: 2` נתפס ביחס לגריד של הסייד-בר עצמו, פותח שם עמודה
	   משתמעת שנייה — והכרטיסים נדחסו זה לצד זה והכפתורים נמעכו
	   לאליפסות. נתפס בבדיקת ה-DOM. */
	.v2 .art-prose { grid-column: 1; grid-row: 1; }
	.v2 .art-side,
	.v2 .art-grid > .art-toc {
		grid-column: 2;
		grid-row: 1;
		position: sticky;
		inset-block-start: calc(68px + var(--s4));
	}
	.v2 .art-side .art-toc { position: static; grid-column: auto; grid-row: auto; }
}

/* --- הסייד-בר: תוכן עניינים + כרטיס ההמרה, ערימה דביקה אחת --- */
.v2 .art-side { display: grid; gap: var(--s4); align-content: start; }
.v2 .side-cta { padding: var(--s4); display: grid; gap: var(--s3); }
.v2 .side-cta__t { font-size: var(--fs-body); font-weight: 700; color: var(--ink); }
.v2 .side-cta .micro { color: var(--muted); }
.v2 .side-cta .b { inline-size: 100%; }
/* במובייל הסייד-בר כולו מוסתר (ג'וני 4.8 לילה: "בעמוד הזה" לא
   בהתחלה או להסתיר) — פס ההתקדמות והרייל הצף מכסים את הניווט
   וההמרה, והמאמר נקרא רצוף. */
@media (max-width: 1019px) {
	.v2 .art-side { display: none; }
}

.v2 .art-toc {
	padding: var(--s4) var(--s4) var(--s3);
	border: 1px solid var(--line);
	border-radius: var(--r1);
	background: var(--bg);
}
.v2 .art-toc__t { margin-block-end: var(--s2); font-weight: 700; color: var(--blue-800); }
.v2 .art-toc ol {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: toc;
}
.v2 .art-toc li { border-block-start: 1px solid var(--line); }
.v2 .art-toc li:first-child { border-block-start: 0; }
.v2 .art-toc a {
	display: flex;
	align-items: baseline;
	gap: var(--s2);
	padding-block: 0.55rem;
	font-size: var(--fs-micro);
	line-height: 1.45;
	color: var(--body);
	text-decoration: none;
	counter-increment: toc;
	transition: color var(--dur) var(--ease);
}
.v2 .art-toc a::before {
	content: counter(toc, decimal-leading-zero);
	flex: none;
	font-variant-numeric: tabular-nums;
	direction: ltr;
	font-weight: 700;
	color: var(--acc-ink, var(--blue-600));
	opacity: 0.55;
}
.v2 .art-toc a:hover { color: var(--acc-ink, var(--blue-600)); }
.v2 .art-toc a[aria-current] { color: var(--acc-ink, var(--blue-600)); font-weight: 500; }
.v2 .art-toc a[aria-current]::before { opacity: 1; }

/* --------------------------------------------------------------------------
   הפרוזה — עמודת הקריאה ובלוקי הספרייה
   -------------------------------------------------------------------------- */

.v2 .art-prose { max-inline-size: 46rem; }

.v2 .art-prose h2 {
	position: relative;
	margin-block: var(--s7) var(--s4);
	padding-block-start: var(--s3);
	font-size: clamp(1.5rem, 1.2rem + 1.3vw, 2.1rem);
	/* עוגני תוכן העניינים נעצרים מתחת להדר הקבוע. */
	scroll-margin-block-start: calc(68px + var(--s5));
}
.v2 .art-prose h2:first-child { margin-block-start: 0; }
.v2 .art-prose h2::before {
	content: "";
	position: absolute;
	inset-block-start: 0;
	inset-inline-start: 0;
	inline-size: 52px;
	block-size: 3px;
	background: var(--acc, var(--brand));
}
.v2 .art-prose h3 { margin-block: var(--s5) var(--s3); font-size: var(--fs-h3); }

.v2 .art-prose p { margin: 0; }
.v2 .art-prose p + p { margin-block-start: var(--s4); }
.v2 .art-prose h2 + p, .v2 .art-prose h3 + p { margin-block-start: 0; }
.v2 .art-prose strong { font-weight: 700; color: var(--ink); }

.v2 .art-prose ul, .v2 .art-prose ol {
	margin: var(--s4) 0 0;
	padding-inline-start: var(--s4);
	display: grid;
	gap: var(--s3);
}
.v2 .art-prose li { line-height: 1.65; }
.v2 .art-prose li::marker { color: var(--acc-ink, var(--brand)); font-weight: 700; }

/* --- קופסת "בקצרה" — התמצית בראש המאמר (שדרוג 4.8 לילה) --- */

.v2 .takeaways {
	margin-block-end: var(--s6);
	padding: var(--s5);
	border-inline-start: 3px solid var(--acc, var(--brand));
	border-radius: var(--r1);
	background: var(--tint);
}
.v2 .takeaways__t {
	margin-block-end: var(--s3);
	font-size: var(--fs-micro);
	font-weight: 700;
	color: var(--blue-600);
}
.v2 .takeaways ul {
	margin: 0;
	padding-inline-start: var(--s4);
	display: grid;
	gap: var(--s2);
}
.v2 .takeaways li { color: var(--ink); line-height: 1.55; }
.v2 .takeaways li::marker { color: var(--acc-ink, var(--blue-600)); font-weight: 700; }

/* מובייל: "בקצרה" קומפקטית יותר (ג'וני 4.8 לילה). */
@media (max-width: 679px) {
	.v2 .takeaways { padding: var(--s4); margin-block-end: var(--s5); }
	.v2 .takeaways__t { font-size: 0.72rem; margin-block-end: var(--s2); }
	.v2 .takeaways li { font-size: var(--fs-micro); line-height: 1.5; }
	.v2 .takeaways ul { gap: var(--s1); }
}

/* --- רצועת ההמרה באמצע המאמר --- */

.v2 .midcta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--s3) var(--s4);
	margin-block-start: var(--s6);
	padding: var(--s4) var(--s5);
	border: 1px solid var(--line);
	border-inline-start: 3px solid var(--acc, var(--brand));
	border-radius: var(--r2);
	background: linear-gradient(100deg, var(--tint), var(--bg));
}
.v2 .midcta p { margin: 0; }
.v2 .midcta b { display: block; color: var(--ink); font-weight: 700; }
.v2 .midcta span { font-size: var(--fs-small); color: var(--body); }
.v2 .midcta .b { flex: none; }

/* --- שורת השיתוף — הקהל חי בוואטסאפ --- */

.v2 .art-share {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--s3);
	margin-block-start: var(--s6);
	padding-block-start: var(--s4);
	border-block-start: 1px solid var(--line);
}
.v2 .art-share .micro { color: var(--muted); }

/* --- פס התקדמות הקריאה — אותו ציר גלילה שמניע את היפוך ההדר.
   נטען רק בעמודי מאמר (הרנדרר מזריק אותו). דפדפן בלי scroll-timeline
   פשוט לא רואה אותו. RTL: מתמלא מימין. --- */

@supports (animation-timeline: scroll()) {
	.v2 .readbar {
		position: fixed;
		inset-inline: 0;
		inset-block-start: 0;
		z-index: 61;
		block-size: 3px;
		background: linear-gradient(105deg, #4573B6 0%, #2F5794 45%, #1D3763 100%);
		transform-origin: 100% 50%;
		transform: scaleX(0);
		animation: v2-readbar linear both;
		animation-timeline: scroll();
		pointer-events: none;
	}
	@keyframes v2-readbar {
		to { transform: scaleX(1); }
	}
}

/* --- צילום המחשה — פריים הסדרה בתוך המאמר (אחד לכל היותר) --- */

.v2 .art-photo {
	margin: var(--s6) 0 0;
	overflow: hidden;
	border-radius: var(--r2);
	box-shadow: var(--sh1);
	aspect-ratio: 16 / 10;
}
.v2 .art-photo > img { inline-size: 100%; block-size: 100%; object-fit: cover; }

/* --- הדיאגרמה — הדימוי של עמוד המאמר --- */

.v2 .art-fig { margin: var(--s5) 0 0; }
.v2 .art-fig__panel {
	padding: var(--s5);
	border-radius: var(--r2);
	background: var(--tint);
}
.v2 .art-fig__panel .fig__svg { max-block-size: 15rem; }
.v2 .art-fig figcaption { margin-block-start: var(--s2); color: var(--muted); }

/* --- טבלת השוואה — קווי שיער, לא קופסאות --- */

.v2 .table-scroll {
	margin-block-start: var(--s5);
	overflow-x: auto;
	border: 1px solid var(--line);
	border-radius: var(--r1);
	/* הגלילה בתוך המכל, לא בעמוד — מלכודת הגלישה האופקית. */
	max-inline-size: 100%;
}
.v2 .art-table {
	inline-size: 100%;
	min-inline-size: 34rem;
	border-collapse: collapse;
	font-size: var(--fs-small);
	line-height: 1.5;
}
.v2 .art-table caption {
	padding: var(--s3) var(--s4);
	text-align: start;
	font-size: var(--fs-micro);
	font-weight: 700;
	color: var(--blue-800);
	border-block-end: 1px solid var(--line);
	background: var(--tint);
}
.v2 .art-table th, .v2 .art-table td {
	padding: var(--s3) var(--s4);
	text-align: start;
	vertical-align: top;
	border-block-start: 1px solid var(--line);
}
.v2 .art-table thead th {
	border-block-start: 0;
	background: var(--tint);
	font-size: var(--fs-micro);
	font-weight: 700;
	color: var(--blue-800);
}
.v2 .art-table tbody th { font-weight: 500; color: var(--ink); }
.v2 .art-table td { color: var(--body); }

/* --- קופסת "השורה התחתונה" — טיפול הזהב של .saving, כבלוק --- */

.v2 .bottomline {
	margin-block-start: var(--s5);
	padding: var(--s5);
	border: 1px solid #F3DFB8;
	border-radius: var(--r1);
	background: linear-gradient(100deg, #FFF6E6, #FFFCF4);
}
.v2 .bottomline__t {
	margin-block-end: var(--s2);
	font-size: var(--fs-micro);
	font-weight: 700;
	color: var(--gold);
}
.v2 .bottomline p { color: var(--ink); }
.v2 .bottomline p + p { margin-block-start: var(--s3); }

/* --- ציטוט — ה-״ הגדול של כרטיסי ההמלצות --- */

.v2 .art-quote {
	margin: var(--s5) 0 0;
	padding-inline-start: var(--s5);
	border-inline-start: 3px solid var(--acc, var(--brand));
}
.v2 .art-quote > p { font-size: var(--fs-lead); line-height: 1.5; color: var(--ink); }
.v2 .art-quote > p::before {
	content: "״";
	display: block;
	font-size: 2rem;
	font-weight: 700;
	line-height: 1;
	color: var(--acc-ink, var(--blue-600));
}
.v2 .art-quote footer { margin-block-start: var(--s2); font-size: var(--fs-micro); color: var(--muted); }

/* --- note — קיים ב-v2.css; כאן רק מרווח בהקשר הפרוזה --- */

.v2 .art-prose .note { margin-block-start: var(--s5); }
.v2 .art-prose .note p + p { margin-block-start: var(--s3); }

/* --- לוחית נתונים (plate) בתוך פרוזה — שורות מפתח-ערך --- */

.v2 .art-prose .plate {
	margin-block-start: var(--s5);
	border: 1px solid var(--line);
	border-radius: var(--r1);
	overflow: hidden;
}

/* --- אקורדיון השאלות בתוך המאמר --- */

.v2 .art-prose .qa > div { max-inline-size: none; }

/* --- שאלות נפוצות ככרטיסים (ג'וני: "שייראו יפה וטוב") ---
   אותו מנגנון details.qa שמזין את ה-Schema — עטוף כרטיס: גבול, רדיוס,
   מסמן +/× בתוך עיגול tint שמתמלא באקסנט בפתיחה. הקווים-בלבד נשארים
   בדף הבית; במאמר השאלות הן תוכן ראשי ומקבלות נפח. --- */

.v2 .art-faq { display: grid; gap: var(--s3); margin-block-start: var(--s4); }
.v2 .art-faq .qa {
	border: 1px solid var(--line);
	border-radius: var(--r1);
	background: var(--w);
	padding-inline: var(--s4);
	transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.v2 .art-faq .qa:last-of-type { border-block-end: 1px solid var(--line); }
.v2 .art-faq .qa[open] {
	border-color: var(--acc, var(--brand));
	box-shadow: var(--sh1);
}
.v2 .art-faq .qa > summary {
	padding-block: var(--s4);
	font-weight: 500;
	align-items: center;
}
/* המסמן — עיגול tint שמתמלא באקסנט בפתיחה, ה-+ מסתובב ל-×. */
.v2 .art-faq .qa > summary::after {
	inline-size: 26px;
	block-size: 26px;
	margin-block-start: 0;
	border-radius: 50%;
	background:
		linear-gradient(currentColor, currentColor) center / 10px 2px no-repeat,
		linear-gradient(currentColor, currentColor) center / 2px 10px no-repeat,
		var(--tint);
	color: var(--acc-ink, var(--blue-600));
	transition: transform 300ms var(--ease), background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.v2 .art-faq .qa[open] > summary::after {
	background:
		linear-gradient(currentColor, currentColor) center / 10px 2px no-repeat,
		linear-gradient(currentColor, currentColor) center / 2px 10px no-repeat,
		var(--acc, var(--brand));
	color: var(--w);
}
.v2 .art-faq .qa > div { padding-block: 0 var(--s4); }
.v2 .art-faq .qa > div p { border-inline-start: 2px solid var(--acc, var(--brand)); padding-inline-start: var(--s3); }

/* --- דפדוף הקודם/הבא בתוך ה-Hub --- */

.v2 .art-pager {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--s3);
	margin-block-start: var(--s7);
	padding-block-start: var(--s5);
	border-block-start: 1px solid var(--line);
}
@media (min-width: 680px) { .v2 .art-pager { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.v2 .pager__cell {
	display: grid;
	gap: var(--s1);
	padding: var(--s4);
	border: 1px solid var(--line);
	border-radius: var(--r2);
	background: var(--w);
	text-decoration: none;
	transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.v2 .pager__cell--empty { border: 0; }
.v2 .pager__cell--next { text-align: end; }
.v2 .pager__cell .micro { color: var(--muted); }
.v2 .pager__cell b { font-size: var(--fs-body); font-weight: 600; color: var(--blue-800); }
.v2 .pager__cell:hover:not(.pager__cell--empty) {
	transform: translateY(-2px);
	box-shadow: var(--sh1);
	border-color: var(--acc, var(--brand));
}

/* --------------------------------------------------------------------------
   רצועת surface שטוחה — קצוות ישרים

   4.8 ערב: ג'וני העביר את העמוד לקווים ישרים (חיתוך המגן וסקין הגלים
   ירדו מדף הבית). הרצועות הפנימיות מיישרות קו: משטח משני, קצה ישר,
   בלי גל — בדיוק כמו רצועת המבטחות וההמלצות בבית. הגלים נשארים מוגדרים
   ב-v2.css למקרה שהשפה תחזור אליהם.
   -------------------------------------------------------------------------- */

.v2 .sec--band {
	margin-block-start: 0;
	background: var(--surface);
}

/* --------------------------------------------------------------------------
   רצועת הקרובים — קווי שיער + חץ-עיגול, על המשטח המשני
   -------------------------------------------------------------------------- */

.v2 .art-related .sec-head--start {
	text-align: start;
	margin-inline: 0;
	margin-block-end: var(--s5);
}

.v2 .rel-list {
	margin: 0;
	padding: 0;
	list-style: none;
	max-inline-size: 54rem;
}
.v2 .rel-list li { border-block-start: 1px solid var(--line); }
.v2 .rel-list li:last-child { border-block-end: 1px solid var(--line); }
.v2 .rel-list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--s4);
	padding-block: var(--s3);
	color: var(--ink);
	text-decoration: none;
	transition: padding-inline-start var(--dur) var(--ease);
}
.v2 .rel-list .rel__txt { display: grid; gap: 2px; }
.v2 .rel-list b { font-size: var(--fs-body); font-weight: 500; color: var(--ink); }
/* על surface אסור muted (‎4.45 נמדד על לבן) — הטקסט המשני ב-body. */
.v2 .rel-list .micro { color: var(--body); }
.v2 .rel-list a::after {
	content: "←";
	display: grid;
	place-items: center;
	flex: none;
	inline-size: 28px;
	block-size: 28px;
	border: 1px solid var(--line);
	border-radius: 50%;
	background: var(--w);
	color: var(--acc-ink, var(--brand));
	font-size: 0.9rem;
	line-height: 1;
	transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease),
		color var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.v2 .rel-list a:hover { padding-inline-start: var(--s2); }
.v2 .rel-list a:hover b { color: var(--acc-ink, var(--blue-600)); }
.v2 .rel-list a:hover::after,
.v2 .rel-list a:focus-visible::after {
	background: var(--acc, var(--brand));
	border-color: var(--acc, var(--brand));
	color: var(--w);
	transform: translateX(-3px);
}

.v2 .rel-hub {
	display: inline-block;
	margin-block-start: var(--s5);
	font-size: var(--fs-small);
	font-weight: 700;
	color: var(--acc-ink, var(--blue-600));
	text-decoration: none;
}
.v2 .rel-hub:hover { text-decoration: underline; }

/* --------------------------------------------------------------------------
   פאנל הליד — מ-4.8 לילה הוא **סקשן ה-CTA של דף הבית עצמו** (הוראת
   ג'וני: זהה, כולל הפילם). כל הסגנון יושב ב-v2.css תחת ‎.cta‎; כאן רק
   שתי תוספות הטופס שהעזר משתמש בהן.
   -------------------------------------------------------------------------- */

.v2 .form .form__alt { inline-size: 100%; margin-block-start: var(--s3); }
.v2 .form .form__note { margin-block-start: var(--s3); }

/* --------------------------------------------------------------------------
   שקופית פלייסהולדר — נכס שג'וני מפיק
   -------------------------------------------------------------------------- */

.v2 .ph--slot {
	display: grid;
	place-items: center;
	background: var(--tint);
	outline: 1px dashed var(--brand);
	outline-offset: -8px;
	border-radius: var(--r2);
}
.v2 .ph--slot::before, .v2 .ph--slot::after { content: none; }
.v2 .ph--slot .shield-mark {
	position: absolute;
	inset-block-end: -26%;
	inset-inline-end: -8%;
	inline-size: 44%;
	color: var(--brand);
	opacity: 0.07;
}
.v2 .ph--slot .ph__slot {
	position: relative;
	z-index: 1;
	max-inline-size: 26ch;
	padding: var(--s2) var(--s3);
	border-radius: 999px;
	background: var(--w);
	box-shadow: var(--sh1);
	color: var(--blue-600);
	font-weight: 500;
	text-align: center;
}

/* --------------------------------------------------------------------------
   עמוד Hub — הגרסה החיה (סבב ג'וני 4.8 לילה: "עמוד-עמוד")

   ההירו צילומי, ברוחב מלא, עם שכבת האינק של סקשן הסגירה — כל Hub מקבל
   את הפריים שלו ואת הזהות שלו. הכותרת גדולה, יושבת נמוך, על צד הקריאה.
   -------------------------------------------------------------------------- */

.v2 .hub-hero {
	position: relative;
	overflow: hidden;
	background: var(--blue-800);
	/* is-layout-flow של וורדפרס נותן ‎16px‎ לכל אח-עוקב בתוך התוכן —
	   וההירו יושב אחרי פס-הקריאה. זה הפס הלבן שג'וני תפס מתחת להדר. */
	margin-block: 0;
}
.v2 .hub-hero__bg { position: absolute; inset: 0; z-index: 0; }
.v2 .hub-hero__bg > img { inline-size: 100%; block-size: 100%; object-fit: cover; }
/* ההחשכה — אותו מתכון כמו סקשן הסגירה בבית: כבד בצד הטקסט, פתוח בצד
   הצילום. נבדק שם ל-AA. */
.v2 .hub-hero__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background:
		linear-gradient(to left, rgb(13 35 64 / 0.92) 0%, rgb(13 35 64 / 0.72) 48%, rgb(13 35 64 / 0.34) 100%),
		linear-gradient(rgb(13 35 64 / 0.2), rgb(13 35 64 / 0.2));
}
.v2 .hub-hero__inner {
	position: relative;
	z-index: 2;
	display: grid;
	align-content: end;
	min-block-size: clamp(19rem, 44vh, 27rem);
	padding-block: var(--s6);
}
.v2 .hub-hero .crumbs ol { margin-block-end: var(--s4); color: rgb(255 255 255 / 0.6); }
.v2 .hub-hero .crumbs a { color: rgb(255 255 255 / 0.85); }
.v2 .hub-hero .crumbs li[aria-current] { color: var(--w); }
.v2 .hub-hero .crumbs li + li::before { color: rgb(255 255 255 / 0.38); }
.v2 .hub-hero h1 {
	color: var(--w);
	font-size: clamp(2.3rem, 1.5rem + 3.4vw, 4.2rem);
	font-weight: 600;
	max-inline-size: 18ch;
}
.v2 .hub-hero .lead {
	color: rgb(255 255 255 / 0.88);
	margin-block-start: var(--s3);
	max-inline-size: 38rem;
	/* ‎-20%‎ מ---fs-lead — בקשת ג'וני (4.8 לילה): הטקסט הרץ מתחת לכותרת
	   ההירו קטן יותר. ‎1.1/0.98+0.8vw/1.45 × 0.8‎. */
	font-size: clamp(0.88rem, 0.78rem + 0.64vw, 1.16rem);
}
.v2 .hub-hero .micro { color: rgb(255 255 255 / 0.6); margin-block-start: var(--s4); }

/* כרטיס רוחב עם פלייסהולדר במקום צילום — השקופית ממלאה את תא התמונה. */
.v2 .hubwide__fig > .ph--slot { position: absolute; inset: 0; border-radius: 0; }

/* --- הירו וידאו (אודות) — אותו שלד hub-hero, גבוה יותר, עם שכבת פילם
   שמוזרקת אחרי הטעינה (film.js, דסקטופ בלבד) — המנגנון של ההירו בבית. --- */
.v2 .hub-hero--film .hub-hero__inner { min-block-size: clamp(26rem, 68svh, 42rem); }
.v2 .hub-hero__film {
	position: absolute;
	inset: 0;
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 900ms var(--ease);
}
.v2 .hub-hero__film.is-playing { opacity: 1; }
/* הפילם יושב מעל הפוסטר (בתוך ה-bg, לפני ה-scrim שב-z1). */
.v2 .hub-hero__bg { z-index: 0; }

/* --- רצועת הפילם האמצעית (אודות): וידאו אווירה + שורת העובדות --- */
.v2 .about-film {
	position: relative;
	overflow: hidden;
	display: grid;
	align-items: center;
	min-block-size: clamp(15rem, 42vh, 22rem);
	padding-block: var(--s6);
	background: var(--blue-800);
}
.v2 .about-film .hub-hero__scrim {
	background:
		linear-gradient(rgb(13 35 64 / 0.62), rgb(13 35 64 / 0.62));
}
.v2 .about-film > .shell { position: relative; z-index: 2; }
.v2 .about-film .nums b { color: var(--w); }

/* --- ההירו של עמוד המאמר — אותו רכיב, גובה מופחת (ג'וני: "ההירו הזה
   בכל העמודים") ומטא: תחום + זמן קריאה מחושב. --- */
.v2 .hub-hero--art .hub-hero__inner { min-block-size: clamp(13rem, 30vh, 19rem); }
.v2 .hub-hero--art h1 { font-size: clamp(2rem, 1.35rem + 2.7vw, 3.5rem); }
.v2 .hub-hero--art .lead { font-size: clamp(0.88rem, 0.78rem + 0.64vw, 1.16rem); max-inline-size: 42rem; }
.v2 .art-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--s2) var(--s3);
	margin-block-start: var(--s4);
	color: rgb(255 255 255 / 0.72);
}
.v2 .art-meta__hub {
	padding: 0.22rem 0.7rem;
	border-radius: 999px;
	background: rgb(255 255 255 / 0.14);
	border: 1px solid rgb(255 255 255 / 0.3);
	color: var(--w);
	font-weight: 500;
}

/* --------------------------------------------------------------------------
   כרטיסיות המוצרים — "כרטיסיות יפות ומעניינות עם לחצן" (ג'וני)

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

.v2 .prodgrid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--s4);
}
@media (min-width: 680px) { .v2 .prodgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1040px) { .v2 .prodgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s5); } }

.v2 .prodcard {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: var(--w);
	border: 1px solid var(--line);
	border-radius: var(--r2);
	box-shadow: var(--sh1);
	transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.v2 .prodcard:hover { transform: translateY(-4px); box-shadow: var(--sh2); }

/* הכובע הצבוע — מעל הגריין (z3), כמו בכל כרטיסי האתר. */
.v2 .prodcard::before {
	content: "";
	position: absolute;
	z-index: 3;
	inset-block-start: 0;
	inset-inline: 0;
	block-size: 3px;
	background: var(--acc, var(--brand));
}

.v2 .prodcard__fig { position: relative; aspect-ratio: 16 / 10; }
.v2 .prodcard__fig > img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	display: block;
	transition: transform 700ms var(--ease);
}
@media (prefers-reduced-motion: no-preference) {
	.v2 .prodcard:hover .prodcard__fig > img { transform: scale(1.045); }
}
/* תא צילום שמחכה לפריים של ג'וני — השקופית ממלאה את כל התא: בלי
   absolute היא גבוהה כתווית בלבד והתא נשאר ריק (נתפס בצילום). */
.v2 .prodcard__fig > .ph--slot { position: absolute; inset: 0; border-radius: 0; }

/* ⚠️ בלי .num על הגלולה עצמה: direction:ltr הופך לה את inline-start
   לשמאל והיא בורחת לצד הלא נכון. הספרות טבלאיות דרך הכלל כאן. */
.v2 .prodcard__n {
	position: absolute;
	z-index: 3;
	inset-block-start: var(--s3);
	inset-inline-start: var(--s3);
	padding: 0.2rem 0.55rem;
	border-radius: 999px;
	background: var(--w);
	box-shadow: var(--sh1);
	color: var(--acc-ink, var(--blue-600));
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.5;
	font-variant-numeric: tabular-nums;
}

.v2 .prodcard__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: var(--s5);
}
/* הכותרת "כיפית" (ג'וני 4.8 ערב): משקל 600, וגרדיאנט הכחולים של
   הלוגו כ-clip-text — אותו מהלך בדיוק כמו כפתורי ה-fill וה-em בהירו,
   ולכן זה נקרא כמערכת. הקצה הכהה ‎11.8:1‎, הבהיר ‎4.79:1‎ — כותרת גדולה
   עוברת AA לאורך כל הגרדיאנט. הריחוף מזיז את הגרדיאנט, לא את הצבע. */
.v2 .prodcard__body h3 {
	margin-block-end: var(--s2);
	font-size: clamp(1.35rem, 1.18rem + 0.85vw, 1.7rem);
	font-weight: 600;
	color: var(--blue-800);
	background-image: linear-gradient(105deg, #4573B6 0%, #2F5794 45%, #1D3763 100%);
	background-size: 200% 100%;
	background-position-x: 0%;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	transition: background-position-x 420ms var(--ease);
}
.v2 .prodcard:hover .prodcard__body h3 { background-position-x: 100%; }
.v2 .prodcard__body p {
	flex: 1;
	margin-block-end: var(--s4);
	font-size: var(--fs-small);
	line-height: 1.6;
	color: var(--body);
}
.v2 .prodcard .b { align-self: flex-start; }

/* --- כרטיסיית ערוץ (צור קשר): בלי צילום — טיפוגרפיה נושאת את הכרטיס.
   המספר הגדול הוא הדימוי; אין אייקונים (החוזה). --- */
.v2 .prodcard--txt .prodcard__body { padding: var(--s5); }
.v2 .channel-big {
	margin-block: var(--s2) var(--s3);
	font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2.1rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--ink);
	font-variant-numeric: tabular-nums;
}
.v2 .prodcard--txt .micro { color: var(--muted); margin-block-end: var(--s4); }

/* רצועת ה"לא בטוחים" הכהה נמחקה בהוראת ג'וני (4.8 לילה) — במקומה
   הממליצים + ה-CTA של הבית. */

/* --------------------------------------------------------------------------
   עמוד ה-Hub — ראש split + אינדקס העמודים (הגרסה הראשונה; savings/services
   עדיין עליה עד אישור הכיוון החדש)
   -------------------------------------------------------------------------- */

.v2 .hub-head { position: relative; overflow: hidden; padding-block: var(--s6) var(--s7); }
@media (min-width: 900px) { .v2 .hub-head { padding-block: var(--s7) var(--s8); } }

/* בלי מיקום מפורש סימן המים יושב בזרימה ומרונדר ככתם — נתפס בצילום. */
.v2 .hub-head .shield-mark {
	inset-block-start: -30%;
	inset-inline-end: -8%;
	inline-size: 32%;
	color: var(--acc, var(--brand));
	opacity: 0.05;
}

.v2 .hub-head__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--s5);
}
@media (min-width: 940px) {
	.v2 .hub-head__grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 0.72fr);
		gap: clamp(2rem, 5vw, 4.5rem);
		align-items: center;
	}
}
.v2 .hub-head .crumbs ol { margin-block-end: var(--s4); }
.v2 .hub-head h1 {
	position: relative;
	padding-block-start: var(--s3);
	font-size: clamp(2rem, 1.4rem + 2.6vw, 3.3rem);
	font-weight: 600;
}
.v2 .hub-head h1::before {
	content: "";
	position: absolute;
	inset-block-start: 0;
	inset-inline-start: 0;
	inline-size: 52px;
	block-size: 3px;
	background: var(--acc, var(--brand));
}
.v2 .hub-head .lead { margin-block-start: var(--s4); }

.v2 .hub-head__media {
	position: relative;
	overflow: hidden;
	border-radius: var(--r3);
	box-shadow: var(--sh2);
}
.v2 .hub-head__media .ph { inline-size: 100%; aspect-ratio: 4 / 3; }
.v2 .hub-head__media .ph > img { inline-size: 100%; block-size: 100%; object-fit: cover; }

/* --- אינדקס העמודים: שורות גדולות, דיאגרמה ממוזערת, חץ-עיגול --- */

.v2 .hub-index { padding-block: 0 var(--s7); }

.v2 .hub-list {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: hub;
}
.v2 .hub-list > li { border-block-start: 1px solid var(--line); }
.v2 .hub-list > li:last-child { border-block-end: 1px solid var(--line); }

.v2 .hub-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: var(--s2) var(--s4);
	padding-block: var(--s4);
	color: var(--ink);
	text-decoration: none;
	counter-increment: hub;
}
@media (min-width: 760px) {
	.v2 .hub-row {
		grid-template-columns: auto minmax(0, 1fr) minmax(0, 9rem) auto;
		gap: var(--s5);
		padding-block: var(--s5);
	}
}

.v2 .hub-row__n {
	display: none;
	font-variant-numeric: tabular-nums;
	direction: ltr;
	font-size: var(--fs-micro);
	font-weight: 700;
	color: var(--acc-ink, var(--blue-600));
}
@media (min-width: 760px) { .v2 .hub-row__n { display: block; } }
.v2 .hub-row__n::before { content: counter(hub, decimal-leading-zero); }

.v2 .hub-row__txt { display: grid; gap: var(--s1); }
.v2 .hub-row__txt h3 { font-size: var(--fs-h3); transition: color var(--dur) var(--ease); }
.v2 .hub-row__txt p { font-size: var(--fs-small); color: var(--body); max-inline-size: 40rem; }
.v2 .hub-row__tag {
	justify-self: start;
	margin-block-start: var(--s1);
	padding: 0.18rem 0.6rem;
	border-radius: 999px;
	background: var(--tint);
	font-size: 0.6875rem;
	font-weight: 700;
	color: var(--blue-600);
}

/* הדיאגרמה הממוזערת — השפה הגרפית של האתר בתור תמונת השורה. */
.v2 .hub-row__fig {
	display: none;
	padding: var(--s3);
	border-radius: var(--r1);
	background: var(--tint);
}
@media (min-width: 760px) { .v2 .hub-row__fig { display: block; } }
.v2 .hub-row__fig .fig__svg { display: block; inline-size: 100%; block-size: auto; }

.v2 .hub-row::after {
	content: "←";
	display: grid;
	place-items: center;
	inline-size: 28px;
	block-size: 28px;
	border: 1px solid var(--line);
	border-radius: 50%;
	color: var(--acc-ink, var(--brand));
	font-size: 0.9rem;
	line-height: 1;
	transition: background-color var(--dur) var(--ease), border-color var(--dur) var(--ease),
		color var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.v2 .hub-row:hover h3 { color: var(--acc-ink, var(--blue-600)); }
.v2 .hub-row:hover::after,
.v2 .hub-row:focus-visible::after {
	background: var(--acc, var(--brand));
	border-color: var(--acc, var(--brand));
	color: var(--w);
	transform: translateX(-3px);
}

/* --------------------------------------------------------------------------
   ערוצים ישירים — צור קשר
   -------------------------------------------------------------------------- */

.v2 .channels { margin: 0; padding: 0; list-style: none; }
.v2 .channels li { border-block-start: 1px solid var(--line); }
.v2 .channels li:last-child { border-block-end: 1px solid var(--line); }
.v2 .channels a,
.v2 .channels .channels__row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--s4);
	padding-block: var(--s3);
	color: var(--ink);
	text-decoration: none;
}
.v2 .channels b { font-size: var(--fs-body); font-weight: 500; }
.v2 .channels .micro { color: var(--muted); }
.v2 .channels a:hover b { color: var(--blue-600); }

/* --------------------------------------------------------------------------
   דפי נחיתה

   ההירו הוא המתכון הכהה ברוחב מלא, הטופס גבוה בעמוד — בתוך ההירו עצמו.
   בלי ניווט מלא: ההדר נושא לוגו, טלפון ו-CTA בלבד (parts/header-landing).
   -------------------------------------------------------------------------- */

.v2 .land-hero {
	position: relative;
	overflow: hidden;
	margin-block-start: 0;
	/* ההדר צף שקוף מעל ההירו (כמו בבית) — התוכן יורד בגובהו. */
	padding-block: calc(var(--header-h, 96px) + var(--s5)) var(--s7);
	background:
		radial-gradient(120% 140% at 88% 8%, rgba(120, 178, 255, 0.42) 0%, rgba(120, 178, 255, 0) 55%),
		radial-gradient(90% 120% at 6% 92%, rgba(18, 169, 156, 0.3) 0%, rgba(18, 169, 156, 0) 55%),
		linear-gradient(140deg, #2C5390 0%, #1D3763 55%, #16294A 100%);
	color: rgba(255, 255, 255, 0.86);
}
/* שכבות הפילם (ג'וני 4.8 לילה: "בהירו תשים סרטון ברקע") — אותו מנגנון
   כמו הבית: פוסטר מיד, וידאו מוזרק אחרי load בדסקטופ. הגרדיאנט נשאר
   כרקע בסיס מתחת לפוסטר. */
.v2 .land-hero .hub-hero__bg { z-index: 0; }
.v2 .land-hero .hub-hero__scrim { z-index: 1; }
.v2 .land-hero .shield-mark {
	z-index: 1;
	inset-block-end: -30%;
	inset-inline-end: -6%;
	inline-size: 42%;
	color: var(--w);
	opacity: 0.06;
}

.v2 .land-hero__grid {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--s6);
}
@media (min-width: 980px) {
	.v2 .land-hero__grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 26rem);
		gap: clamp(2.5rem, 5vw, 5rem);
		align-items: center;
	}
}

.v2 .land-hero__kick {
	margin: 0 0 var(--s3);
	font-size: var(--fs-micro);
	font-weight: 700;
	color: var(--gold-fill);
}
.v2 .land-hero h1 {
	color: var(--w);
	font-size: clamp(2.1rem, 1.3rem + 3.2vw, 3.9rem);
	font-weight: 600;
	max-inline-size: 20ch;
}
.v2 .land-hero .lead { color: #C6D6EE; margin-block-start: var(--s4); max-inline-size: 36rem; }
.v2 .land-hero .land-hero__note { color: rgba(255, 255, 255, 0.58); margin-block-start: var(--s5); max-inline-size: 42rem; }

/* שלוש העובדות — האידיום של סקשן הסגירה בדף הבית. */
.v2 .land-facts {
	list-style: none;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
	gap: var(--s4) var(--s5);
	margin: var(--s6) 0 0;
	padding: var(--s5) 0 0;
	border-block-start: 1px solid rgba(255, 255, 255, 0.22);
}
.v2 .land-facts b {
	display: block;
	font-size: clamp(1.7rem, 1.15rem + 1.9vw, 2.5rem);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.03em;
	color: var(--gold-fill);
}
.v2 .land-facts > li > span {
	display: block;
	margin-block-start: var(--s2);
	font-size: var(--fs-micro);
	color: rgba(255, 255, 255, 0.72);
}

/* כרטיס הטופס — הלבן היחיד על הכהה, צל עמוק. */
.v2 .land-form {
	background: var(--w);
	color: var(--body);
	padding: var(--s5);
	box-shadow: 0 8px 24px rgb(6 18 34 / 0.34), 0 34px 70px rgb(6 18 34 / 0.44);
}
.v2 .land-form h2 { color: var(--ink); font-size: var(--fs-h3); }
.v2 .land-form > p { color: var(--muted); font-size: var(--fs-small); margin-block: var(--s2) var(--s4); }
.v2 .land-form .field { margin-block-end: var(--s3); }

/* גוף הנחיתה — סקשנים לבנים רגילים; ההדגשות עוברות דרך הספרייה. */
.v2 .land-sec { padding-block: var(--s7); }
.v2 .land-sec--tight { padding-block: var(--s6); }

/* חזרת ה-CTA בתחתית הנחיתה — פס, לא פאנל: ההמרה הראשית כבר בהירו. */
.v2 .land-again {
	padding: var(--s6) 0;
	background: var(--surface);
	text-align: center;
}
.v2 .land-again h2 { font-size: clamp(1.5rem, 1.15rem + 1.3vw, 2.1rem); margin-block-end: var(--s4); }
.v2 .land-again .b-row { justify-content: center; }

/* --------------------------------------------------------------------------
   פוטר מצומצם לנחיתה — הגילוי המלא נשאר, מטריצת הניווט יורדת
   -------------------------------------------------------------------------- */

.v2 .foot--min { padding-block-start: var(--s6); }
.v2 .foot--min .foot__legal { margin-block-end: var(--s5); }

/* --------------------------------------------------------------------------
   הדר הנחיתה — לוגו + טלפון + CTA, בלי ניווט
   -------------------------------------------------------------------------- */

.v2 .site-header--landing .site-header__inner { justify-content: space-between; }
.v2 .site-header--landing .land-hdr__actions {
	display: flex;
	align-items: center;
	gap: var(--s3);
}
.v2 .land-hdr__phone {
	font-size: var(--fs-small);
	font-weight: 500;
	color: var(--ink);
	text-decoration: none;
}
.v2 .land-hdr__phone:hover { color: var(--blue-600); }
@media (max-width: 599px) { .v2 .land-hdr__phone { display: none; } }

/* --------------------------------------------------------------------------
   עמוד 404 — "הדף הזה לא מכוסה."

   המספר הענק בגרדיאנט הכחולים (המהלך של כותרות הכרטיסיות), המגן בורח
   מהפריים, והמסלול חזרה: שני כפתורים + שלושת התחומים בשורות הקרובים.
   -------------------------------------------------------------------------- */

.v2 .p404 {
	position: relative;
	overflow: hidden;
	padding-block: var(--s7) var(--s8);
}
.v2 .p404 .shield-mark {
	inset-block-start: -18%;
	inset-inline-end: -10%;
	inline-size: 44%;
	color: var(--brand);
	opacity: 0.05;
}
.v2 .p404__inner {
	position: relative;
	z-index: 1;
	display: grid;
	justify-items: center;
	text-align: center;
}
.v2 .p404__num {
	font-size: clamp(6.5rem, 3rem + 16vw, 14rem);
	font-weight: 700;
	line-height: 0.9;
	letter-spacing: -0.045em;
	color: var(--blue-800);
	background-image: linear-gradient(105deg, #4573B6 0%, #2F5794 45%, #1D3763 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.v2 .p404 h1 {
	margin-block-start: var(--s4);
	font-size: clamp(1.75rem, 1.25rem + 2.4vw, 3rem);
	font-weight: 600;
}
.v2 .p404 .lead { margin-block-start: var(--s3); max-inline-size: 38rem; }
.v2 .p404 .b-row { margin-block-start: var(--s5); justify-content: center; }
.v2 .p404__list {
	margin-block-start: var(--s7);
	inline-size: 100%;
	max-inline-size: 40rem;
	text-align: start;
}

/* --------------------------------------------------------------------------
   נגישות ותנועה
   -------------------------------------------------------------------------- */

/* בלי תנועה אוטונומית חדשה בעמודים פנימיים — הכל scroll-linked דרך .rise
   של v2.css. מתג העצירה וה-reduced-motion מטופלים שם. */

@media (prefers-contrast: more) {
	.v2 .ph--slot { outline-width: 2px; }
}
