/* ==========================================================
   ebmnt1-previous-work.css
   أعمالنا السابقة: سلايدر كروت على خلفية زرقاء
   (نفس أسلوب كروت المدونة في الديمو: صورة 16/9 + شارة تاريخ صفراء بركن مقطوع)
   السلايدر: أزرار قبل/بعد + mouse grab + touch + جزء ظاهر من الكارد السابق والتالي
   ========================================================== */

:root {
    /* ---------- ألوان ---------- */
    --ebmnt1-previous-work-background-color: var(--ebmnt1-color-primary-blue);
    --ebmnt1-previous-work-card-background-color: var(--ebmnt1-color-helper-surface);
    --ebmnt1-previous-work-date-background-color: var(--ebmnt1-color-secondary-yellow);
    --ebmnt1-previous-work-date-text-color: var(--ebmnt1-color-helper-heading-dark);
    --ebmnt1-previous-work-meta-icon-color: var(--ebmnt1-color-primary-blue);
    --ebmnt1-previous-work-meta-text-color: var(--ebmnt1-color-helper-heading-dark);
    --ebmnt1-previous-work-title-text-color: var(--ebmnt1-color-helper-heading-dark);
    --ebmnt1-previous-work-title-hover-text-color: var(--ebmnt1-color-helper-body-gray);
    --ebmnt1-previous-work-paragraph-text-color: var(--ebmnt1-color-helper-body-gray);
    --ebmnt1-previous-work-card-shadow-color: var(--ebmnt1-color-helper-shadow);

    /* ---------- مقاسات ---------- */
    --ebmnt1-previous-work-edge-gap: 4em;
    --ebmnt1-previous-work-slides-per-view: 1;
    --ebmnt1-previous-work-card-radius: 15px;
    --ebmnt1-previous-work-image-ratio: 16 / 9;
    --ebmnt1-previous-work-date-size: 3.4rem;
    --ebmnt1-previous-work-body-gap: 0.6em;
    --ebmnt1-previous-work-meta-gap: 0.9em 1.5em;
    --ebmnt1-previous-work-meta-icon-size: clamp(0.9rem, 0.85rem + 0.2vw, 1.1rem);
    --ebmnt1-previous-work-body-padding: 1.25em;
}

@media (min-width: 768px) {
    :root {
        --ebmnt1-previous-work-edge-gap: 5em;
        --ebmnt1-previous-work-slides-per-view: 2;
    }
}

@media (min-width: 1024px) {
    :root {
        --ebmnt1-previous-work-edge-gap: 7em;
        --ebmnt1-previous-work-slides-per-view: 3;
        --ebmnt1-previous-work-body-padding: 1.875em;
    }
}

.ebmnt1-previous-work {
    gap: var(--ebmnt1-previous-work-edge-gap);
    background-color: var(--ebmnt1-previous-work-background-color);
}

.ebmnt1-previous-work__heading {
    max-width: 100%;
}

.ebmnt1-previous-work__slide {
    flex-basis: calc((100% - (var(--ebmnt1-previous-work-slides-per-view) - 1) * var(--ebmnt1-components-slider-gap)) / var(--ebmnt1-previous-work-slides-per-view));
}

/* ---------- الكارد ---------- */
.ebmnt1-previous-work__card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--ebmnt1-previous-work-card-radius);
    background-color: var(--ebmnt1-previous-work-card-background-color);
    transition: transform var(--ebmnt1-transition-base), box-shadow var(--ebmnt1-transition-base);
}

.ebmnt1-previous-work__card:hover {
    transform: translateY(-6px);
    box-shadow: 0 14px 30px var(--ebmnt1-previous-work-card-shadow-color);
}

.ebmnt1-previous-work__image-link {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: var(--ebmnt1-previous-work-image-ratio);
}

.ebmnt1-previous-work__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.ebmnt1-previous-work__card:hover .ebmnt1-previous-work__image {
    transform: scale(1.06);
}

/* شارة التاريخ (بركن علوي مقطوع زي الديمو بعد التعكيس) */
.ebmnt1-previous-work__date {
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: var(--ebmnt1-previous-work-date-size);
    height: var(--ebmnt1-previous-work-date-size);
    border-radius: 0 var(--ebmnt1-previous-work-card-radius) 0 0;
    background-color: var(--ebmnt1-previous-work-date-background-color);
    font-size: var(--ebmnt1-font-size-label);
    font-weight: var(--ebmnt1-font-weight-semibold);
    line-height: 1.15;
    text-align: center;
    color: var(--ebmnt1-previous-work-date-text-color);
}

.ebmnt1-previous-work__body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: var(--ebmnt1-previous-work-body-gap);
    padding: var(--ebmnt1-previous-work-body-padding);
}

.ebmnt1-previous-work__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ebmnt1-previous-work-meta-gap);
}

.ebmnt1-previous-work__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.45em;
    font-size: var(--ebmnt1-font-size-caption);
    color: var(--ebmnt1-previous-work-meta-text-color);
}

.ebmnt1-previous-work__meta-icon {
    font-size: var(--ebmnt1-previous-work-meta-icon-size);
    color: var(--ebmnt1-previous-work-meta-icon-color);
}

.ebmnt1-previous-work__title {
    font-size: var(--ebmnt1-font-size-small-title);
    font-weight: var(--ebmnt1-font-weight-semibold);
    color: var(--ebmnt1-previous-work-title-text-color);
}

.ebmnt1-previous-work__title-link {
    transition: color var(--ebmnt1-transition-base);
}

.ebmnt1-previous-work__title-link:hover {
    color: var(--ebmnt1-previous-work-title-hover-text-color);
}

.ebmnt1-previous-work__text {
    font-size: var(--ebmnt1-font-size-body);
    color: var(--ebmnt1-previous-work-paragraph-text-color);
}