/* ==========================================================
   ebmnt1-why-choose.css
   سكشن "لماذا تختارنا" (تحت الهيرو) - مبني على سكشن Our Services في الديمو:
   - صورة كبيرة بـ ركنين مقطوعين (notch): عدّاد الخبرة + صورة صغيرة
   - شبكة 2x2 من النقاط بفواصل رفيعة
   النقطة الواحدة: الصف الأول (أيقونة + اسم) بـ flex-start
   والصف التاني الشرح (فقرة أو unordered list)
   ========================================================== */

:root {
    /* ---------- ألوان ---------- */
    --ebmnt1-why-choose-counter-card-background-color: var(--ebmnt1-color-primary-blue);
    --ebmnt1-why-choose-counter-number-text-color: var(--ebmnt1-color-helper-white);
    --ebmnt1-why-choose-counter-caption-text-color: var(--ebmnt1-color-helper-white);

    --ebmnt1-why-choose-point-icon-color: var(--ebmnt1-color-primary-blue);
    --ebmnt1-why-choose-point-title-text-color: var(--ebmnt1-color-helper-heading-dark);
    --ebmnt1-why-choose-point-text-color: var(--ebmnt1-color-helper-body-gray);
    --ebmnt1-why-choose-point-divider-color: var(--ebmnt1-color-helper-border-gray);
    --ebmnt1-why-choose-point-list-icon-color: var(--ebmnt1-color-secondary-yellow);
    --ebmnt1-why-choose-point-list-text-color: var(--ebmnt1-color-helper-body-gray);

    /* ---------- مقاسات ---------- */
    --ebmnt1-why-choose-layout-gap: 2.5em;
    --ebmnt1-why-choose-text-column-gap: 1.75em;
    --ebmnt1-why-choose-media-height: 34.375rem;
    --ebmnt1-why-choose-small-image-height: 10rem;
    --ebmnt1-why-choose-small-image-tab-width: 75.3%;
    --ebmnt1-why-choose-card-radius: 15px;
    --ebmnt1-why-choose-counter-font-size: clamp(2.5rem, 2rem + 2vw, 4.5rem);

    --ebmnt1-why-choose-point-padding: 1.25em;
    --ebmnt1-why-choose-point-padding-wide: 1.875em;
    --ebmnt1-why-choose-point-gap: 0.75em;
    --ebmnt1-why-choose-point-head-gap: 0.9em;
    --ebmnt1-why-choose-point-icon-size: clamp(2rem, 1.7rem + 1vw, 2.6rem);
    --ebmnt1-why-choose-point-list-gap: 0.5em;
    --ebmnt1-why-choose-point-list-icon-size: clamp(0.85rem, 0.8rem + 0.2vw, 1rem);
}

@media (min-width: 768px) {
    :root {
        --ebmnt1-why-choose-media-height: 40rem;
        --ebmnt1-why-choose-small-image-height: 12.5rem;
        --ebmnt1-why-choose-small-image-tab-width: 84.4%;
    }
}

@media (min-width: 1024px) {
    :root {
        --ebmnt1-why-choose-layout-gap: 3.125em;
        --ebmnt1-why-choose-media-height: 42.1875rem;
    }
}

.ebmnt1-why-choose__layout {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--ebmnt1-why-choose-layout-gap);
}

/* ---------- الصور ---------- */
.ebmnt1-why-choose__media {
    width: 100%;
}

.ebmnt1-why-choose__media-frame {
    height: var(--ebmnt1-why-choose-media-height);
}

.ebmnt1-why-choose__counter-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25em;
    padding: 1.25em;
    border-radius: var(--ebmnt1-why-choose-card-radius);
    background-color: var(--ebmnt1-why-choose-counter-card-background-color);
    text-align: center;
}

.ebmnt1-why-choose__counter-number {
    font-size: var(--ebmnt1-why-choose-counter-font-size);
    font-weight: var(--ebmnt1-font-weight-bold);
    line-height: 1;
    color: var(--ebmnt1-why-choose-counter-number-text-color);
}

.ebmnt1-why-choose__counter-caption {
    font-size: var(--ebmnt1-font-size-label);
    font-weight: var(--ebmnt1-font-weight-medium);
    line-height: 1.2;
    color: var(--ebmnt1-why-choose-counter-caption-text-color);
}

.ebmnt1-why-choose__small-image-tab {
    width: var(--ebmnt1-why-choose-small-image-tab-width);
}

.ebmnt1-why-choose__small-image {
    width: 100%;
    height: var(--ebmnt1-why-choose-small-image-height);
    object-fit: cover;
    border-radius: var(--ebmnt1-why-choose-card-radius);
}

/* ---------- العمود النصي ---------- */
.ebmnt1-why-choose__text-column {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--ebmnt1-why-choose-text-column-gap);
}

/* ---------- النقاط ---------- */
.ebmnt1-why-choose__points {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    text-align: start;
}

.ebmnt1-why-choose__point {
    flex: 0 0 100%;
    display: flex;
    flex-direction: column;
    gap: var(--ebmnt1-why-choose-point-gap);
    padding-block: var(--ebmnt1-why-choose-point-padding);
    border-bottom: 1px solid var(--ebmnt1-why-choose-point-divider-color);
}

.ebmnt1-why-choose__point:first-child {
    padding-block-start: 0;
}

.ebmnt1-why-choose__point:last-child {
    padding-block-end: 0;
    border-bottom: 0;
}

/* الصف الأول: الأيقونة + الاسم */
.ebmnt1-why-choose__point-head {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: var(--ebmnt1-why-choose-point-head-gap);
}

.ebmnt1-why-choose__point-icon {
    flex-shrink: 0;
    font-size: var(--ebmnt1-why-choose-point-icon-size);
    line-height: 1.2;
    color: var(--ebmnt1-why-choose-point-icon-color);
}

.ebmnt1-why-choose__point-title {
    font-size: var(--ebmnt1-font-size-card-title);
    font-weight: var(--ebmnt1-font-weight-semibold);
    line-height: 1.3;
    color: var(--ebmnt1-why-choose-point-title-text-color);
}

/* الصف التاني: الشرح (فقرة أو قايمة) */
.ebmnt1-why-choose__point-body {
    color: var(--ebmnt1-why-choose-point-text-color);
}

.ebmnt1-why-choose__point-list {
    display: flex;
    flex-direction: column;
    gap: var(--ebmnt1-why-choose-point-list-gap);
}

.ebmnt1-why-choose__point-list-item {
    display: flex;
    align-items: flex-start;
    gap: 0.6em;
    color: var(--ebmnt1-why-choose-point-list-text-color);
}

.ebmnt1-why-choose__point-list-icon {
    flex-shrink: 0;
    font-size: var(--ebmnt1-why-choose-point-list-icon-size);
    line-height: var(--ebmnt1-line-height-body);
    color: var(--ebmnt1-why-choose-point-list-icon-color);
}

/* ---------- تابلت: عمودين بفواصل ---------- */
@media (min-width: 768px) {
    .ebmnt1-why-choose__text-column .ebmnt1-section-heading {
        align-items: flex-start;
        text-align: start;
    }

    .ebmnt1-why-choose__point,
    .ebmnt1-why-choose__point:first-child,
    .ebmnt1-why-choose__point:last-child {
        flex: 0 0 50%;
        padding-block: var(--ebmnt1-why-choose-point-padding-wide);
        border-bottom: 0;
    }

    .ebmnt1-why-choose__point:nth-child(odd) {
        padding-inline: 0 var(--ebmnt1-why-choose-point-padding-wide);
        border-inline-end: 1px solid var(--ebmnt1-why-choose-point-divider-color);
    }

    .ebmnt1-why-choose__point:nth-child(even) {
        padding-inline: var(--ebmnt1-why-choose-point-padding-wide) 0;
    }

    .ebmnt1-why-choose__point:nth-child(-n + 2) {
        padding-block-start: 0;
        border-bottom: 1px solid var(--ebmnt1-why-choose-point-divider-color);
    }

    .ebmnt1-why-choose__point:nth-child(n + 3) {
        padding-block-end: 0;
    }
}

/* ---------- لابتوب: الصور جنب النص ---------- */
@media (min-width: 1024px) {
    .ebmnt1-why-choose__layout {
        flex-direction: row;
        align-items: center;
    }

    .ebmnt1-why-choose__media {
        flex: 0 0 40%;
        width: 40%;
    }

    .ebmnt1-why-choose__text-column {
        flex: 1 1 0;
        width: auto;
    }
}
