.elementor-3858 .elementor-element.elementor-element-4cbd494c{--display:flex;--min-height:100vh;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:-70px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3858 .elementor-element.elementor-element-1634d0cc{width:100%;max-width:100%;}/* Start custom CSS for html, class: .elementor-element-1634d0cc *//* עטיפה כללית */
.cat-hero{
  position: relative;
  min-height: 100vh;
  width: 100%;
  overflow: hidden;
  direction: rtl;

  /* פונט ברירת מחדל מהאתר/אלמנטור */
  font-family: var(--e-global-typography-text-font-family, inherit) !important;
}

/* אם את לא משתמשת ברקע הגדול לכל המסך – אפשר להשאיר, זה לא מפריע */
.cat-hero__bg{
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transform: scale(1.05);
  transition: opacity .4s ease, transform .8s ease;
  z-index: 0;
}

/* שכבת כהות כללית (למקרה שיש bg גדול) */
.cat-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.25);
  z-index:1;
}

/* ---- פריסה: Accordion (דחיפה) ---- */
.cat-hero__grid{
  position: relative;
  z-index: 2;

  display: flex;      /* חשוב! כדי שדחיפה תעבוד */
  height: 100vh;
  width: 100%;
}

/* כל פס */
.cat-hero__item{
  /* שווה ברירת מחדל */
  flex: 1 1 0%;
  min-width: 0;
  height: 100vh;

  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;

  /* לינק שלא נהיה כחול */
  color:#fff !important;
  text-decoration:none !important;

  /* רקע קבוע לפס (מגיע מה-JS/inline) */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  /* הפרדות */
  border-left: 1px solid rgba(255,255,255,.12);

  /* אנימציה של ההתרחבות */
  transition: flex .35s ease, filter .35s ease, background-position .35s ease;

  position: relative;
}

.cat-hero__item:first-child{
  border-left: none;
}

/* שכבת כהות מעל התמונה כדי שהטקסט יהיה קריא */
.cat-hero__item::before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.45);
  transition: background .35s ease;
  z-index: 0;
}

/* כותרת */
.cat-hero__title{
  position: relative;
  z-index: 1;

  font-family: inherit !important;
  font-size: clamp(18px, 2vw, 34px);
  font-weight: 600;
  line-height: 1.15;
}

/* Hover – ורוד + הרחבה */
.cat-hero__item:hover{
  flex: 1.7 1 0%;                /* כמה להתרחב (אפשר 1.4–2) */
  filter: saturate(1.05);
  color: #CB2A53 !important;      /* למקרה שמישהו דורס */
  background-position: center 40%;
}

.cat-hero__item:hover .cat-hero__title{
  color: #CB2A53 !important;
}

.cat-hero__item:hover::before{
  background: rgba(0,0,0,.28);
}

/* אם יש לך עדיין class של כפתור בקוד ישן – פשוט להעלים */
.cat-hero__btn{
  display:none !important;
}

/* טאבלט – חוזר לגריד 3x2 (בלי דחיפה) */
@media (max-width: 1024px){
  .cat-hero__grid{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    height: 100vh;
  }

  .cat-hero__item{
    height: auto;
    flex: unset;
  }

  .cat-hero__item:hover{
    flex: unset;
  }
}

/* מובייל – טור אחד */
@media (max-width: 640px){
  .cat-hero__grid{
    grid-template-columns: 1fr;
    height: auto;
  }

  .cat-hero__item{
    min-height: 90px;
    padding: 18px 12px;
    border-left: none;
    border-bottom: 1px solid rgba(255,255,255,.15);
  }
}/* End custom CSS */