/* =========================================================
   KIJI MATCHA — CUSTOM CSS
   نسخة مرتبة ونظيفة
   ========================================================= */


/* =========================================================
   01 — البطاقات الثلاث
   KIJI MATCHA / KIJI BUSINESS / KIJI BOX
   ========================================================= */


/* ---------- القسم الرئيسي ---------- */

.s-block--square-links {
    width: 100% !important;
    max-width: none !important;

    /* المسافة بين هذا القسم والعنصر الذي فوقه */
    margin: 5px 0 0 !important;

    /* 5px من أطراف الشاشة */
    padding: 0 5px !important;

    box-sizing: border-box !important;
}


/* إلغاء عرض Container الافتراضي */

.s-block--square-links > div {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* ---------- شبكة البطاقات ---------- */

.s-block--square-links .square-links__grid {
    display: grid !important;

    /* 3 بطاقات متساوية */
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

    width: 100% !important;
    max-width: none !important;

    /* المسافة بين البطاقات */
    gap: 5px !important;

    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;
}


/* ---------- البطاقة ---------- */

.s-block--square-links .square-links__item {
    position: relative !important;

    width: 100% !important;

    /* =====================================
       ارتفاع البطاقة على الكمبيوتر
       عدّل هذا الرقم فقط لتغيير الارتفاع
       ===================================== */
    height: 600px !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    box-sizing: border-box !important;
}


/* ---------- رابط البطاقة ---------- */

.s-block--square-links .square-links__item > a {
    position: relative !important;

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    box-sizing: border-box !important;
}


/* ---------- صورة البطاقة ---------- */

.s-block--square-links .square-links__item img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;
    object-position: center !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* ---------- عنوان البطاقة ---------- */

.s-block--square-links .square-links__item h2,
.s-block--square-links .square-links__item h3,
.s-block--square-links .square-links__item h4 {
    position: absolute !important;

    right: 25px !important;
    left: 25px !important;
    bottom: 55px !important;

    z-index: 30 !important;

    margin: 0 !important;
    padding: 0 !important;

    text-align: right !important;

    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    color: #000 !important;

    pointer-events: none !important;
}


/* ---------- النص الفرعي ---------- */

.s-block--square-links .square-links__item p {
    position: absolute !important;

    right: 25px !important;
    left: 25px !important;
    bottom: 25px !important;

    z-index: 30 !important;

    margin: 0 !important;
    padding: 0 !important;

    text-align: right !important;

    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;

    color: #000 !important;

    pointer-events: none !important;
}



/* =========================================================
   02 — البطاقات الثلاث على الجوال
   تتحول إلى Slider أفقي
   ========================================================= */

@media (max-width: 767px) {

    .s-block--square-links {
        width: 100% !important;

        margin: 5px 0 0 !important;
        padding: 0 !important;

        overflow: hidden !important;
    }


    /* ---------- مسار السلايدر ---------- */

    .s-block--square-links .square-links__grid {
        display: flex !important;

        width: 100% !important;

        /* المسافة بين البطاقات */
        gap: 5px !important;

        margin: 0 !important;
        padding: 0 5px !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;

        scroll-snap-type: x mandatory !important;
        scroll-behavior: smooth !important;

        -webkit-overflow-scrolling: touch !important;

        scrollbar-width: none !important;

        box-sizing: border-box !important;
    }


    /* إخفاء شريط التمرير */

    .s-block--square-links .square-links__grid::-webkit-scrollbar {
        display: none !important;
    }


    /* ---------- البطاقة ---------- */

    .s-block--square-links .square-links__item {
        position: relative !important;

        /* =====================================
           عرض البطاقة على الجوال
           85% = يظهر جزء من البطاقة التالية
           ===================================== */
        flex: 0 0 85% !important;
        width: 85% !important;
        min-width: 85% !important;

        /* =====================================
           ارتفاع البطاقة على الجوال
           ===================================== */
        height: 450px !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden !important;

        scroll-snap-align: start !important;
        scroll-snap-stop: always !important;

        box-sizing: border-box !important;
    }


    /* ---------- الرابط ---------- */

    .s-block--square-links .square-links__item > a {
        position: relative !important;

        display: block !important;

        width: 100% !important;
        height: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden !important;
    }


    /* ---------- الصورة ---------- */

    .s-block--square-links .square-links__item img {
        position: absolute !important;

        inset: 0 !important;

        width: 100% !important;
        height: 100% !important;

        object-fit: cover !important;
        object-position: center !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* ---------- العنوان ---------- */

    .s-block--square-links .square-links__item h2,
    .s-block--square-links .square-links__item h3,
    .s-block--square-links .square-links__item h4 {
        right: 18px !important;
        left: 18px !important;
        bottom: 52px !important;

        z-index: 50 !important;

        font-size: 20px !important;
    }


    /* ---------- النص الفرعي ---------- */

    .s-block--square-links .square-links__item p {
        right: 18px !important;
        left: 18px !important;
        bottom: 20px !important;

        z-index: 50 !important;

        font-size: 14px !important;
    }
}



/* =========================================================
   03 — تبويبات المنتجات على الكمبيوتر
   KIJI MATCHA / KIJI BUSINESS / KIJI BOX
   ========================================================= */

@media (min-width: 768px) {

    /* ---------- السلايدر ---------- */

    [id^="product-tabs-slider-"] {
        width: 100% !important;
        max-width: none !important;
    }

    [id^="product-tabs-slider-"] .swiper {
        width: 100% !important;
        max-width: none !important;

        overflow: hidden !important;
    }


    /* ---------- مسار المنتجات ---------- */

    [id^="product-tabs-slider-"] .swiper-wrapper {
        display: flex !important;

        width: 100% !important;

        transform: none !important;

        gap: 0 !important;
    }


    /* ---------- كل منتج ---------- */

    [id^="product-tabs-slider-"] .swiper-slide {

        /* كل منتج يأخذ ثلث العرض */
        width: 33.333333% !important;
        min-width: 33.333333% !important;
        max-width: 33.333333% !important;

        flex: 0 0 33.333333% !important;

        /* المسافة الداخلية بين المنتجات */
        padding: 0 25px !important;

        box-sizing: border-box !important;
    }


    /* ---------- بطاقة المنتج ---------- */

    [id^="product-tabs-slider-"] .product-card {
        width: 100% !important;
        max-width: none !important;
    }


    /* ---------- مساحة صورة المنتج ---------- */

    [id^="product-tabs-slider-"] .product-card__image {
        width: 100% !important;

        /* =====================================
           ارتفاع مساحة المنتج على الكمبيوتر
           ===================================== */
        height: 400px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        overflow: visible !important;
    }


    /* ---------- صورة المنتج نفسها ---------- */

    [id^="product-tabs-slider-"]
    .product-card__image img.main-image {
        width: 100% !important;
        height: 100% !important;

        /* =====================================
           أقصى حجم للعلبة / الكيس
           ===================================== */
        max-width: 400px !important;
        max-height: 400px !important;

        object-fit: contain !important;
        object-position: center !important;

        transform-origin: center center !important;

        transition:
            transform 0.5s cubic-bezier(.22,.61,.36,1) !important;

        will-change: transform !important;
    }


    /* ---------- معلومات المنتج ---------- */

    [id^="product-tabs-slider-"] .product-card__content {
        width: 100% !important;

        text-align: center !important;
    }


    /* =====================================================
       حركة المنتج عند مرور الماوس
       تتحرك صورة العلبة فقط
       ===================================================== */

    [id^="product-tabs-slider-"]
    .product-card:hover
    .product-card__image img.main-image {

        /* =====================================
           قوة حركة المنتج
           -18px = الارتفاع
           1.06 = التكبير
           -0.8deg = الميلان
           ===================================== */

        transform:
            translateY(-18px)
            scale(1.06)
            rotateZ(-0.8deg) !important;
    }


    /* ---------- أثناء الضغط ---------- */

    [id^="product-tabs-slider-"]
    .product-card:active
    .product-card__image img.main-image {

        transform:
            translateY(-8px)
            scale(1.03) !important;

        transition-duration: 0.15s !important;
    }
}



/* =========================================================
   04 — تبويبات المنتجات على الجوال
   بطاقة كبيرة + ظهور جزء من المنتج التالي
   ========================================================= */

@media (max-width: 767px) {

    /* ---------- القسم ---------- */

    .s-block--product-tabs {
        width: 100% !important;

        overflow: hidden !important;
    }


    /* ---------- السلايدر ---------- */

    .s-block--product-tabs .swiper,
    .s-block--product-tabs .s-slider-container {
        width: 100% !important;

        overflow: visible !important;
    }


    /* ---------- مسار المنتجات ---------- */

    .s-block--product-tabs .swiper-wrapper {
        display: flex !important;
        align-items: stretch !important;

        width: auto !important;

        /* المسافة بين المنتجات */
        gap: 8px !important;

        /* المسافة من أطراف الشاشة */
        padding-inline: 12px !important;

        box-sizing: border-box !important;
    }


    /* ---------- كل منتج ---------- */

    .s-block--product-tabs .swiper-slide,
    .s-block--product-tabs .s-products-slider-card {

        /* =====================================
           عرض المنتج على الجوال
           84vw = تقريباً 84% من الشاشة
           يظهر جزء من المنتج التالي
           ===================================== */

        width: 84vw !important;
        min-width: 84vw !important;
        max-width: 84vw !important;

        flex: 0 0 84vw !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }


    /* ---------- البطاقة ---------- */

    .s-block--product-tabs .product-card {
        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
    }


    /* ---------- مساحة صورة المنتج ---------- */

    .s-block--product-tabs .product-card__image {
        width: 100% !important;

        /* =====================================
           ارتفاع مساحة المنتج على الجوال
           ===================================== */
        height: 390px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        overflow: visible !important;
    }


    /* ---------- صورة العلبة / الكيس ---------- */

    .s-block--product-tabs
    .product-card__image img.main-image {

        width: 100% !important;
        height: 100% !important;

        /* =====================================
           حجم المنتج على الجوال
           ===================================== */
        max-width: 355px !important;
        max-height: 355px !important;

        object-fit: contain !important;
        object-position: center !important;

        transform-origin: center center !important;

        /* لا توجد حركة تلقائية */
        animation: none !important;

        transition:
            transform 0.22s cubic-bezier(.22,.61,.36,1) !important;

        will-change: transform !important;
    }


    /* =====================================================
       حركة المنتج عند لمس الشاشة فقط
       ===================================================== */

    .s-block--product-tabs
    .product-card:active
    .product-card__image img.main-image {

        /* =====================================
           قوة حركة اللمس
           -10px = الارتفاع
           1.05 = التكبير
           -0.6deg = الميلان
           ===================================== */

        transform:
            translateY(-10px)
            scale(1.05)
            rotate(-0.6deg) !important;
    }


    /* ---------- معلومات المنتج ---------- */

    .s-block--product-tabs .product-card__content {
        width: 100% !important;

        box-sizing: border-box !important;
    }
}


/* =========================================
   KIJI — 4 BANNERS

   DESKTOP:
   - صورتان في كل صف
   - 15px بين الصور
   - 15px من حواف الشاشة

   MOBILE:
   - صورة واحدة في كل صف
   - عرض الشاشة بالكامل
   - 10px بين الصور
   - صور طويلة
   - حواف حادة
========================================= */


/* =========================================
   DESKTOP — SECTION
========================================= */

section.s-block.s-block--banners.container {
    width: 100vw !important;
    max-width: 100vw !important;

    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;

    padding: 15px !important;

    box-sizing: border-box !important;
}


/* =========================================
   DESKTOP — GRID
========================================= */

section.s-block.s-block--banners.container > div.grid {

    display: grid !important;

    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: auto auto !important;

    grid-auto-flow: row !important;

    gap: 15px !important;
    column-gap: 15px !important;
    row-gap: 15px !important;

    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;
}


/* إلغاء 3 أعمدة الافتراضية في سلة */

section.s-block.s-block--banners.container > div.grid.md\:grid-cols-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}


/* =========================================
   DESKTOP — BANNERS
========================================= */

section.s-block.s-block--banners.container > div.grid > * {

    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    /* ارتفاع الصور على الكمبيوتر */
    aspect-ratio: 1.60 / 1 !important;

    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    box-sizing: border-box !important;

    border-radius: 0 !important;
}


/* =========================================
   ترتيب الصور — DESKTOP
========================================= */

/* IMAGE 1 */

section.s-block.s-block--banners.container
> div.grid > *:nth-child(1) {

    grid-column: 1 !important;
    grid-row: 1 !important;
}


/* IMAGE 2 */

section.s-block.s-block--banners.container
> div.grid > *:nth-child(2) {

    grid-column: 2 !important;
    grid-row: 1 !important;
}


/* IMAGE 3 */

section.s-block.s-block--banners.container
> div.grid > *:nth-child(3) {

    grid-column: 1 !important;
    grid-row: 2 !important;
}


/* IMAGE 4 */

section.s-block.s-block--banners.container
> div.grid > *:nth-child(4) {

    grid-column: 2 !important;
    grid-row: 2 !important;
}


/* =========================================
   إخفاء الصور 5 و 6
========================================= */

section.s-block.s-block--banners.container
> div.grid > *:nth-child(n+5) {

    display: none !important;
}


/* =========================================
   LINKS
========================================= */

section.s-block.s-block--banners.container
> div.grid > * > a {

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    border-radius: 0 !important;
}


/* =========================================
   PICTURE / FIGURE
========================================= */

section.s-block.s-block--banners.container figure,
section.s-block.s-block--banners.container picture {

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    border-radius: 0 !important;
}


/* =========================================
   IMAGES
========================================= */

section.s-block.s-block--banners.container
> div.grid img {

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    max-width: none !important;

    object-fit: cover !important;
    object-position: center !important;

    margin: 0 !important;
    padding: 0 !important;

    border-radius: 0 !important;
}


/* =========================================
   إزالة الحواف الدائرية الخاصة بالثيم
========================================= */

section.s-block.s-block--banners.container .rounded,
section.s-block.s-block--banners.container .rounded-sm,
section.s-block.s-block--banners.container .rounded-md,
section.s-block.s-block--banners.container .rounded-lg,
section.s-block.s-block--banners.container .rounded-xl,
section.s-block.s-block--banners.container .rounded-2xl,
section.s-block.s-block--banners.container .rounded-3xl {

    border-radius: 0 !important;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 767px) {


    /* =====================================
       القسم بعرض الشاشة بالكامل
    ===================================== */

    section.s-block.s-block--banners.container {

        width: 100vw !important;
        max-width: 100vw !important;

        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;

        /* بدون مسافة يمين ويسار */
        padding: 0 !important;

        box-sizing: border-box !important;
    }


    /* =====================================
       صورة واحدة في كل صف
    ===================================== */

    section.s-block.s-block--banners.container > div.grid,
    section.s-block.s-block--banners.container
    > div.grid.md\:grid-cols-3 {

        display: grid !important;

        grid-template-columns: 1fr !important;
        grid-template-rows: none !important;

        grid-auto-flow: row !important;
        grid-auto-rows: auto !important;

        /* 10px بين الصور */
        gap: 10px !important;
        row-gap: 10px !important;
        column-gap: 0 !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }


    /* =====================================
       الصور الأربع على الجوال
    ===================================== */

    section.s-block.s-block--banners.container
    > div.grid > *:nth-child(1),

    section.s-block.s-block--banners.container
    > div.grid > *:nth-child(2),

    section.s-block.s-block--banners.container
    > div.grid > *:nth-child(3),

    section.s-block.s-block--banners.container
    > div.grid > *:nth-child(4) {

        /* صورة واحدة في الصف */
        grid-column: 1 !important;
        grid-row: auto !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        /*
           ارتفاع أكبر على الجوال
           لتغيير الارتفاع مستقبلاً:
           
           1.00 = مربع
           0.90 = أطول
           0.85 = أطول أكثر
           0.75 = طويل جداً
        */
        aspect-ratio: 0.85 / 1 !important;

        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden !important;

        box-sizing: border-box !important;

        border-radius: 0 !important;
    }


    /* =====================================
       MOBILE — LINKS
    ===================================== */

    section.s-block.s-block--banners.container
    > div.grid > * > a {

        display: block !important;

        width: 100% !important;
        height: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden !important;

        border-radius: 0 !important;
    }


    /* =====================================
       MOBILE — PICTURE / FIGURE
    ===================================== */

    section.s-block.s-block--banners.container figure,
    section.s-block.s-block--banners.container picture {

        display: block !important;

        width: 100% !important;
        height: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden !important;

        border-radius: 0 !important;
    }


    /* =====================================
       MOBILE — IMAGES
    ===================================== */

    section.s-block.s-block--banners.container
    > div.grid img {

        display: block !important;

        width: 100% !important;
        height: 100% !important;

        max-width: none !important;

        object-fit: cover !important;
        object-position: center !important;

        margin: 0 !important;
        padding: 0 !important;

        border-radius: 0 !important;
    }

}

/* =========================================================
   KIJI MATCHA — ENHANCED FEATURES
   FINAL CLEAN CODE
   Desktop + Mobile
========================================================= */


/* =========================================================
   1. القسم الرئيسي
========================================================= */

.s-block--enhanced-features {
    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}


/* =========================================================
   2. الشبكة — الكمبيوتر
========================================================= */

.s-block--enhanced-features .enhanced-features__grid {
    display: grid !important;

    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;

    width: 100% !important;
    max-width: 100% !important;

    gap: 24px !important;

    margin: 0 !important;
    padding: 24px 32px !important;

    box-sizing: border-box !important;

    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}


/* =========================================================
   3. كل ميزة — الكمبيوتر
========================================================= */

.s-block--enhanced-features
.s-block--enhanced-features__item {

    position: relative !important;

    display: flex !important;
    flex-direction: column !important;

    align-items: center !important;
    justify-content: flex-start !important;

    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 18px 10px !important;

    box-sizing: border-box !important;

    text-align: center !important;

    background: transparent !important;

    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;

    transform: none !important;
    transition: none !important;
    animation: none !important;

    overflow: visible !important;
}


/* =========================================================
   4. حذف الإطار المتحرك الأصلي الخاص بثيم سلة
========================================================= */

/*
   الثيم يصنع الإطار باستخدام 4 عناصر absolute
   وليس border عادي
*/

.s-block--enhanced-features
.s-block--enhanced-features__item
> div.absolute {

    display: none !important;
}


/* =========================================================
   5. إلغاء Hover بالكامل
========================================================= */

.s-block--enhanced-features
.s-block--enhanced-features__item:hover {

    background: transparent !important;

    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;

    transform: none !important;
    transition: none !important;
    animation: none !important;
}


/* =========================================================
   6. الأيقونة — الكمبيوتر
========================================================= */

.s-block--enhanced-features
.s-block--enhanced-features__item
.feature-icon {

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 60px !important;
    height: 60px !important;

    min-width: 0 !important;

    margin: 0 auto 10px !important;
    padding: 0 !important;

    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;

    transform: none !important;
    transition: none !important;
    animation: none !important;
}


/* صورة الأيقونة */

.s-block--enhanced-features
.s-block--enhanced-features__item
.feature-icon img {

    display: block !important;

    width: 46px !important;
    height: 46px !important;

    max-width: 46px !important;
    max-height: 46px !important;

    object-fit: contain !important;

    margin: auto !important;

    transform: none !important;
    transition: none !important;
    animation: none !important;
}


/* SVG */

.s-block--enhanced-features
.s-block--enhanced-features__item
.feature-icon svg {

    width: 46px !important;
    height: 46px !important;

    max-width: 46px !important;
    max-height: 46px !important;

    transform: none !important;
    transition: none !important;
    animation: none !important;
}


/* =========================================================
   7. عنوان الميزة — الكمبيوتر
========================================================= */

.s-block--enhanced-features
.s-block--enhanced-features__item h2 {

    width: 100% !important;

    margin: 3px 0 5px !important;
    padding: 0 !important;

    font-size: 17px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;

    text-align: center !important;

    white-space: normal !important;
}


/* =========================================================
   8. وصف الميزة — الكمبيوتر
========================================================= */

.s-block--enhanced-features
.s-block--enhanced-features__item p {

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    font-size: 13px !important;
    line-height: 1.5 !important;

    text-align: center !important;

    white-space: normal !important;
}


/* =========================================================
   9. إزالة أي Ring / Shadow من Tailwind
========================================================= */

.s-block--enhanced-features
.s-block--enhanced-features__item,

.s-block--enhanced-features
.s-block--enhanced-features__item * {

    --tw-ring-offset-width: 0px !important;
    --tw-ring-offset-shadow: 0 0 #0000 !important;
    --tw-ring-shadow: 0 0 #0000 !important;

    --tw-shadow: 0 0 #0000 !important;
    --tw-shadow-colored: 0 0 #0000 !important;
}


/* =========================================================
   10. MOBILE
   ثلاث مميزات في صف واحد
========================================================= */

@media (max-width: 767px) {


    /* القسم */

    .s-block--enhanced-features {

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden !important;
    }


    /* =====================================================
       مهم:
       العنصر نفسه يحمل class container في HTML عندك
    ===================================================== */

    section.s-block.s-block--enhanced-features.container {

        width: 100% !important;
        max-width: 100% !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        padding-left: 6px !important;
        padding-right: 6px !important;

        box-sizing: border-box !important;
    }


    /* =====================================================
       الشبكة
       نجبرها على 3 أعمدة
    ===================================================== */

    .s-block--enhanced-features
    .enhanced-features__grid {

        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr)
            minmax(0, 1fr)
            !important;

        grid-template-rows: auto !important;

        grid-auto-flow: row !important;

        column-gap: 4px !important;
        row-gap: 0 !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;

        padding: 10px 0 !important;

        box-sizing: border-box !important;

        overflow: hidden !important;
    }


    /* =====================================================
       كل ميزة
    ===================================================== */

    .s-block--enhanced-features
    .enhanced-features__grid
    > .s-block--enhanced-features__item {

        display: flex !important;

        flex-direction: column !important;

        align-items: center !important;
        justify-content: flex-start !important;

        /* مهم جداً */
        grid-column: auto !important;
        grid-row: auto !important;

        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;

        flex: none !important;
        flex-basis: auto !important;

        margin: 0 !important;

        padding: 7px 2px !important;

        box-sizing: border-box !important;

        text-align: center !important;

        overflow: hidden !important;

        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;
    }


    /* =====================================================
       إلغاء أي قواعد nth-child من الثيم
    ===================================================== */

    .s-block--enhanced-features
    .enhanced-features__grid
    > .s-block--enhanced-features__item:nth-child(1),

    .s-block--enhanced-features
    .enhanced-features__grid
    > .s-block--enhanced-features__item:nth-child(2),

    .s-block--enhanced-features
    .enhanced-features__grid
    > .s-block--enhanced-features__item:nth-child(3) {

        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;

        margin: 0 !important;

        padding-left: 2px !important;
        padding-right: 2px !important;

        grid-column: auto !important;

        flex: none !important;
        flex-basis: auto !important;
    }


    /* =====================================================
       حذف الإطار المتحرك
    ===================================================== */

    .s-block--enhanced-features
    .s-block--enhanced-features__item
    > div.absolute {

        display: none !important;
    }


    /* =====================================================
       الأيقونة — الجوال
    ===================================================== */

    .s-block--enhanced-features
    .s-block--enhanced-features__item
    .feature-icon {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 38px !important;
        height: 38px !important;

        min-width: 0 !important;

        margin: 0 auto 5px !important;
        padding: 0 !important;
    }


    /* صورة الأيقونة */

    .s-block--enhanced-features
    .s-block--enhanced-features__item
    .feature-icon img {

        display: block !important;

        width: 30px !important;
        height: 30px !important;

        max-width: 30px !important;
        max-height: 30px !important;

        object-fit: contain !important;

        margin: auto !important;
    }


    /* SVG */

    .s-block--enhanced-features
    .s-block--enhanced-features__item
    .feature-icon svg {

        width: 30px !important;
        height: 30px !important;

        max-width: 30px !important;
        max-height: 30px !important;
    }


    /* =====================================================
       عنوان الميزة — الجوال
    ===================================================== */

    .s-block--enhanced-features
    .s-block--enhanced-features__item h2 {

        display: block !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 3px 0 !important;
        padding: 0 !important;

        font-size: 10px !important;
        line-height: 1.3 !important;
        font-weight: 700 !important;

        text-align: center !important;

        white-space: normal !important;

        word-break: normal !important;
        overflow-wrap: break-word !important;
    }


    /* =====================================================
       الوصف — الجوال
    ===================================================== */

    .s-block--enhanced-features
    .s-block--enhanced-features__item p {

        display: block !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        font-size: 7.5px !important;
        line-height: 1.35 !important;

        text-align: center !important;

        white-space: normal !important;

        word-break: normal !important;
        overflow-wrap: break-word !important;
    }


    /* =====================================================
       إزالة Hover / Animation على الجوال
    ===================================================== */

    .s-block--enhanced-features
    .s-block--enhanced-features__item:hover,

    .s-block--enhanced-features
    .s-block--enhanced-features__item:focus,

    .s-block--enhanced-features
    .s-block--enhanced-features__item:active {

        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;

        transform: none !important;
        transition: none !important;
        animation: none !important;
    }

}

.s-block--enhanced-features {
    margin-top: 25px !important;
}