/**
 * === מפת CSS לעמוד הבית ===
 * קובץ זה קובע את סדר איחוד קבצי CSS של בלוקי עמוד הבית
 */

/* משתנים גלובליים לעמוד הבית */

/* ייבוא בלוקי עמוד הבית */
:root {
    /* צבעים */
    /* צבעי מותג ירושלים החרדית */
    --primary-color-jhhd: #DE0100; /* צבע ראשי מתוג ירושלים החרדית */
    --secondary-color-jhhd: #1B365D; /*  צבע משנה מתוג ירושלים החרדית */
    --secondary-color-jhhd-bright: #FAFAFA; /*  צבע משני בהיר מותג ירושלים החרדית */

    --primary-color: #8B4513;
    --secondary-color: #CD853F;
    --secondary-color-dark: #005f8c;
    --white: #ffffff;
    --gray-soft: #f7f7f7;
    --gray-mild: #e0e0e0;
    --gray-medium: #777777;
    --gray-dark: #444444;
    
    /* מרווחים */
    --space-xs: 0.5rem;
    --space-sm: 1rem;
    --space-md: 1.5rem;
    --space-lg: 0;
    --space-xl: 3rem;
    
    /* צללים */
    --box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    
    /* מעברים */
    --transition-default: all 0.3s ease;
    
    /* מרווחים בין עמודות במיכלים */
    --column-gap: 10px;
}


/* ===== _homepage-common.css ===== */
/**
 * === סגנונות משותפים לכל בלוקי עמוד הבית ===
 */

/* ================================
   === איפוס והגדרות בסיסיות ===
   ================================ */

.homepage-template {
  width: 100%;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
}

.section-container {
  width: 100%;
  margin-bottom: 0;
  padding: 0 20px;
  box-sizing: border-box;
}



/* תיקון גלישה במובייל */
@media (max-width: 768px) {
  body {
    overflow-x: hidden !important;
  }

  .homepage-template,
  .section-container {
    max-width: 100% !important;
    overflow-x: hidden !important;
    padding: 0 !important; /* ביטול מרווח במובייל */
  }

  /* מניעת גלישה של כל בלוקי עמוד הבית */
  [class*="-wrapper"],
  [class*="-section"],
  [class*="-container"] {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
}

.homepage-section-divider {
  display: none;
}

.section-title {
  font-family: 'Noto Sans Hebrew', 'Heebo', sans-serif;
  font-size: 1.8rem;
  color: var(--primary-color-jhhd);
  margin-bottom: var(--space-md);
  position: relative;
  display: inline-block;
  padding-bottom: 0.5rem;
  right: 0;
}

.section-title:after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 70px;
  height: 3px;
  background-color: var(--secondary-color-jhhd);
}

/* כלל זה נמחק - העיטור הוסר לחלוטין */

/* כל הכללים של העיטור נמחקו לחלוטין */

/* =======================================
   === עקיפת מגבלות רוחב בעמוד הבית ===
   ======================================= */

/* הסרת מגבלת רוחב מקסימלית מכל האלמנטים בעמוד הבית */
body.home,
body.home .wp-site-blocks,
body.home #content,
body.home .site-content,
body.home .entry-content>*,
body.home .wp-block-group.alignwide,
body.home main>.wp-block-group,
body.home .wp-block-post-content>*,
body.home .wp-block-group>*,
body.home main>*,
body.home .section-container>* {
  max-width: 100% !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* וידוא שה-wrapper הראשי לא מגביל */
body.home .wp-site-blocks {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* התפרסות מלאה של התוכן */
body.home {
  width: 100vw !important;
  overflow-x: hidden !important;
}

/* וידוא שהכותרת צפה ולא דוחפת את התוכן - תוך שמירת ריווח 20px בצדדים */
body.home .site-header,
body.home header.wp-block-template-part {
  position: fixed !important;
  top: 10px !important;
  left: auto !important;
  right: auto !important;
  z-index: 999999 !important;
  /* וידוא שהכותרת מעל הכל */
  width: calc(100% - 40px) !important;
  margin: 10px 20px 0 20px !important;
}

/* התאמה כשיש admin bar */
body.admin-bar.home .site-header,
body.admin-bar.home header.wp-block-template-part {
  top: 42px !important;
  /* 32px admin bar + 10px מרווח ההדר */
}

/* וידוא שהתוכן מתחיל מהתחלה ללא מרווח */
body.home .wp-site-blocks>*:first-child:not(header) {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.home .wp-site-blocks,
body.home #content,
body.home .site-content {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;
}

/* הגדרת מרווחי שוליים אחידים לכל תוכן האתר */
body.home .site-content,
body.home .homepage-template {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  /* הוספת איפוס padding עליון */
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  /* הוספת איפוס margin עליון */
}

/* החרגת הכותרת העליונה והתחתונה: שימור ריווח בהדר, רוחב מלא לפוטר */
body.home header.wp-block-template-part,
body.home .wp-site-blocks>header {
  max-width: 100% !important;
  width: calc(100% - 40px) !important;
  margin-left: 20px !important;
  margin-right: 20px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  left: auto !important;
  right: auto !important;
  position: fixed !important;
  top: 10px !important;
  box-sizing: border-box !important;
}

body.home footer.wp-block-template-part,
body.home .wp-site-blocks>footer {
  max-width: 100% !important;
  width: 100vw !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  left: 0 !important;
  right: 0 !important;
  position: relative !important;
  box-sizing: border-box !important;
}

/* מניעת גלישה אופקית */
body.home {
  overflow-x: hidden !important;
}

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

.article-card a:focus,
.opinion-card a:focus,
.category-card a:focus,
.most-read-article a:focus,
.read-more-button a:focus,
.ad-button:focus {
  outline: 2px solid var(--secondary-color-jhhd);
  outline-offset: 2px;
}

/* קונטרסט גבוה למצב נגישות */
@media (forced-colors: active) {

  .article-card,
  .opinion-card,
  .category-card,
  .most-read-article {
    border: 1px solid CanvasText;
  }
}

/* ========================
   === התאמות למובייל ===
   ======================== */

@media screen and (max-width: 768px) {

  /* הסרת כל המרווחים מהתוכן העליון בעמוד הבית */
  body.home .site-content,
  body.home .wp-site-blocks,
  body.home .entry-content,
  body.home main,
  body.home .homepage-template {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  /* הקטנת גדלי טקסט */
  .section-title {
    font-size: 1.5rem;
    right: 0;
  }

  /* צמצום מרווחים */
  .homepage-section-divider {
    margin: var(--space-md) auto;
  }

  /* התאמת article-meta: הקטנת גופן אוטומטית כשאין מקום - הקטנה של 20% לבקשת המשתמש */
  .article-meta {
    font-size: 0.8rem !important; /* הקטנה ב-20% מ-1rem */
    line-height: 1.2 !important;
    white-space: nowrap;
  }
  .article-meta .author,
  .article-meta .date,
  .article-meta .separator {
    font-size: inherit !important;
  }

  /* הפיכת כרטיסים לקונטיינרים כדי להקטין רק כשהם צרים */
  body.home .article-card,
  body.home .article-card-square,
  body.home .grid-item,
  body.home .post-card,
  body.home .vertical-posts-column {
    container-type: inline-size;
  }

  /* הקטנה מדורגת לפי רוחב הקונטיינר - הקטנה של 20% נוספת לבקשת המשתמש */
  @container (max-width: 340px) {
    .article-meta { font-size: 0.76rem !important; } /* הקטנה ב-20% מ-0.95rem */
  }
  @container (max-width: 300px) {
    .article-meta { font-size: 0.7rem !important; } /* הקטנה ב-20% מ-0.875rem */
  }
  @container (max-width: 260px) {
    .article-meta { font-size: 0.64rem !important; } /* הקטנה ב-20% מ-0.8rem */
  }

  /* הקטנת מרווח אנכי בין הבלוקים במובייל */
  body.home .posts-grid-square-section,
  body.home .all-posts-grid-section,
  body.home .posts-tabs-section,
  body.home .mixed-layout-section.section-container,
  body.home .featured-posts-split-section,
  body.home .popular-articles-section.section-container,
  body.home .leading-articles-section.section-container {
    margin: 0 auto !important;
  }
}

@media screen and (max-width: 480px) {

  /* הקטנת גדלי טקסט נוספת */
  .section-title {
    font-size: 1.3rem;
    margin-top: 0 !important;
    /* הסרת מרווח עליון מכותרות */
  }
  /* כלל זה נמחק - העיטור הוסר לחלוטין */
  .wp-block-group .section-title::after {
    right: 0;
  }
  /* הסרת הקו המפריד במובייל */
  .homepage-section-divider {
    display: none !important;
    /* הסתרה מוחלטת של הקו המפריד */
    margin: 0 !important;
  }

  /* צמצום נוסף למסכים קטנים מאוד - הקטנה של 20% לבקשת המשתמש */
  .article-meta {
    font-size: 0.76rem !important; /* הקטנה ב-20% מ-0.95rem */
  }

  /* מרווח קטן יותר מאוד במסכים קטנים מאוד */
  body.home .posts-grid-square-section,
  body.home .all-posts-grid-section,
  body.home .posts-tabs-section,
  body.home .mixed-layout-section.section-container,
  body.home .featured-posts-split-section,
  body.home .popular-articles-section.section-container,
  body.home .leading-articles-section.section-container {
    margin: 0 auto !important;
  }
}

/* ===== _dual-headline-banner.css ===== */
/* בלוק כותרת ראשית כפולה */
.dual-headline-banner {
    position: relative;
    width: 100vw;
    margin-right: calc(-50vw + 50%);
    margin-left: calc(-50vw + 50%);
    margin-top: 0;
    margin-bottom: 20px; /* מרווח של 20px בדסקטופ */
    height: 95vh;
    /* גובה הבלוק המלא */
    max-height: 95vh;
    height: 95dvh;
    max-height: 95dvh;
    overflow: hidden;
}

.dual-headline-container {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    user-select: none;
    /* מונע בחירת טקסט בזמן גרירה */
}

.dual-headline-container.grabbing {
    cursor: grabbing !important;
}

/* שכבת overlay לתפיסת אירועי גרירה */
.dual-headline-drag-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
    /* מעל התמונות אבל מתחת לכותרות */
    background: transparent;
    pointer-events: none;
    /* לא חוסם לחיצות כברירת מחדל */
}

.dual-headline-drag-overlay.dragging {
    cursor: grabbing;
}

/* בזמן גרירה */
.dual-headline-container.dragging {
    cursor: grabbing !important;
}

.dual-headline-container.dragging * {
    cursor: grabbing !important;
}

/* בזמן גרירה, בטל אינטראקציה עם לינקים */
.dual-headline-banner.dragging .dual-headline-link {
    pointer-events: none;
}

/* בזמן גרירה, הסר transitions כדי שהתנועה תהיה חלקה */
.dual-headline-banner.dragging .dual-headline-slide {
    transition: none !important;
}

/* אפקט צל בזמן גרירה */
.dual-headline-banner.dragging .dual-headline-slide.active {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.dual-headline-slider {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
    /* מונע בחירת טקסט בזמן גרירה */
}

/* הסרנו את ה-cursor מכאן כי הוא יתווסף רק בלחיצה ארוכה */

.dual-headline-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: nowrap;
    opacity: 0;
    visibility: hidden;
    transform: translateX(100%);
    transition: none;
    will-change: transform, opacity;
    /* אופטימיזציה לביצועים */
}

.dual-headline-slide.active {
    position: relative;
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

.dual-headline-slide.prev {
    transform: translateX(-100%);
}

.dual-headline-slide.next {
    transform: translateX(100%);
}

.dual-headline-item {
    flex: 1;
    position: relative;
    overflow: hidden;
    height: 100%;
}

.dual-headline-item.first {
    margin-left: 0;
}

.dual-headline-item.second {
    margin-right: 0;
}

.dual-headline-link {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
    text-decoration: none;
    user-select: none;
    /* מונע בחירת טקסט בתוך הלינקים */
    cursor: pointer;
    /* סמן יד ללחיצה */
}

.dual-headline-image-wrapper {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.dual-headline-image {
    position: absolute;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
    -webkit-user-drag: none;
    /* מונע גרירת תמונה ב-Webkit */
    user-drag: none;
    /* מונע גרירת תמונה */
}

/* מניעת בחירת טקסט/גרירה על תוכן הכותרת בזמן גרירה */
.dual-headline-content {
    -webkit-user-drag: none;
}

.dual-headline-link:hover .dual-headline-image {
    transform: translate(50%, -50%) scale(1.05);
}

.dual-headline-placeholder {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #f0f0f0 0%, #e0e0e0 100%);
}

/* תוכן הכותרת */
.dual-headline-content {
    position: absolute;
    bottom: 20px;
    right: 20px;
    /* שינוי ל-right עבור RTL */
    background: rgba(39, 59, 107, 0.8);
    background: color-mix(in srgb, var(--primary-color-jhhd) 80%, transparent);
    padding: 20px 25px;
    width: 50%;
    /* חצי מרוחב התמונה */
    max-width: 600px;
    /* רוחב מקסימלי למסכים גדולים */
    transition: all 0.3s ease;
    z-index: 6;
    /* מעל ה-overlay */
    user-select: none;
    /* מונע בחירת טקסט בזמן גרירה */
    pointer-events: auto;
    /* מאפשר לחיצה על התוכן */
    border-right: 5px solid var(--secondary-color-jhhd);
    /* פס כחול בצד ימין */
}
 
.dual-headline-title {
    color: #f5f5f5;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0;
    text-align: right;
    direction: rtl;
    /* וידוא כיוון RTL */
    word-wrap: break-word;
    /* שבירת מילים ארוכות */
    overflow-wrap: break-word;
    /* תמיכה בדפדפנים נוספים */
    hyphens: auto;
    /* מקפים אוטומטיים בסוף שורה */
}


.dual-headline-link:hover .dual-headline-content {
    background: rgba(39, 59, 107, 0.7);
    background: color-mix(in srgb, var(--primary-color-jhhd) 70%, transparent);
}


/* כפתורי ניווט - מוסתרים */
.dual-headline-nav {
    display: none !important;
}

.dual-headline-nav:hover {
    background: rgba(255, 255, 255, 1);
    transform: translateY(-50%) scale(1.1);
}

.dual-headline-prev {
    left: 20px;
    /* כפתור "קודם" בצד שמאל */
}

.dual-headline-next {
    right: 20px;
    /* כפתור "הבא" בצד ימין */
}

.dual-headline-nav svg {
    width: 24px;
    height: 24px;
    color: #333;
}

/* אינדיקטורים - מוסתרים */
.dual-headline-indicators {
    display: none !important;
}



.dual-headline-indicator {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.7);
    background: transparent;
    cursor: pointer;
    transition: all 0.3s ease;
}

.dual-headline-indicator.active {
    background: rgba(255, 255, 255, 0.9);
    transform: scale(1.2);
}

.dual-headline-indicator:hover {
    background: rgba(255, 255, 255, 0.5);
}

/* הצגת הסליידר הנכון בהתאם לגודל המסך */
.dual-headline-mobile {
    display: none;
}

.dual-headline-desktop {
    display: flex;
}

.dual-headline-indicators-mobile {
    display: none;
}

.dual-headline-indicators-desktop {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 12px;
    z-index: 10;
}

/* סגנון למצב תמונה בודדת בדסקטופ */
.dual-headline-banner.single-mode .dual-headline-desktop .dual-headline-item.single {
    width: 100%;
    flex: 1 0 100%;
}

.dual-headline-banner.single-mode .dual-headline-desktop .dual-headline-content {
    width: 40%;
    /* רוחב התוכן במצב single */
    max-width: 600px;
}

/* רספונסיב - טאבלט */
@media (max-width: 1024px) {
    .dual-headline-banner {
        height: 90vh;
        /* גובה מותאם לטאבלט */
        max-height: 90vh;
        height: 90dvh;
        max-height: 90dvh;
        margin-bottom: 0;
    }

    .dual-headline-link {
        height: 100%;
        max-height: 100%;
    }

    .dual-headline-title {
        font-size: 1.5rem;
    }

    .dual-headline-content {
        padding: 15px 20px;
        bottom: 15px;
        right: 15px;
        /* שינוי ל-right עבור RTL */
        width: 60%;
        /* רוחב גדול יותר לטאבלט */
        max-width: 450px;
    }
}

/* רספונסיב - מובייל */
@media (max-width: 768px) {

    /* הצג את הסליידר של מובייל והסתר את הדסקטופ */
    .dual-headline-mobile {
        display: flex;
    }

    .dual-headline-desktop {
        display: none;
    }

    /* הצג את האינדיקטורים של מובייל והסתר את הדסקטופ */
    .dual-headline-indicators-mobile {
        position: absolute;
        bottom: 30px;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        gap: 12px;
        z-index: 10;
    }

    .dual-headline-indicators-desktop {
        display: none;
    }

    .dual-headline-banner {
        height: 50vh;
        /* גובה 50% ממסך המכשיר */
        max-height: 50vh;
        height: 50dvh;
        max-height: 50dvh;
        margin-bottom: 0; /* ביטול המרווח התחתון במובייל */
    }

    .dual-headline-slide {
        /* במובייל השארת אותו אפקט slide */
    }

    .dual-headline-item {
        width: 100%;
        height: 100%;
    }

    /* אין צורך להסתיר את הכתבה השנייה כי כל כתבה בסלייד נפרד */
    .dual-headline-item.single {
        width: 100%;
        height: 100%;
    }

    .dual-headline-link {
        height: 100%;
        max-height: 100%;
    }

    .dual-headline-content {
        bottom: 15px;
        right: 15px;
        /* שינוי ל-right עבור RTL */
        padding: 15px 20px;
        width: calc(100% - 30px);
        /* רוחב מלא במובייל */
        max-width: calc(100% - 30px);
    }

    .dual-headline-title {
        font-size: 1.8rem;
        line-height: .9;
    }


    /* כפתורי ניווט מוסתרים גם במובייל */
}

/* מסכים קטנים מאוד */
@media (max-width: 480px) {
    .dual-headline-banner {
        height: 50vh;
        /* גובה 50% למסכים קטנים מאוד */
        max-height: 50vh;
        height: 50dvh;
        max-height: 50dvh;
        margin-bottom: 0; /* ביטול המרווח התחתון במובייל */
    }

    .dual-headline-link {
        height: 100%;
        max-height: 100%;
    }

    .dual-headline-content {
        bottom: 20px;
        right: 10px;
        /* שינוי ל-right עבור RTL */
        padding: 12px 15px;
        width: calc(100% - 20px);
        /* רוחב מלא במסכים קטנים */
        max-width: calc(100% - 20px);
    }

    .dual-headline-title {
        font-size: 1.8rem;
        line-height: .9;
    }

}

/* תמיכה במסכי מגע */
@media (hover: none) {
    .dual-headline-link:active .dual-headline-image {
        transform: translate(50%, -50%) scale(1.02);
    }

    /* הסר את ה-overlay במסכי מגע כי יש touch events */
    .dual-headline-drag-overlay {
        display: none;
    }
}

/* ===== _single-banner.css ===== */
/* בלוק באנר כתבה בודדת */
.single-banner {
    position: relative;
    width: 100vw;
    margin-right: calc(-50vw + 50%);
    margin-left: calc(-50vw + 50%);
    margin-top: 0;
    margin-bottom: 0; 
    overflow: visible; /* מאפשר גלישת כותרת */
}

.single-banner-link {
    display: block;
    position: relative;
    width: 100%;
    text-decoration: none;
    overflow: visible; /* שינוי מ-hidden ל-visible */
}

.single-banner-image-wrapper {
    position: relative;
    width: 100%;
    /* ה-padding-top נקבע inline בהתאם ליחס שנבחר */
    overflow: visible; /* שינוי מ-hidden ל-visible - מאפשר לכותרת לגלוש */
}

.single-banner-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.single-banner-link:hover .single-banner-image {
    transform: scale(1.05);
}

.single-banner-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #f0f0f0 0%, #e0e0e0 100%);
}

/* תוכן הכותרת */
.single-banner-content {
    position: absolute;
    /* המיקום והרוחב נקבעים inline בהתאם להגדרות */
    padding: 20px 30px;
    transition: all 0.3s ease;
    z-index: 2;
    /* רקע ברירת מחדל - יוחלף אם הוגדר צבע מותאם */
    background: rgba(0, 0, 0, 0.9);
    border-radius: 0;
    /* הסרנו את transform: translateY(-50%) כי זה גורם לבעיות במיקום */
    max-height: none; /* מאפשר גובה חופשי */
}

/* תיקון למקרה שהכותרת ארוכה */
.single-banner-content::-webkit-scrollbar {
    display: none; /* מסתיר את פס הגלילה */
}

/* כאשר הכותרת מתחת לתמונה לגמרי */
.single-banner.title-below-image .single-banner-content {
    position: relative;
    top: auto !important;
    right: auto !important;
    transform: none;
    width: 100% !important;
    margin-top: 0;
    border-radius: 0;
}

.single-banner.title-below-image .single-banner-image-wrapper {
    margin-bottom: 0;
}

.single-banner-title {
    color: #fff;
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.4;
    margin: 0;
    text-align: right;
    direction: rtl;
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
}

.single-banner-link:hover .single-banner-content:not([style*="background"]) {
    background: rgba(0, 0, 0, 1);
}

/* רספונסיב - טאבלט */
@media (max-width: 1024px) {
    .single-banner-title {
        font-size: 1.5rem;
    }
    
    .single-banner-content {
        padding: 18px 25px;
    }
}

/* רספונסיב - מובייל */
@media (max-width: 768px) {
    .single-banner-image-wrapper {
        /* יחס 1:1 למובייל - תמיד */
        padding-top: 100% !important;
    }
    
    .single-banner-title {
        font-size: 1.35rem;
    }
    
    .single-banner-content {
        /* במובייל תמיד מיקום ברירת מחדל */
        position: absolute !important;
        top: auto !important;
        bottom: 10% !important;
        right: 5% !important;
        width: 90% !important;
        transform: none !important;
        padding: 15px 20px;
        /* אם אין רקע מותאם, השתמש בברירת המחדל */
    }
    
    .single-banner-content:not([style*="background"]) {
        background: linear-gradient(to top, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.8) 100%);
    }
    
    /* במובייל, אם הכותרת אמורה להיות מתחת לתמונה */
    .single-banner.title-below-image .single-banner-content {
        position: relative !important;
        top: auto !important;
        bottom: auto !important;
        right: auto !important;
        width: 100% !important;
        margin-top: 0;
    }
}

/* מסכים קטנים מאוד */
@media (max-width: 480px) {
    .single-banner-title {
        font-size: 1.2rem;
        line-height: 1.35;
    }
    
    .single-banner-content {
        padding: 12px 15px;
        bottom: 5% !important;
    }
}

/* תמיכה במסכי מגע */
@media (hover: none) {
    .single-banner-link:active .single-banner-image {
        transform: scale(1.02);
    }
}

/* אנימציות עדינות */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.single-banner-content {
    animation: fadeInUp 0.6s ease-out;
}

/* ===== _posts-grid.css ===== */
/**
 * === בלוק רשימת כתבות (גריד) ===
 */

/* Wrapper ראשי להגבלת רוחב, בדומה ל-grid המרובע */
.posts-grid-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
}

/* עוקף כללים גלובליים בעמוד הבית שמאלצים רוחב מלא */
body.home .posts-grid-wrapper {
  max-width: 1200px !important;
  width: auto !important;
}

/* יישור ומרווחים של המיכל הפנימי, זהה ל-grid המרובע */
.posts-grid-wrapper .leading-articles-section.section-container {
  margin: 40px auto;
  padding: 0 20px;
  max-width: 1200px;
}

body.home .posts-grid-wrapper .leading-articles-section.section-container {
  margin: 40px auto !important;
  padding: 0 20px !important;
  width: auto !important;
}

/* גריד כתבות */
.leading-articles-section .articles-grid {
  display: flex;
  gap: var(--space-md);
  width: 100%;
  margin-top: -0.1rem; /* מרווח שלילי כדי להקטין את הרווח מהכותרת */
  justify-content: space-between;
}

/* התאמה דינמית למספר עמודות */
.articles-grid[data-columns="3"] .wp-block-column {
  flex: 0 0 calc(33.333% - var(--space-md) * 2 / 3);
}

.articles-grid[data-columns="4"] .wp-block-column {
  flex: 0 0 calc(25% - var(--space-md) * 3 / 4);
}

.articles-grid[data-columns="5"] .wp-block-column {
  flex: 0 0 calc(20% - var(--space-md) * 4 / 5);
}

.articles-grid[data-columns="6"] .wp-block-column {
  flex: 0 0 calc(16.666% - var(--space-md) * 5 / 6);
}

/* כרטיסיית כתבה סטנדרטית */
.article-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: var(--transition-default);
}

.article-card:hover {
  transform: translateY(-5px);
}

/* פינות מעוגלות */
.rounded-corners .article-card {
  border-radius: 10px;
}

.rounded-corners .article-card figure {
  border-radius: 10px 10px 0 0;
}

.article-card figure {
  margin-bottom: var(--space-xs);
  overflow: hidden;
  aspect-ratio: var(--aspect-ratio, 3 / 2);
  width: 100%;
}

.article-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: var(--transition-default);
}

.article-card:hover img {
  transform: scale(1.03);
}

.article-title {
  font-size: 1.2rem;
  margin-bottom: var(--space-xs);
  line-height: 1.3;
}

.article-excerpt {
  display: none; /* הסתרת התקציר בכתבות מובילות */
  font-size: 1rem;9rem;
  color: var(--gray-dark);
  margin-bottom: var(--space-xs);
}

.posts-grid-wrapper .article-card .article-meta {
  font-size: 1rem; !important; /* קטן מהכותרת (~1.2rem) ובולט פחות */
  color: var(--gray-medium);
  margin-top: auto;
}

/* תגית קטגוריה (תואם לעיצוב ב-grid המרובע) */
.category-tag {
  display: inline-block;
  background-color: #f0f0f0;
  color: #333;
  padding: 4px 12px;
  border-radius: 3px;
  font-size: 1rem;;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: var(--space-xs);
  text-decoration: none;
  transition: all 0.2s ease;
  align-self: flex-start;
}

.category-tag:hover {
  background-color: var(--primary-color, #0073aa);
  color: #fff;
  transform: translateY(-1px);
}

/* וידוא שהתווית לא מתפרסת לרוחב מלא בתוך כרטיס הכתבה */
.article-card .category-tag {
  display: inline-block;
  width: auto;
}

/* חיזוק סגוליות כדי למנוע התפרסות לרוחב מלא */
.leading-articles-section .article-card > a.category-tag {
  display: inline-flex !important;
  align-self: flex-start !important; /* ב-RTL זה מצמיד לימין */
  width: auto !important;
  max-width: max-content;
  white-space: nowrap;
  text-align: right;
  margin: 0 0 var(--space-xs) 0 !important; /* ביטול מרג'ינים אוטומטיים שממרכזים */
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-inline-start: 0 !important;
  margin-inline-end: auto !important; /* דוחף את התגית לקו ההתחלה (ימין ב-RTL) */
}

/* התאמות למסכים בינוניים */
@media screen and (max-width: 1200px) {
  .articles-grid {
    flex-wrap: wrap;
  }
  
  .articles-grid .wp-block-column {
    flex-basis: 31% !important;
    margin-bottom: var(--space-md);
  }
}

/* טאבלטים */
@media screen and (max-width: 768px) {
  .articles-grid .wp-block-column {
    flex-basis: 48% !important;
  }
}

/* מובייל */
@media screen and (max-width: 480px) {
  .articles-grid .wp-block-column {
    flex-basis: 100% !important;
  }
}


/* ===== _opinion-authors.css ===== */
/**
 * === בלוק רשימת דעות עם תמונות מחברים ===
 */

/* הגדרה מיוחדת למקטע הדעות - כל העמודות באותו גובה */
.opinion-section .articles-grid {
  align-items: stretch;
}

/* התאמה דינמית למספר עמודות */
.opinion-articles-grid[data-columns="3"] .wp-block-column {
  flex: 0 0 calc(33.333% - var(--space-md) * 2 / 3);
}

.opinion-articles-grid[data-columns="4"] .wp-block-column {
  flex: 0 0 calc(25% - var(--space-md) * 3 / 4);
}

.opinion-articles-grid[data-columns="5"] .wp-block-column {
  flex: 0 0 calc(20% - var(--space-md) * 4 / 5);
}

/* העמודה האחרונה (באנר) במקטע דעות - גובה קבוע */
.opinion-section .articles-grid .wp-block-column:last-child {
  height: 384px !important;
  max-height: 384px !important;
  overflow: hidden;
}

/* כרטיס דעה */
.opinion-card {
  display: flex;
  flex-direction: column;
  padding: var(--space-md);
  background-color: var(--gray-soft);
  height: 384px;
  border-radius: 2px;
  transition: var(--transition-default);
  text-align: center;
  overflow: hidden;
  box-sizing: border-box;
}

.opinion-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--box-shadow);
}

/* מיכל עבור תמונת המחבר ושמו */
.author-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--space-sm);
}

.opinion-author-image {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto var(--space-xs) auto;
}

.opinion-author-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.opinion-author {
  font-size: 1rem;9rem;
  color: var(--gray-medium);
  text-align: center;
  margin: 0 auto var(--space-xs) auto;
}

/* הסתרת שם הכותב בתחתית הכרטיס */
.opinion-card > .opinion-author:not(.in-container) {
  display: none;
}

.opinion-title {
  font-size: 1.5rem;
  margin-bottom: var(--space-xs);
  text-align: center;
  line-height: 1.3;
  font-weight: 600;
}

.opinion-excerpt {
  display: none;
  font-size: 1rem;
  color: var(--gray-dark);
}

/* באנר פרסומת במדור הדעות */
.opinion-ad-banner {
  height: 384px;
  max-height: 384px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  overflow: hidden;
}

.opinion-ad-container {
  width: 100%;
  height: 100%;
  max-height: 384px;
  background: linear-gradient(135deg, #6a11cb, #2575fc);
  border-radius: 2px;
  box-shadow: var(--box-shadow);
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--space-md);
  box-sizing: border-box;
  color: var(--white);
  text-align: center;
}

/* הגבלת גובה לכל תוכן מותאם אישית בבאנר */
.opinion-ad-banner > *,
.opinion-ad-container > * {
  max-height: 100%;
  overflow: hidden;
}

/* וידוא שתוכן HTML מותאם אישית לא יחרוג מהגובה */
.opinion-ad-banner iframe,
.opinion-ad-banner img,
.opinion-ad-banner video,
.opinion-ad-container iframe,
.opinion-ad-container img,
.opinion-ad-container video {
  max-height: 100% !important;
  height: auto !important;
  width: auto !important;
  max-width: 100% !important;
  object-fit: contain;
}

.opinion-ad-content {
  position: relative;
  z-index: 2;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}

.opinion-ad-content h3 {
  font-size: clamp(1.2rem, 3vw, 1.5rem);
  margin: 0 0 clamp(10px, 3vh, 20px) 0;
  line-height: 1.2;
  font-weight: 700;
}

.opinion-ad-content p {
  font-size: clamp(0.9rem, 2vw, 1.2rem);
  margin: 0 0 clamp(15px, 4vh, 25px) 0;
  font-weight: 600;
}

/* התאמות למובייל */
@media screen and (max-width: 768px) {
  .opinion-articles-grid .wp-block-column {
    flex-basis: 48% !important;
  }
  
  .opinion-card {
    height: auto !important;
    min-height: 250px;
  }
  
  .opinion-ad-banner {
    height: auto !important;
    min-height: 150px;
  }
}

@media screen and (max-width: 480px) {
  .opinion-articles-grid .wp-block-column {
    flex-basis: 100% !important;
  }
  
  .author-container {
    flex-direction: column;
    align-items: center;
  }
  
  .opinion-author-image {
    margin-bottom: var(--space-xs);
  }
  
  .opinion-author {
    margin-right: 0;
    text-align: center;
    width: 100%;
  }
}


/* ===== _categories-grid.css ===== */
/**
 * === בלוק רשימת קטגוריות ===
 */

/* Wrapper ראשי */
.categories-grid-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
}

/* מיכל רקע */
.category-section.with-background-container .featured-categories-grid {
  background: #f9f9f9;
  padding: 30px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.featured-categories-grid {
  display: grid;
  gap: var(--space-md);
  width: 100%;
  margin-top: var(--space-md);
}

/* התאמה דינמית למספר קטגוריות */
.featured-categories-grid[data-columns="3"] {
  grid-template-columns: repeat(3, 1fr);
}

.featured-categories-grid[data-columns="4"] {
  grid-template-columns: repeat(4, 1fr);
}

.featured-categories-grid[data-columns="5"] {
  grid-template-columns: repeat(5, 1fr);
}

.featured-categories-grid[data-columns="6"] {
  grid-template-columns: repeat(6, 1fr);
}

.category-card {
  position: relative;
  height: 200px;
  overflow: hidden;
  border-radius: 2px;
  transition: var(--transition-default);
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
  background: #fff;
}

/* פינות מעוגלות */
.featured-categories-grid.rounded-corners .category-card {
  border-radius: 8px;
}

/* יחס תמונה דינמי */
.featured-categories-grid[data-aspect-ratio="16:9"] .category-card {
  aspect-ratio: 16 / 9;
  height: auto;
}

.featured-categories-grid[data-aspect-ratio="4:3"] .category-card {
  aspect-ratio: 4 / 3;
  height: auto;
}

.featured-categories-grid[data-aspect-ratio="1:1"] .category-card {
  aspect-ratio: 1 / 1;
  height: auto;
}

.featured-categories-grid[data-aspect-ratio="3:2"] .category-card {
  aspect-ratio: 3 / 2;
  height: auto;
}

.category-card:hover {
  transform: translateY(-5px);
}

.category-card a {
  display: block;
  width: 100%;
  height: 100%;
}

.category-card-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.category-card-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: var(--space-sm);
  background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%);
  color: var(--white);
}

/* ללא מסגרת טקסט */
.featured-categories-grid.no-frame .category-card-overlay {
  background: none;
  position: relative;
  color: var(--primary-text-color);
  padding: var(--space-sm) 0;
}

.featured-categories-grid.no-frame .category-card-title {
  color: var(--primary-text-color);
  background: rgba(255, 255, 255, 0.9);
  padding: 8px 12px;
  border-radius: 4px;
  display: inline-block;
}

.category-card-title {
  font-size: 1.2rem;
  margin-bottom: var(--space-xs);
  color: var(--white);
}

/* סגנון כהה */
.featured-categories-grid.style-dark {
  background: #2a2a2a;
  padding: 30px;
  border-radius: 8px;
}

.featured-categories-grid.style-dark .category-card {
  background: #333;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.featured-categories-grid.style-dark .category-card-overlay {
  background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);
}

.featured-categories-grid.style-dark .category-card-title {
  color: #fff;
}

.featured-categories-grid.style-dark.no-frame .category-card-title {
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
}

/* סגנון בהיר - ברירת מחדל */
.featured-categories-grid.style-light {
  /* כבר מוגדר בעיצוב הבסיסי */
}

/* מיכל רקע משופר */
.category-section.with-background-container {
  padding: 40px 20px;
  background: #f5f5f5;
  border-radius: 12px;
  margin: 40px 0;
}

.category-section.with-background-container .section-title {
  margin-bottom: 30px;
}

/* מיכל רקע עם סגנון כהה */
.category-section.with-background-container .featured-categories-grid.style-dark {
  background: #1a1a1a;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

/* אנימציות והובר אפקטים */
.category-card {
  transition: all 0.3s ease;
}

.category-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

.featured-categories-grid.style-dark .category-card:hover {
  box-shadow: 0 5px 20px rgba(0,0,0,0.4);
}

/* שילוב הגדרות מרובות */
.featured-categories-grid.style-dark.rounded-corners .category-card {
  border-radius: 8px;
  overflow: hidden;
}

.featured-categories-grid.style-dark.no-frame .category-card-overlay {
  background: none;
  padding: 10px;
}

/* התאמות למסכים בינוניים */
@media screen and (max-width: 1200px) {
  .featured-categories-grid[data-columns="5"],
  .featured-categories-grid[data-columns="6"] {
    grid-template-columns: repeat(3, 1fr);
  }
  
  .category-section.with-background-container {
    padding: 30px 15px;
  }
}

/* טאבלטים */
@media screen and (max-width: 768px) {
  body.home .featured-categories-grid,
  .featured-categories-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: var(--space-md) !important;
    width: 100% !important;
  }
  
  /* במובייל - כל הקטגוריות באותו יחס */
  .featured-categories-grid[data-aspect-ratio] .category-card {
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
  }
  
  body.home .category-card,
  .category-card {
    height: auto !important;
  }
  
  /* התאמת מיכל רקע למובייל */
  .category-section.with-background-container {
    padding: 20px 10px;
    border-radius: 8px;
    margin: 20px 0;
  }
  
  /* התאמת סגנון כהה למובייל */
  .featured-categories-grid.style-dark {
    padding: 15px;
  }
}

/* מובייל */
@media screen and (max-width: 480px) {
  body.home .category-card,
  .category-card {
    height: auto !important;
  }
  
  /* במובייל קטן - עמודה אחת לקטגוריות 5-6 */
  .featured-categories-grid[data-columns="5"],
  .featured-categories-grid[data-columns="6"] {
    grid-template-columns: 1fr !important;
  }
  
  .category-card-title {
    font-size: 1rem;
  }
  
  .category-section.with-background-container .section-title {
    font-size: 1.5rem;
    margin-bottom: 20px;
  }
}


/* ===== _posts-horizontal.css ===== */
/**
 * === בלוק רשימת כתבות אופקית ===
 */

/* מיכל עוטף למספר שורות */
.posts-horizontal-wrapper {
  display: flex;
  flex-direction: column;
  /* gap מוגדר inline בתג HTML מהגדרות המשתמש */
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 40px auto; /* הוספת margin תחתון של 40px */
}

/* עקיפת כללי עמוד הבית שמרחיבים ל-100% */
body.home .posts-horizontal-wrapper:not(.full-width-container) {
  max-width: 1200px !important;
  width: auto !important;
}

/* במצב full-width בעמוד הבית */
body.home .posts-horizontal-wrapper.full-width-container {
  max-width: 100vw !important;
  width: 100vw !important;
  margin-bottom: 0 !important; /* ללא מרווח תחתון במצב מלא רוחב */
}

/* מגבלת רוחב גם למיכל ה-section (כולל הכותרת) */
.popular-articles-section.section-container {
  max-width: 1200px;
  margin: 40px auto;
  padding: 0 20px;
}

/* מיכל רקע חיצוני (אופציונלי) */
.posts-horizontal-wrapper.has-background-container:not(.full-width-container) {
  padding: 40px 20px; /* 40px למעלה ולמטה, 20px בצדדים - כמו בבלוק posts-grid-square */
  border-radius: 8px;
}

/* מיכל רקע מלא רוחב */
.posts-horizontal-wrapper.has-background-container.full-width-container {
  width: 100vw;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 0; /* ללא מרווח תחתון במצב מלא רוחב */
  max-width: none;
  border-radius: 0;
  padding: 40px 20px;
  box-sizing: border-box;
}

/* התוכן עצמו צריך להישאר ממורכז ומוגבל ברוחב */
.posts-horizontal-wrapper.full-width-container .posts-horizontal-section {
  max-width: 1200px;
  margin: 0 auto !important;
  padding: 0 !important; /* ללא padding - המרווחים מטופלים ברמת הרכיבים */
}

/* הכותרת במצב מלא רוחב */
.posts-horizontal-wrapper.has-background-container.full-width-container .posts-horizontal-section {
  margin: 0 auto !important;
  padding: 0 !important; /* ללא padding - המרווחים מטופלים ברמת הרכיבים */
}

@media (min-width: 769px) {
    .posts-horizontal-wrapper.has-background-container.full-width-container .posts-horizontal-section .section-title {
        max-width: 1200px;
        margin: 0 auto;
        margin-bottom: var(--space-md);
        padding: 0 20px; /* padding אופקי לכותרת */
        padding-bottom: 0.5rem; /* שמירה על המרווח בין הטקסט לפס כמו בשאר הבלוקים */
        box-sizing: border-box;
    }
    
    /* תיקון מיקום הפס הכחול במצב full-width */
    .posts-horizontal-wrapper.has-background-container.full-width-container .posts-horizontal-section .section-title:after {
        right: 20px; /* התאמת הפס ל-padding של הכותרת */
    }
}

/* הגריד עצמו במצב מלא רוחב */
.posts-horizontal-wrapper.full-width-container .posts-horizontal-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px; /* padding אופקי לכתבות */
}

.posts-horizontal-wrapper.has-border {
  border-style: solid;
}

/* פינות מעוגלות למיכל רקע */
.popular-articles-section.section-container.rounded-container {
  border-radius: 8px;
}

/* מיכל רקע רק במובייל - מוסתר בדסקטופ */
.popular-articles-section.section-container.has-background-mobile-only {
  /* בדסקטופ - ללא רקע ו-padding */
  background: none !important;
  padding: 0 20px !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* עקיפה ספציפית בעמוד הבית עבור ה-section */
body.home .popular-articles-section.section-container {
  max-width: 1200px !important;
  width: auto !important;
  margin: 40px auto !important;
  padding: 0 20px !important;
}

/* שמירת padding מלא כשיש מיכל רקע */
body.home .popular-articles-section.section-container.has-background-container {
  padding: 40px 20px !important; /* 40px למעלה ולמטה, 20px בצדדים */
}

/* התאמת מיכל רק במובייל בדסקטופ */
@media (min-width: 769px) {
  body.home .popular-articles-section.section-container.has-background-mobile-only {
    /* בדסקטופ - קיבול הערכים הרגילים */
    padding: 0 20px !important;
  }
}

/* מיכל הכתבות עם מרווח בין השורות */
.posts-horizontal-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  /* gap מוגדר inline בתג HTML מהגדרות המשתמש */
}

/* גריד הכתבות האופקיות */
.most-read-articles-grid {
  display: flex;
  flex-direction: row;
  gap: var(--space-md);
  width: 100%;
}

/* התאמה דינמית למספר כתבות */
.most-read-articles-grid[data-columns="2"] .wp-block-column {
  flex: 0 0 calc(50% - var(--space-md) / 2);
}

.most-read-articles-grid[data-columns="3"] .wp-block-column {
  flex: 0 0 calc(33.333% - var(--space-md) * 2 / 3);
}

.most-read-articles-grid[data-columns="4"] .wp-block-column {
  flex: 0 0 calc(25% - var(--space-md) * 3 / 4);
}

/* כרטיסיית כתבה - מיכל אחד לתמונה ולטקסט */
.most-read-article {
  display: flex;
  flex-direction: row;
  gap: 0; /* ללא רווח בין התמונה לטקסט */
  width: 100%;
  height: 140px; /* גובה קבוע לכל הכרטיסיות */
  align-items: stretch; /* כדי שהטקסט יתאים לגובה התמונה */
  background: var(--bg-color, #fff);
  transition: all 0.3s ease;
  overflow: hidden;
}

/* מסגרת עדינה (ברירת מחדל) */
.subtle-frame .most-read-article {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* מסגרת רגילה */
.most-read-articles-grid.regular-frame {
  border: none !important; /* וידוא שאין מסגרת על הקונטיינר */
}

.most-read-articles-grid.regular-frame .most-read-article {
  border: var(--frame-border-width, 1px) solid var(--frame-border-color, #e0e0e0) !important;
  box-shadow: none;
}

/* כיוון RTL - תמונה מימין */
.most-read-articles-grid.direction-rtl .most-read-article {
  flex-direction: row-reverse;
}

/* פינות מעוגלות לכרטיסיה */
.most-read-articles-grid.rounded-corners .most-read-article {
  border-radius: 8px;
}

/* Hover effects לפי סגנון מסגרת */
.subtle-frame .most-read-article:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.12);
}

.most-read-articles-grid.regular-frame .most-read-article:hover {
  transform: translateY(-1px);
  border-color: var(--frame-border-color, #999) !important;
  background: var(--bg-color, #fff);
}

.most-read-image {
  margin: 0;
  overflow: hidden;
  position: relative;
  flex-shrink: 0;
  display: block;
  width: 100%; /* המיכל יימתח לרוחב העוגן */
  height: 100%; /* גובה מלא של הכרטיסיה */
}

/* אלמנט העוגן הוא פריט ה-flex בפועל */
.most-read-article > .most-read-image-link {
  display: block;
  height: 100%;
  flex-shrink: 0;
}

/* פינות מעוגלות - רק בצד שמאל לתמונה (LTR) */
.most-read-articles-grid.rounded-corners:not(.direction-rtl) .most-read-image {
  border-radius: 8px 0 0 8px;
}

.most-read-articles-grid.rounded-corners:not(.direction-rtl) .most-read-image img {
  border-radius: 8px 0 0 8px;
}

/* פינות מעוגלות - רק בצד ימין לתמונה (RTL) */
.most-read-articles-grid.rounded-corners.direction-rtl .most-read-image {
  border-radius: 0 8px 8px 0;
}

.most-read-articles-grid.rounded-corners.direction-rtl .most-read-image img {
  border-radius: 0 8px 8px 0;
}

/* איפוס מרווחים לאלמנט figure */
.most-read-image.wp-block-image,
.most-read-image-link,
.most-read-image-link > .most-read-image {
  margin: 0 !important;
  padding: 0 !important;
  width: 100%;
  height: 100%;
}

.most-read-image figure {
  margin: 0;
  width: 100%;
  height: 100% !important;
  display: block;
}

.most-read-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center;
  transition: var(--transition-default);
  display: block;
}

.most-read-article:hover .most-read-image img {
  transform: scale(1.03);
}

.most-read-content {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  justify-content: space-between;
  padding: 12px 16px;
  margin: 0;
  height: 100%;
  overflow: hidden;
}

/* ללא מסגרת - רקע שקוף */
.most-read-articles-grid.no-frame .most-read-article {
  background: transparent;
  box-shadow: none;
  border: none;
}

.most-read-articles-grid.no-frame .most-read-article:hover {
  transform: translateY(-1px);
  box-shadow: none;
  border: none;
}

.most-read-articles-grid.no-frame:not(.direction-rtl) .most-read-content {
  padding: 0 0 0 12px;
}

.most-read-articles-grid.no-frame.direction-rtl .most-read-content {
  padding: 0 12px 0 0;
}

/* פינות מעוגלות לטקסט - רק בצד ימין (LTR) */
.most-read-articles-grid.rounded-corners:not(.direction-rtl) .most-read-content {
  border-radius: 0 8px 8px 0;
}

/* פינות מעוגלות לטקסט - רק בצד שמאל (RTL) */
.most-read-articles-grid.rounded-corners.direction-rtl .most-read-content {
  border-radius: 8px 0 0 8px;
}

/* איפוס מרווחים לכותרת h3 */
.most-read-title,
h3.most-read-title {
  font-size: 1.1rem;
  margin: 0 0 var(--space-xs) 0 !important;
  padding: 0;
  line-height: 1.3;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* חזרה ל-2 שורות */
  -webkit-box-orient: vertical;
}

/* תגית קטגוריה */
.most-read-articles-grid .most-read-content .category-tag,
.most-read-articles-grid .category-tag {
  display: inline-block !important;
  width: auto !important;
  max-width: max-content !important;
  background-color: var(--secondary-color-jhhd-bright) !important;
  color: var(--primary-color-jhhd) !important;
  border: 1px solid var(--primary-color-jhhd) !important;
  padding: 3px 8px; /* הקטנת padding ב-30% */
  border-radius: 3px;
  font-size: 0.7rem !important; /* הקטנת גודל פונט ב-30% (מ-1rem ל-0.7rem) */
  text-decoration: none;
  margin: var(--space-xs) 0;
  margin-right: 0 !important; /* יישור לימין */
  transition: all 0.2s ease;
  line-height: 1.4;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.3px; /* הקטנת letter-spacing ב-30% */
  align-self: flex-start !important;
  white-space: nowrap;
}

.most-read-articles-grid .most-read-content .category-tag:hover,
.most-read-articles-grid .category-tag:hover {
  background-color: var(--primary-color-jhhd) !important;
  color: #fff !important;
  border-color: var(--primary-color-jhhd) !important;
  transform: translateY(-1px);
}

.most-read-excerpt {
  display: none;
  font-size: 1rem;
  margin-bottom: var(--space-xs);
}

.most-read-articles-grid .most-read-meta,
.most-read-content .most-read-meta {
  font-size: 0.7rem !important; /* הקטנת גודל פונט ב-30% (מ-1rem ל-0.7rem) */
  color: #666 !important;
  margin-top: auto !important; /* דחיפה לתחתית */
  margin-bottom: 0;
  padding-bottom: 2px;
  line-height: 1.4;
}

.most-read-articles-grid .most-read-meta .separator,
.most-read-content .most-read-meta .separator {
  margin: 0 5px;
  color: #ccc !important;
}

.most-read-articles-grid .most-read-meta .date,
.most-read-content .most-read-meta .date {
  color: #888 !important;
}

/* התאמות למסכים בינוניים */
@media screen and (max-width: 1200px) {
  .most-read-articles-grid[data-columns="4"] .wp-block-column {
    flex-basis: 48% !important;
  }
  
  .most-read-article {
    height: 120px; /* גובה קטן יותר למסכים בינוניים */
  }
  
  .most-read-image {
    width: 160px; /* רוחב קטן יותר */
  }
  
  .most-read-articles-grid[data-aspect-ratio="16:9"] .most-read-image {
    width: 180px;
  }
  
  .most-read-articles-grid[data-aspect-ratio="1:1"] .most-read-image {
    width: 120px;
  }
  
  /* שמירת margin תחתון גם במסכים בינוניים */
  .posts-horizontal-wrapper {
    margin-bottom: 35px !important;
  }
}

/* טאבלטים */
@media screen and (max-width: 768px) {
  /* מיכל רקע מלא רוחב בטאבלט */
  .posts-horizontal-wrapper.has-background-container.full-width-container {
    padding: 30px 0;
  }
  
  body.home .posts-horizontal-wrapper.has-background-container.full-width-container {
    width: 100vw !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    margin-left: calc(-1 * (100vw - 100%) / 2) !important;
    margin-right: calc(-1 * (100vw - 100%) / 2) !important;
    margin-bottom: 0 !important; /* ללא מרווח תחתון במצב מלא רוחב */
    padding: 30px 15px !important;
    border-radius: 0;
    box-sizing: border-box !important;
    transform: none !important; /* ביטול ה-transform מהדסקטופ */
  }
  
  .posts-horizontal-wrapper.full-width-container .posts-horizontal-section {
    padding: 0 15px;
  }
  
  .posts-horizontal-wrapper.full-width-container .posts-horizontal-container {
    padding: 0;
  }
  
  /* מיכל רקע רק במובייל - מפעיל בטאבלט */
  .popular-articles-section.section-container.has-background-mobile-only {
    padding: 25px 15px !important;
    background-color: var(--mobile-bg-color, #f5f5f5) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
    border-radius: 6px !important;
    box-sizing: border-box;
    max-width: calc(100% - 20px);
    margin: 20px auto;
  }
  
  body.home .popular-articles-section.section-container.has-background-mobile-only {
    padding: 25px 15px !important;
  }
  
  /* ביטול ה-padding הכפול כשיש מיכל רקע רק במובייל */
  .popular-articles-section.section-container.has-background-mobile-only .posts-horizontal-wrapper,
  body.home .popular-articles-section.section-container.has-background-mobile-only .posts-horizontal-wrapper {
    padding: 0 !important; /* ביטול padding כפול כשיש כבר padding במיכל החיצוני */
  }
  
  /* פינות מעוגלות למיכל בטאבלט */
  .popular-articles-section.section-container.has-background-mobile-only.rounded-container {
    border-radius: 8px !important;
  }
  
  /* אם אין פינות מעוגלות */
  .popular-articles-section.section-container.has-background-mobile-only:not(.rounded-container) {
    border-radius: 0 !important;
  }
  
  .most-read-articles-grid {
    flex-wrap: wrap;
  }
  
  /* 2 בשורה בטאבלט */
  .most-read-articles-grid[data-columns="3"] .wp-block-column,
  .most-read-articles-grid[data-columns="4"] .wp-block-column {
    flex-basis: 48% !important;
  }
  
  .most-read-article {
    height: 110px; /* גובה קטן יותר לטאבלטים */
  }
  
  .most-read-image {
    width: 140px;
  }
  
  /* שמירת margin תחתון גם בטאבלט */
  .posts-horizontal-wrapper {
    margin-bottom: 35px !important;
  }
}

/* סגנון כהה */
.most-read-articles-grid.style-dark {
  --bg-color: #2a2a2a;
  --text-color: #ffffff;
  --meta-color: #cccccc;
  --separator-color: #666666;
}

.most-read-articles-grid.style-dark .most-read-article {
  background: var(--bg-color);
}

/* מסגרת רגילה בסגנון כהה */
.most-read-articles-grid.style-dark.regular-frame {
  border: none !important; /* וידוא שאין מסגרת על הקונטיינר */
}

.most-read-articles-grid.style-dark.regular-frame .most-read-article {
  border: var(--frame-border-width, 1px) solid var(--frame-border-color, rgba(255, 255, 255, 0.2)) !important;
}

.most-read-articles-grid.style-dark.regular-frame .most-read-article:hover {
  border-color: var(--frame-border-color, rgba(255, 255, 255, 0.4)) !important;
}

.most-read-articles-grid.style-dark .most-read-title,
.most-read-articles-grid.style-dark .most-read-title a {
  color: var(--text-color);
}

.most-read-articles-grid.style-dark .most-read-excerpt {
  color: var(--meta-color);
}

.most-read-articles-grid.style-dark .most-read-meta {
  color: var(--meta-color) !important;
}

.most-read-articles-grid.style-dark .most-read-meta .separator {
  color: var(--separator-color) !important;
}

.most-read-articles-grid.style-dark .most-read-meta .date {
  color: var(--meta-color) !important;
}

.most-read-articles-grid.style-dark .category-tag {
  background-color: var(--secondary-color-jhhd-bright) !important;
  color: var(--primary-color-jhhd) !important;
  border: 1px solid var(--primary-color-jhhd) !important;
}

.most-read-articles-grid.style-dark .category-tag:hover {
  background-color: var(--primary-color-jhhd) !important;
  color: #fff !important;
  border-color: var(--primary-color-jhhd) !important;
}

/* סגנון בהיר (ברירת מחדל) */
.most-read-articles-grid.style-light {
  --bg-color: #ffffff;
  --text-color: #333333;
  --meta-color: #666666;
  --separator-color: #cccccc;
}

.most-read-articles-grid.style-light .most-read-article {
  background: var(--bg-color);
}

/* תגיות קטגוריה במצב בהיר - רקע שקוף */
.most-read-articles-grid.style-light .category-tag {
  background-color: transparent !important;
}

.most-read-articles-grid.style-light .category-tag:hover {
  background-color: var(--primary-color-jhhd) !important;
  color: #fff !important;
  border-color: var(--primary-color-jhhd) !important;
}

/* כותרת במצב בהיר - צבע secondary-color-jhhd */
.most-read-articles-grid.style-light .most-read-title,
.most-read-articles-grid.style-light .most-read-title a {
  color: var(--secondary-color-jhhd) !important;
  transition: color 0.3s ease;
}

/* כותרת במצב בהיר - צבע primary-color-jhhd בריחוף - specificity מוגברת */
.most-read-articles-grid.style-light .most-read-article .most-read-content .most-read-title a:hover,
.most-read-articles-grid.style-light .most-read-article:hover .most-read-content .most-read-title a,
.most-read-articles-grid.style-light .most-read-title a:hover {
  color: var(--primary-color-jhhd) !important;
}

/* יחסי תמונה - ברירת מחדל וספציפיים (על פריט ה-flex: העוגן) */
/* 16:9 - ברירת מחדל */
.most-read-articles-grid .most-read-image-link {
  aspect-ratio: 16 / 9;
  height: 100% !important;
  flex-basis: calc(140px * (16/9));
}

/* נתמך על ידי data-aspect-ratio ברמת המיכל */
.most-read-articles-grid[data-aspect-ratio="1:1"] .most-read-image-link {
  aspect-ratio: 1 / 1;
  height: 100% !important;
  flex-basis: 140px; /* שווה לגובה הכרטיסיה */
}

.most-read-articles-grid[data-aspect-ratio="3:2"] .most-read-image-link {
  aspect-ratio: 3 / 2;
  height: 100% !important;
  flex-basis: calc(140px * (3/2));
}

.most-read-articles-grid[data-aspect-ratio="4:3"] .most-read-image-link {
  aspect-ratio: 4 / 3;
  height: 100% !important;
  flex-basis: calc(140px * (4/3));
}

.most-read-articles-grid[data-aspect-ratio="16:9"] .most-read-image-link {
  aspect-ratio: 16 / 9;
  height: 100% !important;
  flex-basis: calc(140px * (16/9));
}

/* מובייל */
@media screen and (max-width: 480px) {
  /* מיכל רקע מלא רוחב במובייל */
  .posts-horizontal-wrapper.has-background-container.full-width-container {
    padding: 20px 10px !important;
  }
  
  body.home .posts-horizontal-wrapper.has-background-container.full-width-container {
    width: 100vw !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    margin-left: calc(-1 * (100vw - 100%) / 2) !important;
    margin-right: calc(-1 * (100vw - 100%) / 2) !important;
    margin-bottom: 0 !important; /* ללא מרווח תחתון במצב מלא רוחב */
    transform: none !important;
  }
  
  /* התאמת המיכל העוטף למובייל */
  .posts-horizontal-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    /* gap כבר מוגדר inline בתג HTML אבל נדרוס אותו למובייל */
    gap: 0 !important;
    margin-bottom: 30px !important; /* שמירת margin תחתון גם במובייל */
  }
  
  /* מרווח בין שורות (כל שורה היא most-read-articles-grid) */
  .posts-horizontal-wrapper .most-read-articles-grid:not(:last-child) {
    margin-bottom: 10px !important; /* אותו מרווח כמו בין הכתבות - לשנות ביחד עם שורה 438 */
  }
  
  /* התאמת כל שורת כתבות למובייל */
  .most-read-articles-grid {
    flex-direction: column !important; /* שינוי לכיוון אנכי */
    width: 100% !important;
    gap: 0px !important; /* רווח בין כתבות - ניתן לשינוי בקלות */
  }
  
  .most-read-articles-grid .wp-block-column {
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
    margin: 0 !important; /* איפוס margin */
    padding: 0 !important; /* איפוס padding */
  }
  
  /* רווח בין כתבות - שימוש ב-margin-bottom במקום gap */
  .most-read-articles-grid .wp-block-column:not(:last-child) {
    margin-bottom: 10px !important; /* רווח בין כתבות - לשנות ביחד עם שורה 418 (רווח בין שורות) */
  }
  
  /* איפוס כללי של margins לכל הכרטיסיות */
  .most-read-articles-grid .most-read-article {
    margin: 0 !important;
  }
  
  /* === כתבה ראשונה - פריסה אנכית (תמונה מעל, טקסט מתחת) === */
  .most-read-articles-grid .wp-block-column:first-child .most-read-article {
    flex-direction: column !important;
    height: auto !important;
    width: 100% !important;
  }
  
  .most-read-articles-grid .wp-block-column:first-child .most-read-image-link {
    aspect-ratio: unset !important;
    flex-basis: unset !important;
    width: 100% !important;
    height: 200px !important;
  }
  
  .most-read-articles-grid .wp-block-column:first-child .most-read-image {
    width: 100% !important;
    height: 200px !important;
    margin: 0;
  }
  
  .most-read-articles-grid .wp-block-column:first-child .most-read-content {
    width: 100%;
    padding: 12px !important;
    height: auto;
  }
  
  /* פינות מעוגלות לכתבה הראשונה */
  .most-read-articles-grid.rounded-corners .wp-block-column:first-child .most-read-image,
  .most-read-articles-grid.rounded-corners .wp-block-column:first-child .most-read-image img {
    border-radius: 8px 8px 0 0 !important;
  }
  
  .most-read-articles-grid.rounded-corners .wp-block-column:first-child .most-read-content {
    border-radius: 0 0 8px 8px !important;
  }
  
  /* === כל שאר הכתבות - פריסה אופקית (תמונה לצד טקסט) === */
  .most-read-articles-grid .wp-block-column:not(:first-child) .most-read-article {
    flex-direction: row !important; /* תמונה לצד טקסט */
    height: 100px !important; /* גובה קבוע לפריסה אופקית */
    width: 100% !important;
  }
  
  /* עבור כיוון RTL - הפוך את הסדר */
  .most-read-articles-grid.direction-rtl .wp-block-column:not(:first-child) .most-read-article {
    flex-direction: row-reverse !important;
  }
  
  .most-read-articles-grid .wp-block-column:not(:first-child) .most-read-image-link {
    aspect-ratio: 1 / 1 !important; /* ריבוע */
    flex-basis: 100px !important; /* רוחב קבוע */
    width: 100px !important;
    height: 100px !important;
    flex-shrink: 0;
  }
  
  .most-read-articles-grid .wp-block-column:not(:first-child) .most-read-image {
    width: 100px !important;
    height: 100px !important;
    margin: 0;
  }
  
  .most-read-articles-grid .wp-block-column:not(:first-child) .most-read-content {
    flex: 1;
    padding: 8px 12px !important;
    height: 100%;
    overflow: hidden;
  }
  
  /* הקטנת גודל הכותרת בכתבות האופקיות */
  .most-read-articles-grid .wp-block-column:not(:first-child) .most-read-title {
    font-size: 1rem;
    -webkit-line-clamp: 2;
  }
  
  /* הסתרת תג הקטגוריה בכתבות האופקיות במובייל */
  .most-read-articles-grid .wp-block-column:not(:first-child) .category-tag {
    display: none !important;
  }
  
  /* פינות מעוגלות לכתבות האופקיות */
  .most-read-articles-grid.rounded-corners:not(.direction-rtl) .wp-block-column:not(:first-child) .most-read-image,
  .most-read-articles-grid.rounded-corners:not(.direction-rtl) .wp-block-column:not(:first-child) .most-read-image img {
    border-radius: 8px 0 0 8px !important;
  }
  
  .most-read-articles-grid.rounded-corners:not(.direction-rtl) .wp-block-column:not(:first-child) .most-read-content {
    border-radius: 0 8px 8px 0 !important;
  }
  
  /* פינות מעוגלות לכתבות האופקיות - כיוון RTL */
  .most-read-articles-grid.rounded-corners.direction-rtl .wp-block-column:not(:first-child) .most-read-image,
  .most-read-articles-grid.rounded-corners.direction-rtl .wp-block-column:not(:first-child) .most-read-image img {
    border-radius: 0 8px 8px 0 !important;
  }
  
  .most-read-articles-grid.rounded-corners.direction-rtl .wp-block-column:not(:first-child) .most-read-content {
    border-radius: 8px 0 0 8px !important;
  }
  
  /* ללא מסגרת במובייל */
  .most-read-articles-grid.no-frame .wp-block-column:first-child .most-read-content {
    padding: 12px 0 !important;
  }
  
  .most-read-articles-grid.no-frame:not(.direction-rtl) .wp-block-column:not(:first-child) .most-read-content {
    padding: 0 0 0 8px !important;
  }
  
  .most-read-articles-grid.no-frame.direction-rtl .wp-block-column:not(:first-child) .most-read-content {
    padding: 0 8px 0 0 !important;
  }
  
  /* התאמת המיכל החיצוני במובייל */
  .popular-articles-section.section-container {
    max-width: 100% !important;
    padding: 0 15px !important;
    margin: 20px auto 0 !important; /* הסרת margin תחתון */
  }
  
  body.home .popular-articles-section.section-container {
    max-width: 100% !important;
    padding: 0 15px !important;
    margin-bottom: 0 !important; /* הסרת margin תחתון */
  }
  
  /* שמירת padding כשיש מיכל רקע */
  body.home .popular-articles-section.section-container.has-background-container {
    padding: 20px 15px !important;
    margin-bottom: 0 !important; /* הסרת margin תחתון גם למיכל עם רקע */
  }

  /* תיקון עקיפת המרווחים במיכל הפנימי - הוספת מרווח לכתבות עצמן */
  .posts-horizontal-wrapper {
    padding: 0 15px !important; /* הוספת padding פנימי כדי שהכתבות לא יהיו צמודות לקצה */
  }
  
  /* ביטול ה-padding הכפול כשיש מיכל רקע */
  .popular-articles-section.section-container.has-background-container .posts-horizontal-wrapper,
  body.home .popular-articles-section.section-container.has-background-container .posts-horizontal-wrapper {
    padding: 0 !important; /* ביטול padding כפול כשיש כבר padding במיכל החיצוני */
  }
  

  
  /* הסרת margin תחתון מכל בלוקי עמוד הבית במובייל */
  body.home .wp-block-group.section-container {
    margin: 20px auto !important;
  }
}


/* ===== _posts-grid-square.css ===== */
/* בלוק רשימת כתבות עם תמונות מרובעות */

/* Wrapper ראשי להגבלת רוחב */
.posts-grid-square-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    transition: all 0.3s ease;
}

/* מיכל רקע */
.posts-grid-square-wrapper.has-background-container {
    padding: 40px 20px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    box-sizing: border-box; /* padding נספר בתוך מגבלת הרוחב */
    max-width: 1200px;      /* המיכל עצמו מוגבל ל-1200px */
    margin: 0 auto;      /* יישור כמו section */
}

/* מסגרת למיכל */
.posts-grid-square-wrapper.has-border {
    border-style: solid;
}

/* פינות מעוגלות למיכל רקע - לא למיכל רוחב מלא */
.posts-grid-square-wrapper.rounded-container:not(.full-width-container) {
    border-radius: 8px;
}

/* מיכל רקע רק במובייל - מוסתר בדסקטופ */
.posts-grid-square-wrapper.has-background-mobile-only {
    /* בדסקטופ - ללא רקע ו-padding */
    background: none !important;
    padding: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* מיכל רקע ברוחב מלא */
.posts-grid-square-wrapper.has-background-container.full-width-container {
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-left: 0;
    margin-right: 0;
    max-width: none;
    border-radius: 0;
    padding: 40px 20px;
    box-sizing: border-box;
}

/* התאמת התוכן הפנימי במיכל רוחב מלא */
.posts-grid-square-wrapper.full-width-container .posts-grid-square-section {
    max-width: 1200px;
    margin: 0 auto !important;
    padding: 0 20px;
}

/* התאמת section במיכל רוחב מלא */
.posts-grid-square-wrapper.has-background-container.full-width-container .posts-grid-square-section {
    margin: 0 auto !important;
    padding: 0 !important;
}

/* תיקון יישור הכותרת במיכל רוחב מלא - רק בדסקטופ */
@media (min-width: 769px) {
    .posts-grid-square-wrapper.has-background-container.full-width-container .posts-grid-square-section .section-title {
        max-width: 1200px;
        margin: 0 auto;
        margin-bottom: var(--space-md);
        padding: 0 20px;
        padding-bottom: 0.5rem; /* שמירה על המרווח המקורי בין הטקסט לפס */
        box-sizing: border-box;
    }
    
    /* תיקון יישור הפס מתחת לכותרת במיכל רוחב מלא */
    .posts-grid-square-wrapper.has-background-container.full-width-container .posts-grid-square-section .section-title:after {
        right: 20px;
    }
}

/* וידוא שה-container עצמו ממורכז */
.posts-grid-square-wrapper.full-width-container .posts-grid-square-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* עוקף את הכללים הגלובליים של עמוד הבית */
body.home .posts-grid-square-wrapper:not(.full-width-container) {
    max-width: 1200px !important;
    width: auto !important;
}

/* מיכל ברוחב מלא - עוקף הגבלות */
body.home .posts-grid-square-wrapper.full-width-container {
    max-width: none !important;
    width: 100vw !important;
}

/* התאמה כשיש מיכל רקע רגיל (לא רוחב מלא) */
body.home .posts-grid-square-wrapper.has-background-container:not(.full-width-container) {
    max-width: 1200px !important; /* המיכל עצמו מוגבל, ה-padding בתוך ה-1200 */
    width: auto !important;
}

body.home .posts-grid-square-section {
    margin: 0 auto !important;
    padding: 0 20px !important;
    width: auto !important;
}

/* התאמה כשיש מיכל רקע רגיל (לא רוחב מלא) */
.posts-grid-square-wrapper.has-background-container:not(.full-width-container) .posts-grid-square-section {
    margin: 0 !important;
    padding: 0 !important;
}

/* התאמת section כשהמיכל רק במובייל - בדסקטופ */
@media (min-width: 769px) {
    .posts-grid-square-wrapper.has-background-mobile-only .posts-grid-square-section {
        /* בדסקטופ - חוזר להתנהגות רגילה */
        margin: 0 auto !important;
        padding: 0 20px !important;
    }
}

/* התאמת section כשהמיכל רק במובייל - במובייל */
@media (max-width: 768px) {
    .posts-grid-square-wrapper.has-background-mobile-only .posts-grid-square-section {
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* מיכל רקע ברוחב מלא במובייל - פתרון פשוט */
    body.home .posts-grid-square-wrapper.has-background-container.full-width-container {
        width: 100vw !important;
        position: static !important;
        left: auto !important;
        right: auto !important;
        margin-left: calc(-1 * (100vw - 100%) / 2) !important;
        margin-right: calc(-1 * (100vw - 100%) / 2) !important;
        padding: 20px 15px !important; /* הוספת padding אופקי למיכל עצמו */
        border-radius: 0;
        box-sizing: border-box !important;
        transform: none !important; /* ביטול ה-transform מהדסקטופ */
    }
    
    body.home .posts-grid-square-wrapper.full-width-container .posts-grid-square-section {
        padding: 0 !important; /* ביטול padding כי הוא כבר במיכל */
        max-width: 100%;
        margin: 0 auto;
    }
    
    body.home .posts-grid-square-wrapper.full-width-container .posts-grid-square-container {
        padding: 0;
        width: 100%;
        max-width: 100%;
    }
}

.posts-grid-square-section {
    margin: 0 auto;
    padding: 0 20px;
    max-width: 1200px;
}

/* הכותרת משתמשת בעיצוב המשותף מקובץ _homepage-common.css */

/* קונטיינר הגריד */
.posts-grid-square-container {
    display: grid;
    gap: 30px;
    margin: 0 auto;
}

/* וידוא שאין מסגרת על המיכל בכל מצב, במיוחד ב-regular-frame */
.posts-grid-square-container,
.posts-grid-square-container.regular-frame,
.posts-grid-square-container.style-dark.regular-frame {
    border: none !important;
    outline: none !important;
    box-shadow: none;
}

/* הגדרת מספר עמודות לפי data attribute */
.posts-grid-square-container[data-columns="3"] {
    grid-template-columns: repeat(3, 1fr);
}

.posts-grid-square-container[data-columns="4"] {
    grid-template-columns: repeat(4, 1fr);
}

.posts-grid-square-container[data-columns="5"] {
    grid-template-columns: repeat(5, 1fr);
}

.posts-grid-square-container[data-columns="6"] {
    grid-template-columns: repeat(6, 1fr);
}

/* כרטיסיית כתבה */
.article-card-square {
    background: var(--cards-bg-color, #fff);
    overflow: hidden;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* מסגרת עדינה (ברירת מחדל) */
.subtle-frame .article-card-square {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* מסגרת רגילה */
.regular-frame .article-card-square {
    border: var(--frame-border-width, 1px) solid var(--frame-border-color, #e0e0e0);
    box-shadow: none;
}

/* פינות מעוגלות */
.rounded-corners .article-card-square {
    border-radius: 8px;
}

.rounded-corners .square-image-container {
    border-radius: 8px 8px 0 0;
}

/* Hover effects לפי סגנון מסגרת */
.subtle-frame .article-card-square:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.12);
}

.regular-frame .article-card-square:hover {
    transform: translateY(-3px);
    border-color: var(--frame-border-color, #c0c0c0);
    background: var(--cards-bg-color, #fff);
    filter: brightness(0.9);
}

/* קונטיינר לתמונה */
.square-image-container {
    position: relative;
    width: 100%;
    aspect-ratio: var(--aspect-ratio, 1 / 1); /* יחס דינמי עם ברירת מחדל 1:1 */
    overflow: hidden;
    background-color: #f0f0f0;
}

.square-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* חיתוך התמונה למילוי הריבוע */
    object-position: center; /* מרכוז התמונה */
    transition: transform 0.3s ease;
}

.article-card-square:hover .square-image-container img {
    transform: scale(1.05);
}

/* תוכן הכתבה */
.article-content {
    padding: 20px 20px 0px 20px; /* ביטול המרווח התחתון לחלוטין */
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

/* תגית קטגוריה */
.posts-grid-square-container .category-tag {
    display: inline-block;
    background-color: transparent !important;
    color: var(--primary-color-jhhd) !important;
    border: 1px solid var(--primary-color-jhhd) !important;
    padding: 3px 8px; /* הקטנת הpadding פרופורציונלית לגודל הפונט */
    border-radius: 3px;
    font-size: 0.7rem; /* הקטנת הגודל ב-30% (70% מהמקורי) */
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px; /* הקטנת המרווח בין האותיות פרופורציונלית */
    margin-bottom: 20px; /* הכפלת המרווח מ-10px ל-20px */
    text-decoration: none;
    transition: all 0.2s ease;
    align-self: flex-start; /* יישור לימין בגלל שהאתר בעברית */
}

.posts-grid-square-container .category-tag:hover {
    background-color: var(--primary-color-jhhd) !important;
    color: #fff !important;
    border-color: var(--primary-color-jhhd) !important;
    transform: translateY(-1px);
}

.article-card-square .article-title {
    font-size: 1.1rem;
    font-weight: 600;
    line-height: 1.4;
    margin: 0 0 12px 0;
    color: var(--secondary-color-jhhd, #8B4513);
    transition: color 0.2s ease;
    
    /* גובה קבוע של 3 שורות */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 4.2em; /* 3 שורות * 1.4 line-height */
}

.article-card-square a {
    text-decoration: none;
    color: inherit;
}

.article-card-square a:hover .article-title {
    color: var(--primary-color, #0073aa);
}

/* מטא-דאטה - מחבר ותאריך */
.posts-grid-square-container .article-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: #666;
    margin-top: 8px;
    margin-bottom: 10px; /* ריווח של 10px בתחתית */
    line-height: 1.2;
    flex-wrap: nowrap; /* וידוא שהתוכן נשאר בשורה אחת */
}

.posts-grid-square-container .article-meta .author-name {
    font-weight: 500;
    color: #888; /* התאמה לצבע התאריך */
    white-space: nowrap; /* מונע שבירת שורה */
}

.posts-grid-square-container .article-meta .meta-separator {
    color: #ccc;
    margin: 0 2px;
    flex-shrink: 0; /* מונע התכווצות */
}

.posts-grid-square-container .article-meta .publish-date {
    color: #888;
    white-space: nowrap; /* מונע שבירת שורה */
}

/* כרטיסיות placeholder */
.article-card-square.placeholder {
    opacity: 0.5;
    pointer-events: none;
}

.article-card-square.placeholder .square-image-container {
    background-color: #e0e0e0;
}

.article-card-square.placeholder img {
    opacity: 0.3;
}

/* רספונסיביות */
@media (max-width: 1024px) {
    .posts-grid-square-container[data-columns="6"] {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .posts-grid-square-container[data-columns="5"] {
        grid-template-columns: repeat(4, 1fr);
    }
    
    /* התאמת מיכל רקע בטאבלט */
    .posts-grid-square-wrapper.has-background-container {
        padding: 30px 15px;
    }
}

@media (max-width: 768px) {
    .posts-grid-square-container[data-columns="6"],
    .posts-grid-square-container[data-columns="5"],
    .posts-grid-square-container[data-columns="4"] {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .posts-grid-square-container {
        gap: 20px;
    }
    
    .article-card-square .article-title {
        font-size: 1rem;
    }
    
    /* התאמת מיכל רקע במובייל */
    .posts-grid-square-wrapper.has-background-container {
        padding: 25px 12px;
        border-radius: 6px;
    }
    
    /* מיכל רקע רק במובייל - מפעיל במובייל */
    .posts-grid-square-wrapper.has-background-mobile-only {
        padding: 25px 12px !important;
        background-color: var(--mobile-bg-color, #f5f5f5) !important;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
        border-radius: 6px !important;
        box-sizing: border-box;
        max-width: calc(100% - 20px);
        margin: 0 auto;
    }
    
    /* פינות מעוגלות למיכל במובייל */
    .posts-grid-square-wrapper.has-background-mobile-only.rounded-container {
        border-radius: 8px !important;
    }
    
    /* אם אין פינות מעוגלות */
    .posts-grid-square-wrapper.has-background-mobile-only:not(.rounded-container) {
        border-radius: 0 !important;
    }
    
    body.home .posts-grid-square-wrapper.has-background-container {
        max-width: calc(100% - 20px) !important;
        margin: 0 auto !important;
    }
}

@media (max-width: 600px) {
    .posts-grid-square-container[data-columns="6"],
    .posts-grid-square-container[data-columns="5"],
    .posts-grid-square-container[data-columns="4"],
    .posts-grid-square-container[data-columns="3"] {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* התאמת מיכל רקע רק במובייל במסכים קטנים */
    .posts-grid-square-wrapper.has-background-mobile-only {
        padding: 20px 10px !important;
        max-width: calc(100% - 10px);
        margin: 0 auto;
    }
    
    /* מרווחים למיכל רוחב מלא במובייל קטן */
    body.home .posts-grid-square-wrapper.has-background-container.full-width-container {
        padding: 20px 10px !important; /* padding קטן יותר במסכים קטנים */
    }
    
    /* התאמת פינות מעוגלות במסכים קטנים */
    .posts-grid-square-wrapper.has-background-mobile-only.rounded-container {
        border-radius: 6px !important;
    }
    
    /* הכתבה הראשונה תופסת את כל הרוחב במובייל */
    .posts-grid-square-container .grid-item:first-child {
        grid-column: span 2;
    }
    
    /* עיצוב ייחודי לכתבה הראשונה במובייל */
    .posts-grid-square-container.subtle-frame .grid-item:first-child .article-card-square {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }
    
    .posts-grid-square-container.regular-frame .grid-item:first-child .article-card-square {
        border-width: calc(var(--frame-border-width, 1px) + 1px);
        border-color: var(--frame-border-color, #d0d0d0);
    }
    
    /* תמונה גדולה יותר לכתבה הראשונה */
    .posts-grid-square-container .grid-item:first-child .square-image-container {
        aspect-ratio: 16 / 9; /* יחס רחב יותר לכתבה הראשונה */
    }
    
    /* הגדלת הכותרת של הכתבה הראשונה */
    .posts-grid-square-container .grid-item:first-child .article-title {
        font-size: 1.4rem;
        font-weight: 700;
        -webkit-line-clamp: 4; /* 4 שורות בכתבה הראשונה במובייל */
        min-height: auto; /* ביטול גובה מינימלי שיצר מרווח מיותר */
        margin-bottom: 8px; /* הקטנת המרווח התחתון משמעותית */
    }
    
    /* הגדלת התוכן של הכתבה הראשונה */
    .posts-grid-square-container .grid-item:first-child .article-content {
        padding: 20px 20px 0px 20px; /* ביטול המרווח התחתון לחלוטין */
    }
    
    /* תגית קטגוריה גדולה יותר בכתבה הראשונה */
    .posts-grid-square-container .grid-item:first-child .category-tag {
        font-size: 0.7rem; /* הקטנת הגודל ב-30% גם בכתבה הראשונה במובייל */
        padding: 3px 10px; /* הקטנת הpadding פרופורציונלית */
        margin-bottom: 20px; /* שמירה על המרווח המוכפל גם בכתבה הראשונה במובייל */
    }
    
    /* מטא-דאטה בכתבה הראשונה במובייל */
    .posts-grid-square-container .grid-item:first-child .article-meta {
        font-size: 0.72rem; /* הקטנה ב-20% מ-0.9rem */
        margin-top: 12px;
        gap: 10px;
    }
    
    .posts-grid-square-container .grid-item:first-child .article-meta .author-name {
        font-weight: 600;
    }
    
    /* הסתרת הכתבה האחרונה כאשר יש מספר זוגי של כתבות (ללא הראשונה) */
    .posts-grid-square-container.hide-last-mobile .grid-item:last-child {
        display: none;
    }
    
    .posts-grid-square-container {
        gap: 10px; /* הקטנת הרווח בין הכרטיסיות במובייל */
    }
    
    .posts-grid-square-container .article-content {
        padding: 15px;
        padding-bottom: 0px; /* ביטול המרווח התחתון לחלוטין */
    }
    
    /* הקטנת padding לכרטיסיות הקטנות (לא הראשונה) */
    .posts-grid-square-container .grid-item:not(:first-child) .article-content {
        padding: 12px 10px 0px 10px; /* ביטול המרווח התחתון לחלוטין */
    }
    
    /* מטא-דאטה בכרטיסיות הקטנות במובייל */
    .posts-grid-square-container .grid-item:not(:first-child) .article-meta {
        font-size: 0.6rem; /* הקטנה ב-20% מ-0.75rem */
        margin-top: 6px;
        gap: 6px;
    }
    
    /* התאמות נוספות למסכים קטנים במיוחד (אייפון SE וכדומה) */
    @media (max-width: 380px) {
        .posts-grid-square-container {
            gap: 8px; /* רווח קטן עוד יותר */
        }
        
        .posts-grid-square-container .grid-item:not(:first-child) .article-content {
            padding: 10px 8px 0px 8px; /* ביטול המרווח התחתון לחלוטין */
        }
        
        .posts-grid-square-container .grid-item:not(:first-child) .article-title {
            font-size: 1rem; /* כותרת קטנה יותר */
        }
        
        .posts-grid-square-container .grid-item:not(:first-child) .category-tag {
            font-size: 0.5rem; /* הקטנת הגודל ב-30% (70% מ-0.7rem) */
            padding: 2px 6px; /* הקטנת הpadding פרופורציונלית */
            margin-bottom: 16px; /* הכפלת המרווח גם בכרטיסיות הקטנות */
        }
        
        /* מטא-דאטה במסכים קטנים מאוד */
        .posts-grid-square-container .grid-item:not(:first-child) .article-meta {
            font-size: 0.56rem; /* הקטנה ב-20% מ-0.7rem */
            margin-top: 4px;
            gap: 4px;
        }
        
        .posts-grid-square-container .grid-item:first-child .article-meta {
            font-size: 0.68rem; /* הקטנה ב-20% מ-0.85rem */
            margin-top: 8px;
            gap: 8px;
        }
        
        /* וודא שהכרטיסיות לא גולשות */
        .posts-grid-square-container .grid-item {
            min-width: 0; /* מאפשר לכרטיסיות להתכווץ */
        }
        
        .posts-grid-square-wrapper {
            overflow-x: hidden; /* מונע גלילה אופקית */
        }
    }
    
    /* התאמת מיכל רקע במסכים קטנים */
    .posts-grid-square-wrapper.has-background-container {
        padding: 20px 10px;
    }
    
    /* התאמת מיכל רקע רק במובייל במסכים קטנים מאוד */
    .posts-grid-square-wrapper.has-background-mobile-only {
        padding: 18px 10px !important;
    }
}

@media (max-width: 300px) {
    /* רק במסכים קטנים במיוחד - עמודה אחת */
    .posts-grid-square-container {
        grid-template-columns: 1fr !important;
        gap: 20px;
    }
    
    /* במסכים קטנים מאוד, הכתבה הראשונה כבר תופסת את כל הרוחב בגלל עמודה אחת */
    .posts-grid-square-container .grid-item:first-child {
        grid-column: span 1; /* ביטול ה-span 2 מה-media query הקודם */
    }
    
    /* הסתרת הכתבה האחרונה במסכים קטנים מאוד - אותה לוגיקה */
    .posts-grid-square-container.hide-last-mobile .grid-item:last-child {
        display: none;
    }
    
    /* מטא-דאטה במסכים קטנים מאוד (מתחת ל-300px) */
    .posts-grid-square-container .article-meta {
        font-size: 0.6rem; /* הקטנה ב-20% מ-0.75rem */
        margin-top: 6px;
        gap: 6px;
    }
    
    /* התאמת מיכל רקע במסכים קטנים מאוד */
    .posts-grid-square-wrapper.has-background-container {
        padding: 15px 8px;
        border-radius: 4px;
    }
    
    /* התאמת מיכל רקע רק במובייל במסכים קטנים מאוד */
    .posts-grid-square-wrapper.has-background-mobile-only {
        padding: 15px 8px !important;
        max-width: calc(100% - 10px) !important;
        margin: 0 auto !important;
    }
    
    /* התאמת פינות מעוגלות במסכים קטנים מאוד */
    .posts-grid-square-wrapper.has-background-mobile-only.rounded-container {
        border-radius: 4px !important;
    }
    
    body.home .posts-grid-square-wrapper.has-background-container {
        max-width: calc(100% - 10px) !important;
        margin: 0 auto !important;
    }
}

/* אנימציות לטעינה */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.article-card-square {
    animation: fadeIn 0.5s ease backwards;
}

/* עיכוב הדרגתי לאנימציה */
.grid-item:nth-child(1) .article-card-square { animation-delay: 0.05s; }
.grid-item:nth-child(2) .article-card-square { animation-delay: 0.1s; }
.grid-item:nth-child(3) .article-card-square { animation-delay: 0.15s; }
.grid-item:nth-child(4) .article-card-square { animation-delay: 0.2s; }
.grid-item:nth-child(5) .article-card-square { animation-delay: 0.25s; }
.grid-item:nth-child(6) .article-card-square { animation-delay: 0.3s; }

/* עיצוב נוסף לגריד עם מספר שורות */
.posts-grid-square-container[data-rows="2"] {
    max-height: none;
}

.posts-grid-square-container[data-rows="3"] {
    max-height: none;
}

.posts-grid-square-container[data-rows="4"] {
    max-height: none;
}

/* התאמות למספר שורות במובייל */
@media (max-width: 768px) {
    /* במובייל, מגבילים את מספר השורות המוצגות */
    .posts-grid-square-container[data-rows="4"] {
        max-height: 800px;
        overflow-y: auto;
    }
}

/* ========== סגנון כהה ========== */
.posts-grid-square-container.style-dark .article-card-square .article-content {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.95) 100%);
    color: #fff;
    position: relative;
    transition: background 0.3s ease;
}

/* מסגרת רגילה בסגנון כהה */
.posts-grid-square-container.style-dark.regular-frame .article-card-square {
    border: var(--frame-border-width, 1px) solid var(--frame-border-color, rgba(255, 255, 255, 0.2));
}

.posts-grid-square-container.style-dark.regular-frame .article-card-square:hover {
    border-color: var(--frame-border-color, rgba(255, 255, 255, 0.4));
    filter: brightness(1.1);
}

/* אפקט hover על הכרטיסייה בסגנון כהה */
.posts-grid-square-container.style-dark .article-card-square:hover .article-content {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 1) 100%);
}

/* תגית קטגוריה בסגנון כהה */
.posts-grid-square-container.style-dark .category-tag {
    background-color: transparent !important;
    color: var(--primary-color-jhhd) !important;
    border: 1px solid var(--primary-color-jhhd) !important;
}

.posts-grid-square-container.style-dark .category-tag:hover {
    background-color: var(--primary-color-jhhd) !important;
    color: #fff !important;
    border-color: var(--primary-color-jhhd) !important;
}

/* כותרת בסגנון כהה */
.posts-grid-square-container.style-dark .article-card-square .article-title {
    color: #fff;
}

.posts-grid-square-container.style-dark .article-card-square a:hover .article-title {
    color: #ccc;
}

/* מטא-דאטה בסגנון כהה */
.posts-grid-square-container.style-dark .article-meta {
    color: rgba(255, 255, 255, 0.8);
}

.posts-grid-square-container.style-dark .article-meta .author-name {
    color: rgba(255, 255, 255, 0.7); /* התאמה לצבע התאריך */
}

.posts-grid-square-container.style-dark .article-meta .meta-separator {
    color: rgba(255, 255, 255, 0.5);
}

.posts-grid-square-container.style-dark .article-meta .publish-date {
    color: rgba(255, 255, 255, 0.7);
}

/* כרטיסיות placeholder בסגנון כהה */
.posts-grid-square-container.style-dark .article-card-square.placeholder .article-content {
    background: rgba(0, 0, 0, 0.5);
}

.posts-grid-square-container.style-dark .article-card-square.placeholder .article-title {
    color: rgba(255, 255, 255, 0.5);
}

/* מטא-דאטה ב-placeholder בסגנון כהה */
.posts-grid-square-container.style-dark .article-card-square.placeholder .article-meta {
    color: rgba(255, 255, 255, 0.3);
}

.posts-grid-square-container.style-dark .article-card-square.placeholder .article-meta .author-name {
    color: rgba(255, 255, 255, 0.3); /* התאמה לצבע התאריך */
}

/* ========== סגנון ללא מסגרת ========== */
.posts-grid-square-container.no-frame .article-card-square {
    box-shadow: none;
    border: none;
    background: transparent;
}

/* שימוש בצבע רקע מותאם אישית גם במצב ללא מסגרת */
.posts-grid-square-container.style-light.no-frame .article-card-square {
    background: var(--cards-bg-color, transparent);
}

.posts-grid-square-container.no-frame .article-card-square:hover {
    transform: translateY(-2px);
    box-shadow: none;
    border: none;
}

.posts-grid-square-container.no-frame .article-content {
    padding: 15px 0 0px 0; /* ביטול המרווח התחתון לחלוטין */
    background: transparent;
}

.posts-grid-square-container.no-frame .category-tag {
    margin-bottom: 16px; /* הכפלת המרווח מ-8px ל-16px */
}

.posts-grid-square-container.no-frame .article-card-square .article-title {
    font-size: 1.15rem;
    margin-bottom: 8px;
}

/* מטא-דאטה בסגנון ללא מסגרת */
.posts-grid-square-container.no-frame .article-meta {
    margin-top: 10px;
}

/* שילוב סגנון כהה עם ללא מסגרת */
.posts-grid-square-container.style-dark.no-frame .article-content {
    background: transparent;
    color: inherit;
}

.posts-grid-square-container.style-dark.no-frame .article-card-square .article-title {
    color: var(--primary-text-color, #1a1a1a);
}

.posts-grid-square-container.style-dark.no-frame .article-card-square a:hover .article-title {
    color: var(--primary-color, #0073aa);
}

/* מטא-דאטה בשילוב סגנון כהה ללא מסגרת */
.posts-grid-square-container.style-dark.no-frame .article-meta {
    color: #666;
}

.posts-grid-square-container.style-dark.no-frame .article-meta .author-name {
    color: #888; /* התאמה לצבע התאריך */
}

.posts-grid-square-container.style-dark.no-frame .article-meta .publish-date {
    color: #888;
}

.posts-grid-square-container.style-dark.no-frame .category-tag {
    background-color: transparent !important;
    color: var(--primary-color-jhhd) !important;
    border: 1px solid var(--primary-color-jhhd) !important;
}

.posts-grid-square-container.style-dark.no-frame .category-tag:hover {
    background-color: var(--primary-color-jhhd) !important;
    color: #fff !important;
    border-color: var(--primary-color-jhhd) !important;
}



/* ===== _all-posts-grid.css ===== */
/* בלוק כל הכתבות באתר - גריד עם תמונות מרובעות */

/* Wrapper ראשי להגבלת רוחב */
.all-posts-grid-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    transition: all 0.3s ease;
}

/* מיכל רקע */
.all-posts-grid-wrapper.has-background-container {
    padding: 40px 20px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    box-sizing: border-box; /* padding נספר בתוך מגבלת הרוחב */
    max-width: 1200px;      /* המיכל עצמו מוגבל ל-1200px */
    margin: 0 auto;      /* יישור כמו section */
}

/* מסגרת למיכל */
.all-posts-grid-wrapper.has-border {
    border-style: solid;
}

/* פינות מעוגלות למיכל רקע - לא למיכל רוחב מלא */
.all-posts-grid-wrapper.rounded-container:not(.full-width-container) {
    border-radius: 8px;
}

/* מיכל רקע רק במובייל - מוסתר בדסקטופ */
.all-posts-grid-wrapper.has-background-mobile-only {
    /* בדסקטופ - ללא רקע ו-padding */
    background: none !important;
    padding: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* מיכל רקע ברוחב מלא */
.all-posts-grid-wrapper.has-background-container.full-width-container {
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-left: 0;
    margin-right: 0;
    max-width: none;
    border-radius: 0;
    padding: 40px 20px;
    box-sizing: border-box;
}

/* התאמת התוכן הפנימי במיכל רוחב מלא */
.all-posts-grid-wrapper.full-width-container .all-posts-grid-section {
    max-width: 1200px;
    margin: 0 auto !important;
    padding: 0 20px;
}

/* התאמת section במיכל רוחב מלא */
.all-posts-grid-wrapper.has-background-container.full-width-container .all-posts-grid-section {
    margin: 0 auto !important;
    padding: 0 !important;
}

/* תיקון יישור הכותרת במיכל רוחב מלא - רק בדסקטופ */
@media (min-width: 769px) {
    .all-posts-grid-wrapper.has-background-container.full-width-container .all-posts-grid-section .section-title {
        max-width: 1200px;
        margin: 0 auto;
        margin-bottom: var(--space-md);
        padding: 0 20px;
        padding-bottom: 0.5rem; /* שמירה על המרווח המקורי בין הטקסט לפס */
        box-sizing: border-box;
    }
    
    /* תיקון יישור הפס מתחת לכותרת במיכל רוחב מלא */
    .all-posts-grid-wrapper.has-background-container.full-width-container .all-posts-grid-section .section-title:after {
        right: 20px;
    }
}

/* וידוא שה-container עצמו ממורכז */
.all-posts-grid-wrapper.full-width-container .all-posts-grid-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* עוקף את הכללים הגלובליים של עמוד הבית */
body.home .all-posts-grid-wrapper:not(.full-width-container) {
    max-width: 1200px !important;
    width: auto !important;
}

/* מיכל ברוחב מלא - עוקף הגבלות */
body.home .all-posts-grid-wrapper.full-width-container {
    max-width: none !important;
    width: 100vw !important;
}

/* התאמה כשיש מיכל רקע רגיל (לא רוחב מלא) */
body.home .all-posts-grid-wrapper.has-background-container:not(.full-width-container) {
    max-width: 1200px !important; /* המיכל עצמו מוגבל, ה-padding בתוך ה-1200 */
    width: auto !important;
}

body.home .all-posts-grid-section {
    margin: 0 auto !important;
    padding: 0 20px !important;
    width: auto !important;
}

/* התאמה כשיש מיכל רקע רגיל (לא רוחב מלא) */
.all-posts-grid-wrapper.has-background-container:not(.full-width-container) .all-posts-grid-section {
    margin: 0 !important;
    padding: 0 !important;
}

/* התאמת section כשהמיכל רק במובייל - בדסקטופ */
@media (min-width: 769px) {
    .all-posts-grid-wrapper.has-background-mobile-only .all-posts-grid-section {
        /* בדסקטופ - חוזר להתנהגות רגילה */
        margin: 0 auto !important;
        padding: 0 20px !important;
    }
}

/* התאמת section כשהמיכל רק במובייל - במובייל */
@media (max-width: 768px) {
    .all-posts-grid-wrapper.has-background-mobile-only .all-posts-grid-section {
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* מיכל רקע ברוחב מלא במובייל - פתרון פשוט */
    body.home .all-posts-grid-wrapper.has-background-container.full-width-container {
        width: 100vw !important;
        position: static !important;
        left: auto !important;
        right: auto !important;
        margin-left: calc(-1 * (100vw - 100%) / 2) !important;
        margin-right: calc(-1 * (100vw - 100%) / 2) !important;
        padding: 20px 15px !important; /* הוספת padding אופקי למיכל עצמו */
        border-radius: 0;
        box-sizing: border-box !important;
        transform: none !important; /* ביטול ה-transform מהדסקטופ */
    }
    
    body.home .all-posts-grid-wrapper.full-width-container .all-posts-grid-section {
        padding: 0 !important; /* ביטול padding כי הוא כבר במיכל */
        max-width: 100%;
        margin: 0 auto;
    }
    
    body.home .all-posts-grid-wrapper.full-width-container .all-posts-grid-container {
        padding: 0;
        width: 100%;
        max-width: 100%;
    }
}

.all-posts-grid-section {
    margin: 0 auto;
    padding: 0 20px;
    max-width: 1200px;
}

/* הכותרת משתמשת בעיצוב המשותף מקובץ _homepage-common.css */

/* קונטיינר הגריד */
.all-posts-grid-container {
    display: grid;
    gap: 30px;
    margin: 0 auto;
}

/* ביטול מסגרת על המיכל כאשר יש מסגרת רגילה לכרטיסיות */
.all-posts-grid-container,
.all-posts-grid-container.regular-frame,
.all-posts-grid-container.style-dark.regular-frame {
    border: none !important;
    outline: none !important;
    box-shadow: none;
}

/* הגדרת מספר עמודות לפי data attribute */
.all-posts-grid-container[data-columns="3"] {
    grid-template-columns: repeat(3, 1fr);
}

.all-posts-grid-container[data-columns="4"] {
    grid-template-columns: repeat(4, 1fr);
}

.all-posts-grid-container[data-columns="5"] {
    grid-template-columns: repeat(5, 1fr);
}

.all-posts-grid-container[data-columns="6"] {
    grid-template-columns: repeat(6, 1fr);
}

/* כרטיסיית כתבה - עיצוב עם פינות ישרות */
.all-posts-grid-container .article-card-square {
    background: var(--cards-bg-color, #fff);
    /* ברירת מחדל ללא פינות מעוגלות */
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* ========== סגנונות מסגרת טקסט ========== */
/* מסגרת עדינה - ברירת המחדל */
.all-posts-grid-container.subtle-frame .article-card-square {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.all-posts-grid-container.subtle-frame .article-card-square:hover {
    transform: translateY(-3px);
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.1);
}

/* מסגרת רגילה */
.all-posts-grid-container.regular-frame .article-card-square {
    border: var(--frame-border-width, 1px) solid var(--frame-border-color, #e0e0e0);
    box-shadow: none;
}

.all-posts-grid-container .article-card-square:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.12);
}

.all-posts-grid-container.regular-frame .article-card-square:hover {
    transform: translateY(-3px);
    border-color: var(--frame-border-color, #c0c0c0);
    background: var(--cards-bg-color, #fff);
    filter: brightness(0.9);
    box-shadow: none;
}

/* קונטיינר לתמונה */
.all-posts-grid-container .square-image-container {
    position: relative;
    width: 100%;
    aspect-ratio: var(--aspect-ratio, 1 / 1); /* יחס דינמי עם ברירת מחדל 1:1 */
    overflow: hidden;
    background-color: #f0f0f0;
}

.all-posts-grid-container .square-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* חיתוך התמונה למילוי הריבוע */
    object-position: center; /* מרכוז התמונה */
    transition: transform 0.3s ease;
}

.all-posts-grid-container .article-card-square:hover .square-image-container img {
    transform: scale(1.05);
}

/* תוכן הכתבה */
.all-posts-grid-container .article-content {
    padding: 20px 20px 0px 20px; /* ביטול המרווח התחתון לחלוטין */
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

/* תגית קטגוריה */
.all-posts-grid-container .category-tag {
    display: inline-block;
    background-color: transparent !important;
    color: var(--primary-color-jhhd) !important;
    border: 1px solid var(--primary-color-jhhd) !important;
    padding: 3px 8px; /* הקטנת הpadding פרופורציונלית לגודל הפונט */
    /* ברירת מחדל ללא פינות מעוגלות */
    font-size: 0.7rem; /* הקטנת הגודל ב-30% (70% מהמקורי) */
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px; /* הקטנת המרווח בין האותיות פרופורציונלית */
    margin-bottom: 20px; /* הכפלת המרווח כמו ב-posts-grid-square */
    text-decoration: none;
    transition: all 0.2s ease;
    align-self: flex-start; /* יישור לימין בגלל שהאתר בעברית */
}

.all-posts-grid-container .category-tag:hover {
    background-color: var(--primary-color-jhhd) !important;
    color: #fff !important;
    border-color: var(--primary-color-jhhd) !important;
    transform: translateY(-1px);
}

.all-posts-grid-container .article-card-square .article-title {
    font-size: 1.1rem;
    font-weight: 600;
    line-height: 1.4;
    margin: 0 0 12px 0;
    color: var(--secondary-color-jhhd, #8B4513);
    transition: color 0.2s ease;
    
    /* גובה קבוע של 3 שורות */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 4.2em; /* 3 שורות * 1.4 line-height */
}

.all-posts-grid-container .article-card-square a {
    text-decoration: none;
    color: inherit;
}

.all-posts-grid-container .article-card-square a:hover .article-title {
    color: var(--primary-color, #0073aa);
}

/* מטא-דאטה - מחבר ותאריך */
.all-posts-grid-container .article-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: #666;
    margin-top: 8px;
    margin-bottom: 10px; /* ריווח של 10px בתחתית */
    line-height: 1.2;
    flex-wrap: nowrap; /* וידוא שהתוכן נשאר בשורה אחת */
}

.all-posts-grid-container .article-meta .author-name {
    font-weight: 500;
    color: #888; /* התאמה לצבע התאריך */
    white-space: nowrap; /* מונע שבירת שורה */
}

.all-posts-grid-container .article-meta .meta-separator {
    color: #ccc;
    margin: 0 2px;
    flex-shrink: 0; /* מונע התכווצות */
}

.all-posts-grid-container .article-meta .publish-date {
    color: #888;
    white-space: nowrap; /* מונע שבירת שורה */
}

/* ========== סגנון כהה ========== */
.all-posts-grid-container.style-dark .article-card-square .article-content {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.95) 100%);
    color: #fff;
    position: relative;
    transition: background 0.3s ease;
}

/* מסגרת רגילה בסגנון כהה */
.all-posts-grid-container.style-dark.regular-frame .article-card-square {
    border: var(--frame-border-width, 1px) solid var(--frame-border-color, rgba(255, 255, 255, 0.2));
}

.all-posts-grid-container.style-dark.regular-frame .article-card-square:hover {
    border-color: var(--frame-border-color, rgba(255, 255, 255, 0.4));
    filter: brightness(1.1);
}

/* אפקט hover על הכרטיסייה בסגנון כהה */
.all-posts-grid-container.style-dark .article-card-square:hover .article-content {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 1) 100%);
}

/* תגית קטגוריה בסגנון כהה */
.all-posts-grid-container.style-dark .category-tag {
    background-color: transparent !important;
    color: var(--primary-color-jhhd) !important;
    border: 1px solid var(--primary-color-jhhd) !important;
}

.all-posts-grid-container.style-dark .category-tag:hover {
    background-color: var(--primary-color-jhhd) !important;
    color: #fff !important;
    border-color: var(--primary-color-jhhd) !important;
}

/* כותרת בסגנון כהה */
.all-posts-grid-container.style-dark .article-card-square .article-title {
    color: #fff;
}

.all-posts-grid-container.style-dark .article-card-square a:hover .article-title {
    color: #ccc;
}

/* מטא-דאטה בסגנון כהה */
.all-posts-grid-container.style-dark .article-meta {
    color: rgba(255, 255, 255, 0.8);
}

.all-posts-grid-container.style-dark .article-meta .author-name {
    color: rgba(255, 255, 255, 0.7); /* התאמה לצבע התאריך */
}

.all-posts-grid-container.style-dark .article-meta .meta-separator {
    color: rgba(255, 255, 255, 0.5);
}

.all-posts-grid-container.style-dark .article-meta .publish-date {
    color: rgba(255, 255, 255, 0.7);
}

/* כרטיסיות placeholder */
.all-posts-grid-container .article-card-square.placeholder {
    opacity: 0.5;
    pointer-events: none;
}

.all-posts-grid-container .article-card-square.placeholder .square-image-container {
    background-color: #e0e0e0;
}

.all-posts-grid-container .article-card-square.placeholder img {
    opacity: 0.3;
}

/* כרטיסיות placeholder בסגנון כהה */
.all-posts-grid-container.style-dark .article-card-square.placeholder .article-content {
    background: rgba(0, 0, 0, 0.5);
}

.all-posts-grid-container.style-dark .article-card-square.placeholder .article-title {
    color: rgba(255, 255, 255, 0.5);
}

/* מטא-דאטה ב-placeholder בסגנון כהה */
.all-posts-grid-container.style-dark .article-card-square.placeholder .article-meta {
    color: rgba(255, 255, 255, 0.3);
}

.all-posts-grid-container.style-dark .article-card-square.placeholder .article-meta .author-name {
    color: rgba(255, 255, 255, 0.3); /* התאמה לצבע התאריך */
}

/* קישור לכל הכתבות */
.all-posts-link-container {
    text-align: center;
    margin-top: 40px;
    padding-top: 30px;
    border-top: 2px solid #f0f0f0;
}

.view-all-posts-link {
    display: inline-block;
    padding: 14px 35px;
    background: #f7f7f7; /* רקע אפור בהיר מאוד */
    color: #000; /* טקסט שחור */
    text-decoration: none;
    /* ברירת מחדל ללא פינות מעוגלות */
    font-weight: 600;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    border: 2px solid #e0e0e0; /* מסגרת אפורה כהה יותר מהרקע */
    position: relative;
    overflow: hidden;
}

.view-all-posts-link:hover {
    background: #ffffff; /* הבהרה עד לבן בהובר */
    color: #000; /* נשאר שחור */
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.10);
    border-color: #d0d0d0; /* מעט כהה יותר בהובר */
}

/* אפקט חץ לכפתור */
.view-all-posts-link::after {
    content: "←";
    margin-right: 8px;
    display: inline-block;
    transition: transform 0.3s ease;
}

.view-all-posts-link:hover::after {
    transform: translateX(-5px);
}

/* רספונסיביות */
@media (max-width: 1024px) {
    .all-posts-grid-container[data-columns="6"] {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .all-posts-grid-container[data-columns="5"] {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 768px) {
    .all-posts-grid-container[data-columns="6"],
    .all-posts-grid-container[data-columns="5"],
    .all-posts-grid-container[data-columns="4"] {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .all-posts-grid-container {
        gap: 20px;
    }
    
    .all-posts-grid-container .article-card-square .article-title {
        font-size: 1rem;
    }
    
    /* מיכל רקע במובייל */
    .all-posts-grid-wrapper.has-background-container {
        padding: 20px 10px;
        margin: 0 10px;
    }
    
    /* מיכל רקע רק במובייל - מוצג במובייל */
    .all-posts-grid-wrapper.has-background-mobile-only {
        background-color: var(--mobile-bg-color) !important;
        padding: 20px 10px !important;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
        margin: 0 10px !important;
    }
    
    .all-posts-grid-wrapper.has-background-mobile-only.rounded-container {
        border-radius: 8px !important;
    }
    
    /* וודא ש-border-radius לא מוחל אם אין rounded-container */
    .all-posts-grid-wrapper.has-background-mobile-only:not(.rounded-container) {
        border-radius: 0 !important;
    }
    
    body.home .all-posts-grid-wrapper.has-background-container {
        margin: 0 10px !important;
    }
}

@media (max-width: 600px) {
    .all-posts-grid-container[data-columns="6"],
    .all-posts-grid-container[data-columns="5"],
    .all-posts-grid-container[data-columns="4"],
    .all-posts-grid-container[data-columns="3"] {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* מיכל רקע במובייל קטן */
    .all-posts-grid-wrapper.has-background-container {
        padding: 15px 8px;
        margin: 0 5px;
    }
    
    /* מרווחים למיכל רוחב מלא במובייל קטן */
    body.home .all-posts-grid-wrapper.has-background-container.full-width-container {
        padding: 20px 10px !important; /* padding קטן יותר במסכים קטנים */
    }
    
    /* מיכל רקע רק במובייל - מוצג במובייל קטן */
    .all-posts-grid-wrapper.has-background-mobile-only {
        padding: 15px 8px !important;
        margin: 0 5px !important;
    }
    
    /* הכתבה הראשונה תופסת את כל הרוחב במובייל */
    .all-posts-grid-container .grid-item:first-child {
        grid-column: span 2;
    }
    
    /* עיצוב ייחודי לכתבה הראשונה במובייל */
    .all-posts-grid-container .grid-item:first-child .article-card-square {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }
    
    /* תמונה גדולה יותר לכתבה הראשונה */
    .all-posts-grid-container .grid-item:first-child .square-image-container {
        aspect-ratio: 16 / 9; /* יחס רחב יותר לכתבה הראשונה */
    }
    
    /* הגדלת הכותרת של הכתבה הראשונה */
    .all-posts-grid-container .grid-item:first-child .article-title {
        font-size: 1.4rem;
        font-weight: 700;
        -webkit-line-clamp: 4; /* 4 שורות בכתבה הראשונה במובייל */
        min-height: auto; /* ביטול גובה מינימלי שיצר מרווח מיותר */
        margin-bottom: 8px; /* הקטנת המרווח התחתון משמעותית */
    }
    
    /* הגדלת התוכן של הכתבה הראשונה */
    .all-posts-grid-container .grid-item:first-child .article-content {
        padding: 20px 20px 0px 20px; /* ביטול המרווח התחתון לחלוטין */
    }
    
    /* תגית קטגוריה גדולה יותר בכתבה הראשונה */
    .all-posts-grid-container .grid-item:first-child .category-tag {
        font-size: 0.7rem; /* הקטנת הגודל ב-30% גם בכתבה הראשונה במובייל */
        padding: 3px 10px; /* הקטנת הpadding פרופורציונלית */
        margin-bottom: 20px; /* שמירה על המרווח המוכפל גם בכתבה הראשונה במובייל */
    }
    
    /* מטא-דאטה בכתבה הראשונה במובייל */
    .all-posts-grid-container .grid-item:first-child .article-meta {
        font-size: 0.9rem;
        margin-top: 12px;
        gap: 10px;
    }
    
    .all-posts-grid-container .grid-item:first-child .article-meta .author-name {
        font-weight: 600;
    }
    
    /* הסתרת הכתבה האחרונה כאשר יש מספר זוגי של כתבות (ללא הראשונה) */
    .all-posts-grid-container.hide-last-mobile .grid-item:last-child {
        display: none;
    }
    
    .all-posts-grid-container {
        gap: 10px; /* הקטנת הרווח בין הכרטיסיות במובייל */
    }
    
    .all-posts-grid-container .article-content {
        padding: 15px;
        padding-bottom: 0px; /* ביטול המרווח התחתון לחלוטין */
    }
    
    /* הקטנת padding לכרטיסיות הקטנות (לא הראשונה) */
    .all-posts-grid-container .grid-item:not(:first-child) .article-content {
        padding: 12px 10px 0px 10px; /* ביטול המרווח התחתון לחלוטין */
    }
    
    /* מטא-דאטה בכרטיסיות הקטנות במובייל */
    .all-posts-grid-container .grid-item:not(:first-child) .article-meta {
        font-size: 0.75rem;
        margin-top: 6px;
        gap: 6px;
    }
    
    /* התאמות נוספות למסכים קטנים במיוחד (אייפון SE וכדומה) */
    @media (max-width: 380px) {
        .all-posts-grid-container {
            gap: 8px; /* רווח קטן עוד יותר */
        }
        
        .all-posts-grid-container .grid-item:not(:first-child) .article-content {
            padding: 10px 8px 0px 8px; /* ביטול המרווח התחתון לחלוטין */
        }
        
        .all-posts-grid-container .grid-item:not(:first-child) .article-title {
            font-size: 1rem; /* כותרת קטנה יותר */
        }
        
        .all-posts-grid-container .grid-item:not(:first-child) .category-tag {
            font-size: 0.5rem; /* הקטנת הגודל ב-30% (70% מ-0.7rem) */
            padding: 2px 6px; /* הקטנת הpadding פרופורציונלית */
            margin-bottom: 16px; /* הכפלת המרווח גם בכרטיסיות הקטנות */
        }
        
        /* מטא-דאטה במסכים קטנים מאוד */
        .all-posts-grid-container .grid-item:not(:first-child) .article-meta {
            font-size: 0.7rem;
            margin-top: 4px;
            gap: 4px;
        }
        
        .all-posts-grid-container .grid-item:first-child .article-meta {
            font-size: 0.85rem;
            margin-top: 8px;
            gap: 8px;
        }
        
        /* וודא שהכרטיסיות לא גולשות */
        .all-posts-grid-container .grid-item {
            min-width: 0; /* מאפשר לכרטיסיות להתכווץ */
        }
        
        .all-posts-grid-wrapper {
            overflow-x: hidden; /* מונע גלילה אופקית */
        }
    }
    
    .view-all-posts-link {
        padding: 12px 30px;
        font-size: 1rem;9rem;
        letter-spacing: 0.5px;
    }
}

@media (max-width: 300px) {
    /* רק במסכים קטנים במיוחד - עמודה אחת */
    .all-posts-grid-container {
        grid-template-columns: 1fr !important;
        gap: 20px;
    }
    
    /* מיכל רקע במסכים קטנים מאוד */
    .all-posts-grid-wrapper.has-background-container,
    .all-posts-grid-wrapper.has-background-mobile-only {
        padding: 10px 5px !important;
        margin: 0 2px !important;
    }
    
    .all-posts-grid-wrapper.has-background-mobile-only.rounded-container {
        border-radius: 5px !important;
    }
    
    body.home .all-posts-grid-wrapper.has-background-container {
        margin: 0 2px !important;
    }
    
    /* במסכים קטנים מאוד, הכתבה הראשונה כבר תופסת את כל הרוחב בגלל עמודה אחת */
    .all-posts-grid-container .grid-item:first-child {
        grid-column: span 1; /* ביטול ה-span 2 מה-media query הקודם */
    }
    
    /* הסתרת הכתבה האחרונה במסכים קטנים מאוד - אותה לוגיקה */
    .all-posts-grid-container.hide-last-mobile .grid-item:last-child {
        display: none;
    }
    
    /* מטא-דאטה במסכים קטנים מאוד (מתחת ל-300px) */
    .all-posts-grid-container .article-meta {
        font-size: 0.75rem;
        margin-top: 6px;
        gap: 6px;
    }
}

/* אנימציות לטעינה */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.all-posts-grid-container .article-card-square {
    animation: fadeIn 0.5s ease backwards;
}

/* עיכוב הדרגתי לאנימציה */
.all-posts-grid-container .grid-item:nth-child(1) .article-card-square { animation-delay: 0.05s; }
.all-posts-grid-container .grid-item:nth-child(2) .article-card-square { animation-delay: 0.1s; }
.all-posts-grid-container .grid-item:nth-child(3) .article-card-square { animation-delay: 0.15s; }
.all-posts-grid-container .grid-item:nth-child(4) .article-card-square { animation-delay: 0.2s; }
.all-posts-grid-container .grid-item:nth-child(5) .article-card-square { animation-delay: 0.25s; }
.all-posts-grid-container .grid-item:nth-child(6) .article-card-square { animation-delay: 0.3s; }
.all-posts-grid-container .grid-item:nth-child(7) .article-card-square { animation-delay: 0.35s; }
.all-posts-grid-container .grid-item:nth-child(8) .article-card-square { animation-delay: 0.4s; }
.all-posts-grid-container .grid-item:nth-child(9) .article-card-square { animation-delay: 0.45s; }
.all-posts-grid-container .grid-item:nth-child(10) .article-card-square { animation-delay: 0.5s; }

/* עיצוב נוסף לגריד עם מספר שורות */
.all-posts-grid-container[data-rows="2"],
.all-posts-grid-container[data-rows="3"],
.all-posts-grid-container[data-rows="4"],
.all-posts-grid-container[data-rows="5"],
.all-posts-grid-container[data-rows="6"] {
    max-height: none;
}

/* התאמות למספר שורות במובייל */
@media (max-width: 768px) {
    /* במובייל, מגבילים את מספר השורות המוצגות */
    .all-posts-grid-container[data-rows="5"],
    .all-posts-grid-container[data-rows="6"] {
        max-height: 1000px;
        overflow-y: auto;
        padding-left: 5px;
    }
    
    .all-posts-grid-container[data-rows="5"]::-webkit-scrollbar,
    .all-posts-grid-container[data-rows="6"]::-webkit-scrollbar {
        width: 6px;
    }
    
    .all-posts-grid-container[data-rows="5"]::-webkit-scrollbar-track,
    .all-posts-grid-container[data-rows="6"]::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 3px;
    }
    
    .all-posts-grid-container[data-rows="5"]::-webkit-scrollbar-thumb,
    .all-posts-grid-container[data-rows="6"]::-webkit-scrollbar-thumb {
        background: #888;
        border-radius: 3px;
    }
    
    .all-posts-grid-container[data-rows="5"]::-webkit-scrollbar-thumb:hover,
    .all-posts-grid-container[data-rows="6"]::-webkit-scrollbar-thumb:hover {
        background: #555;
    }
}

/* פינות מעוגלות */
.all-posts-grid-container.rounded-corners .article-card-square {
    border-radius: 8px;
}

.all-posts-grid-container.rounded-corners .square-image-container {
    border-radius: 8px 8px 0 0;
}

/* ========== סגנון ללא מסגרת ========== */
.all-posts-grid-container.no-frame .article-card-square {
    box-shadow: none;
    /* שומרים על צבע הרקע שהוגדר במשתנה --cards-bg-color */
    /* background נשאר כפי שהוגדר בכלל הבסיסי */
}

.all-posts-grid-container.no-frame .article-card-square:hover {
    transform: translateY(-2px);
    box-shadow: none;
}

.all-posts-grid-container.no-frame .article-content {
    padding: 15px 20px 0px 20px; /* ביטול המרווח התחתון לחלוטין */
    /* שומרים על צבע הרקע במקום להפוך לשקוף */
    background: inherit;
}

.all-posts-grid-container.no-frame .category-tag {
    margin-bottom: 16px; /* הכפלת המרווח מ-8px ל-16px */
}

.all-posts-grid-container.no-frame .article-card-square .article-title {
    font-size: 1.15rem;
    margin-bottom: 8px;
}

/* מטא-דאטה בסגנון ללא מסגרת */
.all-posts-grid-container.no-frame .article-meta {
    margin-top: 10px;
}

/* שילוב סגנון כהה עם ללא מסגרת */
.all-posts-grid-container.style-dark.no-frame .article-content {
    /* שומרים על הגרדיאנט הכהה של הסגנון הכהה גם בללא מסגרת */
    /* background נשאר כפי שהוגדר בסגנון הכהה */
    color: inherit;
}

.all-posts-grid-container.style-dark.no-frame .article-card-square .article-title {
    color: var(--primary-text-color, #1a1a1a);
}

.all-posts-grid-container.style-dark.no-frame .article-card-square a:hover .article-title {
    color: var(--primary-color, #0073aa);
}

/* מטא-דאטה בשילוב סגנון כהה ללא מסגרת */
.all-posts-grid-container.style-dark.no-frame .article-meta {
    color: #666;
}

.all-posts-grid-container.style-dark.no-frame .article-meta .author-name {
    color: #888; /* התאמה לצבע התאריך */
}

.all-posts-grid-container.style-dark.no-frame .article-meta .publish-date {
    color: #888;
}

.all-posts-grid-container.style-dark.no-frame .category-tag {
    background-color: transparent !important;
    color: var(--primary-color-jhhd) !important;
    border: 1px solid var(--primary-color-jhhd) !important;
}

.all-posts-grid-container.style-dark.no-frame .category-tag:hover {
    background-color: var(--primary-color-jhhd) !important;
    color: #fff !important;
    border-color: var(--primary-color-jhhd) !important;
}

/* התאמות למצב ללא מסגרת במובייל */
@media (max-width: 600px) {
    /* שמירה על padding מתאים במובייל גם במצב ללא מסגרת */
    .all-posts-grid-container.no-frame .article-content {
        padding: 15px;
        padding-bottom: 0px; /* ביטול המרווח התחתון לחלוטין */
    }
    
    /* הכתבה הראשונה במובייל - ללא מסגרת */
    .all-posts-grid-container.no-frame .grid-item:first-child .article-content {
        padding: 20px 20px 0px 20px; /* ביטול המרווח התחתון לחלוטין */
    }
    
    /* הכתבות הקטנות במובייל - ללא מסגרת */
    .all-posts-grid-container.no-frame .grid-item:not(:first-child) .article-content {
        padding: 12px 10px 0px 10px; /* ביטול המרווח התחתון לחלוטין */
    }
}

/* התאמות למסכים קטנים במיוחד - ללא מסגרת */
@media (max-width: 380px) {
    .all-posts-grid-container.no-frame .grid-item:not(:first-child) .article-content {
        padding: 10px 8px 0px 8px; /* ביטול המרווח התחתון לחלוטין */
    }
}

/* וידוא שהגריד לא גולש במובייל במצב ללא מסגרת */
@media (max-width: 768px) {
    .all-posts-grid-container.no-frame {
        width: 100%;
        box-sizing: border-box;
        overflow-x: hidden; /* מניעת גלילה אופקית */
    }
    
    .all-posts-grid-container.no-frame .grid-item {
        min-width: 0; /* מאפשר לכרטיסיות להתכווץ */
        width: 100%;
        box-sizing: border-box;
    }
}


/* ===== _posts-tabs.css ===== */
/**
 * === בלוק כתבות עם טאבים ===
 */

/* Wrapper ראשי */
.posts-tabs-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
  position: relative;
}

/* מיכל רקע משותף */
.posts-tabs-wrapper.with-background-container:not(.mobile-only-bg) {
  background: var(--bg-color, #f5f5f5);
  padding: 30px 20px;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  margin-top: 0;
  margin-bottom: 0;
  overflow: visible; /* מאפשר לכפתורים לבלוט מחוץ למיכל */
}

/* מיכל רקע רק במובייל - ללא עיצוב בדסקטופ */
.posts-tabs-wrapper.with-background-container.mobile-only-bg {
  background: transparent;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
  margin-top: 0;
  margin-bottom: 0;
  overflow: visible;
}

/* מיכל רקע ברוחב מלא */
.posts-tabs-wrapper.with-background-container.full-width-container {
  width: 100vw;
  position: relative;
  left: 0;
  right: 0;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  max-width: none;
  border-radius: 0;
  padding: 40px 20px;
  box-sizing: border-box;
}

/* התאמת התוכן הפנימי במיכל רוחב מלא */
.posts-tabs-wrapper.full-width-container .posts-tabs-section {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.posts-tabs-wrapper.with-background-container:not(.mobile-only-bg) .posts-tabs-section {
  background: transparent;
  margin: 0;
  padding: 0;
}

/* מיכל רקע עם פינות מעוגלות */
.posts-tabs-wrapper.with-background-container:not(.mobile-only-bg)[data-rounded="no"] {
  border-radius: 0;
}

/* עוקף כללים גלובליים בעמוד הבית */
body.home .posts-tabs-wrapper:not(.full-width-container) {
  max-width: 1200px !important;
  width: auto !important;
}

/* מיכל ברוחב מלא - עוקף הגבלות */
body.home .posts-tabs-wrapper.full-width-container {
  max-width: none !important;
  width: 100vw !important;
}

/* מיכל הסקציה */
.posts-tabs-wrapper .posts-tabs-section {
  margin: 0 auto;
  padding: 0 20px;
  max-width: 1200px;
}

body.home .posts-tabs-wrapper .posts-tabs-section {
  margin: 0 auto !important;
  padding: 0 20px !important;
  width: auto !important;
}

/* === סרגל הטאבים === */
.posts-tabs-navigation {
  margin-bottom: 30px;
  border-bottom: none;
  position: relative;
}

.tabs-list {
  display: flex;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 5px;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: #ccc #f5f5f5;
}

/* סגנון scrollbar למקרה של הרבה טאבים */
.tabs-list::-webkit-scrollbar {
  height: 6px;
}

.tabs-list::-webkit-scrollbar-track {
  background: #f5f5f5;
}

.tabs-list::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 3px;
}

.tabs-list::-webkit-scrollbar-thumb:hover {
  background: #999;
}

/* סגנון כל טאב */
.tab-item {
  flex-shrink: 0;
}

.tab-button {
  background: transparent; /* רקע שקוף תמיד */
  border: none;
  padding: 12px 24px;
  font-size: 15px;
  font-weight: 500;
  color: #666;
  cursor: pointer;
  transition: all 0.3s ease;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  white-space: nowrap;
  font-family: inherit;
  outline: none; /* הסרת קו המתאר */
}

.tab-button:hover {
  color: var(--primary-color-jhhd);
  background-color: transparent; /* רקע שקוף - נשאר צבע הרקע המקורי */
}

/* טאב פעיל */
.tab-item.active .tab-button {
  color: var(--secondary-color-jhhd);
  border-bottom-color: var(--secondary-color-jhhd);
  font-weight: 600;
  outline: none; /* הסרת קו המתאר גם בטאב פעיל */
}

/* הסרת outline גם במצבי פוקוס ולחיצה על הטאבים */
.tab-button:focus,
.tab-button:active {
  outline: none;
  box-shadow: none;
}

/* === תוכן הטאבים === */
.posts-tabs-content {
  position: relative;
  margin-top: 20px;
}

.tab-content {
  display: none;
  position: relative;
  align-items: center;
}

.tab-content.active {
  display: flex;
  justify-content: center; /* מרכז את הילדים באופק */
}

/* === כפתורי ניווט - עיצוב כפתור (ברירת מחדל) === */
.posts-tabs-wrapper.nav-button .nav-button {
  position: absolute;
  /* ממוקם במרכז התמונה - חישוב קבוע */
  top: 85px; /* מיקום קבוע שמתאים לרוב יחסי התמונה */
  transform: translateY(-50%);
  background: rgba(0, 0, 0, 0.7);
  border: none;
  border-radius: 4px;
  width: 52px;  /* הגדלה ב-30% מ-40px */
  height: 78px; /* הגדלה ב-30% מ-60px */
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 10;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
  color: #ffffff;
  font-size: 42px; /* הגדלה ב-30% מ-32px */
  font-weight: 500;
  font-family: system-ui, -apple-system, sans-serif;
  line-height: 1;
}

.posts-tabs-wrapper.nav-button .nav-button:hover:not(:disabled) {
  background: rgba(0, 0, 0, 0.85);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
  transform: translateY(-50%) scale(1.05);
}

.posts-tabs-wrapper.nav-button .nav-button:disabled {
  opacity: 0.3;
  cursor: not-allowed;
  background: rgba(0, 0, 0, 0.3);
}

/* === כפתורי ניווט - עיצוב חץ פשוט === */  
.posts-tabs-wrapper.nav-arrow .nav-button {
  position: absolute;
  /* ממוקם במרכז כל המיכל (תמונה + טקסט) */
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  padding: 0;
  width: 40px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 100; /* גבוה יותר כדי להיות מעל התוכן */
  color: var(--primary-color-jhhd);
  font-size: 100px;
  font-weight: bold;
  font-family: system-ui, -apple-system, sans-serif;
  line-height: 1;
  box-shadow: none;
  outline: none; /* הסרת קו המתאר */
}

.posts-tabs-wrapper.nav-arrow .nav-button:hover:not(:disabled) {
  transform: translateY(-50%) scale(1.2);
  color: var(--primary-color-jhhd);
  opacity: 0.8;
}

/* הסרת outline גם במצבי פוקוס ולחיצה */
.posts-tabs-wrapper.nav-arrow .nav-button:focus,
.posts-tabs-wrapper.nav-arrow .nav-button:active {
  outline: none;
  box-shadow: none;
}

.posts-tabs-wrapper.nav-arrow .nav-button:disabled {
  opacity: 0.2;
  cursor: not-allowed;
}

/* === מיקום החיצים - עיצוב כפתור === */
.posts-tabs-wrapper.nav-button .nav-prev {
  left: -47px; /* 90% מהכפתור בחוץ (52px * 0.9) */
}

.posts-tabs-wrapper.nav-button .nav-next {
  right: -47px; /* 90% מהכפתור בחוץ (52px * 0.9) */
}

/* === מיקום החיצים - עיצוב חץ פשוט === */
.posts-tabs-wrapper.nav-arrow .nav-prev {
  left: -50px; /* מחוץ למיכל התוכן */
}

.posts-tabs-wrapper.nav-arrow .nav-next {
  right: -50px; /* מחוץ למיכל התוכן */
}

/* התאמת כפתורי ניווט במיכל רוחב מלא */
.posts-tabs-wrapper.full-width-container.nav-button .nav-prev {
  left: 10px; /* הכפתור בתוך המיכל */
}

.posts-tabs-wrapper.full-width-container.nav-button .nav-next {
  right: 10px; /* הכפתור בתוך המיכל */
}

/* מיקום הכפתורים מותאם לגובה התמונה */

/* === קרוסלת הכתבות === */
.posts-carousel {
  flex: 1;
  overflow: hidden;
  padding: 0;
  position: relative; /* הוספת position relative למיכל */
  margin: 0 auto;
  max-width: 100%;
  direction: ltr; /* כפה כיוון LTR על הקרוסלה עצמה */
}

.posts-track {
  display: flex; /* שינוי ל-flex רגיל */
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  gap: var(--space-md);
  will-change: transform;
  flex-wrap: nowrap;
  padding: 0 10px; /* הוספת padding לקצוות המסילה */
}

/* גודל פריטים לפי מספר עמודות */
.posts-track[data-columns="3"] .carousel-item {
  flex: 0 0 calc(33.333% - var(--space-md) * 2 / 3);
}

.posts-track[data-columns="4"] .carousel-item {
  flex: 0 0 calc(25% - var(--space-md) * 3 / 4);
}

.posts-track[data-columns="5"] .carousel-item {
  flex: 0 0 calc(20% - var(--space-md) * 4 / 5);
}

.posts-track[data-columns="6"] .carousel-item {
  flex: 0 0 calc(16.666% - var(--space-md) * 5 / 6);
}

/* === כרטיסיית כתבה === */
.posts-tabs-wrapper .article-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--cards-bg-color, #fff);
  overflow: hidden;
  transition: all 0.3s ease;
  direction: rtl; /* החזרת כיוון RTL לתוכן */
}

/* מסגרת עדינה (ברירת מחדל) */
.posts-tabs-wrapper .article-card.subtle-frame {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* מסגרת רגילה */
.posts-tabs-wrapper .article-card.regular-frame {
  border: 1px solid #e0e0e0;
  box-shadow: none;
}

/* פינות מעוגלות */
.posts-tabs-wrapper .article-card.rounded-corners {
  border-radius: 8px;
}

.posts-tabs-wrapper .article-card.rounded-corners figure {
  border-radius: 8px 8px 0 0;
}

/* ללא מסגרת */
.posts-tabs-wrapper .article-card.no-frame {
  box-shadow: none;
  border: none;
  background: transparent;
}

/* Hover effects לפי סגנון מסגרת */
.posts-tabs-wrapper .article-card.subtle-frame:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.posts-tabs-wrapper .article-card.regular-frame:hover {
  transform: translateY(-2px);
  border-color: #c0c0c0;
  background: #fff;
}

.posts-tabs-wrapper .article-card.no-frame:hover {
  transform: translateY(-2px);
  box-shadow: none;
  border: none;
}

.posts-tabs-wrapper .article-card figure {
  margin: 0;
  overflow: hidden;
  aspect-ratio: var(--aspect-ratio, 3 / 2);
  width: 100%;
  position: relative;
  max-width: 100%;
  display: block;
  flex-shrink: 0; /* למנוע כיווץ של התמונה */
}

.posts-tabs-wrapper .article-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.3s ease;
  max-width: 100%;
  max-height: 100%;
}

.posts-tabs-wrapper .article-card:hover img {
  transform: scale(1.05);
}

.posts-tabs-wrapper .article-title {
  font-size: 1.1rem;
  margin: 15px 15px 8px; /* הוספת מרווח תחתון קטן לפני המטא-דאטה */
  line-height: 1.3;
  color: #222;
  font-weight: 600;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: 2.6em;
}

.posts-tabs-wrapper .article-card a {
  text-decoration: none;
  color: inherit;
}

.posts-tabs-wrapper .article-card a:hover .article-title {
  color: var(--primary-color-jhhd);
}

/* מטא-דאטה - מחבר ותאריך */
.posts-tabs-wrapper .article-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.85rem;
  color: #666;
  margin: 0 15px 10px; /* מרווח מהצדדים ומהתחתית */
  line-height: 1.2;
  flex-wrap: nowrap;
}

.posts-tabs-wrapper .article-meta .author-name {
  font-weight: 500;
  color: #888;
  white-space: nowrap;
}

.posts-tabs-wrapper .article-meta .meta-separator {
  color: #ccc;
  margin: 0 2px;
  flex-shrink: 0;
}

.posts-tabs-wrapper .article-meta .publish-date {
  color: #888;
  white-space: nowrap;
}

/* === סגנון כהה === */
.posts-tabs-wrapper.style-dark {
  color: #ecf0f1;
}

/* רקע כהה כשאין מיכל רקע */
.posts-tabs-wrapper.style-dark:not(.with-background-container) .posts-tabs-section {
  background: #2c3e50;
  padding: 30px 20px;
  border-radius: 8px;
}

.posts-tabs-wrapper.style-dark .section-title {
  color: #ffffff;
}

.posts-tabs-wrapper.style-dark .tab-button {
  color: #bdc3c7;
}

.posts-tabs-wrapper.style-dark .tab-button:hover {
  color: var(--primary-color-jhhd);
  background-color: transparent; /* רקע שקוף גם בסגנון כהה */
}

.posts-tabs-wrapper.style-dark .tab-item.active .tab-button {
  color: var(--secondary-color-jhhd);
  border-bottom-color: var(--secondary-color-jhhd);
}

.posts-tabs-wrapper.style-dark .article-card {
  background: var(--cards-bg-color, #34495e);
  color: #ecf0f1;
}

/* מסגרת עדינה בסגנון כהה */
.posts-tabs-wrapper.style-dark .article-card.subtle-frame {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.posts-tabs-wrapper.style-dark .article-card.subtle-frame:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

/* מסגרת רגילה בסגנון כהה */
.posts-tabs-wrapper.style-dark .article-card.regular-frame {
  border-color: rgba(255, 255, 255, 0.2);
}

.posts-tabs-wrapper.style-dark .article-card.regular-frame:hover {
  border-color: rgba(255, 255, 255, 0.4);
  background: #34495e;
}

.posts-tabs-wrapper.style-dark .article-title {
  color: #ffffff;
}

.posts-tabs-wrapper.style-dark .article-card a {
  color: inherit;
}

.posts-tabs-wrapper.style-dark .article-card a:hover .article-title {
  color: var(--secondary-color-jhhd);
}

/* מטא-דאטה בסגנון כהה */
.posts-tabs-wrapper.style-dark .article-meta {
  color: rgba(255, 255, 255, 0.8);
}

.posts-tabs-wrapper.style-dark .article-meta .author-name {
  color: rgba(255, 255, 255, 0.7);
}

.posts-tabs-wrapper.style-dark .article-meta .meta-separator {
  color: rgba(255, 255, 255, 0.5);
}

.posts-tabs-wrapper.style-dark .article-meta .publish-date {
  color: rgba(255, 255, 255, 0.7);
}

/* עיצוב כפתורי ניווט בסגנון כהה */
.posts-tabs-wrapper.style-dark.nav-button .nav-button {
  background: rgba(0, 0, 0, 0.8);
  border: none;
  color: #ffffff;
}

.posts-tabs-wrapper.style-dark.nav-button .nav-button:hover:not(:disabled) {
  background: rgba(0, 0, 0, 0.95);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4);
}

.posts-tabs-wrapper.style-dark.nav-button .nav-button:disabled {
  opacity: 0.3;
  background: rgba(0, 0, 0, 0.4);
}

/* עיצוב חיצים פשוטים בסגנון כהה */
.posts-tabs-wrapper.style-dark.nav-arrow .nav-button {
  color: #3498db; /* צבע כחול בסגנון כהה */
}

.posts-tabs-wrapper.style-dark.nav-arrow .nav-button:hover:not(:disabled) {
  color: #5dade2;
  opacity: 1;
}

/* === מיכל רקע עם סגנונות שונים === */
.posts-tabs-wrapper.with-background-container:not(.mobile-only-bg).style-dark {
  background: var(--bg-color, #2c3e50);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
}

.posts-tabs-wrapper.with-background-container:not(.mobile-only-bg).style-light {
  background: var(--bg-color, #f8f9fa);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

/* סגנונות למיכל רקע רק במובייל */
@media screen and (max-width: 480px) {
  .posts-tabs-wrapper.with-background-container.mobile-only-bg.style-dark {
    background: var(--bg-color, #2c3e50);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  }
  
  .posts-tabs-wrapper.with-background-container.mobile-only-bg.style-light {
    background: var(--bg-color, #f8f9fa);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  }
}

/* === תיקונים נוספים לסגנון כהה עם ללא מסגרת === */
.posts-tabs-wrapper.style-dark .article-card.no-frame {
  background: transparent;
  box-shadow: none;
  border: none;
}

.posts-tabs-wrapper.style-dark .article-card.no-frame:hover {
  box-shadow: none;
  border: none;
}

/* === Responsive === */

/* טאבלטים */
@media screen and (max-width: 1024px) {
  .posts-tabs-wrapper {
    padding: 0 15px;
  }
  
  /* עיצוב כפתור */
  .posts-tabs-wrapper.nav-button .nav-button {
    width: 47px;  /* הגדלה ב-30% מ-36px */
    height: 70px; /* הגדלה ב-30% מ-54px */
    font-size: 36px; /* הגדלה ב-30% מ-28px */
    top: 75px; /* התאמה לטאבלט */
  }
  
  .posts-tabs-wrapper.nav-button .nav-prev {
    left: -42px; /* 90% מהכפתור בחוץ (47px * 0.9) */
  }
  
  .posts-tabs-wrapper.nav-button .nav-next {
    right: -42px; /* 90% מהכפתור בחוץ (47px * 0.9) */
  }
  
  /* עיצוב חץ פשוט נשאר כמו שהוא */
}

/* מסכים קטנים */
@media screen and (max-width: 768px) {
  /* נשאיר כאן רק עיצוב בסיסי, בלי התאמות מיוחדות */
  .posts-tabs-wrapper {
    padding: 0 10px;
  }
  
  /* הקטנת רווחים אנכיים בין הבלוקים במסכים קטנים */
  body.home .posts-tabs-wrapper .posts-tabs-section {
    margin: 0 auto !important;
  }
  
  .posts-tabs-wrapper.with-background-container:not(.mobile-only-bg) {
    margin-top: 0;
    margin-bottom: 0;
    padding: 16px 12px;
  }
  
  .posts-tabs-navigation {
    margin-bottom: 10px;
  }
  
  /* התאמת מיקום חיצים פשוטים למסכים קטנים */
  .posts-tabs-wrapper.nav-arrow .nav-button {
    top: 50%; /* במרכז המיכל גם במסכים קטנים */
    font-size: 56px;
    outline: none; /* הסרת קו המתאר גם בטאבלטים */
  }
  
  /* הסרת outline גם במצבי פוקוס ולחיצה בטאבלטים */
  .posts-tabs-wrapper.nav-arrow .nav-button:focus,
  .posts-tabs-wrapper.nav-arrow .nav-button:active {
    outline: none;
    box-shadow: none;
  }
}

/* מובייל */
@media screen and (max-width: 480px) {
  .posts-tabs-wrapper {
    padding: 0;
    width: 100%;
    overflow: visible; /* מאפשר ללחצנים לבלוט מחוץ למיכל */
  }
  
  /* הקטנת רווחים אנכיים נוספת במסכים קטנים מאוד */
  body.home .posts-tabs-wrapper .posts-tabs-section {
    margin: 0 auto !important;
  }
  
  .posts-tabs-wrapper.with-background-container:not(.mobile-only-bg) {
    margin-top: 0;
    margin-bottom: 0;
    padding: 12px 8px;
  }
  
  /* מיכל רקע רק במובייל - מפעיל את המיכל רקע */
  .posts-tabs-wrapper.with-background-container.mobile-only-bg {
    background: var(--bg-color, #f5f5f5);
    padding: 20px 10px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    margin-top: 0;
    margin-bottom: 0;
  }
  
  /* מיכל רקע רק במובייל ברוחב מלא */
  .posts-tabs-wrapper.with-background-container.mobile-only-bg.full-width-container {
    width: 100vw;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
    padding: 20px 10px;
    border-radius: 0;
    box-sizing: border-box;
  }
  
  /* מיכל רקע ברוחב מלא במובייל (כשהוא תמיד פעיל) */
  .posts-tabs-wrapper.with-background-container.full-width-container:not(.mobile-only-bg) {
    width: 100vw;
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
    padding: 20px 0;
    border-radius: 0;
    box-sizing: border-box;
  }
  
  .posts-tabs-wrapper.full-width-container .posts-tabs-section {
    padding: 0 10px;
  }
  
  .posts-tabs-content {
    overflow: visible; /* מאפשר ללחצנים לבלוט */
  }
  
  /* תיקון מיקום מרכזי של הכתבות */
  .posts-carousel {
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    padding: 0;
    width: 100%;
  }
  
  .posts-track {
    display: flex;
    gap: 30px; /* רווח בין הכתבות */
    padding: 0 15px; /* padding לקצוות */
    width: auto;
  }
  
  /* כל כתבה תופסת רוחב מסך פחות padding של ה-track וmargin בטיחותי */
  .posts-track[data-columns] .carousel-item {
    flex: 0 0 calc(100vw - 60px) !important;
    width: calc(100vw - 60px) !important;
    min-width: calc(100vw - 60px) !important;
    max-width: calc(100vw - 60px) !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block;
    box-sizing: border-box;
  }
  
  /* התאמת הכרטיסיות - הכרטיס עצמו ממלא את כל רוחב ה-item */
  .posts-tabs-wrapper .article-card {
    width: 100%;
    max-width: 100%;
    margin: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden; /* חשוב למנוע חריגה של התוכן */
    box-sizing: border-box;
  }
  
  .posts-tabs-wrapper .article-card figure {
    width: 100%;
    max-width: 100%;
    margin: 0;
    overflow: hidden;
    box-sizing: border-box;
    /* יחס התמונה נשאר כמו שהוגדר בהגדרות הכלליות */
  }
  
  /* כותרת יותר קומפקטית */
  .posts-tabs-wrapper .article-title {
    font-size: 1rem;
    margin: 10px 12px 6px; /* מרווח קטן לפני המטא-דאטה */
    -webkit-line-clamp: 2;
  }
  
  /* מטא-דאטה במובייל */
  .posts-tabs-wrapper .article-meta {
    font-size: 0.75rem;
    margin: 0 12px 8px;
    gap: 6px;
  }
  
  /* === סרגל הטאבים - התאמה דינמית === */
  .posts-tabs-navigation {
    margin-bottom: 15px;
    padding: 0 10px;
    overflow: hidden;
  }
  
  .tabs-list {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2px;
    overflow: hidden;
    flex-wrap: nowrap; /* אסור לרדת לשורה הבאה */
    width: 100%;
  }
  
  /* הסתרת scrollbar */
  .tabs-list::-webkit-scrollbar {
    display: none;
  }
  
  .tabs-list {
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  
  .tab-item {
    flex: 1 1 auto;
    min-width: 0; /* מאפשר להתכווץ */
  }
  
  /* גודל פונט דינמי בהתאם למספר הטאבים */
  .tab-button {
    padding: 8px 4px;
    font-size: clamp(11px, 2.5vw, 14px); /* גודל דינמי */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    display: block;
    outline: none; /* הסרת קו המתאר גם במובייל */
  }
  
  /* הסרת outline במצבי פוקוס ולחיצה במובייל */
  .tab-button:focus,
  .tab-button:active,
  .tab-item.active .tab-button {
    outline: none;
    box-shadow: none;
  }
  
  /* התאמה למספר טאבים שונה */
  .tabs-list:has(.tab-item:nth-child(5)) .tab-button {
    font-size: 12px;
    padding: 8px 3px;
  }
  
  .tabs-list:has(.tab-item:nth-child(6)) .tab-button {
    font-size: 11px;
    padding: 8px 2px;
  }
  
  .tabs-list:has(.tab-item:nth-child(7)) .tab-button {
    font-size: 10px;
    padding: 8px 2px;
  }
  
  /* כפתורי ניווט מותאמים - עיצוב כפתור */
  .posts-tabs-wrapper.nav-button .nav-button {
    width: 42px;  /* הגדלה ב-30% מ-32px */
    height: 62px; /* הגדלה ב-30% מ-48px */
    background: rgba(0, 0, 0, 0.7);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    font-size: 31px; /* הגדלה ב-30% מ-24px */
    top: 100px; /* מיקום מותאם למובייל */
    z-index: 10;
  }
  
  /* הלחצנים מתחילים מקצה המסך ממש */
  .posts-tabs-wrapper.nav-button .nav-prev {
    /* יציאה מה-padding של posts-tabs-section כדי להגיע לקצה המסך */
    left: -20px;
  }
  
  .posts-tabs-wrapper.nav-button .nav-next {
    /* יציאה מה-padding של posts-tabs-section כדי להגיע לקצה המסך */
    right: -20px;
  }
  
  /* כפתורי ניווט - עיצוב חץ פשוט במובייל */
  .posts-tabs-wrapper.nav-arrow .nav-button {
    width: 50px;
    height: 100px;
    font-size: 48px;
    top: 50%; /* במרכז המיכל גם במובייל */
    outline: none; /* הסרת קו המתאר גם במובייל */
  }
  
  /* הסרת outline גם במצבי פוקוס ולחיצה במובייל */
  .posts-tabs-wrapper.nav-arrow .nav-button:focus,
  .posts-tabs-wrapper.nav-arrow .nav-button:active {
    outline: none;
    box-shadow: none;
  }
  
  .posts-tabs-wrapper.nav-arrow .nav-prev {
    left: -30px; /* קרוב לקצה המסך */
  }
  
  .posts-tabs-wrapper.nav-arrow .nav-next {
    right: -30px; /* קרוב לקצה המסך */
  }
  
  /* התאמת המיכל הראשי */
  .posts-tabs-section {
    padding: 0 10px;
    overflow: visible; /* מאפשר ללחצנים לבלוט */
  }
  
  .section-title {
    font-size: 1.25rem;
    margin-bottom: 15px;
  }
}

/* === אנימציות === */
@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.tab-content.active .carousel-item {
  animation: slideIn 0.4s ease forwards;
  animation-delay: calc(var(--item-index, 0) * 0.05s);
}

/* === עיצוב נוסף לחווית משתמש === */

/* אינדיקטור טעינה */
.posts-tabs-wrapper.loading {
  opacity: 0.6;
  pointer-events: none;
}

.posts-tabs-wrapper.loading::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 40px;
  height: 40px;
  border: 3px solid #f3f3f3;
  border-top: 3px solid var(--secondary-color, #435068);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/* הדגשת טאב בעת מעבר */
.tab-item {
  position: relative;
}

.tab-item::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) scaleX(0);
  width: 100%;
  height: 3px;
  background: var(--secondary-color-jhhd);
  transition: transform 0.3s ease;
}

.tab-item:hover::after {
  transform: translateX(-50%) scaleX(0.8);
  background: var(--primary-color-jhhd);
}

.tab-item.active::after {
  transform: translateX(-50%) scaleX(1);
}

/* ===== _featured-posts-split.css ===== */
/* בלוק פוסטים מובילים עם חלוקה - פוסט גדול ו-4 קטנים */

/* Wrapper ראשי להגבלת רוחב */
.featured-posts-split-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
}

/* עוקף את הכללים הגלובליים של עמוד הבית */
body.home .featured-posts-split-wrapper {
    max-width: 1200px !important;
    width: auto !important;
}

body.home .featured-posts-split-section {
    margin: 40px auto !important;
    padding: 0 20px !important;
    width: auto !important;
}

.featured-posts-split-section {
    margin: 40px auto;
    padding: 0 20px;
    max-width: 1200px;
}

/* הכותרת משתמשת בעיצוב המשותף מקובץ _homepage-common.css */

/* קונטיינר ראשי עם חלוקה */
.featured-posts-split-container {
    display: flex;
    gap: 30px;
    margin: 0 auto;
}

/* כאשר הפוסט הגדול בצד ימין - הפוך את הסדר */
.featured-posts-split-container.main-right {
    flex-direction: row-reverse;
}

/* עמודת הפוסט הראשי - 50% מהרוחב */
.main-post-column {
    flex: 1;
    width: 50%;
}

/* עמודת הפוסטים הקטנים - 50% מהרוחב */
.side-posts-column {
    flex: 1;
    width: 50%;
}

/* גריד לפוסטים הקטנים - 2x2 */
.side-posts-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 20px;
    height: 100%;
}

/* כרטיסיית פוסט ראשי */
.main-post-card {
    background: #fff;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.main-post-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.12);
}

/* כרטיסיית פוסט קטן */
.side-post-card {
    background: #fff;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.side-post-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.12);
}

/* קונטיינר לתמונה עם יחס דינמי */
.post-image-container {
    position: relative;
    width: 100%;
    aspect-ratio: var(--aspect-ratio, 1 / 1);
    overflow: hidden;
    background-color: #f0f0f0;
}

.post-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.3s ease;
}

.main-post-card:hover .post-image-container img,
.side-post-card:hover .post-image-container img {
    transform: scale(1.05);
}

/* תוכן הפוסט */
.post-content {
    padding: 20px 20px 0px 20px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

/* תוכן הפוסט הקטן - יותר קומפקטי */
.side-post-card .post-content {
    padding: 15px 15px 0px 15px;
}

/* תגית קטגוריה */
.category-tag {
    display: inline-block;
    background-color: #f0f0f0;
    color: #333;
    padding: 4px 12px;
    border-radius: 3px;
    font-size: 1rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
    text-decoration: none;
    transition: all 0.2s ease;
    align-self: flex-start;
}

.category-tag:hover {
    background-color: var(--primary-color-jhhd);
    color: #fff;
    transform: translateY(-1px);
}

/* כותרת הפוסט הראשי */
.main-post-card .post-title {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 12px 0;
    color: var(--primary-text-color, #1a1a1a);
    transition: color 0.2s ease;
}

/* כותרת הפוסטים הקטנים */
.side-post-card .post-title {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
    margin: 0 0 8px 0;
    color: var(--primary-text-color, #1a1a1a);
    transition: color 0.2s ease;
    
    /* גובה קבוע של 2 שורות */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.8em;
}

/* תקציר הפוסט הראשי */
.main-post-card .post-excerpt {
    font-size: 1.2rem; /* גדלה ב-20% מ-1rem */
    line-height: 1.5;
    color: #666;
    margin-bottom: 15px;
    
    /* הגבלה ל-5 שורות בדסקטופ */
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* קישורים */
.main-post-card a,
.side-post-card a {
    text-decoration: none;
    color: inherit;
}

.main-post-card a:hover .post-title,
.side-post-card a:hover .post-title {
    color: var(--primary-color-jhhd);
}

/* מטא-דאטה */
.post-meta {
    font-size: 1rem;
    color: #666;
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid #666;
    display: flex;
    align-items: center;
    gap: 8px;
}

.side-post-card .post-meta {
    font-size: 1rem;
    padding-top: 8px;
}

.post-meta .author {
    font-weight: 500;
}

.post-meta .separator {
    color: #ccc;
}

.post-meta .date {
    color: #888;
}

/* סגנון כהה */
.featured-posts-split-container.style-dark {
    background: #2a2a2a;
    padding: 30px;
    border-radius: 8px;
}

.style-dark .main-post-card,
.style-dark .side-post-card {
    background: #333;
    color: #fff;
}

.style-dark .post-title {
    color: #fff;
}

.style-dark .post-excerpt,
.style-dark .post-meta {
    color: #ccc;
}

.style-dark .post-meta {
    border-top-color: #ccc;
}

.style-dark .category-tag {
    background-color: #444;
    color: #fff;
}

.style-dark .category-tag:hover {
    background-color: var(--primary-color-jhhd);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.style-dark a:hover .post-title {
    color: var(--primary-color-jhhd);
}

/* פינות מעוגלות */
.rounded-corners .main-post-card,
.rounded-corners .side-post-card {
    border-radius: 8px;
}

.rounded-corners .post-image-container {
    border-radius: 8px 8px 0 0;
}

/* כרטיסיות placeholder */
.main-post-card.placeholder,
.side-post-card.placeholder {
    opacity: 0.5;
    pointer-events: none;
}

.placeholder .post-image-container {
    background-color: #e0e0e0;
}

/* רספונסיביות */
@media (max-width: 1024px) {
    .featured-posts-split-container {
        gap: 20px;
    }
    
    .main-post-card .post-title {
        font-size: 1.3rem;
    }
}

@media (max-width: 768px) {
    /* במובייל - הפוסט הגדול למעלה, הקטנים למטה */
    .featured-posts-split-container {
        flex-direction: column;
        gap: 30px;
    }
    
    /* במובייל אין הבדל בין ימין לשמאל - תמיד עמודה */
    .featured-posts-split-container.main-right {
        flex-direction: column;
    }
    
    .main-post-column,
    .side-posts-column {
        width: 100%;
    }
    
    .side-posts-grid {
        gap: 15px;
    }
    
    .main-post-card .post-title {
        font-size: 1.4rem;
    }
    
    .side-post-card .post-title {
        font-size: 1rem;
    }
    
    /* הקטנה של 30% בגודל הפונט של המטא-דאטה במובייל */
    .post-meta {
        font-size: 0.7rem;
    }
    
    .side-post-card .post-meta {
        font-size: 0.7rem;
    }
    
    /* הקטנת מרווחים במובייל */
    .featured-posts-split-section {
        padding: 0 5px;
        margin: 20px auto;
    }
    
    .post-content {
        padding: 5px 5px 0px 5px;
    }
    
    .side-post-card .post-content {
        padding: 5px 5px 0px 5px;
    }
    
    /* עיצוב כהה במובייל - הקטנת המרווחים */
    .featured-posts-split-container.style-dark {
        padding: 10px;
    }
}

@media (max-width: 768px) {
    /* במובייל - פריסה מיוחדת ל-4 הכתבות הקטנות */
    .side-posts-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto auto auto;
        gap: 15px;
    }
    
    /* 2 הכתבות הראשונות - תופסות עמודה אחת כל אחת בשורה הראשונה */
    .side-posts-grid .side-post-item:nth-child(1) {
        grid-column: 1;
        grid-row: 1;
    }
    
    .side-posts-grid .side-post-item:nth-child(2) {
        grid-column: 2;
        grid-row: 1;
    }
    
    /* 2 הכתבות האחרונות - תופסות את כל הרוחב, כל אחת בשורה נפרדת */
    .side-posts-grid .side-post-item:nth-child(3) {
        grid-column: 1 / -1;
        grid-row: 2;
    }
    
    .side-posts-grid .side-post-item:nth-child(4) {
        grid-column: 1 / -1;
        grid-row: 3;
    }
    
    /* 2 הכתבות הראשונות - תצוגה אנכית (תמונה מעל, טקסט מתחת) */
    .side-posts-grid .side-post-item:nth-child(1) .side-post-card,
    .side-posts-grid .side-post-item:nth-child(2) .side-post-card {
        flex-direction: column;
        height: auto;
    }
    
    .side-posts-grid .side-post-item:nth-child(1) .post-image-container,
    .side-posts-grid .side-post-item:nth-child(2) .post-image-container {
        aspect-ratio: 1 / 1;
        width: 100%;
        height: auto;
    }
    
    /* הקטנת padding ב-2 הכתבות הראשונות */
    .side-posts-grid .side-post-item:nth-child(1) .post-content,
    .side-posts-grid .side-post-item:nth-child(2) .post-content {
        padding: 5px 5px 0px 5px;
    }
    
    /* הקטנת כותרת ב-2 הכתבות הראשונות */
    .side-posts-grid .side-post-item:nth-child(1) .post-title,
    .side-posts-grid .side-post-item:nth-child(2) .post-title {
        font-size: 1rem;
        -webkit-line-clamp: 2;
        min-height: 2.5em;
    }
    
    /* 2 הכתבות האחרונות - תצוגה אופקית (תמונה לצד טקסט) */
    .side-posts-grid .side-post-item:nth-child(3) .side-post-card,
    .side-posts-grid .side-post-item:nth-child(4) .side-post-card {
        flex-direction: row;
        height: 100px;
    }
    
    /* הבטחת רוחב קבוע לאלמנט הקישור של התמונה */
    .side-posts-grid .side-post-item:nth-child(3) .image-link,
    .side-posts-grid .side-post-item:nth-child(4) .image-link {
        display: block;
        width: 100px;
        height: 100px;
        flex-shrink: 0;
    }
    
    /* תמונה קטנה ריבועית לכתבות האופקיות */
    .side-posts-grid .side-post-item:nth-child(3) .post-image-container,
    .side-posts-grid .side-post-item:nth-child(4) .post-image-container {
        width: 100px;
        height: 100px;
        flex-shrink: 0;
        aspect-ratio: 1 / 1;
    }
    
    /* התאמת התוכן לכתבות האופקיות */
    .side-posts-grid .side-post-item:nth-child(3) .post-content,
    .side-posts-grid .side-post-item:nth-child(4) .post-content {
        padding: 5px 5px 0px 5px;
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    
    /* הסתרת תג קטגוריה בכתבות האופקיות */
    .side-posts-grid .side-post-item:nth-child(3) .category-tag,
    .side-posts-grid .side-post-item:nth-child(4) .category-tag {
        display: none;
    }
    
    /* הקטנת הכותרת בכתבות האופקיות */
    .side-posts-grid .side-post-item:nth-child(3) .post-title,
    .side-posts-grid .side-post-item:nth-child(4) .post-title {
        font-size: 1rem;
        -webkit-line-clamp: 2;
        min-height: 2.4em;
    }
    
    /* התאמת הפונט במטא-דאטה */
    .side-posts-grid .side-post-item:nth-child(3) .post-meta,
    .side-posts-grid .side-post-item:nth-child(4) .post-meta {
        font-size: 0.7rem;
        padding-top: 5px;
    }
    
    /* פינות מעוגלות לכתבות האופקיות */
    .rounded-corners .side-posts-grid .side-post-item:nth-child(3) .post-image-container,
    .rounded-corners .side-posts-grid .side-post-item:nth-child(4) .post-image-container {
        border-radius: 8px 0 0 8px;
    }
    
    /* כותרת הפוסט הראשי */
    .main-post-card .post-title {
        font-size: 1.3rem;
    }
    
    .main-post-card .post-excerpt {
        font-size: 1rem; /* חזרה לגודל המקורי במובייל */
        -webkit-line-clamp: 2;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

@media (max-width: 480px) {
    /* במובייל קטן מאוד - התאמות נוספות */
    .main-post-card .post-title {
        font-size: 1.2rem;
    }
    
    .post-content {
        padding: 5px 5px 0px 5px;
    }
    
    /* הקטנת מרווחים נוספת במובייל קטן */
    .featured-posts-split-section {
        padding: 0 5px;
        margin: 20px auto;
    }
    
    /* הקטנת הגודל של 2 הכתבות הראשונות */
    .side-posts-grid .side-post-item:nth-child(1) .post-title,
    .side-posts-grid .side-post-item:nth-child(2) .post-title {
        font-size: 1rem;
        -webkit-line-clamp: 2;
        min-height: 2.4em;
    }
    
    .side-posts-grid .side-post-item:nth-child(1) .post-content,
    .side-posts-grid .side-post-item:nth-child(2) .post-content {
        padding: 5px 5px 0px 5px;
    }
    
    .side-posts-grid .side-post-item:nth-child(1) .post-meta,
    .side-posts-grid .side-post-item:nth-child(2) .post-meta {
        font-size: 0.7rem;
    }
    
    /* עיצוב כהה במובייל קטן - הקטנת המרווחים */
    .featured-posts-split-container.style-dark {
        padding: 10px;
    }
}

/* אנימציות לטעינה */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.main-post-card {
    animation: fadeInUp 0.5s ease backwards;
}

.side-post-card {
    animation: fadeInUp 0.5s ease backwards;
}

/* עיכוב הדרגתי לאנימציה של הפוסטים הקטנים */
.side-post-item:nth-child(1) .side-post-card { animation-delay: 0.1s; }
.side-post-item:nth-child(2) .side-post-card { animation-delay: 0.15s; }
.side-post-item:nth-child(3) .side-post-card { animation-delay: 0.2s; }
.side-post-item:nth-child(4) .side-post-card { animation-delay: 0.25s; }

/* התאמות ליחסי תמונה שונים */
.featured-posts-split-container[data-aspect-ratio="3:2"] .post-image-container {
    aspect-ratio: 3 / 2;
}

.featured-posts-split-container[data-aspect-ratio="4:3"] .post-image-container {
    aspect-ratio: 4 / 3;
}

/* במובייל - יחס תמונה קבוע לפוסט הראשי */
@media (max-width: 768px) {
    .main-post-card .post-image-container {
        aspect-ratio: 16 / 9;
    }
}



/* ===== _mixed-layout.css ===== */
/**
 * === בלוק פריסה משולבת ===
 * בלוק עם כתבות אנכיות בימין וכתבות אופקיות בשמאל
 */

/* Wrapper ראשי */
.mixed-layout-wrapper {
    max-width: 1200px;
    margin: 20px auto 20px;
    width: 100%;
    transition: all 0.3s ease;
}

/* מיכל רקע */
.mixed-layout-container.has-background-container {
    padding: 40px 20px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    box-sizing: border-box;
    /* padding נספר בתוך מגבלת הרוחב */
    margin-top: 20px;
    /* ריווח מהכותרת */
}

/* מסגרת למיכל */
.mixed-layout-container.has-border {
    border-style: solid;
}

/* עוקף כללים גלובליים בעמוד הבית */
body.home .mixed-layout-wrapper {
    max-width: 1200px !important;
    width: auto !important;
}

/* התאמה כשיש מיכל רקע */
body.home .mixed-layout-container.has-background-container {
    max-width: 100% !important;
    width: auto !important;
}

/* יישור ומרווחים של המיכל הפנימי */
.mixed-layout-wrapper .mixed-layout-section.section-container {
    margin: 20px auto;
    padding: 0 20px;
    max-width: 1200px;
}

body.home .mixed-layout-wrapper .mixed-layout-section.section-container {
    margin: 20px auto !important;
    padding: 0 20px !important;
    width: auto !important;
}

/* התאמה כשיש מיכל רקע - לא צריך יותר שינויים מיוחדים */
.mixed-layout-container.has-background-container {
    /* הסגנונות כבר מוגדרים למעלה */
}

/* מיכל ראשי מחולק לשני חלקים */
.mixed-layout-container {
    display: flex;
    gap: 20px;
    width: 100%;
    margin-top: 20px;
    align-items: stretch;
}

/* כאשר layout_direction הוא ltr - הפוך את הסדר */
.mixed-layout-container.layout-ltr {
    flex-direction: row-reverse;
}

/* חלק ימני - כתבות אנכיות (דינמי לפי --split-ratio) */
.mixed-layout-container .vertical-posts-column {
    flex: 0 0 calc(var(--split-ratio, 50%) - 10px);
    width: calc(var(--split-ratio, 50%) - 10px);
    display: flex;
    align-items: flex-start;
}

/* חלק שמאלי - כתבות אופקיות (דינמי - השלמה ל-100%) */
.mixed-layout-container .horizontal-posts-column {
    flex: 0 0 calc((100% - var(--split-ratio, 50%)) - 10px);
    width: calc((100% - var(--split-ratio, 50%)) - 10px);
}

/* === חלק ימני - כתבות אנכיות === */
.vertical-posts-column .posts-grid-square-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    width: 100%;
}

/* תמיכה ב-3 כתבות */
.vertical-posts-column .posts-grid-square-container.cols-3 {
    grid-template-columns: repeat(3, 1fr);
}

/* תמיכה ב-4 כתבות */
.vertical-posts-column .posts-grid-square-container.cols-4 {
    grid-template-columns: repeat(4, 1fr);
}

/* כרטיסיית כתבה אנכית */
.vertical-posts-column .article-card-square {
    display: flex;
    flex-direction: column;
    background: var(--cards-bg-color, var(--white));
    transition: var(--transition-default);
    overflow: hidden;
}

.style-dark .vertical-posts-column .article-card-square {
    background: #545454;
    color: var(--white);
}

.vertical-posts-column .article-card-square:hover {
    transform: translateY(-5px);
    box-shadow: var(--box-shadow);
}

/* תמונה בכרטיס אנכי */
.vertical-posts-column .square-image-container {
    aspect-ratio: var(--aspect-ratio, 1 / 1);
    overflow: hidden;
    width: 100%;
    flex-shrink: 0;
}

.vertical-posts-column .square-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: var(--transition-default);
}

.vertical-posts-column .article-card-square:hover img {
    transform: scale(1.05);
}

/* תוכן כרטיס אנכי */
.vertical-posts-column .article-content {
    padding: 15px;
    display: flex;
    flex-direction: column;
    flex: 1;
    justify-content: space-between;
}

/* התאמות ל-4 כתבות - פדינג קטן יותר */
.vertical-posts-column .posts-grid-square-container.cols-4 .article-content {
    padding: 10px;
}

.vertical-posts-column .article-content.no-frame {
    padding: 10px 0;
}

.vertical-posts-column .article-title {
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.25;
    margin: 8px 0;
    color: var(--heading-color, #333);

    /* הגבלה ל-3 שורות עם ellipsis */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 3.75em; /* מקום ל-3 שורות */
}

/* התאמות ל-4 כתבות - כותרת קטנה יותר */
.vertical-posts-column .posts-grid-square-container.cols-4 .article-title {
    font-size: 1rem;
    margin: 8px 0;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 5.2em; /* מקום ל-4 שורות עם פונט קטן יותר */
}

.vertical-posts-column .article-meta {
    font-size: clamp(0.64rem, 1.53vw, 0.72rem);
    color: var(--gray-medium);
    margin-top: auto;
    overflow: hidden;
    display: flex;
    align-items: center;
    gap: 3px;
    flex-wrap: wrap;
    line-height: 1.1;
}

.style-dark .vertical-posts-column .article-meta {
    color: #ccc;
}

/* === חלק שמאלי - כתבות אופקיות === */
.horizontal-posts-column .posts-horizontal-wrapper {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* כרטיסיית כתבה אופקית */
.horizontal-posts-column .most-read-articles-grid {
    display: flex;
    height: 155px;
    align-items: stretch;
}

.horizontal-posts-column .wp-block-column {
    width: 100%;
}

.horizontal-posts-column .most-read-article {
    display: flex;
    background: var(--cards-bg-color, var(--white));
    transition: var(--transition-default);
    overflow: hidden;
    align-items: stretch;
    height: 100%;
}

.style-dark .horizontal-posts-column .most-read-article {
    background: #545454;
    color: var(--white);
}

.horizontal-posts-column .most-read-article:hover {
    transform: translateX(-5px);
    box-shadow: var(--box-shadow);
}

/* כיוון תצוגה */
.horizontal-posts-column .direction-ltr .most-read-article {
    flex-direction: row;
}

.horizontal-posts-column .direction-rtl .most-read-article {
    flex-direction: row-reverse;
}

/* תמונה בכרטיס אופקי */
.horizontal-posts-column .most-read-image {
    flex: 0 0 40%;
    margin: 0;
    overflow: hidden;
    position: relative;
    height: 100%;
}

.horizontal-posts-column .most-read-image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: var(--transition-default);
}

.horizontal-posts-column .most-read-article:hover img {
    transform: scale(1.05);
}

/* תוכן כרטיס אופקי */
.horizontal-posts-column .most-read-content {
    flex: 1;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.horizontal-posts-column .most-read-content.no-frame {
    padding: 15px;
}

.horizontal-posts-column .most-read-title {
    font-size: 1.15rem;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 10px;
    color: var(--heading-color, #333);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 2.6em; /* מקום לשתי שורות */
}

.horizontal-posts-column .most-read-excerpt {
    font-size: 0.9rem;
    color: var(--gray-dark);
    margin-bottom: 10px;
    line-height: 1.4;
}

.style-dark .horizontal-posts-column .most-read-excerpt {
    color: #ccc;
}

.horizontal-posts-column .most-read-meta {
    font-size: clamp(0.75rem, 1.8vw, 0.85rem);
    color: var(--gray-medium);
    margin-top: auto;
    overflow: hidden;
    display: flex;
    align-items: center;
    gap: 3px;
    flex-wrap: wrap;
    line-height: 1.2;
}

.style-dark .horizontal-posts-column .most-read-meta {
    color: #ccc;
}

/* תגית קטגוריה משותפת */
.mixed-layout-container .category-tag {
    display: inline-block;
    background-color: #444;
    color: #fff;
    padding: 3px 8px;
    border-radius: 3px;
    font-size: 0.7rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.35px;
    margin-bottom: 8px;
    text-decoration: none;
    transition: all 0.2s ease;
}

.style-dark .mixed-layout-container .category-tag {
    background-color: #444;
    color: #ddd;
}

/* סגנון כהה - רקע כהה למיכל הראשי */
.mixed-layout-container.style-dark {
    background: #2a2a2a;
    padding: 30px;
    border-radius: 8px;
}

.style-dark .mixed-layout-container .category-tag:hover {
    background-color: var(--primary-color, #0073aa);
}

/* דריסה ממוקדת: תגיות בכתבות אופקיות בתוך mixed-layout יהיו זהות לאנכיות */
.mixed-layout-container .most-read-articles-grid .category-tag {
    background-color: #444;
    color: #fff;
    font-size: 0.7rem;
    padding: 3px 8px;
    letter-spacing: 0.35px;
}

.mixed-layout-container .most-read-articles-grid .category-tag:hover {
    background-color: var(--primary-color, #0073aa);
    color: #fff;
    transform: translateY(-1px);
}

/* תיקון סלקטור למצב כהה כשהמחלקות על אותו אלמנט */
.mixed-layout-container.style-dark .category-tag {
    background-color: #444;
    color: #ddd;
}

.mixed-layout-container.style-dark .most-read-articles-grid .category-tag {
    background-color: #444;
    color: #ddd;
    font-size: 0.7rem;
    padding: 3px 8px;
    letter-spacing: 0.35px;
}

.mixed-layout-container.style-dark .most-read-articles-grid .category-tag:hover,
.mixed-layout-container.style-dark .category-tag:hover {
    background-color: var(--primary-color, #0073aa);
}

/* צבעי טקסט במצב כהה */
.style-dark .vertical-posts-column .article-title,
.style-dark .horizontal-posts-column .most-read-title {
    color: #fff;
}

.style-dark a:hover .article-title,
.style-dark a:hover .most-read-title {
    color: #4db8ff;
}

/* צבע אחיד לכותרות בקישורים */
a .vertical-posts-column .article-title,
a .horizontal-posts-column .most-read-title {
    color: var(--heading-color, #333);
}

a:hover .vertical-posts-column .article-title,
a:hover .horizontal-posts-column .most-read-title {
    color: var(--primary-color, #0073aa);
}

.mixed-layout-container .category-tag:hover {
    background-color: var(--primary-color, #0073aa);
    color: #fff;
    transform: translateY(-1px);
}

/* פינות מעוגלות */
.rounded-corners .article-card-square,
.rounded-corners .most-read-article {
    border-radius: 10px;
    overflow: hidden;
}

.rounded-corners .square-image-container,
.rounded-corners .most-read-image {
    border-radius: 0;
}

/* placeholder לכרטיסיות ריקות */
.mixed-layout-container .placeholder {
    opacity: 0.3;
    pointer-events: none;
}

/* הפרדה בין פריטים */
.mixed-layout-container .separator {
    margin: 0 8px;
    color: var(--gray-medium);
}

/* התאמת גובה לתמונות אופקיות לפי יחס */
.horizontal-posts-column [data-aspect-ratio="16:9"] .most-read-image {
    min-height: 120px;
}

.horizontal-posts-column [data-aspect-ratio="4:3"] .most-read-image {
    min-height: 140px;
}

.horizontal-posts-column [data-aspect-ratio="3:2"] .most-read-image {
    min-height: 130px;
}

.horizontal-posts-column [data-aspect-ratio="1:1"] .most-read-image {
    min-height: 160px;
}

/* === Responsive === */

/* התאמת מיכל רקע ועיצוב כהה בטאבלט */
@media (max-width: 1024px) {
    .mixed-layout-container.has-background-container {
        padding: 30px 15px;
    }

    .mixed-layout-container.style-dark {
        padding: 25px;
    }
}

/* טאבלט */
@media screen and (max-width: 1024px) {
    .mixed-layout-container {
        gap: 20px;
    }

    .vertical-posts-column .posts-grid-square-container {
        gap: 15px;
    }

    .horizontal-posts-column .posts-horizontal-wrapper {
        gap: 15px;
    }
}

/* התאמת מיכל רקע ועיצוב כהה במובייל */
@media (max-width: 768px) {
    .mixed-layout-container.has-background-container {
        padding: 25px 12px;
        border-radius: 6px;
    }

    body.home .mixed-layout-container.has-background-container {
        max-width: 100% !important;
        width: auto !important;
    }

    .mixed-layout-container.style-dark {
        padding: 20px;
        border-radius: 6px;
    }
}

/* טאבלט קטן */
@media screen and (max-width: 768px) {
    .mixed-layout-container {
        flex-direction: column !important;
        /* חשוב: במובייל תמיד עמודה */
        gap: 10px;
    }

    .mixed-layout-container .vertical-posts-column,
    .mixed-layout-container .horizontal-posts-column {
        flex: 1 1 100%;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* התאמה ל-3 כתבות בטאבלט - 2 עמודות */
    .vertical-posts-column .posts-grid-square-container.cols-3 {
        grid-template-columns: repeat(2, 1fr);
    }

    /* התאמה ל-4 כתבות בטאבלט - 2 עמודות */
    .vertical-posts-column .posts-grid-square-container.cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }

    /* במובייל - התמונה באופקי תהיה מעל */
    .horizontal-posts-column .most-read-article {
        flex-direction: column !important;
    }

    .horizontal-posts-column .most-read-articles-grid {
        height: auto;
        /* בטל גובה קבוע במובייל */
        min-height: 250px;
    }

    .horizontal-posts-column .most-read-image {
        flex: 1 1 auto;
        width: 100%;
        height: 200px;
    }
}

/* התאמת מיכל רקע ועיצוב כהה במסכים קטנים */
@media (max-width: 600px) {
    .mixed-layout-container.has-background-container {
        padding: 20px 10px;
    }

    .mixed-layout-container.style-dark {
        padding: 15px;
    }
}

/* התאמת מיכל רקע ועיצוב כהה במסכים קטנים מאוד */
@media (max-width: 400px) {
    .mixed-layout-container.has-background-container {
        padding: 15px 8px;
        border-radius: 4px;
    }

    body.home .mixed-layout-container.has-background-container {
        max-width: 100% !important;
        width: auto !important;
    }

    .mixed-layout-container.style-dark {
        padding: 12px;
        border-radius: 4px;
    }
}

/* מובייל */
@media screen and (max-width: 480px) {
    .vertical-posts-column .posts-grid-square-container {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }

    /* גם ב-3 כתבות - עדיין שתי עמודות במובייל קטן */
    .vertical-posts-column .posts-grid-square-container.cols-3 {
        grid-template-columns: repeat(2, 1fr);
    }

    /* גם ב-4 כתבות - עדיין שתי עמודות במובייל קטן */
    .vertical-posts-column .posts-grid-square-container.cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }

    .horizontal-posts-column .posts-horizontal-wrapper {
        gap: 20px;
    }

    .vertical-posts-column .article-content,
    .horizontal-posts-column .most-read-content {
        padding: 12px;
    }

    .vertical-posts-column .article-title,
    .horizontal-posts-column .most-read-title {
        font-size: 1rem;
    }

    .horizontal-posts-column .most-read-excerpt {
        font-size: 0.9rem;
    }
}

/* === מובייל משופר: פריסה כמו featured-posts-split (עד 768px) === */
@media (max-width: 768px) {

    /* חלק אנכי: הכתבה הראשונה גדולה, השתיים הבאות בשתי עמודות */
    .vertical-posts-column .posts-grid-square-container {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        /* תאום ריווח עם האופקי */
    }

    /* פריט ראשון גדול ברוחב מלא */
    .vertical-posts-column .posts-grid-square-container>*:first-child {
        grid-column: 1 / -1;
    }
    
    /* הוספת רקע לכל הכרטיסיות האנכיות במובייל */
    .vertical-posts-column .article-card-square {
        background: var(--cards-bg-color, #ffffff) !important;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
        border-radius: 8px !important;
    }

    .vertical-posts-column .posts-grid-square-container>*:first-child .square-image-container {
        aspect-ratio: 16 / 9;
    }

    .vertical-posts-column .posts-grid-square-container>*:first-child .article-title {
        font-size: 1.2rem;
        font-weight: 700;
        max-height: 4.2em;
    }

    /* פריטים 2-3 בעמודה כפולה (ברירת מחדל של repeat(2,1fr)) */
    .vertical-posts-column .posts-grid-square-container>*:nth-child(2) .square-image-container,
    .vertical-posts-column .posts-grid-square-container>*:nth-child(3) .square-image-container {
        aspect-ratio: 1 / 1;
    }

    .vertical-posts-column .posts-grid-square-container>*:nth-child(2) .article-title,
    .vertical-posts-column .posts-grid-square-container>*:nth-child(3) .article-title {
        font-size: 1rem;
        -webkit-line-clamp: 2;
        min-height: 2.8em;
    }

    .vertical-posts-column .posts-grid-square-container>*:nth-child(2) .article-content,
    .vertical-posts-column .posts-grid-square-container>*:nth-child(3) .article-content {
        padding: 12px;
    }

    /* חלק אופקי: כל שאר הכתבות אופקיות (תמונה 100px + טקסט) */
    .mixed-layout-container .horizontal-posts-column .posts-horizontal-wrapper {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .mixed-layout-container .horizontal-posts-column .most-read-articles-grid {
        flex-direction: column !important;
        gap: 10px !important;
        /* התאמת ריווח בין כתבות אופקיות */
        height: auto !important;
        min-height: 0 !important;
        width: 100% !important;
    }

    .mixed-layout-container .horizontal-posts-column .wp-block-column {
        flex-basis: 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .mixed-layout-container .horizontal-posts-column .most-read-article {
        flex-direction: row !important;
        /* לא להפוך את הראשונה לאנכית */
        height: 100px !important;
        margin: 0 !important;
        width: 100% !important;
        background: var(--cards-bg-color, #ffffff) !important;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
        border-radius: 8px !important;
    }

    .mixed-layout-container .horizontal-posts-column .most-read-image-link {
        aspect-ratio: 1 / 1 !important;
        flex-basis: 100px !important;
        width: 100px !important;
        height: 100px !important;
        flex-shrink: 0;
    }

    .mixed-layout-container .horizontal-posts-column .most-read-image {
        width: 100px !important;
        height: 100px !important;
        margin: 0 !important;
        border-radius: 8px 0 0 8px !important;
        overflow: hidden !important;
    }

    .mixed-layout-container .horizontal-posts-column .most-read-content {
        flex: 1;
        padding: 8px 12px !important;
        height: 100%;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    /* כותרות ומטא בכתבות האופקיות */
    .mixed-layout-container .horizontal-posts-column .most-read-title {
        font-size: 1rem;
        -webkit-line-clamp: 2;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        max-height: 2.4em; /* מקום לשתי שורות במובייל */
        margin: 0 0 6px 0 !important;
    }

    .mixed-layout-container .horizontal-posts-column .most-read-meta {
        font-size: clamp(0.7rem, 1.5vw, 0.8rem) !important;
        margin-top: auto !important;
        overflow: hidden;
        display: flex;
        align-items: center;
        gap: 2px;
        flex-wrap: wrap;
        line-height: 1.1;
    }

    /* הסתרת תגית קטגוריה באופקיות כדי לחסוך מקום */
    .mixed-layout-container .horizontal-posts-column .category-tag {
        display: none !important;
    }

    /* דריסות ספציפיות: התמודדות עם כללי first-child שמקורם ב-_posts-horizontal.css */
    .mixed-layout-container .horizontal-posts-column .most-read-articles-grid .wp-block-column:first-child .most-read-article {
        flex-direction: row !important;
        height: 100px !important;
    }

    .mixed-layout-container .horizontal-posts-column .most-read-articles-grid .wp-block-column:first-child .most-read-image-link {
        aspect-ratio: 1 / 1 !important;
        flex-basis: 100px !important;
        width: 100px !important;
        height: 100px !important;
        flex-shrink: 0;
    }

    .mixed-layout-container .horizontal-posts-column .most-read-articles-grid .wp-block-column:first-child .most-read-image {
        width: 100px !important;
        height: 100px !important;
        margin: 0 !important;
    }

    .mixed-layout-container .horizontal-posts-column .most-read-articles-grid .wp-block-column:first-child .most-read-content {
        padding: 8px 12px !important;
        height: 100%;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .mixed-layout-container .horizontal-posts-column .most-read-articles-grid .wp-block-column:first-child .most-read-title {
        font-size: 1rem;
        -webkit-line-clamp: 2;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        max-height: 2.4em; /* מקום לשתי שורות במובייל */
        margin: 0 0 6px 0 !important;
    }

    /* === כלל חדש: החל מהפריט הרביעי בעמודה האנכית — העבר לאופקי ושורה מלאה === */
    .vertical-posts-column .posts-grid-square-container>*:nth-child(n+4) {
        grid-column: 1 / -1;
        /* תופס שורה מלאה */
    }

    .vertical-posts-column .posts-grid-square-container>*:nth-child(n+4) .article-card-square {
        flex-direction: row;
        /* אופקי */
        height: 100px;
        /* גובה קומפקטי */
    }

    .vertical-posts-column .posts-grid-square-container>*:nth-child(n+4) .image-link {
        display: block;
        width: 100px;
        height: 100px;
        flex-shrink: 0;
    }

    .vertical-posts-column .posts-grid-square-container>*:nth-child(n+4) .square-image-container {
        width: 100px;
        height: 100px;
        aspect-ratio: 1 / 1;
        flex-shrink: 0;
    }

    .vertical-posts-column .posts-grid-square-container>*:nth-child(n+4) .article-content {
        flex: 1;
        padding: 8px 12px;
        height: 100%;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .vertical-posts-column .posts-grid-square-container>*:nth-child(n+4) .category-tag {
        display: none;
        /* חיסכון מקום באופקי */
    }

    .vertical-posts-column .posts-grid-square-container>*:nth-child(n+4) .article-title {
        font-size: 1rem;
        -webkit-line-clamp: 2;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin: 0 0 6px 0;
    }

    .vertical-posts-column .posts-grid-square-container>*:nth-child(n+4) .article-meta {
        font-size: clamp(0.7rem, 1.5vw, 0.8rem);
        margin-top: auto;
        overflow: hidden;
        display: flex;
        align-items: center;
        gap: 2px;
        flex-wrap: wrap;
        line-height: 1.1;
    }
}

/* ===== _banner-display.css ===== */
/* בלוק תצוגת באנר */

/* Wrapper ראשי להגבלת רוחב - כמו בבלוק posts-grid-square */
.banner-display-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
}

/* וידוא שהמגבלה חלה גם על body.home */
body.home .banner-display-wrapper {
    max-width: 1200px !important;
    width: auto !important;
    margin: 0 auto !important;
}

.banner-display-block {
    width: 100%;
    margin: 0 auto 20px auto; /* הקטנת מרווח תחתון מ-40px ל-20px */
}

.banner-display-block .banner-container {
    width: 100%;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

/* פינות עגולות */
.banner-display-block.rounded-corners .banner-container {
    border-radius: 12px;
}

.banner-display-block.rounded-corners .banner-wrapper {
    border-radius: 12px;
}

.banner-display-block.rounded-corners img {
    border-radius: 12px;
}

/* ללא פינות עגולות */
.banner-display-block.no-rounded .banner-container,
.banner-display-block.no-rounded .banner-wrapper,
.banner-display-block.no-rounded img {
    border-radius: 0;
}

.banner-display-block .banner-wrapper {
    position: relative;
    width: 100%;
    overflow: hidden;
}

/* עיצוב placeholder כשאין באנר */
.banner-display-block.banner-placeholder .banner-wrapper {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

/* פינות עגולות ל-placeholder */
.banner-display-block.banner-placeholder.rounded-corners .banner-wrapper {
    border-radius: 12px;
}

.banner-display-block .placeholder-content,
.banner-display-block .fallback-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: white;
    width: 90%;
}

.banner-display-block .placeholder-text h3,
.banner-display-block .fallback-text h3 {
    font-size: 24px;
    margin: 0 0 10px 0;
    font-weight: 700;
}

.banner-display-block .placeholder-text p,
.banner-display-block .fallback-text p {
    font-size: 16px;
    margin: 5px 0;
    opacity: 0.9;
}

.banner-display-block .placeholder-text small {
    font-size: 14px;
    opacity: 0.8;
}

/* עיצוב באנר אמיתי */
.banner-display-block .ttfc-banner {
    width: 100%;
    height: 100%;
}

.banner-display-block .ttfc-banner img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* תמיכה בבאנר גמיש */
.banner-display-block .ttfc-banner-flexible_wide {
    width: 100%;
    height: auto;
}

.banner-display-block .ttfc-banner-flexible_wide img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* fallback לבאנר גמיש */
.flexible-banner-fallback {
    padding: 40px 20px;
    text-align: center;
    background: #f9f9f9;
    border: 2px dashed #ddd;
    border-radius: 8px;
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ביטול מרווחים מיותרים בעמוד הבית */
body.home .banner-display-block {
    margin-top: 5px; /* מרווח קטן מהבלוק מעל */
}

/* אם הבאנר הוא הבלוק הראשון - ביטול מרווח עליון */
body.home .section-container:first-of-type .banner-display-block,
body.home .section-container:first-of-type .banner-display-wrapper {
    margin-top: 0 !important;
}

/* מרווח מצומצם בין בלוקים */
body.home .banner-display-block + * {
    margin-top: 10px;
}

/* ביטול מרווחים של section-container כשמכיל באנר */
body.home .section-container:has(.banner-display-block) {
    margin: 0 auto !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* פתרון חלופי למדפדפנים שלא תומכים ב-:has - מרווח חיובי קטן */
body.home .banner-display-wrapper {
    margin-top: 5px !important; /* מרווח קטן מהבלוק מעל */
}

/* ביטול מרווחים ספציפיים לבלוקי עמוד הבית */
body.home .wp-block-group.section-container:has(.banner-display-block) {
    margin-top: 0 !important;
    margin-bottom: 10px !important;
}

/* עיצוב מיוחד לממשק הניהול - צבע אדום כתום לפרסומת */
.homepage-block-content.banner-block-content {
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    border: 2px solid #e65100;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(230, 81, 0, 0.2);
}

.homepage-block-content.banner-block-content h3 {
    color: white;
    margin-top: 0;
    font-size: 18px;
    font-weight: 700;
}

.banner-block-indicator {
    background: rgba(255, 255, 255, 0.25);
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    margin-right: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.banner-display-info {
    background: rgba(255, 255, 255, 0.95);
    padding: 15px;
    border-radius: 8px;
    margin-top: 15px;
}

.current-ratio-info {
    margin-bottom: 15px;
    font-size: 14px;
    color: #333;
}

.ratio-display {
    background: #e3f2fd;
    color: #1976d2;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    margin-right: 8px;
}

.rounded-display {
    background: #e8f5e8;
    color: #2e7d32;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    margin-right: 8px;
}

.banner-preview-placeholder {
    border: 2px dashed #ddd;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 8px;
    transition: border-radius 0.3s ease;
}

/* תצוגה מקדימה ללא פינות עגולות */
.banner-display-info[data-rounded="no"] .banner-preview-placeholder {
    border-radius: 0;
}

.banner-content-notice {
    background: #fff3cd;
    border: 1px solid #ffeaa7;
    border-radius: 6px;
    padding: 12px;
    margin-top: 15px;
}

.banner-content-notice p {
    margin: 8px 0;
    font-size: 13px;
    color: #856404;
}

.banner-content-notice strong {
    color: #533f03;
}

/* הגדרות מבנה בכרטיסיית מבנה העמוד */
.block-structure-setting .banner-ratio-setting {
    width: 100%;
    max-width: 300px;
}

/* צבע רקע מיוחד לבלוק באנר בממשק מבנה העמוד - אדום כתום */
.homepage-structure-manager .block-item[data-block-type="banner-display"] {
    background: linear-gradient(135deg, #ff8a65 0%, #ffb74d 100%);
    border: 2px solid #e65100;
    box-shadow: 0 3px 10px rgba(230, 81, 0, 0.15);
}

.homepage-structure-manager .block-item[data-block-type="banner-display"] h4 {
    color: #bf360c;
    font-weight: 700;
}

.homepage-structure-manager .block-item[data-block-type="banner-display"] p {
    color: #d84315;
    font-weight: 500;
}

.homepage-structure-manager .block-item[data-block-type="banner-display"] .dashicons {
    color: #bf360c;
}

/* רספונסיביות */
@media (max-width: 768px) {
    .banner-display-wrapper {
        padding: 0 20px; /* מרווח של 20px בצדדים במובייל (כמו בדסקטופ) */
        /* הסרת margin שלילי כדי לשמור על מרווח של 5px */
    }
    
    .banner-display-block {
        margin-bottom: 10px; /* מרווח מינימלי במובייל */
        margin-top: 5px !important; /* מרווח קטן מהבלוק מעל */
    }
    
    /* ביטול מרווחים של section-container במובייל */
    body.home .section-container:has(.banner-display-block) {
        margin: 0 auto !important;
        padding: 0 !important;
    }
    
    /* פתרון חלופי למובייל */
    body.home .wp-block-group.section-container:has(.banner-display-block) {
        margin: 0 !important;
    }
    
    .banner-display-block .placeholder-text h3,
    .banner-display-block .fallback-text h3 {
        font-size: 20px;
    }
    
    .banner-display-block .placeholder-text p,
    .banner-display-block .fallback-text p {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .banner-display-wrapper {
        padding: 0 20px; /* מרווח של 20px בצדדים גם במסכים קטנים */
        /* הסרת margin שלילי כדי לשמור על מרווח של 5px */
    }
    
    .banner-display-block {
        margin-bottom: 5px; /* מרווח מינימלי במסכים קטנים */
        margin-top: 5px !important; /* מרווח קטן מהבלוק מעל */
    }
    
    /* ביטול מרווחים לחלוטין במסכים קטנים */
    body.home .section-container:has(.banner-display-block),
    body.home .wp-block-group.section-container:has(.banner-display-block) {
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .banner-display-block .placeholder-text h3,
    .banner-display-block .fallback-text h3 {
        font-size: 18px;
    }
    
    .banner-display-block .placeholder-text p,
    .banner-display-block .fallback-text p {
        font-size: 13px;
    }
}

