/*
Theme Name: Hayush
Theme URI: https://example.com/hayush
Author: Cobihay
Description: ערכת בלוקים לחנות ערכות עיצוב לכיתות. נבנתה בקוד, בלי בונה אתרים. RTL, עברית, מוכנה ל-WooCommerce.
Version: 0.7.56
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 8.1
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hayush
Tags: block-theme, full-site-editing, rtl-language-support, e-commerce, accessibility-ready
*/

/* ==========================================================================
   מערכת העיצוב יושבת ב-theme.json.
   כאן רק רכיבים שהבלוקים לא יודעים לבטא.
   כל המרווחים לוגיים, כדי ש-RTL יעבוד בלי גיליון נפרד.
   ========================================================================== */

:root {
	--hy-radius:      18px;
	--hy-radius-lg:   26px;
	--hy-shadow:      0 10px 30px -18px rgba(43, 36, 31, .38);
	--hy-shadow-lift: 0 22px 48px -24px rgba(43, 36, 31, .48);
	--hy-ease:        cubic-bezier(.22, .61, .36, 1);
}

/* --- יסודות --- */

/* בלי זה, inline-size: 100% ועוד padding יוצאים רחבים מההורה.
   בדסקטופ זה לא נראה, במובייל זה דחף את הכותרת ואת עמוד המוצר
   כעשרים פיקסלים אל מחוץ למסך משמאל. וורדפרס מגדיר border-box
   על הבלוקים שלו בלבד, ולא על אלמנטים של התמה. */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

h1, h2, h3, .wp-block-heading, .hayush-h2 { text-wrap: balance; }
p { text-wrap: pretty; }

img { max-inline-size: 100%; block-size: auto; }

/* שום דבר לא מותר לגלוש אופקית ולדחוף את העמוד */
html, body { max-inline-size: 100%; overflow-x: clip; }

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

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 3px;
	border-radius: 4px;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
	.hayush-hero__img { animation: none !important; transform: none !important; }
}

/* ==========================================================================
   טיפוגרפיה משותפת
   ========================================================================== */

.hayush-center { text-align: center; }

.hayush-eyebrow {
	font-size: .82rem;
	font-weight: 600;
	letter-spacing: .1em;
	color: var(--wp--preset--color--primary-dark);
	margin: 0 0 .5rem;
}

.hayush-pill {
	display: inline-block;
	border: 1px solid #DCC5B2;
	border-radius: 999px;
	padding: .45rem 1.1rem;
	letter-spacing: .04em;
	color: var(--wp--preset--color--primary-dark);
	background: rgba(255, 255, 255, .5);
}

.hayush-h2 {
	font-size: clamp(2rem, 1.4rem + 2.4vw, 3.1rem);
	font-weight: 700;
	line-height: 1.14;
	letter-spacing: -.02em;
	margin: 0 0 .7rem;
	color: var(--wp--preset--color--contrast);
}

.hayush-lead {
	color: var(--wp--preset--color--muted);
	max-inline-size: 60ch;
	margin: 0 auto;
}

.hayush-center.hayush-lead { margin-inline: auto; }

.hayush-strong { font-weight: 600; }

/* ==========================================================================
   כפתורים
   ========================================================================== */

.hayush-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	padding: 1rem 2rem;
	border-radius: 999px;
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	transition: transform .2s var(--hy-ease), box-shadow .2s var(--hy-ease), background-color .2s var(--hy-ease);
}

/*
 * טקסט על משטח החול. החול כהה מספיק כדי שהגוונים הרכים
 * ייפלו עליו מתחת לסף: הגוון הרך נמדד 3.39 והטרהקוטה 3.24.
 * החום המלא נותן 9.17, ולכן כל טקסט על משטח כזה עובר אליו.
 * זו הסיבה שהתיקון כאן ולא בפלטה, הבעיה היא הרקע ולא הצבע.
 */
.has-sand-background-color .hayush-eyebrow,
.has-sand-background-color .hayush-lead,
.has-sand-background-color .hayush-age__meta,
.has-sand-background-color .hayush-values li,
.has-sand-background-color .hayush-bigquote__role,
.has-blush-background-color .hayush-eyebrow,
.has-blush-background-color .hayush-lead,
.has-blush-background-color .hayush-values li,
.hayush-story .hayush-values li,
.has-warm-fade-gradient-background .hayush-values li,
.has-warm-fade-gradient-background .hayush-lead {
	color: var(--wp--preset--color--contrast);
}

.hayush-btn--solid {
	background: var(--wp--preset--color--primary-dark);
	color: #fff;
}

.hayush-btn--solid:hover {
	background: var(--wp--preset--color--deep);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: var(--hy-shadow);
}

.hayush-btn--ghost {
	border: 1.5px solid var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--contrast);
	background: transparent;
}

.hayush-btn--ghost:hover {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	transform: translateY(-2px);
}

/* ==========================================================================
   מקטע פתיחה. תמונה ברוחב מלא, טקסט מעליה
   ========================================================================== */

.hayush-hero {
	position: relative;
	isolation: isolate;
	overflow: clip;
	background:
		radial-gradient(120% 90% at 85% 10%, rgba(246, 223, 217, .55) 0%, transparent 55%),
		linear-gradient(165deg, var(--wp--preset--color--base) 0%, var(--wp--preset--color--sand) 100%);
}

/* גרעין עדין שמוציא את הפלסטיק מהרקע */
.hayush-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	opacity: .03;
	pointer-events: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

.hayush-hero__inner {
	inline-size: 100%;
	max-inline-size: 860px;
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--30);
	padding-block: clamp(2.8rem, 6vw, 4.5rem) clamp(2rem, 4vw, 3rem);
	text-align: center;
}

/* --- רצועת מוצרים מתחת לכותרת. המוצרים הם הוויזואל --- */

.hayush-hero__strip {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
	margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
}

.hayush-hero__chip {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	padding: .7rem .7rem 1rem;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 16px;
	text-decoration: none;
	color: inherit;
	transition: transform .22s var(--hy-ease), box-shadow .22s var(--hy-ease), border-color .22s var(--hy-ease);
}

.hayush-hero__chip:hover {
	transform: translateY(-5px);
	box-shadow: var(--hy-shadow-lift);
	border-color: #D9C3AE;
}

.hayush-hero__chip-img {
	display: block;
	aspect-ratio: 4 / 3;
	border-radius: 10px;
	overflow: hidden;
	background: var(--wp--preset--color--base);
}

.hayush-hero__chip-img img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: contain;
}

.hayush-hero__chip-name {
	font-size: .92rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--contrast);
}

.hayush-hero__chip-price {
	font-size: .85rem;
	font-weight: 700;
	color: var(--wp--preset--color--primary-dark);
}

.hayush-hero__eyebrow {
	display: inline-block;
	margin: 0;
	padding: .45rem 1.1rem;
	border: 1px solid rgba(201, 123, 94, .45);
	border-radius: 999px;
	background: rgba(255, 255, 255, .72);
	backdrop-filter: blur(6px);
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .04em;
	color: var(--wp--preset--color--primary-dark);
}

.hayush-hero__title {
	font-size: clamp(2.5rem, 1.4rem + 4.4vw, 4.3rem);
	font-weight: 900;
	line-height: 1.04;
	letter-spacing: -.035em;
	margin: 1rem 0 0;
	color: var(--wp--preset--color--contrast);
}

/* התת כותרת גדולה בכוונה. במובייל היא הדבר שקוראים אחרי הכותרת. */
.hayush-hero__lead {
	font-size: clamp(1.2rem, 1.05rem + .7vw, 1.5rem);
	line-height: 1.6;
	color: #4A3F31;
	margin: 1.2rem auto 0;
	max-inline-size: 42rem;
}

.hayush-hero__lead strong {
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
	box-shadow: inset 0 -.42em 0 rgba(246, 223, 217, .95);
}

.hayush-hero__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .8rem;
	margin-block-start: 2rem;
}

.hayush-trust {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.4rem;
	margin: 1.6rem 0 0;
	padding: 0;
	font-size: .92rem;
	color: #6b5f54;
}

.hayush-trust li::before {
	content: "✓";
	color: var(--wp--preset--color--primary);
	font-weight: 700;
	margin-inline-end: .4rem;
}

/* ==========================================================================
   רשת קטגוריות
   ========================================================================== */

.hayush-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
}

.hayush-card {
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--hy-radius);
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: transform .24s var(--hy-ease), box-shadow .24s var(--hy-ease), border-color .24s var(--hy-ease);
}

.hayush-card:hover {
	transform: translateY(-5px);
	box-shadow: var(--hy-shadow-lift);
	border-color: #D9C3AE;
}

.hayush-card__media {
	display: block;
	aspect-ratio: 4 / 3;
	background: var(--wp--preset--color--base);
	overflow: hidden;
}

/* contain, לא cover: שום מוצר לא נחתך באמצע */
.hayush-card__media img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: contain;
	transition: transform .45s var(--hy-ease);
}

.hayush-card:hover .hayush-card__media img { transform: scale(1.04); }

.hayush-card__body {
	display: flex;
	flex-direction: column;
	gap: .35rem;
	padding: 1.35rem 1.4rem 1.5rem;
	flex: 1;
}

.hayush-card__title {
	font-size: 1.3rem;
	font-weight: 700;
	line-height: 1.25;
	color: var(--wp--preset--color--contrast);
}

.hayush-card__desc {
	font-size: .92rem;
	line-height: 1.6;
	color: var(--wp--preset--color--muted);
	flex: 1;
}

.hayush-card__go {
	margin-block-start: .7rem;
	font-size: .9rem;
	font-weight: 600;
	color: var(--wp--preset--color--primary-dark);
}

.hayush-card__go::after {
	content: "←";
	margin-inline-start: .35rem;
	display: inline-block;
	transition: transform .22s var(--hy-ease);
}

.hayush-card:hover .hayush-card__go::after { transform: translateX(-4px); }

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

/* סדר הפתיחה.
   ב-DOM הכותרת ראשונה, כי h1 צריך להופיע לפני התוכן שאחריו לקורא מסך.
   בדסקטופ order מעלה את הקרוסלה למעלה, בלי לגעת בסדר המסמך. */
.hayush-opening {
	display: flex;
	flex-direction: column;
}

.hayush-opening__title    { order: 2; }
.hayush-opening__carousel { order: 1; }

.hayush-carousel {
	position: relative;
	isolation: isolate;
	/* הגובה נגזר מיחס תמונת הרקע, 2006 על 784, כדי שהחדר לא ייחתך אנכית.
	   max-block-size הוסר: במסך רחב מ-1800 פיקסלים הוא נכנס לפעולה,
	   ואז object-fit: cover חתך את החלק העליון והתחתון של הכיתה
	   והיא נראתה כמו קיר ריק ולא כמו חדר. */
	aspect-ratio: 2006 / 784;
	min-block-size: 26rem;
	display: grid;
	align-items: center;
	overflow: clip;
	background: var(--wp--preset--color--sand);
}

.hayush-carousel:focus-visible { outline: none; }

.hayush-carousel__bg {
	position: absolute;
	inset: 0;
	z-index: -3;
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	/* התמונה ביחס של הקרוסלה, לכן כמעט ולא נחתכת. מוקד במרכז. */
	object-position: 50% 50%;
}

/* צעיף עדין. מבהיר את הקיר כדי שהטקסט והכרטיס ייקראו, בלי להלבין הכל */
.hayush-carousel__veil {
	position: absolute;
	inset: 0;
	z-index: -2;
	/*
	 * צעיף עדין בלבד. הגרסה הקודמת הלבינה תשעים אחוז מהחצי הימני,
	 * והכוורת, הקיר והאור נמחקו. במקום צילום כיתה התקבל ערפל.
	 * הטקסט מקבל צל משלו ולכן אינו זקוק לרקע אטום.
	 */
	background: linear-gradient(
		to left,
		rgba(255,253,250,.60) 0%,
		rgba(255,253,250,.42) 22%,
		rgba(255,253,250,.18) 40%,
		rgba(255,253,250,.04) 55%,
		rgba(255,253,250,0) 66%
	);
}

.hayush-carousel__inner {
	position: relative;
	inline-size: 100%;
	max-inline-size: 1240px;
	margin-inline: auto;
	padding-inline: clamp(3rem, 5vw, 4.5rem);
	padding-block: clamp(3rem, 5vw, 4.5rem);
	display: grid;
}

/* כל השקופיות באותו תא גריד, מתחלפות בשקיפות */
.hayush-slide {
	grid-area: 1 / 1;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(2rem, 4vw, 3.5rem);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	/* visibility חייב delay ולא transition. אחרת השקופית היוצאת
	   נשארת מצוירת לאורך כל המעבר ושתי שקופיות נראות יחד. */
	transition:
		opacity .4s var(--hy-ease),
		transform .4s var(--hy-ease),
		visibility 0s linear .4s;
	pointer-events: none;
}

.hayush-slide.is-active {
	opacity: 1;
	visibility: visible;
	transform: none;
	pointer-events: auto;
	transition:
		opacity .4s var(--hy-ease),
		transform .4s var(--hy-ease),
		visibility 0s linear 0s;
}

/* בלי כרטיס לבן. המוצר יושב ישירות על הקיר עם צל מתחתיו,
   כך שהרקע השקוף שלו עושה את העבודה והוא נראה תלוי ולא מודבק על ריבוע.
   order: המוצר לשמאל, אל הקיר הריק. הטקסט לימין, מעל אזור החלון המוצלל.
   place-items: המוצר ממורכז בחצי שלו. בלי זה הוא נצמד לקצה
   ונראה כאילו הוא נפל מהקיר במקום להיות תלוי עליו. */
.hayush-slide__media {
	order: 2;
	margin: 0;
	background: none;
	border: 0;
	padding: 0;
	transform: rotate(-1deg);
	display: grid;
	place-items: center;
	block-size: 100%;
}

/*
 * כרטיס ולא טקסט חשוף. אחרי שהצעיף הוקטן, הכפתורים והלינק נפלו
 * על הכוורת והסלסלות שבתמונה והפסיקו להיקרא. כרטיס מטושטש
 * פותר את הקריאות בלי להלבין מחדש את חצי התמונה.
 */
.hayush-slide__text {
	order: 1;
	padding: clamp(1.3rem, 2.2vw, 2rem);
	border-radius: var(--hy-radius-lg);
	background: rgba(255, 253, 250, .84);
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, .65);
	box-shadow: 0 16px 44px -26px rgba(43, 36, 31, .45);
}

.hayush-slide__media img {
	display: block;
	block-size: auto;
	object-fit: contain;
	margin-inline: auto;

	/*
	 * גודל יחסי לרוחב הקרוסלה ולא ברוחב מלא.
	 * הפריים מראה 305 סנטימטר של חדר, ומזה 165 סנטימטר קיר פנוי.
	 * 38 אחוז מהרוחב הם כמאה שישה עשר סנטימטר אמיתיים, כלומר
	 * כשבעים אחוז מהקיר הפנוי. מרשים, ועדיין אפשרי על קיר כיתה.
	 * מעבר לזה המוצר מתחיל לגלוש אל הכוורת ומאבד אמינות.
	 */
	inline-size: min(100%, 38vw);
	max-block-size: 88%;

	/*
	 * שלושה צללים ולא שניים. חפץ תלוי על קיר מטיל צל מגע קצר וכהה
	 * ממש מתחתיו, ועוד צל רך ורחוק יותר. בלי צל המגע הוא נראה מרחף.
	 * כיוון הצל למטה ומעט שמאלה, לפי האור שנכנס מהחלון בתמונה.
	 */
	filter:
		drop-shadow(0 2px 3px rgba(43, 36, 31, .40))
		drop-shadow(-4px 9px 12px rgba(43, 36, 31, .26))
		drop-shadow(-9px 20px 30px rgba(43, 36, 31, .16));
}

/* הילה בהירה סביב הטקסט במקום צעיף אטום על חצי התמונה.
   הטקסט נקרא, והצילום נשאר צילום. */
.hayush-slide__title {
	font-size: clamp(1.8rem, 1.3rem + 1.8vw, 2.7rem);
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -.025em;
	margin: 0;
	color: var(--wp--preset--color--contrast);
	text-shadow: 0 1px 16px rgba(255, 253, 250, .95), 0 1px 4px rgba(255, 253, 250, .9);
}

.hayush-slide__desc {
	font-size: 1.05rem;
	line-height: 1.7;
	color: #42382C;
	margin: .9rem 0 0;
	text-shadow: 0 1px 12px rgba(255, 253, 250, .98), 0 1px 3px rgba(255, 253, 250, .9);
}

.hayush-slide__buy {
	margin-block-start: 1.6rem;
	max-inline-size: 24rem;
}

.hayush-slide__more {
	display: inline-block;
	margin-block-start: 1rem;
	font-size: .92rem;
	font-weight: 600;
	color: var(--wp--preset--color--primary-dark);
}

/* --- ניווט --- */

.hayush-carousel__prev,
.hayush-carousel__next {
	position: absolute;
	inset-block-start: 50%;
	translate: 0 -50%;
	z-index: 3;
	inline-size: 2.9rem;
	block-size: 2.9rem;
	display: grid;
	place-items: center;
	font-size: 1.7rem;
	line-height: 1;
	color: var(--wp--preset--color--contrast);
	background: rgba(255, 255, 255, .88);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 50%;
	cursor: pointer;
	transition: background-color .18s var(--hy-ease), transform .18s var(--hy-ease);
}

.hayush-carousel__prev { inset-inline-end: 1rem; }
.hayush-carousel__next { inset-inline-start: 1rem; }

.hayush-carousel__prev:hover,
.hayush-carousel__next:hover {
	background: #fff;
	transform: translateY(-50%) scale(1.06);
}

.hayush-carousel__dots {
	position: absolute;
	inset-block-end: 1.4rem;
	inset-inline: 0;
	z-index: 3;
	display: flex;
	justify-content: center;
	gap: .5rem;
}

.hayush-carousel__dot {
	inline-size: .58rem;
	block-size: .58rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(43, 36, 31, .28);
	cursor: pointer;
	transition: background-color .2s var(--hy-ease), width .2s var(--hy-ease);
}

.hayush-carousel__dot.is-active {
	background: var(--wp--preset--color--primary);
	inline-size: 1.5rem;
	border-radius: 99px;
}

/* מי שביקש הפחתת תנועה מקבל את הראשונה בלבד, בלי מעברים */
@media (prefers-reduced-motion: reduce) {
	.hayush-slide { transition: none; }
}

/* ==========================================================================
   תפריט ראשי ומגה תפריט. CSS בלבד, בלי JavaScript.
   נפתח ב-hover וב-focus-within, כלומר עובד גם בניווט מקלדת.
   ========================================================================== */

.hayush-nav__list {
	list-style: none;
	display: flex;
	align-items: center;
	gap: 1.6rem;
	margin: 0;
	padding: 0;
}

/* עוגן המיקום הוא ה-nav ולא הפריט.
   פאנל רחב שנתלה על פריט קיצוני גולש מהמסך ודוחף את כל העמוד. */
.hayush-nav { position: relative; }
.hayush-nav__item { position: static; }

.hayush-nav__link {
	display: inline-flex;
	align-items: center;
	gap: .3rem;
	padding-block: .5rem;
	font-size: .95rem;
	font-weight: 500;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	white-space: nowrap;
	transition: color .18s var(--hy-ease);
}

.hayush-nav__link:hover,
.hayush-nav__item--mega:hover .hayush-nav__link,
.hayush-nav__item--mega:focus-within .hayush-nav__link { color: var(--wp--preset--color--primary-dark); }

.hayush-nav__caret {
	font-size: .7em;
	transition: transform .22s var(--hy-ease);
}

.hayush-nav__item--mega:hover .hayush-nav__caret,
.hayush-nav__item--mega:focus-within .hayush-nav__caret { transform: rotate(180deg); }

/* --- הפאנל --- */

.hayush-mega {
	/* fixed ולא absolute: ממורכז למסך ולא לפריט התפריט.
	   ב-absolute הפאנל ברח שמאלה וחציו נחתך מחוץ למסך.
	   left ולא inset-inline-start: ב-RTL הצד הלוגי מתהפך לימין,
	   ואז translate של מינוס חצי דחף את הפאנל 694 פיקסלים מחוץ למסך.
	   מירכוז למסך הוא מדידה פיזית ולא כיוונית. */
	position: fixed;
	left: 50%;
	translate: -50% 0;
	top: 8.6rem;
	z-index: 60;
	inline-size: min(56rem, calc(100vw - 3rem));
	max-block-size: calc(100vh - 11rem);
	overflow-y: auto;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--hy-radius);
	box-shadow: var(--hy-shadow-lift);
	padding: 1.4rem;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity .2s var(--hy-ease), transform .2s var(--hy-ease), visibility .2s;
}

.hayush-nav__item--mega:hover .hayush-mega,
.hayush-nav__item--mega:focus-within .hayush-mega {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* גשר בלתי נראה, כדי שהעכבר לא יאבד את הפאנל בדרך */
.hayush-nav__item--mega::after {
	content: "";
	position: absolute;
	inset-inline: -1rem;
	top: 100%;
	block-size: .8rem;
}

.hayush-mega__inner {
	display: grid;
	grid-template-columns: 1fr 15rem;
	gap: 1.4rem;
}

.hayush-mega__cats {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .35rem;
}

.hayush-mega__cats a {
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: .6rem .7rem;
	border-radius: 12px;
	text-decoration: none;
	color: inherit;
	transition: background-color .16s var(--hy-ease);
}

.hayush-mega__cats a:hover { background: var(--wp--preset--color--base); }

.hayush-mega__thumb {
	flex: none;
	inline-size: 3.2rem;
	block-size: 3.2rem;
	border-radius: 9px;
	overflow: hidden;
	background: var(--wp--preset--color--sand);
	display: grid;
	place-items: center;
}

.hayush-mega__thumb img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: contain;
	transition: transform .3s var(--hy-ease);
}

.hayush-mega__cats a:hover .hayush-mega__thumb img { transform: scale(1.08); }

.hayush-mega__text {
	display: flex;
	flex-direction: column;
	gap: .1rem;
	min-inline-size: 0;
	flex: 1;
}

.hayush-mega__name {
	font-size: .96rem;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

.hayush-mega__desc {
	font-size: .8rem;
	line-height: 1.4;
	color: var(--wp--preset--color--muted);
}

.hayush-mega__count {
	flex: none;
	font-size: .75rem;
	font-weight: 700;
	color: var(--wp--preset--color--primary-dark);
	background: rgba(201, 123, 94, .12);
	border-radius: 999px;
	padding: .15rem .5rem;
}

.hayush-mega__promo {
	background: var(--wp--preset--color--base);
	border-radius: 14px;
	padding: .9rem;
	display: flex;
	flex-direction: column;
	gap: .4rem;
}

.hayush-mega__promo img {
	inline-size: 100%;
	border-radius: 9px;
	display: block;
}

/* ---- תמונה מייצגת שמתחלפת בריחוף על קטגוריה ----
   כל התמונות באותו תא grid. הראשונה מוצגת כברירת מחדל,
   ובריחוף על פריט ברשימה :has בוחר את המקבילה שלו.
   בלי JavaScript, ולכן אין קפיצה ואין המתנה. */

.hayush-mega__pics {
	display: grid;
	aspect-ratio: 1;
	border-radius: 9px;
	overflow: hidden;
	background: var(--wp--preset--color--white);
}

.hayush-mega__pic {
	grid-area: 1 / 1;
	margin: 0;
	position: relative;
	opacity: 0;
	transition: opacity .28s var(--hy-ease);
}

/* ברירת מחדל: הראשונה, כל עוד לא מרחפים על אף קטגוריה */
.hayush-mega__inner:not(:has(.hayush-mega__cat:hover)) .hayush-mega__pic[data-i="0"] { opacity: 1; }

.hayush-mega__pic img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: contain;
	padding: .6rem;
}



.hayush-mega__inner:has(.hayush-mega__cat[data-i="0"]:hover) .hayush-mega__pic[data-i="0"],
.hayush-mega__inner:has(.hayush-mega__cat[data-i="1"]:hover) .hayush-mega__pic[data-i="1"],
.hayush-mega__inner:has(.hayush-mega__cat[data-i="2"]:hover) .hayush-mega__pic[data-i="2"],
.hayush-mega__inner:has(.hayush-mega__cat[data-i="3"]:hover) .hayush-mega__pic[data-i="3"],
.hayush-mega__inner:has(.hayush-mega__cat[data-i="4"]:hover) .hayush-mega__pic[data-i="4"],
.hayush-mega__inner:has(.hayush-mega__cat[data-i="5"]:hover) .hayush-mega__pic[data-i="5"],
.hayush-mega__inner:has(.hayush-mega__cat[data-i="6"]:hover) .hayush-mega__pic[data-i="6"],
.hayush-mega__inner:has(.hayush-mega__cat[data-i="7"]:hover) .hayush-mega__pic[data-i="7"] {
	opacity: 1;
}

.hayush-mega__promo-title {
	margin: .4rem 0 0;
	font-size: .95rem;
	font-weight: 700;
}

.hayush-mega__promo-text {
	margin: 0;
	font-size: .8rem;
	line-height: 1.5;
	color: var(--wp--preset--color--muted);
}

.hayush-mega__promo-link {
	margin-block-start: .2rem;
	font-size: .85rem;
	font-weight: 600;
	color: var(--wp--preset--color--primary-dark);
	text-decoration: none;
}

/* ==========================================================================
   עמודי תוכן: שלבים, ערכים, יצירת קשר
   ========================================================================== */

.hayush-split--reverse .hayush-split__media { order: 2; }
.hayush-split--reverse .hayush-split__text  { order: 1; }

.hayush-portrait img {
	transform: none;
	border-radius: var(--hy-radius-lg);
	max-block-size: 32rem;
	inline-size: 100%;
	object-fit: cover;
}

.hayush-steps {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
	margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
}

.hayush-step h3 { margin: .5rem 0 .4rem; font-size: 1.25rem; }
.hayush-step p  { margin: 0; color: var(--wp--preset--color--muted); font-size: .95rem; line-height: 1.7; }

.hayush-step__num {
	font-size: 2.4rem;
	font-weight: 900;
	line-height: 1;
	color: #E3D2C1;
}

.hayush-values {
	list-style: none;
	margin: 1.2rem 0 0;
	padding: 0;
	display: grid;
	gap: .5rem;
}

.hayush-values li::before {
	content: "✓";
	color: var(--wp--preset--color--primary);
	font-weight: 700;
	margin-inline-end: .5rem;
}

/*
 * הרשת נבנית לפי מספר הכרטיסיות בפועל. שלוש עמודות קבועות עם
 * שתי כרטיסיות השאירו חור בצד, שנראה כאילו משהו לא נטען.
 */
.hayush-contact {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: 1.2rem;
	margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
}

.hayush-contact__card {
	display: flex;
	flex-direction: column;
	gap: .3rem;
	padding: 1.4rem 1.3rem;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--hy-radius);
	text-decoration: none;
	color: inherit;
	transition: transform .22s var(--hy-ease), box-shadow .22s var(--hy-ease), border-color .22s var(--hy-ease);
}

a.hayush-contact__card:hover {
	transform: translateY(-4px);
	box-shadow: var(--hy-shadow-lift);
	border-color: #D9C3AE;
}

.hayush-contact__icon {
	font-size: 1.5rem;
	color: var(--wp--preset--color--primary);
	line-height: 1;
}

.hayush-contact__label {
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .06em;
	color: var(--wp--preset--color--muted);
	text-transform: uppercase;
}

.hayush-contact__value { font-size: 1.1rem; font-weight: 700; }

.hayush-contact__note {
	font-size: .85rem;
	color: var(--wp--preset--color--muted);
	line-height: 1.5;
}

/* ==========================================================================
   ארכיון מוצרים, סרגל קטגוריות ועמוד מוצר
   ========================================================================== */

.hayush-archive__head {
	background: linear-gradient(165deg, var(--wp--preset--color--base) 0%, var(--wp--preset--color--sand) 100%);
	padding-block: clamp(2.5rem, 5vw, 3.5rem);
	padding-inline: var(--wp--preset--spacing--30);
}

.hayush-archive__head-inner,
.hayush-archive__body {
	inline-size: 100%;
	max-inline-size: 1240px;
	margin-inline: auto;
}

.hayush-archive__body {
	padding-block: clamp(2.5rem, 5vw, 3.5rem);
	padding-inline: var(--wp--preset--spacing--30);
}

.hayush-catbar {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .6rem;
	margin-block-start: 1.8rem;
}

.hayush-catbar__chip {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	padding: .55rem 1.1rem;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 999px;
	background: var(--wp--preset--color--white);
	font-size: .92rem;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	transition: background-color .18s var(--hy-ease), border-color .18s var(--hy-ease), color .18s var(--hy-ease);
}

.hayush-catbar__chip span {
	font-size: .75rem;
	font-weight: 700;
	color: var(--wp--preset--color--muted);
}

.hayush-catbar__chip:hover { border-color: var(--wp--preset--color--primary); }

.hayush-catbar__chip.is-active {
	background: var(--wp--preset--color--contrast);
	border-color: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}

.hayush-catbar__chip.is-active span { color: rgba(255, 255, 255, .7); }

/* --- עמוד מוצר --- */

.hayush-pdp-wrap {
	inline-size: 100%;
	max-inline-size: 1240px;
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--30);
	padding-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
}

.hayush-crumbs {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	font-size: .85rem;
	color: var(--wp--preset--color--muted);
	margin-block-end: 1.6rem;
}

.hayush-crumbs a { color: inherit; text-decoration: none; }
.hayush-crumbs a:hover { color: var(--wp--preset--color--primary-dark); }

.hayush-pdp {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: clamp(2rem, 4vw, 3.5rem);
	align-items: start;
}

/* עמודת הקנייה נשארת מול העין בזמן גלילה בגלריה.
   בעמוד עם ארבע תמונות ותיאור ארוך, הכפתורים נעלמים אחרת
   ברגע שהלקוחה מתחילה להסתכל על התמונות. */
.hayush-pdp__buy {
	position: sticky;
	top: 2rem;
}

/* תגית מבצע, כמו בכרטיס בחנות */
.hayush-pdp__badge {
	display: inline-block;
	margin-block-end: .6rem;
	padding: .3rem .8rem;
	border-radius: 999px;
	font-size: .78rem;
	font-weight: 700;
	color: #fff;
	background: var(--wp--preset--color--primary-dark);
}

/* ניווט למוצר הקודם והבא, כמו באתר הרפרנס */
.hayush-pdp__nav {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	margin-block-start: clamp(3rem, 6vw, 4.5rem);
	padding-block-start: 1.6rem;
	border-block-start: 1px solid var(--wp--preset--color--line);
}

.hayush-pdp__nav a {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	max-inline-size: 45%;
	font-size: .95rem;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	transition: color .18s var(--hy-ease);
}

.hayush-pdp__nav a:hover { color: var(--wp--preset--color--primary-dark); }

.hayush-pdp__nav span {
	color: var(--wp--preset--color--primary);
	font-size: 1.1rem;
	line-height: 1;
}

.hayush-pdp__nav em {
	font-style: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.hayush-pdp__main {
	margin: 0;
	border-radius: var(--hy-radius-lg);
	overflow: hidden;
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--line);
	/* יש מוצרים שהם עמודה אנכית ארוכה, כמו ערכת סדר יום.
	   בלי תקרה התמונה מותחת את העמוד לגובה מטורף. */
	display: grid;
	place-items: center;
	padding: 1rem;
	max-block-size: 42rem;
}

.hayush-pdp__main img {
	display: block;
	inline-size: auto;
	max-inline-size: 100%;
	block-size: auto;
	max-block-size: 40rem;
	object-fit: contain;
}

/* auto-fill ולא ארבע קבועות. חמש תמונות בארבע עמודות
   הותירו תמונה בודדת בשורה שנייה, בגודל של רבע השורה. */
.hayush-pdp__thumbs {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr));
	gap: .7rem;
	margin-block-start: .8rem;
}

/* כפתור ולא figure. התמונות הקטנות הן בקרה, לא תצוגה. */
.hayush-pdp__thumbs button {
	margin: 0;
	padding: 0;
	border-radius: 10px;
	overflow: hidden;
	border: 1.5px solid var(--wp--preset--color--line);
	background: var(--wp--preset--color--base);
	aspect-ratio: 1;
	cursor: pointer;
	transition: border-color .18s var(--hy-ease), transform .18s var(--hy-ease);
}

.hayush-pdp__thumbs button:hover {
	border-color: #D9C3AE;
	transform: translateY(-2px);
}

.hayush-pdp__thumbs button.is-active {
	border-color: var(--wp--preset--color--primary);
}

.hayush-pdp__thumbs img {
	display: block;
	inline-size: 100%;
	block-size: 100%;
	object-fit: contain;
}

.hayush-pdp__title {
	font-size: clamp(1.9rem, 1.4rem + 1.8vw, 2.8rem);
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -.025em;
	margin: .4rem 0 0;
}

.hayush-pdp__short {
	font-size: 1.08rem;
	line-height: 1.7;
	color: var(--wp--preset--color--muted);
	margin: 1rem 0 0;
}

.hayush-pdp__actions { margin-block-start: 1.8rem; }

/* --- מוצר שהלקוחה בוחרת בו את התוכן --- */

.hayush-pdp__custom {
	margin-block-start: 1.6rem;
	padding: 1.1rem 1.2rem 1.2rem;
	border: 1px solid #DCC5B2;
	border-radius: var(--hy-radius);
	background: var(--wp--preset--color--base);
}

.hayush-pdp__custom-note {
	margin: 0 0 .8rem;
	font-size: .98rem;
	line-height: 1.6;
}

.hayush-pdp__custom-note strong { color: var(--wp--preset--color--primary-dark); }

.hayush-pdp__custom-label {
	display: block;
	margin-block-end: .35rem;
	font-size: .88rem;
	font-weight: 600;
}

.hayush-pdp__custom textarea {
	inline-size: 100%;
	padding: .7rem .8rem;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 10px;
	background: var(--wp--preset--color--white);
	font: inherit;
	font-size: .92rem;
	line-height: 1.6;
	resize: vertical;
}

.hayush-pdp__custom textarea:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 1px;
}

.hayush-pdp__custom-help {
	margin: .5rem 0 0;
	font-size: .82rem;
	color: var(--wp--preset--color--muted);
}

/* הכפתורים הם button בתוך טופס ולא קישורים, כדי שהרשימה תיסע איתם */
.hayush-pdp__actions .hayush-buy {
	inline-size: 100%;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	text-align: start;
}

.hayush-pdp__assure {
	list-style: none;
	margin: 1.6rem 0 0;
	padding: 0;
	display: grid;
	gap: .5rem;
	font-size: .92rem;
	color: var(--wp--preset--color--muted);
}

.hayush-pdp__assure li::before {
	content: "✓";
	color: var(--wp--preset--color--primary);
	font-weight: 700;
	margin-inline-end: .5rem;
}

.hayush-pdp__desc {
	max-inline-size: 760px;
	margin: clamp(3rem, 6vw, 4.5rem) auto 0;
}

.hayush-pdp__desc h3 {
	font-size: 1.4rem;
	margin-block: 2rem .6rem;
}

.hayush-pdp__desc h3:first-child { margin-block-start: 0; }
.hayush-pdp__desc p  { line-height: 1.85; margin-block: 0 1rem; }
.hayush-pdp__desc ul { line-height: 1.9; }

/* המוקאפ בתוך התיאור. גולש מעט מעבר לרוחב הטקסט,
   כי צילום צריך נוכחות ולא רוחב של פסקה.
   הגלישה מבוטלת מתחת ל-782 פיקסלים, אחרת התמונה יוצאת מהמסך. */
.hayush-pdp__inuse {
	margin: clamp(2.2rem, 4vw, 3.2rem) 0 0;
	inline-size: 100%;
}

@media (min-width: 783px) {
	.hayush-pdp__inuse {
		inline-size: min(100% + 8rem, 92vw);
		margin-inline: calc(min(4rem, 4vw) * -1);
	}
}

.hayush-pdp__inuse img {
	display: block;
	inline-size: 100%;
	block-size: auto;
	border-radius: var(--hy-radius);
	border: 1px solid var(--wp--preset--color--line);
	box-shadow: var(--hy-shadow);
}

.hayush-pdp__inuse figcaption {
	margin-block-start: .8rem;
	text-align: center;
	font-size: .9rem;
	color: var(--wp--preset--color--muted);
}

/* ==========================================================================
   כרטיסי מוצר עם שני כפתורי הזמנה
   ========================================================================== */

.hayush-products {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	/* רשת צפופה יותר, כמו באתרי הרפרנס. המוצרים הם הוויזואל,
	   ומרווח גדול ביניהם מפרק את הקטלוג לפריטים בודדים. */
	gap: 1.1rem;
	margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
}

.hayush-product {
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--hy-radius);
	overflow: hidden;
	transition: transform .24s var(--hy-ease), box-shadow .24s var(--hy-ease), border-color .24s var(--hy-ease);
}

.hayush-product:hover {
	transform: translateY(-4px);
	box-shadow: var(--hy-shadow-lift);
	border-color: #D9C3AE;
}

/* grid ולא block, בכוונה. block-size באחוזים אינו נפתר מול הורה
   שגובהו נגזר מ-aspect-ratio בלבד, והתמונה קיבלה את גובהה הטבעי
   וגלשה מהקופסה. overflow: hidden חתך את הגלישה, ולכן תמונות
   גבוהות נראו חתוכות בתחתית. פריט ב-grid מקבל שטח בגודל מוגדר,
   ולכן 100% נפתר נכון. */
.hayush-product__media {
	display: grid;
	grid-template-rows: 1fr;
	position: relative;
	background: var(--wp--preset--color--base);
	overflow: hidden;
	padding: .9rem;
}

/* aspect-ratio לבדו לא נותן לשורה גובה מוגדר, ולכן block-size של
   התמונה נפתר ל-auto והיא גולשת. פסאודו ריק עם padding אחוזי
   נגזר מרוחב התא, מייצר גובה אמיתי, והריבוע נשמר. */
.hayush-product__media::before {
	content: "";
	grid-area: 1 / 1;
	inline-size: 0;
	padding-block-start: 100%;
}

/* שתי התמונות באותו תא, כדי שיוכלו להתחלף בריחוף */
.hayush-product__img {
	grid-area: 1 / 1;
	inline-size: 100%;
	block-size: 100%;
	min-block-size: 0;
	object-fit: contain;
	transition: opacity .35s var(--hy-ease), transform .45s var(--hy-ease);
}

/* התמונה השנייה יושבת באותו תא grid ומופיעה בריחוף.
   position: absolute היה מוציא אותה מהרשת ומחזיר את בעיית האחוזים. */
.hayush-product__img--hover {
	opacity: 0;
}

.hayush-product__media.has-hover:hover .hayush-product__img,
.hayush-product__media.has-hover:focus-visible .hayush-product__img { opacity: 0; }

.hayush-product__media.has-hover:hover .hayush-product__img--hover,
.hayush-product__media.has-hover:focus-visible .hayush-product__img--hover { opacity: 1; }

.hayush-product:hover .hayush-product__img { transform: scale(1.03); }

/* במסך מגע אין ריחוף. מציגים רק את התמונה הראשית. */
@media (hover: none) {
	.hayush-product__img--hover { display: none; }
}

/* תגית פינתית: מבצע או חדש. יושבת מעל התמונה ולא זזה בריחוף. */
.hayush-product__badge {
	position: absolute;
	z-index: 2;
	inset-block-start: .75rem;
	inset-inline-start: .75rem;
	padding: .28rem .7rem;
	border-radius: 999px;
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .02em;
	color: #fff;
	background: var(--wp--preset--color--primary-dark);
	box-shadow: 0 2px 8px -3px rgba(43, 36, 31, .5);
}

.hayush-product__body {
	display: flex;
	flex-direction: column;
	gap: .55rem;
	/* צר יותר משהיה. התיאור ירד מהכרטיס, ולכן אין מה לרפד. */
	padding: 1rem 1rem 1.1rem;
	flex: 1;
	text-align: center;
}

.hayush-product__title {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.3;
	min-block-size: 2.7em;
	display: flex;
	align-items: center;
	justify-content: center;
}

.hayush-product__title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.hayush-product__title a:hover { color: var(--wp--preset--color--primary-dark); }

.hayush-product__desc {
	margin: 0;
	font-size: .9rem;
	line-height: 1.6;
	color: var(--wp--preset--color--muted);
	flex: 1;
}

/* --- שני הכפתורים --- */

.hayush-product__buy {
	display: grid;
	gap: .4rem;
	margin-block-start: auto;
	padding-block-start: .3rem;
}

/* כפתור בשורה אחת: אייקון, תווית, ומחיר בקצה.
   קודם היה בלוק בן שתי שורות עם עיגול גדול, ושני כאלה
   תפסו יותר גובה מהתמונה עצמה. */
.hayush-buy {
	display: flex;
	align-items: center;
	gap: .5rem;
	padding: .6rem .8rem;
	border-radius: 10px;
	text-decoration: none;
	font-weight: 600;
	line-height: 1.2;
	transition: transform .18s var(--hy-ease), box-shadow .18s var(--hy-ease),
	            background-color .18s var(--hy-ease), border-color .18s var(--hy-ease);
}

.hayush-buy__icon {
	flex: none;
	inline-size: 1.4rem;
	block-size: 1.4rem;
	display: grid;
	place-items: center;
	border-radius: 50%;
	font-size: .78rem;
}

.hayush-buy__text {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: .5rem;
	flex: 1;
}

.hayush-buy__label {
	font-size: .84rem;
	font-weight: 600;
}

.hayush-buy__price {
	font-size: .95rem;
	font-weight: 700;
	white-space: nowrap;
}

/* המחיר הקודם. קו חוצה עבה יותר מברירת המחדל,
   אחרת בגופן קטן הוא נראה כמו שני מחירים ולא כמו הנחה. */
.hayush-buy__price s {
	font-size: .78em;
	font-weight: 400;
	color: rgba(255, 255, 255, .9);
	margin-inline-end: .25rem;
	text-decoration-thickness: 1.5px;
}

/* הורדה: הכפתור הראשי.
   הגוון הכהה ולא הבהיר: טקסט לבן על הטרהקוטה הבהירה של הלוגו
   נותן יחס ניגודיות 3.2, ותקן AA דורש 4.5 לטקסט בגודל הזה. */
.hayush-buy--digital {
	background: var(--wp--preset--color--primary-dark);
	color: #fff;
	border: 1.5px solid var(--wp--preset--color--primary-dark);
}

.hayush-buy--digital .hayush-buy__icon {
	background: rgba(255, 255, 255, .22);
	color: #fff;
}

.hayush-buy--digital:hover {
	background: var(--wp--preset--color--primary-dark);
	border-color: var(--wp--preset--color--primary-dark);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: var(--hy-shadow);
}

/* הדפסה: משני, מסגרת בלבד */
.hayush-buy--printed {
	background: transparent;
	color: var(--wp--preset--color--contrast);
	border: 1.5px solid var(--wp--preset--color--contrast);
}

.hayush-buy--printed .hayush-buy__icon {
	background: rgba(43, 36, 31, .09);
	color: var(--wp--preset--color--contrast);
}

.hayush-buy--printed:hover {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	transform: translateY(-2px);
	box-shadow: var(--hy-shadow);
}

.hayush-buy--printed:hover .hayush-buy__icon {
	background: rgba(255, 255, 255, .18);
	color: var(--wp--preset--color--base);
}

.hayush-product__more {
	margin-block-start: .7rem;
	font-size: .88rem;
	font-weight: 600;
	color: var(--wp--preset--color--primary-dark);
	text-decoration: none;
	text-align: center;
}

.hayush-product__more:hover { text-decoration: underline; }

/* ==========================================================================
   רצועת חודשים על רקע כהה
   ========================================================================== */

/* קריאה לפעולה בסוף מקטע התהליך */
.hayush-flow__cta {
	margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
	text-align: center;
}

.hayush-eyebrow--light { color: #e0a68d; }
.hayush-h2--light      { color: #FAF7F1; }
.hayush-lead--light    { color: #CBBFAC; }

.hayush-months {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 1rem;
	margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
}

.hayush-month {
	margin: 0;
	border-radius: 14px;
	overflow: hidden;
	background: #3A2D1C;
	border: 1px solid #4A3620;
	transition: transform .24s var(--hy-ease), box-shadow .24s var(--hy-ease), border-color .24s var(--hy-ease);
}

.hayush-month:hover {
	transform: translateY(-5px);
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 18px 36px -20px rgba(0, 0, 0, .7);
}

.hayush-month img {
	display: block;
	inline-size: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.hayush-month figcaption {
	padding: .6rem .5rem .7rem;
	text-align: center;
	font-size: .92rem;
	font-weight: 600;
	color: #E9E0D2;
}

/* ==========================================================================
   פסיפס גלריה. עמודות CSS = אפס חיתוך, כל תמונה ביחס הטבעי שלה
   ========================================================================== */

.hayush-mosaic {
	columns: 3;
	column-gap: 1.4rem;
	margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
}

.hayush-shot {
	break-inside: avoid;
	margin: 0 0 1.4rem;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--hy-radius);
	overflow: hidden;
	transition: transform .24s var(--hy-ease), box-shadow .24s var(--hy-ease);
}

.hayush-shot:hover {
	transform: translateY(-4px);
	box-shadow: var(--hy-shadow-lift);
}

.hayush-shot img { display: block; inline-size: 100%; }

.hayush-shot figcaption {
	padding: .85rem 1.1rem 1rem;
	font-size: .88rem;
	font-weight: 500;
	color: var(--wp--preset--color--muted);
}

/* ==========================================================================
   מקטע מפוצל, טקסט מול תמונה
   ========================================================================== */

.hayush-split {
	display: grid;
	grid-template-columns: 5fr 6fr;
	align-items: center;
	gap: clamp(2rem, 5vw, 4.5rem);
}

.hayush-split__media { margin: 0; }

.hayush-split__media img {
	display: block;
	inline-size: 100%;
	border-radius: var(--hy-radius-lg);
	box-shadow: var(--hy-shadow);
	transform: rotate(-1.5deg);
}

.hayush-split__text > p {
	line-height: 1.85;
	margin-block: 0 1.1rem;
}

.hayush-split__text .hayush-btn { margin-block-start: .8rem; }

/* ==========================================================================
   שאלות נפוצות
   ========================================================================== */

.hayush-faq summary {
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.hayush-faq summary::-webkit-details-marker { display: none; }

.hayush-faq summary::after {
	content: "+";
	font-size: 1.5rem;
	line-height: 1;
	color: var(--wp--preset--color--primary);
	transition: transform .22s var(--hy-ease);
	flex: none;
}

.hayush-faq[open] summary::after { transform: rotate(45deg); }
.hayush-faq[open] { border-color: #DCC5B2; }

/* ==========================================================================
   ניווט וכותרות
   ========================================================================== */

.hayush-wordmark { letter-spacing: .14em; line-height: 1.1; }

.wp-block-navigation .wp-block-navigation-item__content {
	position: relative;
	padding-block: .25rem;
}

.wp-block-navigation .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	bottom: 0;
	block-size: 1.5px;
	background: var(--wp--preset--color--primary);
	transform: scaleX(0);
	transform-origin: inline-end;
	transition: transform .22s var(--hy-ease);
}

.wp-block-navigation .wp-block-navigation-item__content:hover::after,
.wp-block-navigation .current-menu-item .wp-block-navigation-item__content::after {
	transform: scaleX(1);
	transform-origin: inline-start;
}

/* קישורי פוטר: בלי קו תחתון, צבע רגוע */
footer .wp-block-list { list-style: none; }

footer .wp-block-list a {
	text-decoration: none;
	color: var(--wp--preset--color--muted);
	transition: color .18s var(--hy-ease);
}

footer .wp-block-list a:hover { color: var(--wp--preset--color--primary-dark); }

/* כפתורי בלוקים */
.wp-block-button__link {
	transition: transform .2s var(--hy-ease), box-shadow .2s var(--hy-ease), background-color .2s var(--hy-ease);
}

.wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: var(--hy-shadow);
}

/* ==========================================================================
   רספונסיביות
   ========================================================================== */

@media (max-width: 1024px) {
	.hayush-grid   { grid-template-columns: repeat(2, 1fr); }
	.hayush-mosaic   { columns: 2; }
	.hayush-months   { grid-template-columns: repeat(4, 1fr); }
	.hayush-products { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 782px) {
	.hayush-hero__inner { padding-block: 2.2rem 2.4rem; }

	/* מובייל: הכותרת חוזרת להיות ראשונה, והקרוסלה יורדת לגמרי,
	   כי במסך צר היא נדחסת ומסתירה גם את התמונה וגם את הטקסט. */
	.hayush-opening__title    { order: 1; }
	.hayush-opening__carousel { display: none; }
	.hayush-hero__strip { grid-template-columns: repeat(2, 1fr); gap: .8rem; }

	.hayush-split {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.hayush-pdp { grid-template-columns: 1fr; }
	.hayush-split__media { order: 2; max-inline-size: 460px; margin-inline: auto; }
	.hayush-split__text  { order: 1; }

	.hayush-steps   { grid-template-columns: 1fr; gap: 1.6rem; }
	.hayush-contact { grid-template-columns: 1fr; }

	/* מובייל: מגה תפריט הופך לרשימת קישורים, בלי ריחוף */
	.hayush-nav__list  { flex-wrap: wrap; gap: .9rem; justify-content: center; }
	.hayush-mega       { display: none; }
	.hayush-nav__caret { display: none; }

	/* שורת הכותרת מוגדרת nowrap בבלוק עצמו, ובמסך צר זה דוחס
	   את הכפתור לעיגול ואת הניווט לשתי שורות חופפות.
	   כאן היא נשברת לשתי שורות: לוגו וכפתור למעלה, תפריט מתחת.
	   הכפילות בסלקטור מנצחת את ה-CSS שוורדפרס מזריק ל-head. */
	.hayush-headbar.hayush-headbar {
		flex-wrap: wrap;
		row-gap: 1rem;
	}

	.hayush-headbar > .hayush-nav {
		flex: 1 0 100%;
		order: 3;
	}

	.hayush-headbar__cta .wp-block-button__link { white-space: nowrap; }
}

@media (max-width: 560px) {
	.hayush-grid   { grid-template-columns: 1fr; }
	.hayush-mosaic { columns: 1; }
	.hayush-months { grid-template-columns: repeat(2, 1fr); gap: .7rem; }
	.hayush-btn    { padding: .9rem 1.6rem; font-size: 1rem; }

	/* שני מוצרים בשורה נשמרים גם במסך צר, כמו באתרי הרפרנס.
	   מה שמשתנה הוא הכפתור: תווית ומחיר אחד מעל השני וללא אייקון,
	   אחרת "הזמנה להורדה עכשיו" נשבר לשלוש שורות בכרטיס של 180 פיקסלים. */
	.hayush-products      { gap: .7rem; }
	.hayush-product__body { padding: .7rem .55rem .8rem; gap: .45rem; }
	.hayush-product__title { font-size: .92rem; min-block-size: 2.6em; }

	.hayush-buy {
		flex-direction: column;
		gap: .1rem;
		padding: .5rem .45rem;
		text-align: center;
	}

	.hayush-buy__icon { display: none; }

	.hayush-buy__text {
		flex-direction: column;
		align-items: center;
		gap: .05rem;
	}

	.hayush-buy__label { font-size: .74rem; line-height: 1.25; }
	.hayush-buy__price { font-size: .88rem; }

	/* שלוש בשורה גולשות במסך צר. עמודה אחת ממורכזת */
	.hayush-trust {
		display: grid;
		grid-template-columns: 1fr;
		justify-items: center;
		gap: .5rem;
		font-size: .9rem;
	}
}

/* --- מונה הכרטיסיות --- */

.hayush-cards-count {
	margin: .5rem 0 0;
	font-size: .85rem;
	font-weight: 600;
	color: var(--wp--preset--color--muted);
	transition: color .2s var(--hy-ease);
}

.hayush-pdp__custom.is-exact .hayush-cards-count { color: #15803d; }
.hayush-pdp__custom.is-under .hayush-cards-count { color: var(--wp--preset--color--muted); }
.hayush-pdp__custom.is-over  .hayush-cards-count { color: #b45309; }

.hayush-pdp__custom.is-exact textarea { border-color: #15803d; }
.hayush-pdp__custom.is-over  textarea { border-color: #b45309; }

/* זמן ההכנה במוצר בהתאמה אישית. בולט בכוונה: זו הפתעה
   שאסור שתתגלה רק אחרי התשלום. */
.hayush-pdp__assure strong {
	color: var(--wp--preset--color--contrast);
	font-weight: 700;
}

/* ==========================================================================
   בחירה לפי שלב גיל
   ========================================================================== */

.hayush-ages {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
	margin-block-start: clamp(2rem, 4vw, 2.8rem);
}

.hayush-age {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .5rem;
	padding: 1.8rem 1rem 1.6rem;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--hy-radius-lg);
	text-decoration: none;
	text-align: center;
	transition: transform .22s var(--hy-ease), box-shadow .22s var(--hy-ease), border-color .22s var(--hy-ease);
}

.hayush-age:hover {
	transform: translateY(-5px);
	box-shadow: var(--hy-shadow-lift);
	border-color: #D9C3AE;
}

.hayush-age__art {
	font-size: 2.4rem;
	line-height: 1;
}

.hayush-age__name {
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}

.hayush-age__meta {
	font-size: .85rem;
	color: var(--wp--preset--color--muted);
}

/* שלב שעדיין ריק. נשאר גלוי בכוונה, כדי לאותת שהוא בדרך. */
/*
 * הכרטיס שעדיין לא נפתח. השקיפות שהייתה כאן הפילה את הטקסט
 * שבתוכו ל-2.95 מול סף של 4.5, וגם ניתקה אותו מהקורא. במקומה
 * המסגרת המקווקוות והרקע השקוף עושים את אותה עבודה ויזואלית,
 * והטקסט נשאר בצבע מלא.
 */
.hayush-age.is-soon {
	pointer-events: none;
	background: transparent;
	border-style: dashed;
	border-color: var(--wp--preset--color--line);
	box-shadow: none;
}

.hayush-age.is-soon .hayush-age__meta {
	color: var(--wp--preset--color--contrast);
	font-weight: 600;
}

@media (max-width: 782px) {
	.hayush-ages { grid-template-columns: repeat(2, 1fr); gap: .8rem; }
	.hayush-age  { padding: 1.3rem .8rem 1.2rem; }
	.hayush-age__art  { font-size: 2rem; }
	.hayush-age__name { font-size: 1rem; }
}

/* שלבי הגיל בתפריט המגה, בעמודה שמשמאל */
.hayush-mega__ages {
	list-style: none;
	margin: .5rem 0 .9rem;
	padding: 0;
	display: grid;
	gap: .42rem;
	font-size: .88rem;
}

.hayush-mega__ages a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	transition: color .18s var(--hy-ease);
}

.hayush-mega__ages a:hover { color: var(--wp--preset--color--primary-dark); }

.hayush-mega__ages span { color: var(--wp--preset--color--muted); }

.hayush-mega__ages em {
	font-style: normal;
	font-size: .76rem;
	color: var(--wp--preset--color--primary);
	font-weight: 600;
}

/* ==========================================================================
   תוכן מורחב בעמוד קטגוריה
   ========================================================================== */

.hayush-archive__content {
	max-inline-size: 800px;
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--30);
	padding-block: clamp(3rem, 6vw, 4.5rem) clamp(2rem, 4vw, 3rem);
}

.hayush-catcopy h2 {
	font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
	font-weight: 700;
	margin-block: 2rem .7rem;
}

.hayush-catcopy h2:first-child { margin-block-start: 0; }
.hayush-catcopy h3 { font-size: 1.2rem; margin-block: 1.6rem .5rem; }
.hayush-catcopy p  { line-height: 1.85; margin-block: 0 1.1rem; }
.hayush-catcopy ul { line-height: 1.9; margin-block: 0 1.2rem; }

.hayush-catfaq { margin-block-start: clamp(2.5rem, 5vw, 3.5rem); }
.hayush-catfaq .hayush-h2 { margin-block-end: 1.2rem; }

.hayush-catfaq .hayush-faq {
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--hy-radius);
	padding: 1rem 1.2rem;
	margin-block-end: .7rem;
	background: var(--wp--preset--color--white);
}

.hayush-catfaq .hayush-faq summary {
	font-weight: 600;
	font-size: 1.02rem;
}

.hayush-catfaq .hayush-faq div {
	margin-block-start: .7rem;
	color: var(--wp--preset--color--muted);
	line-height: 1.8;
}

.hayush-catfaq .hayush-faq p { margin: 0 0 .8rem; }
.hayush-catfaq .hayush-faq p:last-child { margin-block-end: 0; }

.hayush-catcta {
	margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
	padding: clamp(1.6rem, 3vw, 2.2rem);
	border-radius: var(--hy-radius-lg);
	background: var(--wp--preset--color--sand);
	text-align: center;
}

.hayush-catcta h2 {
	font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem);
	font-weight: 700;
	margin: 0 0 .6rem;
}

.hayush-catcta p {
	margin: 0 auto 1.2rem;
	max-inline-size: 52ch;
	line-height: 1.75;
	color: #4A3F31;
}

/* ==========================================================================
   עמוד מי אני
   ========================================================================== */

.hayush-story {
	max-inline-size: 760px;
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--30);
}

.hayush-story .hayush-h2 { margin-block-end: 1.6rem; }

.hayush-story p {
	line-height: 1.9;
	margin-block: 0 1.3rem;
	font-size: 1.05rem;
}

.hayush-story strong { color: var(--wp--preset--color--contrast); }

/* ציטוט. גדול בכוונה, זה המשפט שחיה חתמה בו את הסיפור שלה. */
.hayush-quote {
	margin: clamp(2.2rem, 4vw, 3rem) 0 0;
	padding: 0;
	border: 0;
	border-inline-start: 3px solid var(--wp--preset--color--primary);
	padding-inline-start: 1.5rem;
}

.hayush-quote p {
	margin: 0;
	font-size: clamp(1.3rem, 1.1rem + .8vw, 1.7rem);
	font-weight: 600;
	line-height: 1.5;
	color: var(--wp--preset--color--contrast);
}

.hayush-values {
	list-style: none;
	margin: 1.4rem 0 0;
	padding: 0;
	display: grid;
	gap: .85rem;
	line-height: 1.7;
}

.hayush-values li {
	padding-inline-start: 1.7rem;
	position: relative;
	color: var(--wp--preset--color--muted);
}

.hayush-values li::before {
	content: "✓";
	position: absolute;
	inset-inline-start: 0;
	color: var(--wp--preset--color--primary);
	font-weight: 700;
}

.hayush-values strong { color: var(--wp--preset--color--contrast); }

.hayush-invite {
	max-inline-size: 620px;
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--30);
	text-align: center;
}

.hayush-invite .hayush-lead { margin-block: .8rem 1.8rem; }


/* ==========================================================================
   כרטיס מוצר צף על הקרוסלה
   ========================================================================== */

.hayush-pick {
	position: absolute;
	z-index: 4;
	/* בצד הטקסט. בצד השני של התמונה יושב הספסל, והכרטיס כיסה אותו. */
	inset-block-end: 1.5rem;
	inset-inline-start: 1.5rem;
	display: flex;
	align-items: center;
	gap: .8rem;
	max-inline-size: 21rem;
	padding: .7rem .9rem;
	border-radius: 16px;
	background: rgba(255, 255, 255, .93);
	backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, .8);
	box-shadow: 0 12px 34px -18px rgba(43, 36, 31, .5);
	text-decoration: none;
	color: inherit;
	transition: transform .22s var(--hy-ease), box-shadow .22s var(--hy-ease);
}

.hayush-pick:hover {
	transform: translateY(-3px);
	box-shadow: 0 18px 42px -20px rgba(43, 36, 31, .6);
}

.hayush-pick__media {
	flex: none;
	inline-size: 3.4rem;
	block-size: 3.4rem;
	border-radius: 11px;
	overflow: hidden;
	background: var(--wp--preset--color--base);
	display: grid;
	place-items: center;
}

.hayush-pick__media img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: contain;
}

.hayush-pick__text {
	display: flex;
	flex-direction: column;
	gap: .1rem;
	min-inline-size: 0;
	flex: 1;
}

.hayush-pick__eyebrow {
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .06em;
	color: var(--wp--preset--color--primary-dark);
}

.hayush-pick__name {
	font-size: .88rem;
	font-weight: 700;
	line-height: 1.25;
	color: var(--wp--preset--color--contrast);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.hayush-pick__price {
	font-size: .84rem;
	font-weight: 700;
	color: var(--wp--preset--color--primary-dark);
}

/* המחיר הקודם. שקיפות נמוכה הפילה אותו מתחת לסף, ולכן הוא נבדל בגודל */
.hayush-pick__price s { font-weight: 400; font-size: .85em; color: var(--wp--preset--color--muted); margin-inline-end: .25rem; }

.hayush-pick__go {
	flex: none;
	padding: .38rem .8rem;
	border-radius: 999px;
	font-size: .78rem;
	font-weight: 700;
	background: var(--wp--preset--color--primary-dark);
	color: #fff;
}

/* במסך צר הכרטיס היה מכסה את המוצר עצמו */
@media (max-width: 900px) {
	.hayush-pick { display: none; }
}

/* ==========================================================================
   ארבעה שלבים על רקע כהה
   ========================================================================== */

.hayush-flow {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.4rem;
	margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
}

.hayush-flow__item { display: flex; flex-direction: column; }

.hayush-flow__media {
	margin: 0 0 1rem;
	aspect-ratio: 4 / 3;
	border-radius: var(--hy-radius);
	overflow: hidden;
	background: #4A3620;
	display: grid;
	place-items: center;
	padding: .8rem;
}

.hayush-flow__media img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: contain;
}

/* המספר גדול וכהה, יושב מתחת לתמונה כמו באתר הרפרנס */
.hayush-flow__num {
	font-size: 2.6rem;
	font-weight: 900;
	line-height: 1;
	/* נמדד ב-1.62 מול סף של 3 לטקסט גדול. 0.40 מגיע ל-3.23 */
	color: rgba(255, 255, 255, .40);
	margin-block-end: .2rem;
}

.hayush-flow__title {
	font-size: 1.18rem;
	font-weight: 700;
	margin: 0 0 .45rem;
	color: #FAF7F1;
}

.hayush-flow__text {
	margin: 0;
	font-size: .92rem;
	line-height: 1.75;
	color: #CBBFAC;
}

@media (max-width: 1024px) {
	.hayush-flow { grid-template-columns: repeat(2, 1fr); gap: 1.6rem 1.2rem; }
}

@media (max-width: 560px) {
	.hayush-flow { grid-template-columns: 1fr; }
	.hayush-flow__num { font-size: 2.1rem; }
}

/* ==========================================================================
   ציטוט גדול
   ========================================================================== */

.hayush-bigquote {
	max-inline-size: 780px;
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--30);
	text-align: center;
}

.hayush-bigquote blockquote {
	margin: 0;
	padding: 0;
	border: 0;
}

.hayush-bigquote blockquote p {
	margin: 0;
	font-size: clamp(1.6rem, 1.2rem + 1.9vw, 2.7rem);
	font-weight: 700;
	line-height: 1.32;
	letter-spacing: -.02em;
	color: var(--wp--preset--color--contrast);
	text-wrap: balance;
}

/* גרשיים דקורטיביים, מעל הטקסט */
.hayush-bigquote blockquote::before {
	content: "”";
	display: block;
	font-size: clamp(3rem, 2rem + 3vw, 5rem);
	line-height: .6;
	color: var(--wp--preset--color--primary);
	opacity: .5;
	margin-block-end: .4rem;
}

.hayush-bigquote figcaption {
	margin-block-start: 1.6rem;
	display: flex;
	flex-direction: column;
	gap: .15rem;
}

.hayush-bigquote__name {
	font-size: 1rem;
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}

.hayush-bigquote__role {
	font-size: .88rem;
	color: var(--wp--preset--color--muted);
}

/* ==========================================================================
   דירוג כוכבים בכרטיס המוצר
   ========================================================================== */

.hayush-stars {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	margin-inline: auto;
	font-size: .95rem;
	line-height: 1;
}

/* חמישה כוכבים אפורים, ושכבה כתומה ברוחב הדירוג מעליהם */
.hayush-stars::before,
.hayush-stars__fill {
	content: "★★★★★";
	letter-spacing: .1em;
	white-space: nowrap;
}

.hayush-stars {
	position: relative;
}

.hayush-stars::before {
	color: #DED3C4;
}

.hayush-stars__fill {
	position: absolute;
	inset-block-start: 0;
	inset-inline-start: 0;
	overflow: hidden;
	color: var(--wp--preset--color--primary);
	direction: rtl;
}

.hayush-stars__count {
	margin-inline-start: 4.9em;
	font-size: .78rem;
	color: var(--wp--preset--color--muted);
}

/* ==========================================================================
   לוגו
   ========================================================================== */

.hayush-brand__logo {
	display: block;
	inline-size: 3.6rem;
	block-size: 3.6rem;
	line-height: 0;
	flex: none;
}

.hayush-brand__img {
	inline-size: 100%;
	block-size: 100%;
	object-fit: contain;
}

/* בהדר הלוגו עגול ויושב מימין לשם, והשם מיושר לימין ולא ממורכז */
.hayush-brand.hayush-brand {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: .8rem;
	text-align: start;
}

.hayush-brand .hayush-brand__img { border-radius: 50%; }

.hayush-brand .wp-block-site-title,
.hayush-brand .wp-block-site-title a,
.hayush-brand p {
	text-align: start;
	margin-block: 0;
}

.hayush-brand__text {
	display: flex;
	flex-direction: column;
	gap: .1rem;
	min-inline-size: 0;
}

/* בפוטר הדמות שקופה ויושבת ישירות על הירוק, בלי עיגול ובלי מסגרת */
.hayush-brand__logo--footer {
	inline-size: 7.5rem;
	block-size: 7.5rem;
	margin-block-end: .7rem;
}

.hayush-brand__logo--footer .hayush-brand__img { border-radius: 0; }




/* ==========================================================================
   נגישות הפוטר
   ========================================================================== */

/*
 * הפוטר יושב על ירוק המרווה, ועליו הגוון הרך נמדד ב-2.12 מול
 * סף של 4.5. הוא נדרס כאן לחום המלא, שנותן 5.73.
 *
 * זה לא שינוי עיצובי אלא תיקון נגישות. אתר שנושא הצהרת נגישות
 * ונכשל בפוטר של אותה הצהרה חושף את חיה בדיוק לתביעה שהתוסף
 * נועד למנוע.
 */
.wp-block-template-part .has-secondary-background-color a,
footer .has-secondary-background-color a {
	color: var(--wp--preset--color--contrast);
}

/* קישור בפוטר מסומן בקו תחתון, כדי שלא יזוהה בצבע בלבד */
.wp-block-template-part .has-secondary-background-color a,
footer .has-secondary-background-color a {
	text-decoration-color: color-mix(in srgb, var(--wp--preset--color--contrast) 45%, transparent);
}

/* ==========================================================================
   מילים מהלב. המלצות בגלילה אופקית
   ========================================================================== */

/*
 * גלילה אופקית ולא קרוסלה עם כפתורים. אין כאן JavaScript, אין
 * מצב פנימי שיכול להישבר, ובמובייל זו התנועה שהאצבע כבר מצפה לה.
 * scroll-snap עוצר כל כרטיס במקומו כדי שלא ייקטע באמצע.
 */
/*
 * שם המחלקה כפול בכוונה. וורדפרס מחיל על כל ילד של מקטע
 * מוגבל גם max-width וגם margin-inline auto, ובמדידה הם ניצחו
 * את הכלל הפשוט וקיבענו את הרצועה על 1240. הכפלה מעלה את
 * הספציפיות בלי selector מלאכותי ובלי important.
 */
/*
 * המקטע שמכיל רצועה נוגעת בקצוות. במקום לפרוץ החוצה בשוליים
 * שליליים, שנדרסו במדידה על ידי הכללים של וורדפרס, המקטע עצמו
 * מוותר על הריפוד ועל תקרת הרוחב. הרצועה מקבלת אז את מלוא
 * הרוחב באופן טבעי, בלי חישוב שתלוי במי ההורה.
 *
 * הריפוד עובר לכותרות בלבד, כדי שהן יישארו מיושרות עם העמוד.
 */
.hayush-band.hayush-band {
	padding-inline: 0;
}

.hayush-band > .hayush-eyebrow,
.hayush-band > .hayush-h2,
.hayush-band > .hayush-lead {
	padding-inline: var(--wp--preset--spacing--30, 1rem);
}

.hayush-words.hayush-words {
	position: relative;
	margin-block-start: clamp(2rem, 4vw, 2.8rem);
	inline-size: auto;
	max-inline-size: none;
	margin-inline: 0;

	/* ריפוד קבוע וקטן. ריפוד שגדל עם המסך חנק את הרצועה ברוחב גדול. */
	padding-inline: 1.25rem;
}

.hayush-words__track {
	list-style: none;
	margin: 0;
	padding: .5rem .25rem 1.4rem;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(280px, 340px);
	gap: 1rem;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-snap-type: inline mandatory;
	scrollbar-width: none;
	cursor: grab;
}

.hayush-words__track::-webkit-scrollbar { display: none; }

.hayush-words__track:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 3px;
	border-radius: var(--hy-radius-lg);
}

/*
 * בזמן גרירה הסמן משתנה והבחירה מבוטלת, אחרת הגרירה מסמנת
 * את הטקסט בכרטיסים במקום להזיז את הרצועה.
 */
.hayush-words__track.is-dragging {
	cursor: grabbing;
	user-select: none;
	scroll-behavior: auto;
}

.hayush-words__track.is-dragging .hayush-word { pointer-events: none; }

/* העותקים של הקרוסלה המעגלית זהים למקור לכל דבר */
.hayush-word.is-clone { }

/* ---------- חיצים ---------- */

.hayush-words__nav {
	position: absolute;
	inset-block-start: calc(50% - 1.4rem);
	z-index: 3;
	inline-size: 2.8rem;
	block-size: 2.8rem;
	display: none;
	place-items: center;
	padding: 0;
	font-size: 1.5rem;
	line-height: 1;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 999px;
	box-shadow: 0 6px 18px -10px rgba(43, 36, 31, .45);
	cursor: pointer;
	transition: background-color .2s var(--hy-ease), transform .2s var(--hy-ease), opacity .2s var(--hy-ease);
}

/* מוצגים רק כשיש באמת לאן לגלול, והמחלקה נקבעת במדידה */
.hayush-words.is-scrollable .hayush-words__nav { display: grid; }

/*
 * מיקום פיזי ולא לוגי. הכפתורים צמודים לקצה החלון, ובכיוון
 * ימין לשמאל ערך לוגי היה מחליף ביניהם ומצמיד אותם לצד הלא נכון.
 */
.hayush-words__nav--prev { right: .6rem; }
.hayush-words__nav--next { left:  .6rem; }

.hayush-words__nav:hover:not(:disabled) {
	background: var(--wp--preset--color--sand);
	transform: scale(1.06);
}

.hayush-words__nav:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

/*
 * בקצה הרצועה הכפתור נשאר במקומו ומתעמעם, ולא נעלם. היעלמות
 * מזיזה את הפריסה ומבלבלת את מי שכבר כיוון אליו את העכבר.
 */
.hayush-words__nav:disabled {
	opacity: .3;
	cursor: default;
	box-shadow: none;
}

.hayush-word {
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.5rem 1.4rem 1.3rem;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--hy-radius-lg);
	box-shadow: var(--hy-shadow-soft, 0 4px 16px -8px rgba(43, 36, 31, .22));
}

/*
 * הגרשיים הן קישוט ולכן הן מוסתרות מהקורא, אחרת קורא מסך
 * מקריא סימן פיסוק לפני כל המלצה.
 */
.hayush-word__quote {
	margin: 0;
	position: relative;
	padding-block-start: 1.6rem;
	font-size: 1rem;
	line-height: 1.7;
	color: var(--wp--preset--color--contrast);
}

.hayush-word__quote::before {
	content: "”";
	position: absolute;
	inset-block-start: -.6rem;
	inset-inline-start: 0;
	font-size: 3rem;
	line-height: 1;
	color: var(--wp--preset--color--primary);
	opacity: .55;
}

.hayush-word__by {
	display: flex;
	flex-direction: column;
	gap: .1rem;
	padding-block-start: .9rem;
	border-block-start: 1px solid var(--wp--preset--color--line);
}

.hayush-word__name {
	font-weight: 700;
	font-size: .95rem;
	color: var(--wp--preset--color--contrast);
}

.hayush-word__role {
	font-size: .84rem;
	color: var(--wp--preset--color--muted);
}

/*
 * במסך מגע החיצים מיותרים, האצבע כבר יודעת מה לעשות,
 * והם רק מכסים חלק מהכרטיס.
 */
@media (hover: none), (max-width: 720px) {
	.hayush-words.is-scrollable .hayush-words__nav { display: none; }
}

/* ==========================================================================
   למה דווקא הערכות שלי
   ========================================================================== */

.hayush-why {
	list-style: none;
	margin: clamp(2rem, 4vw, 2.8rem) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
}

.hayush-why__item {
	padding: 1.7rem 1.2rem 1.5rem;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--hy-radius-lg);
	text-align: center;
}

.hayush-why__icon {
	display: block;
	font-size: 1.7rem;
	line-height: 1;
	margin-block-end: .7rem;
}

.hayush-why__title {
	margin: 0 0 .4rem;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}

.hayush-why__text {
	margin: 0;
	font-size: .92rem;
	line-height: 1.6;
	color: var(--wp--preset--color--muted);
}

@media (max-width: 900px) {
	.hayush-why { grid-template-columns: repeat(2, 1fr); gap: .8rem; }
}

@media (max-width: 480px) {
	.hayush-why { grid-template-columns: 1fr; }
	.hayush-why__item { display: grid; grid-template-columns: auto 1fr; gap: .2rem .9rem; text-align: start; padding: 1.2rem 1.1rem; }
	.hayush-why__icon { grid-row: 1 / 3; align-self: center; margin: 0; }
	.hayush-words__track { grid-auto-columns: minmax(260px, 85vw); }
}

/* ==========================================================================
   מפת אתר
   ========================================================================== */

/*
 * לא מפת ה-XML של יואסט אלא מפה לקוראים, שאליה מקשר סרגל
 * הנגישות. שלוש עמודות ברוחב מלא, אחת במובייל, וקישורים
 * מודגשים בקו תחתון כדי שלא יזוהו בצבע בלבד.
 */
.hayush-sitemap {
	display: grid;
	gap: clamp(2rem, 4vw, 3rem);
	margin-block-start: 1rem;
}

.hayush-sitemap__title {
	margin: 0 0 .9rem;
	padding-block-end: .6rem;
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
	border-block-end: 1px solid var(--wp--preset--color--line);
}

.hayush-sitemap__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: .55rem 1.5rem;
}

.hayush-sitemap__list a {
	color: var(--wp--preset--color--contrast);
	text-decoration: underline;
	text-underline-offset: .22em;
	text-decoration-color: var(--wp--preset--color--line);
	transition: text-decoration-color .18s var(--hy-ease);
}

.hayush-sitemap__list a:hover,
.hayush-sitemap__list a:focus-visible {
	text-decoration-color: var(--wp--preset--color--primary-dark);
}

@media (max-width: 900px) {
	.hayush-sitemap__list { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
	.hayush-sitemap__list { grid-template-columns: 1fr; }
}

/* ==========================================================================
   שורת הקרדיט
   ========================================================================== */

/*
 * רצועה כהה בתחתית הפוטר, ולא על הירקרק שמעליה. הירקרק נמצא
 * בבהירות בינונית, ובמדידה גם הכחול וגם הכתום נפלו עליו מתחת
 * לסף, הכתום ביחס של 1.06. על החום הכהה הכתום המקורי של
 * המותג נותן 5.39 ונשמר בדיוק.
 */
.hayush-credit__line {
	margin: 0;
	text-align: center;
	font-size: .8125rem;
	font-weight: 300;
	line-height: 1.7;
	color: var(--wp--preset--color--sand);
}

.hayush-credit__sep {
	margin-inline: .45rem;
	opacity: .45;
}

/*
 * שני קישורים לאותו יעד בשני צבעים, כמו החתימה באתרים
 * האחרים. הכתום הוא הצבע המקורי. הכחול הובהר, כי בגרסתו
 * הכהה הוא היה נבלע ברצועה.
 */
.hayush-credit__a,
.hayush-credit__b {
	font-weight: 500;
	text-decoration: underline;
	text-underline-offset: .2em;
	text-decoration-thickness: 1px;
	transition: text-decoration-color .18s var(--hy-ease), color .18s var(--hy-ease);
}

/* קו תחתון ולא צבע בלבד, אחרת הקישור מזוהה רק לפי גוון */
.hayush-credit__a {
	color: #799CBE;
	text-decoration-color: rgba(121, 156, 190, .5);
}

.hayush-credit__b {
	color: #F38A1F;
	text-decoration-color: rgba(243, 138, 31, .5);
}

.hayush-credit__a:hover,
.hayush-credit__a:focus-visible { text-decoration-color: #799CBE; }

.hayush-credit__b:hover,
.hayush-credit__b:focus-visible { text-decoration-color: #F38A1F; }

.hayush-credit__line a:focus-visible {
	outline: 2px solid var(--wp--preset--color--sand);
	outline-offset: 3px;
	border-radius: 3px;
}

@media (max-width: 560px) {
	.hayush-credit__line { font-size: .75rem; }
	.hayush-credit__sep { display: block; block-size: 0; margin: .15rem 0; visibility: hidden; }
}

/* ==========================================================================
   כפתור הנגישות לפני שגיליון התוסף נטען
   ========================================================================== */

/*
 * גיליון הסגנונות של תוסף הנגישות נדחה עד לאינטראקציה, וכל עוד
 * הוא לא הגיע הכפתור הוא אלמנט רגיל בזרימת הדף ונופל לתחתיתו.
 * במדידה הוא ישב ב-12374 פיקסלים מלמעלה במקום להיות צף.
 *
 * הכללים כאן משחזרים את המינימום ההכרחי בלבד, בדיוק לפי מה
 * שנמדד מהתוסף עצמו: עטיפה קבועה בפינה, כפתור עגול ארבעים
 * ושמונה על ארבעים ושמונה. כשהגיליון המלא מגיע הוא גובר
 * ממילא, ולכן אין כאן שכפול של עיצוב אלא רק מניעת קפיצה.
 */
#acwp-toolbar-btn-wrap {
	position: fixed;
	inset-block-start: 120px;
	left: 20px;
	z-index: 9500;
}

#acwp-toolbar-btn {
	inline-size: 48px;
	block-size: 48px;
	border: 0;
	border-radius: 50%;
	background: #1E7AB9;
	cursor: pointer;
	padding: 0;
	display: grid;
	place-items: center;
}

#acwp-toolbar-btn img,
#acwp-toolbar-btn svg {
	inline-size: 60%;
	block-size: auto;
}

/* כתובת מייל שנכתבת הפוכה ב-HTML כדי לא להיקצר על ידי בוטים */
.hayush-rev { unicode-bidi: bidi-override; direction: rtl; }

/* ==========================================================================
   טופס פנייה
   ========================================================================== */

/*
 * טקסט משני על משטח החול. הגוון הרך נמדד ב-3.39 מול סף של 4.5,
 * כי החול כהה מספיק כדי להפיל אותו. החום המלא נותן 9.17.
 * הקישור בתוך הפסקה נבדל בקו תחתון ולא בגוון.
 */
.hayush-inquiry .hayush-field__hint,
.hayush-inquiry__privacy,
.hayush-inquiry__lead a {
	color: var(--wp--preset--color--contrast);
}

.hayush-inquiry__lead a,
.hayush-inquiry__privacy a {
	text-decoration: underline;
	text-underline-offset: .2em;
	text-decoration-color: var(--wp--preset--color--primary-dark);
}

.hayush-inquiry {
	margin-block-start: clamp(2.5rem, 5vw, 3.5rem);
	padding: clamp(1.6rem, 3vw, 2.4rem);
	background: var(--wp--preset--color--sand);
	border-radius: var(--hy-radius-lg);
	scroll-margin-block-start: 6rem;
}

.hayush-inquiry__title {
	margin: 0 0 .5rem;
	font-size: clamp(1.4rem, 1.1rem + 1.2vw, 1.9rem);
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}

.hayush-inquiry__lead {
	margin: 0 0 1.6rem;
	color: var(--wp--preset--color--contrast);
	line-height: 1.7;
}

.hayush-inquiry__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}

.hayush-field--wide { grid-column: 1 / -1; }

.hayush-field {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: .35rem;
}

.hayush-field label {
	font-size: .9rem;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

.hayush-field input,
.hayush-field textarea {
	inline-size: 100%;
	padding: .7rem .9rem;
	font: inherit;
	font-size: 1rem;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 10px;
}

.hayush-field input:focus-visible,
.hayush-field textarea:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary-dark);
	outline-offset: 1px;
	border-color: var(--wp--preset--color--primary-dark);
}

.hayush-field__hint {
	font-size: .82rem;
	color: var(--wp--preset--color--contrast);
}

/*
 * מלכודת הבוטים. מוסתרת מהעין, מסדר הטאבים וקוראי המסך, אבל
 * נשארת שדה אמיתי שבוט ימלא. display none היה גורם לחלק
 * מהבוטים לדלג עליה, ולכן היא מוסרת מהזרימה ולא מהמסמך.
 */
.hayush-hp {
	position: absolute !important;
	inset-inline-start: -9999px;
	inline-size: 1px !important;
	block-size: 1px !important;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	pointer-events: none;
}

/* גם השדה עצמו, אחרת הוא יורש רוחב מכלל הטופס */
.hayush-hp input { inline-size: 1px !important; block-size: 1px !important; padding: 0 !important; border: 0 !important; }

.hayush-inquiry__about {
	margin: 1.1rem 0 0;
	font-size: .92rem;
	color: var(--wp--preset--color--contrast);
}

.hayush-inquiry__submit {
	margin-block-start: 1.2rem;
	inline-size: 100%;
	justify-content: center;
}

/* הגוון הרך נמדד 3.39 על החול, החום המלא נותן 9.17 */
.hayush-inquiry__privacy {
	margin: .9rem 0 0;
	font-size: .82rem;
	color: var(--wp--preset--color--contrast);
	text-align: center;
}

.hayush-inquiry__privacy a {
	color: var(--wp--preset--color--contrast);
	text-decoration: underline;
	text-underline-offset: .2em;
	text-decoration-color: var(--wp--preset--color--primary-dark);
}

.hayush-inquiry__error {
	margin: 0 0 1.2rem;
	padding: .8rem 1rem;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--white);
	border: 2px solid var(--wp--preset--color--primary-dark);
	border-radius: 10px;
}

.hayush-inquiry__done {
	text-align: center;
	padding-block: 1rem;
}

.hayush-inquiry__done-title {
	margin: 0 0 .4rem;
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}

.hayush-inquiry__done p { color: var(--wp--preset--color--contrast); }
.hayush-inquiry__done .hayush-btn { margin-block-start: 1.2rem; }

@media (max-width: 640px) {
	.hayush-inquiry__grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   הודעת עוגיות
   ========================================================================== */

/*
 * רצועה תחתונה ולא חלון חוסם. חלון שחוסם את המסך מכריח החלטה
 * לפני שראו משהו, פוגע במדד יציבות הפריסה, ומעודד לחיצה
 * אוטומטית על אישור, שהיא ההפך מהסכמה מדעת.
 *
 * שני הכפתורים באותו גודל ובאותה בולטות בכוונה. עיצוב שמבליט
 * את האישור ומחליש את הסירוב הוא הטיה, וזה מה שהתיקון בא
 * למנוע.
 */
.hayush-cookies {
	position: fixed;
	inset-block-end: 0;
	inset-inline: 0;
	z-index: 9400;
	padding: 1rem clamp(1rem, 4vw, 2rem);
	background: var(--wp--preset--color--contrast);
	box-shadow: 0 -8px 30px -18px rgba(43, 36, 31, .6);
}

.hayush-cookies__inner {
	max-inline-size: 1240px;
	margin-inline: auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.hayush-cookies__text {
	margin: 0;
	flex: 1 1 22rem;
	font-size: .92rem;
	line-height: 1.65;
	color: var(--wp--preset--color--sand);
}

.hayush-cookies__text a {
	color: var(--wp--preset--color--sand);
	text-decoration: underline;
	text-underline-offset: .2em;
}

.hayush-cookies__actions {
	display: flex;
	gap: .6rem;
	flex-wrap: wrap;
}

.hayush-cookies__btn {
	padding: .65rem 1.3rem;
	font: inherit;
	font-size: .92rem;
	font-weight: 600;
	border-radius: 999px;
	cursor: pointer;
	white-space: nowrap;
	transition: transform .18s var(--hy-ease), background-color .18s var(--hy-ease);
}

.hayush-cookies__btn:hover { transform: translateY(-1px); }

.hayush-cookies__btn:focus-visible {
	outline: 2px solid var(--wp--preset--color--sand);
	outline-offset: 2px;
}

/* אישור וסירוב באותו משקל, רק בהיפוך צבע */
.hayush-cookies__btn--yes {
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--sand);
	border: 2px solid var(--wp--preset--color--sand);
}

.hayush-cookies__btn--no {
	color: var(--wp--preset--color--sand);
	background: transparent;
	border: 2px solid var(--wp--preset--color--sand);
}

.hayush-cookies[hidden],
.hayush-cookies-reset[hidden] { display: none !important; }

.hayush-cookies-reset button {

	font: inherit;
	font-size: .82rem;
	color: inherit;
	background: none;
	border: 0;
	padding: 0;
	text-decoration: underline;
	text-underline-offset: .2em;
	cursor: pointer;
}

@media (max-width: 600px) {
	/*
	 * flex-basis של 22rem על הטקסט מתח אותו לגובה של 451 פיקסלים
	 * במסך של 844, כלומר יותר מחצי מסך של רווח ריק. בעמודה הוא
	 * מקבל רק את מה שהוא צריך.
	 */
	.hayush-cookies { padding: .9rem 1rem calc(.9rem + env(safe-area-inset-bottom)); }
	.hayush-cookies__inner { flex-direction: column; align-items: stretch; gap: .85rem; }
	.hayush-cookies__text { flex: 0 0 auto; font-size: .86rem; }
	.hayush-cookies__actions { justify-content: stretch; gap: .5rem; }
	.hayush-cookies__btn { flex: 1; text-align: center; padding-inline: .8rem; }
}

/*
 * התמונה בקרוסלה כקישור. הקישור עוטף את התמונה בלי לשנות את
 * הפריסה, ומקבל את אותו סמן שמקבל כל קישור אחר.
 */
/*
 * grid ולא block. ה-figure ממרכז את הילד שלו, וברגע שהקישור נכנס
 * בין השניים הוא נעשה הילד הממורכז והתמונה איבדה את המרכוז.
 * התמונה מוגבלת ל-88 אחוז מהגובה, כך שההפרש נערם מתחתיה במקום
 * להתחלק מעליה ומתחתיה.
 */
.hayush-slide__link {
	display: grid;
	place-items: center;
	inline-size: 100%;
	block-size: 100%;
	cursor: pointer;
}

.hayush-slide__link img { display: block; }

/* הכותרת נושאת את הקישור לקורא מסך, ולכן היא נראית כקישור */
.hayush-slide__title a {
	color: inherit;
	text-decoration: none;
}

.hayush-slide__title a:hover,
.hayush-slide__title a:focus-visible {
	text-decoration: underline;
	text-underline-offset: .12em;
	text-decoration-thickness: 2px;
	text-decoration-color: var(--wp--preset--color--primary-dark);
}

.hayush-slide__title a:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary-dark);
	outline-offset: 4px;
	border-radius: 4px;
}

/*
 * מחירים בעמוד המוצר במצב פנייה. שתי שורות ולא כפתורים, כי אין
 * מה ללחוץ. המחיר גדול והתווית קטנה, כדי שהעין תתפוס קודם את
 * המספר ורק אחר כך את מה שהוא מתייחס אליו.
 */
.hayush-pdp__prices {
	list-style: none;
	margin: 1.4rem 0 .6rem;
	padding: 0;
	display: grid;
	gap: .5rem;
}

.hayush-pdp__prices li {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	padding: .55rem .9rem;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 12px;
	background: var(--wp--preset--color--white);
}

.hayush-pdp__price-label {
	font-size: .93rem;
	color: var(--wp--preset--color--muted);
}

.hayush-pdp__price {
	font-weight: 700;
	font-size: 1.15rem;
	white-space: nowrap;
}

/* המחיר לפני ההנחה, דק ומוקטן, כדי שלא יתחרה במחיר בפועל */
.hayush-pdp__price s {
	font-weight: 400;
	font-size: .92rem;
	color: var(--wp--preset--color--muted);
	margin-inline-end: .35rem;
}

.hayush-pdp__price-note {
	margin: 0 0 1.4rem;
	font-size: .85rem;
	line-height: 1.6;
	color: var(--wp--preset--color--muted);
}
