/* ===== بخش «مهر را ببینید» در صفحه‌ی اصلی — چیدمان بنتو روی Loop Grid المنتور =====
   روی ویجت Loop Grid کلاس CSS «mehr-bento» بگذارید (Advanced → CSS Classes).
   ۶ آیتم در هر بلوک: آیتم ۱ و ۴ دو ردیف را می‌گیرند (در RTL: راست و وسط-چپ). nth-of-type چون المنتور بین آیتم‌ها <style> می‌گذارد. */
.mehr-bento .elementor-loop-container {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-auto-rows: 200px;
  gap: 16px !important;
}
.mehr-bento .elementor-loop-container > .e-loop-item { height: 100%; min-height: 0; }
.mehr-bento .elementor-loop-container > .e-loop-item:nth-of-type(6n + 1),
.mehr-bento .elementor-loop-container > .e-loop-item:nth-of-type(6n + 4) { grid-row: span 2; }

/* تبلت: ۲ ستون، آیتم‌های بلند همچنان ۲ ردیف */
@media (max-width: 1024px) {
  .mehr-bento .elementor-loop-container { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; grid-auto-rows: 180px; }
}
/* موبایل: ویدئو تمام‌عرض، بقیه ۲ ستونه، بدون span */
@media (max-width: 767px) {
  .mehr-bento .elementor-loop-container { grid-auto-rows: 130px; gap: 12px !important; }
  .mehr-bento .elementor-loop-container > .e-loop-item:nth-of-type(6n + 1) { grid-row: auto; grid-column: span 2; }
  .mehr-bento .elementor-loop-container > .e-loop-item:nth-of-type(6n + 4) { grid-row: auto; }
}

/* ===== قالب آیتم (Loop Item) — کارت آلبوم =====
   کانتینر ریشه‌ی قالب: کلاس «album-card»، پس‌زمینه = تصویر شاخص (Dynamic)، گردی ۲۴px، overflow hidden. */
.album-card { position: relative; border-radius: 24px; overflow: hidden; height: 100%; isolation: isolate; transition: transform .25s ease; }
.album-card:hover { transform: translateY(-2px); }
.album-card::after { /* گرادیان پایین برای خوانایی برچسب */
  content: ""; position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(180deg, rgba(23,33,43,0) 55%, rgba(23,33,43,.55) 100%);
}
.album-card > * { position: relative; z-index: 1; }
.album-card .album-cap { /* برچسب پایین: عنوان + نشان مقطع + تعداد */
  position: absolute; right: 12px; left: 12px; bottom: 12px;
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
  background: rgba(23,33,43,.6); color: #fff; padding: 8px 12px; border-radius: 12px;
  font-size: 13px; font-weight: 600; backdrop-filter: blur(4px);
}
.album-card .album-play { /* دکمه‌ی پخش برای آلبوم‌های ویدئویی */
  position: absolute; inset: 0; margin: auto; width: 60px; height: 60px; border-radius: 999px;
  background: #E9B949; color: #17212B; display: grid; place-items: center; box-shadow: 0 12px 32px rgba(0,0,0,.25);
}

/* ===== چیپ‌های فیلتر (ویجت Taxonomy Filter) ===== */
.mehr-filter .e-filter-item {
  height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid #E2E8F0; background: #fff;
  font-size: 14px; font-weight: 600; color: #17212B;
}
.mehr-filter .e-filter-item[aria-pressed="true"], .mehr-filter .e-filter-item.e-active {
  background: #164E63; border-color: #164E63; color: #fff;
}

/* ===== صفحه‌ی گالری کامل — Loop Grid با Masonry روشن، ۴ ستون، فاصله ۱۶ ===== */
.mehr-masonry .album-card { min-height: 180px; }

/* کارت‌های آلبوم داخل بنتو ارتفاع ردیف را می‌گیرند */
.mehr-bento .album-card, .mehr-bento .e-loop-item > .e-con { min-height: 0 !important; height: 100%; }
