.anlamtv-five-mix {
    margin: 24px 0;
}

body.rtl .anlamtv-five-mix {
    direction: rtl;
}

.anlamtv-five-mix__title {
    font-size: 22px;
    margin: 0 0 16px;
    padding-inline-start: 12px;
    border-inline-start: 4px solid #d32f2f;
}

.anlamtv-five-mix__title a {
    color: #222;
    text-decoration: none;
}

.anlamtv-five-mix__body {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 0;
    border-radius: 6px;
    overflow: hidden;
}

.anlamtv-five-mix__big {
    position: relative;
    display: block;
    box-sizing: border-box;
    border: 1px solid #fff; /* خط سفید صریح، مستقل از رنگ پس‌زمینه‌ی هر عنصر اطراف */
    overflow: hidden;
    text-decoration: none;
    min-height: 320px;
    background: #333;
}

.anlamtv-five-mix__big-thumb {
    position: absolute;
    inset: 0;
    display: block;
}

.anlamtv-five-mix__big-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.anlamtv-five-mix__big-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, transparent 60%);
}

.anlamtv-five-mix__big-content {
    position: absolute;
    inset-inline-start: 0;
    inset-inline-end: 0;
    bottom: 0;
    padding: 20px;
    z-index: 2;
}

.anlamtv-five-mix__big-category {
    display: inline-block;
    background: #d32f2f;
    color: #fff;
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 3px;
    margin-bottom: 8px;
}

.anlamtv-five-mix__big-title {
    display: block;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.5;
    margin-bottom: 6px;
}

.anlamtv-five-mix__big-date {
    display: block;
    color: rgba(255, 255, 255, 0.75);
    font-size: 12px;
}

/* --- ۴ پست فرعی: شبکه‌ی ۲×۲ از تصاویر تمام‌عرض، به‌هم‌چسبیده و فقط با یک
   خط سفید نازک از هم جدا. این خط با border سفید صریح روی هر خانه ساخته
   می‌شود (نه با gap روی پس‌زمینه‌ی کانتینر)، چون تکیه‌کردن به پس‌زمینه‌ی یک
   عنصر والد قابل‌اعتماد نیست (اگر جایی پس‌زمینه‌ی تیره تعریف شود، اثر خط
   سفید از بین می‌رود). با border، خط همیشه و در هر عرضی (چه حالت دو ستونه،
   چه حالتی که در صفحه‌های باریک همه‌چیز زیر هم می‌رود) تضمین‌شده سفید است. */
.anlamtv-five-mix__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 0;
    height: 100%;
    min-height: 320px;
    overflow: hidden;
}

.anlamtv-five-mix__grid-item {
    position: relative;
    display: block;
    box-sizing: border-box;
    border: 1px solid #fff; /* خط سفید صریح، مستقل از رنگ پس‌زمینه‌ی هر عنصر اطراف */
    overflow: hidden;
    background: #333;
    text-decoration: none;
    min-height: 0; /* برای رعایت درست ارتفاع سلول‌های گرید */
}

.anlamtv-five-mix__grid-thumb {
    position: absolute;
    inset: 0;
    display: block;
}

.anlamtv-five-mix__grid-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.anlamtv-five-mix__grid-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.15) 60%, transparent 100%);
}

.anlamtv-five-mix__grid-content {
    position: absolute;
    inset-inline-start: 0;
    inset-inline-end: 0;
    bottom: 0;
    padding: 10px 12px;
    z-index: 2;
}

.anlamtv-five-mix__grid-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #fff;
    font-size: 13px;
    font-weight: bold;
    line-height: 1.5;
    margin-bottom: 4px;
}

.anlamtv-five-mix__grid-date {
    display: block;
    color: rgba(255, 255, 255, 0.8);
    font-size: 11px;
}

@media (max-width: 480px) {
    .anlamtv-five-mix__grid {
        min-height: 240px;
    }
    .anlamtv-five-mix__grid-title {
        font-size: 12px;
    }
}

@media (max-width: 782px) {
    .anlamtv-five-mix__body {
        grid-template-columns: 1fr;
    }
    .anlamtv-five-mix__big {
        min-height: 220px;
    }
}