/* =========================================================
   Master Count – Design Polish layer
   טוען אחרי Bricks. תוסף-בלבד, אינו משנה מבנה קיים.
   צבעים: charcoal #404D57 (brand-1-200) · אדום #db2323 · אפור #F5F5F5
   ========================================================= */

/* ---------- 1. כרטיסי בלוג (ארכיון /blog/) ---------- */

/* גריד: כרטיסים בגובה אחיד + מרווח נוח */
.blog--listing__wrapper {
  align-items: stretch;
  gap: 2.6rem;
}
.blog--listing__wrapper > article {
  height: 100%;
  display: flex;
}

/* הכרטיס עצמו (תגית <a>) */
.blog--listing__item--wrapper {
  height: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 0 !important;
  background: #fff;
  border: 1px solid var(--gray-160, #dadada);
  border-radius: 14px;
  overflow: hidden;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(43, 52, 59, 0.04);
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}
.blog--listing__item--wrapper:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 38px -14px rgba(43, 52, 59, 0.30);
  border-color: transparent;
}

/* תמונה ביחס אחיד 3:2 עם object-fit */
.blog--listing__item--wrapper figure {
  margin: 0;
  width: 100%;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: var(--gray-140, #f5f5f5);
}
.blog--listing__item--wrapper figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}
.blog--listing__item--wrapper:hover figure img {
  transform: scale(1.05);
}

/* אזור הטקסט */
.blog--listing__item--wrapper > div {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 1.8rem 2rem 2.2rem;
  flex: 1 1 auto;
}

/* "זמן קריאה" – מטא קטן ומאופק */
.blog--listing__item--wrapper .brxe-text-basic {
  font-size: var(--text-xs, 1.25rem);
  color: var(--gray-180, #828282);
  font-weight: 500;
  letter-spacing: 0.01em;
  margin: 0;
}

/* כותרת הכרטיס – גודל נורמלי, 2 שורות מקסימום */
.blog--listing__item--title {
  font-size: var(--text-l, 1.8rem) !important;
  line-height: 1.35 !important;
  font-weight: 600;
  color: var(--gray-200, #363636);
  margin: 0 !important;
  min-height: 0 !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.25s ease;
}
.blog--listing__item--wrapper:hover .blog--listing__item--title {
  color: var(--brand-1-200, #404d57);
}

@media (max-width: 767px) {
  .blog--listing__item--wrapper > div { padding: 1.6rem 1.6rem 1.8rem; }
}