/* ================================================================
   iranboschcenter.com — «پیشنهاد ویژه»
   پنل تیره‌ی فروشگاه (تلفن/واتساپ/توضیح «قیمت روز») کنار کروسلی از
   محصولات هم‌وزن. کارت‌ها سفید روی نوار خاکستریِ روشن، سایه فقط در hover.
   ================================================================ */

.dl {
    background: #f5f6f7;
    border-top: 1px solid #eaecef;
    border-bottom: 1px solid #eaecef;
    padding: 2rem 0 2.25rem;
    margin: 2.5rem 0;
}
.dl__inner {
    max-width: var(--home-max, 1320px);
    margin: 0 auto;
    padding: 0 var(--home-pad, 1rem);
}

/* ---------------- سرصفحه ---------------- */
.dl__head {
    display: flex; align-items: center; gap: .7rem;
    margin-bottom: 1rem;
}
.dl__title {
    margin: 0; font-size: 1.3rem; font-weight: 800; color: #0f1111;
    letter-spacing: -.015em;
}
.dl__chip {
    flex-shrink: 0;
    background: var(--color-primary, #e20015); color: #fff;
    font-size: .72rem; font-weight: 800;
    border-radius: .3rem; padding: .22rem .55rem; white-space: nowrap;
}
.dl__tools { margin-inline-start: auto; display: flex; align-items: center; gap: .6rem; }
.dl__all {
    display: inline-flex; align-items: center; gap: .2rem;
    font-size: .8rem; font-weight: 700; color: #0f5b8c; white-space: nowrap;
}
.dl__all svg { width: 14px; height: 14px; }
.dl__all:hover { color: var(--color-primary, #e20015); text-decoration: underline; }

/* ---------------- چیدمان ---------------- */
.dl__body { display: grid; gap: .9rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 940px) {
    .dl__body { grid-template-columns: 290px minmax(0, 1fr); gap: 1rem; align-items: stretch; }
}
@media (min-width: 1200px) {
    .dl__body { grid-template-columns: 320px minmax(0, 1fr); }
}

/* ================================================================
   بج درصد تخفیف — گوشه‌ی بالای تصویر
   ================================================================ */
.doff {
    position: absolute; top: 0; inset-inline-start: 0;
    display: inline-flex; align-items: baseline; gap: 1px;
    background: var(--color-primary, #e20015); color: #fff;
    font-size: .78rem; font-weight: 800; line-height: 1;
    padding: .34rem .5rem;
    border-end-end-radius: .5rem;
    direction: ltr;
}
.doff i { font-style: normal; font-size: .9em; }

/* ================================================================
   قیمت
   ================================================================ */
.dprice { display: block; line-height: 1.4; }
.dprice b { font-size: 1rem; font-weight: 800; color: #0f1111; letter-spacing: -.01em; }
.dprice--ph { min-height: 1.4rem; }   /* کارت بدون قیمت هم‌قدِ بقیه بماند */

.dwas {
    display: block; font-size: .72rem; color: #6b7280; line-height: 1.7;
    min-height: 1.22rem;                 /* کارت‌های بدون «قیمت قبل» کوتاه‌تر نشوند */
}
.dwas del { color: #8b95a3; text-decoration-color: #d0555f; }
.dwas--ph { visibility: hidden; }

/* ================================================================
   پنل فروشگاه — جای کارت «شاخص» را گرفت
   ================================================================ */
.dpanel {
    background: #0b1b2b; color: #cbd5e1;
    border-radius: .6rem;
    padding: 1.25rem 1.15rem 1.35rem;
    display: flex; flex-direction: column;
    min-width: 0;
}
.dpanel__kicker {
    font-size: .66rem; font-weight: 800; letter-spacing: .14em;
    color: #7d8ba0; margin-bottom: .45rem;
}
.dpanel__title {
    margin: 0 0 .55rem; font-size: 1.05rem; font-weight: 800; color: #fff;
    line-height: 1.8;
}
.dpanel__text {
    margin: 0 0 1.1rem; font-size: .78rem; line-height: 2.05; color: #93a1b5;
}

.dpanel__phone {
    display: flex; align-items: center; justify-content: center; gap: .5rem;
    background: var(--color-primary, #e20015); color: #fff;
    font-size: 1.15rem; font-weight: 800; letter-spacing: .04em;
    border-radius: .45rem; padding: .7rem 1rem;
    transition: background .15s;
}
.dpanel__phone:hover { background: var(--color-primary-dark, #b00010); color: #fff; }
.dpanel__phone svg { width: 17px; height: 17px; flex-shrink: 0; }

.dpanel__wa {
    display: flex; align-items: center; justify-content: center; gap: .45rem;
    margin-top: .5rem;
    background: rgba(255,255,255,.06); color: #e2e8f0;
    border: 1px solid rgba(255,255,255,.12);
    font-size: .8rem; font-weight: 700;
    border-radius: .45rem; padding: .6rem 1rem;
    transition: background .15s, border-color .15s;
}
.dpanel__wa:hover { background: rgba(37,211,102,.14); border-color: rgba(37,211,102,.4); color: #fff; }
.dpanel__wa svg { width: 16px; height: 16px; flex-shrink: 0; color: #25d366; }

.dpanel__hours {
    margin: .8rem 0 0; text-align: center;
    font-size: .7rem; color: #7d8ba0;
}

/* ================================================================
   کروسل کارت‌های تخفیف
   ================================================================ */
.dl__rail-wrap { min-width: 0; }
.dl__rail { gap: .7rem; padding: .5rem .15rem .35rem; }

.dcard {
    flex: 0 0 auto;
    width: 150px;
    display: flex; flex-direction: column;
    background: #fff; border: 1px solid #e7e9ec; border-radius: .6rem;
    padding: .55rem;
    scroll-snap-align: start;
    transition: border-color .15s, box-shadow .15s, transform .15s;
}
.dcard:hover {
    border-color: #cfd4da;
    box-shadow: 0 6px 18px rgba(15, 17, 17, .1);
    transform: translateY(-2px);
}
@media (min-width: 480px)  { .dcard { width: 168px; } }
@media (min-width: 768px)  { .dcard { width: 182px; } }
@media (min-width: 1200px) { .dl__rail { gap: .85rem; } .dcard { width: 196px; } }

.dcard__media {
    position: relative; display: block; aspect-ratio: 1 / 1;
    background: #fff; border-radius: .35rem; overflow: hidden;
    margin-bottom: .5rem;
}
.dcard__media img { width: 100%; height: 100%; object-fit: contain; display: block; }

.dcard__info { display: flex; flex-direction: column; min-width: 0; }
.dcard__name {
    margin-bottom: .35rem;
    font-size: .76rem; font-weight: 500; color: #3a4250; line-height: 1.75;
    /* عنوان کامل؛ min-height برای هم‌ترازیِ عنوان‌های کوتاه می‌ماند */
    display: block; overflow-wrap: anywhere; min-height: 2.66em;
}
.dcard:hover .dcard__name { color: #0f5b8c; }

/* ================================================================
   موبایل
   ================================================================ */
@media (max-width: 939px) {
    .dl__nav { display: none; }          /* با انگشت اسکرول می‌شود */
    /* لبه‌ی ریل تا کنار صفحه برود تا معلوم باشد ادامه دارد */
    .dl__rail-wrap { margin-inline: calc(-1 * var(--home-pad, 1rem)); }
    .dl__rail { padding-inline: var(--home-pad, 1rem); }
}
@media (max-width: 559px) {
    .dl { padding: 1.6rem 0 1.85rem; margin: 1.75rem 0; }
    .dl__inner { padding: 0 .85rem; }
    .dl__head { flex-wrap: wrap; gap: .5rem; margin-bottom: .85rem; }
    .dl__title { font-size: 1.1rem; }

    .dpanel { padding: 1rem .95rem 1.1rem; }
    .dpanel__title { font-size: .95rem; }
    .dpanel__text { font-size: .75rem; line-height: 1.95; margin-bottom: .9rem; }
    .dpanel__phone { font-size: 1.05rem; }

    .dl__rail-wrap { margin-inline: -.85rem; }
    .dl__rail { padding-inline: .85rem; }
}