/* ================================
   Hover Features List v4
   ================================ */

.hfw-wrap {
    position: relative;
    display: flex;
    align-items: stretch;
}

/* כיוון */
.hfw-dir-rtl { direction: rtl; }
.hfw-dir-ltr { direction: ltr; }

/* מיקומי תמונה */
.hfw-pos-center .hfw-images { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 10; pointer-events: none; }
.hfw-pos-fixed  .hfw-images { position: fixed;    top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 9999; pointer-events: none; }
.hfw-pos-right  .hfw-images { position: relative; flex-shrink: 0; min-width: 460px; }
.hfw-pos-left   .hfw-images { position: relative; flex-shrink: 0; min-width: 460px; }
.hfw-pos-right { flex-direction: row; gap: 30px; align-items: center; }
.hfw-pos-left  { flex-direction: row-reverse; gap: 30px; align-items: center; }

/* רשימה */
.hfw-list {
    flex: 1;
    display: flex;
    flex-direction: column;
    width: 100%;
}

/* פריט */
.hfw-item {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 18px 20px !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: background-color 0.3s ease !important;
    position: relative;
}

/* כיוון אייקון */
.hfw-dir-rtl .hfw-item { flex-direction: row !important; }
.hfw-dir-ltr .hfw-item { flex-direction: row-reverse !important; }

/* כותרת */
.hfw-title {
    flex: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.3;
}

/* אייקון */
.hfw-icon {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
.hfw-icon img {
    width: 36px !important;
    height: 36px !important;
    object-fit: contain !important;
    display: block !important;
}

/* ================================
   תמונות
   ================================ */
.hfw-images {
    pointer-events: none;
}

.hfw-img-box {
    position: absolute;
    top: 0; left: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    width: 460px;
    will-change: transform, opacity;
}

/* left/right — relative */
.hfw-pos-right .hfw-img-box,
.hfw-pos-left  .hfw-img-box {
    position: relative;
    top: auto; left: auto;
}

.hfw-img-box img {
    display: block !important;
    width: 100% !important;
    height: 300px !important;
    object-fit: cover !important;
    border-radius: 10px !important;
}

/* תמונה פעילה */
.hfw-img-box.hfw-show {
    opacity: 1 !important;
    visibility: visible !important;
}

/* ================================
   אנימציות
   ================================ */

/* Scale + Fade */
.hfw-anim-scale .hfw-img-box {
    transform: rotate(var(--rot,0deg)) scale(0.93);
    transition: opacity .4s ease, transform .4s ease, visibility .4s ease;
}
.hfw-anim-scale .hfw-img-box.hfw-show {
    transform: rotate(var(--rot,0deg)) scale(1);
}

/* Fade */
.hfw-anim-fade .hfw-img-box {
    transform: rotate(var(--rot,0deg));
    transition: opacity .4s ease, visibility .4s ease;
}
.hfw-anim-fade .hfw-img-box.hfw-show {
    transform: rotate(var(--rot,0deg));
}

/* Slide Up */
.hfw-anim-slideup .hfw-img-box {
    transform: rotate(var(--rot,0deg)) translateY(20px);
    transition: opacity .4s ease, transform .4s ease, visibility .4s ease;
}
.hfw-anim-slideup .hfw-img-box.hfw-show {
    transform: rotate(var(--rot,0deg)) translateY(0);
}

/* Zoom Bounce */
.hfw-anim-zoom .hfw-img-box {
    transform: rotate(var(--rot,0deg)) scale(0.6);
    transition: opacity .4s ease, transform .5s cubic-bezier(0.34,1.56,0.64,1), visibility .4s ease;
}
.hfw-anim-zoom .hfw-img-box.hfw-show {
    transform: rotate(var(--rot,0deg)) scale(1);
}

/* ================================
   Mobile
   ================================ */
@media (max-width: 767px) {
    .hfw-pos-right,
    .hfw-pos-left { flex-direction: column !important; }
    .hfw-pos-right .hfw-images,
    .hfw-pos-left  .hfw-images { min-width: unset !important; width: 100%; }
    .hfw-pos-center .hfw-images,
    .hfw-pos-fixed  .hfw-images { display: none; }
    .hfw-img-box img { height: 220px !important; }
}
