/* ==========================================================
   strip — سلايدر المميزات أسفل الهيرو (حافة سحابية)
   ========================================================== */

:root {
    --ebmnt1-strip-background: var(--ebmnt1-color-helper-pink-soft);
    --ebmnt1-strip-scallop-color: var(--ebmnt1-color-helper-pink-soft);
    --ebmnt1-strip-text-color: var(--ebmnt1-color-helper-purple);
    --ebmnt1-strip-icon-background: var(--ebmnt1-color-white);
    --ebmnt1-strip-icon-color-one: var(--ebmnt1-color-primary);
    --ebmnt1-strip-icon-color-two: var(--ebmnt1-color-secondary);
    --ebmnt1-strip-icon-color-three: var(--ebmnt1-color-helper-mint-strong);
    --ebmnt1-strip-icon-color-four: var(--ebmnt1-color-helper-sky-strong);
    --ebmnt1-strip-icon-shadow-color: var(--ebmnt1-color-shadow);
    --ebmnt1-strip-font-size: clamp(0.85rem, 0.78rem + 0.4vw, 1.05rem);
    --ebmnt1-strip-scallop-size: 2.6rem;
}

.ebmnt1-strip {
    position: relative;
    z-index: 2;
    justify-content: center;
    min-height: 7.5rem;
    background-color: var(--ebmnt1-strip-background);
}

.ebmnt1-strip::before {
    content: "";
    position: absolute;
    inset-inline: 0;
    bottom: calc(100% - 1px);
    height: calc(var(--ebmnt1-strip-scallop-size) / 2);
    background-image: radial-gradient(circle at 50% 100%, var(--ebmnt1-strip-scallop-color) 0 68%, transparent 70%);
    background-size: var(--ebmnt1-strip-scallop-size) 100%;
    background-repeat: repeat-x;
    background-position: center bottom;
}

.ebmnt1-strip__inner {
    --ebmnt1-slider-visible: 1;
}

.ebmnt1-strip__item {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.8em;
    padding: 0.4em 0.8em;
    color: var(--ebmnt1-strip-text-color);
    font-size: var(--ebmnt1-strip-font-size);
    font-weight: 600;
    text-align: start;
    line-height: 1.4;
}

.ebmnt1-strip__item-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    font-size: 1.3rem;
    background-color: var(--ebmnt1-strip-icon-background);
    box-shadow: 0 0.25em 0 -0.05em var(--ebmnt1-strip-icon-shadow-color);
}

.ebmnt1-strip__slide:nth-child(4n + 1) .ebmnt1-strip__item-icon i { color: var(--ebmnt1-strip-icon-color-one); }
.ebmnt1-strip__slide:nth-child(4n + 2) .ebmnt1-strip__item-icon i { color: var(--ebmnt1-strip-icon-color-two); }
.ebmnt1-strip__slide:nth-child(4n + 3) .ebmnt1-strip__item-icon i { color: var(--ebmnt1-strip-icon-color-three); }
.ebmnt1-strip__slide:nth-child(4n + 4) .ebmnt1-strip__item-icon i { color: var(--ebmnt1-strip-icon-color-four); }

@media (min-width: 768px) {
    .ebmnt1-strip__inner {
        --ebmnt1-slider-visible: 2;
    }
}

@media (min-width: 1024px) {
    .ebmnt1-strip__inner {
        --ebmnt1-slider-visible: 3;
    }
}

@media (min-width: 1440px) {
    .ebmnt1-strip__inner {
        --ebmnt1-slider-visible: 4;
    }
}
