/* تعديل عبد الغني +213798913454 */
/* ---------------------- */
/* 1. إجبار حاوية السلايدر الرئيسية على قبول الارتفاع التلقائي */
.embla__slide {
    height: auto !important; /* إلغاء الارتفاع الثابت */
    min-height: auto !important; /* إلغاء أي حد أدنى للارتفاع */
    display: block !important; /* تغيير طريقة العرض لتسمح بالارتفاع التلقائي */
}

/* 2. تعديل حاوية الصورة (التي كانت خلفية absolute) */
/* نلغي وضعية "الخلفية المطلقة" ونعلجها عنصراً عادياً يفرض ارتفاعه */
.embla__slide > div.absolute.inset-0 {
    position: relative !important; /* تحويلها من absolute إلى relative */
    width: 100% !important;
    height: auto !important; /* جعل الارتفاع تلقائياً بناءً على المحتوى */
    z-index: 1 !important;
}

/* 3. إعدادات الصورة لتظهر كاملة وتتمدد عرضياً */
.embla__slide img {
    width: 100% !important; /* تمدد من اليمين لليسار بالكامل */
    height: auto !important; /* أهم سطر: الارتفاع يتحدد تلقائياً ليُظهر الصورة كاملة */
    display: block !important;
    object-fit: fill !important; /* أو استخدم stretch لضمان ملء العرض */
    position: relative !important;
}

/* 4. إبقاء طبقة اللون الخفيفة (الشفافة) فوق الصورة */
.embla__slide div.bg-primary {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 2 !important; /* فوق الصورة */
}

/* 5. ضبط مكان النقاط (Dots) لتتبع نهاية الصورة تلقائياً */
.embla__dots {
    bottom: 15px !important; /* مسافة من أسفل الصورة */
    z-index: 10 !important; /* فوق الجميع */
}
/* ---------------------- */




/* ---------------------- */
.embla__dots {
    /* القيمة الأصلية كانت bottom-8 (أي 32px) */
    /* سنرفعها إلى 50px أو أكثر حسب رغبتك */
    bottom: 60px !important; 
    
    /* لضمان أنها فوق الصورة دائماً */
   
}

/* 2. تغيير لون النقطة النشطة (Active) إلى الأزرق */
.embla__dots button[data-active="true"] {
    background-color: #78CEE8 !important; /* اللون الأزرق */
    opacity: 1 !important; /* لجعل اللون واضحاً جداً */
    width: 20px !important; /* إذا أردت جعلها أعرض قليلاً عند التفعيل */
}
/* ---------------------- */


/* ---------------------- */
/* إخفاء عنصر الصورة بالكامل داخل السكشن المحدد */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] picture {
    display: none !important;
}

/* لضمان عدم وجود مساحة فارغة أو ألوان خلفية غير مرغوب فيها من الحاوية الأب */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] .absolute.inset-0.-z-10 {
    display: none !important;
}
/* ---------------------- */



/* إخفاء الصورة الأصلية وتعتيمها */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] img {
    opacity: 0.2 !important;
    filter: grayscale(100%);
}

/* 2. إخفاء العنوان الأصلي واستبداله بسطرين */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] h1 {
    font-size: 0 !important; /* إخفاء النص الأصلي */
    line-height: 0 !important;
}

/* السطر الأول: فنٌّ يتجاوز */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] h1::before {
    content: "فنٌّ يتجاوز";
    display: block;
    font-size: clamp(3rem, 8vw, 6rem) !important; /* حجم متجاوب */
    color: white !important;
    font-weight: 800 !important;
    line-height: 1.1;
    margin-bottom: 10px;
}

[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] h1::after {
    content: "اللوحة";
    font-size: clamp(2.5rem, 7vw, 5.5rem) !important;
    background: linear-gradient(to bottom, #6293CD, #4F8DCB);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800 !important;
    line-height: 1.1;
    display: block;
   text-align: center !important;
}


/* 3. تنسيق النص الصغير (آرت باي ميم) */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] span.text-xs {
    color: #7dd3fc !important;
    letter-spacing: 0.4em !important;
    font-weight: 600;
    margin-bottom: 20px;
    display: block;
}

/* 4. تنسيق الوصف */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] p.text-base {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 1.1rem !important;
    max-width: 500px;
    margin: 30px auto !important;
    line-height: 1.6;
}



[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] .btn:hover {
    background: white !important;
    color: #020c1b !important;
    transform: translateY(-3px);
}

















/* 3. إجبار جميع الحاويات الداخلية على التوسط */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] .theme-container,
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] .flex-col,
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] .flex {
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
}

/* 4. تنسيق "آرت باي ميم" في الوسط */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] span.text-xs {

    text-align: center !important;
}

/* 5. تنسيق العنوان "فن يتجاوز اللوحة" ليصبح سطرين في الوسط */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] h1 {

    align-items: center !important;
}

[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] h1::before {
    content: "فنٌّ يتجاوز";
    font-size: clamp(2.5rem, 7vw, 5.5rem) !important;
    color: white !important;
    font-weight: 800 !important;
    line-height: 1.1;
    display: block;
}

/* 6. توسيط الوصف (حيث تتحول اللوحات...) */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] p.text-base {

    margin: 25px auto !important; /* الهامش التلقائي يضمن التوسط */
    text-align: center !important;
}

/* 7. تنسيق وتوسيط الزر */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] .btn {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(125, 211, 252, 0.3) !important;
    color: white !important;
    padding: 14px 30px !important;
    border-radius: 0 !important;
    backdrop-filter: blur(10px);
    transition: all 0.4s ease !important;
    margin-top: 20px !important;
}

[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] .btn:hover {
    background: white !important;
    color: #020c1b !important;
    transform: translateY(-5px);
}






















/* استهداف الفقرة النصية داخل السكشن */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] p.text-base {
    font-size: 0 !important; /* إخفاء النص الأصلي بالكامل */
    line-height: 0 !important;
    margin: 30px auto !important;
    text-align: center !important;
    display: block !important;
}

/* الجزء الأول: الوصف الأساسي */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] p.text-base::before {
    content: "حيث تتحوّل اللوحات الأصلية إلى عطور فاخرة. خمس لوحات. خمسة عطور. رؤية واحدة.";
    display: block;
    font-size: 1.1rem !important; /* استعادة حجم الخط */
    color: rgba(255, 255, 255, 0.8) !important; /* لون أبيض شفاف */
    line-height: 1.6;
    margin-bottom: 15px; /* مسافة قبل الجملة التالية */
}

/* الجزء الثاني: صُنعت في غراس، فرنسا */
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] p.text-base::after {
    content: "صُنعت في غراس، فرنسا";
    display: block;
    font-size: 0.85rem !important; /* حجم أصغر قليلاً لجعلها تبدو كخاتمة فاخرة */
    color: #4A879D !important; /* اللون الأزرق السماوي */
    text-transform: uppercase;
    letter-spacing: 0.2em; /* تباعد الحروف للفخامة */
    margin-top: 10px;
    font-weight: 500;
}
















/* ---------------------- */

[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] {
    /* اللون الأساسي الذي سيظهر في الأطراف */
    background-color: #041b2a !important; 
    
    /* رسم التوهج في المنتصف فقط ليتلاشى تماماً قبل الوصول للحواف */
    background-image: radial-gradient(circle at center, rgba(56, 189, 248, 0.12) 0%, transparent 45%) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    padding: 80px 20px !important; 
    min-height: auto !important;
    border: none !important; /* التأكد من عدم وجود حدود */
}

/* إخفاء الصورة الأصلية */
[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] picture {
    display: none !important;
}

/* 2. تصغير العنوان الصغير (عن الفنان) */
[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] span.text-xs {
    color: #7dd3fc !important;
    letter-spacing: 0.3em !important;
    font-size: 11px !important; /* تصغير حجم الخط */
    font-weight: 500 !important;
    margin-bottom: 12px !important; /* تقليل المسافة */
    display: block !important;
}

/* 3. تصغير العنوان الرئيسي */
[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] h2 {
    color: white !important;
    font-size: 1.8rem !important; /* تصغير العنوان من 2.5 إلى 1.8 */
    font-weight: 600 !important;
    margin-bottom: 30px !important;
    letter-spacing: -0.5px !important;
}

/* 4. تنسيق الوصف (تصغير الخط والتباعد) */
[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] p.text-base {
    font-size: 0 !important;
    line-height: 0 !important;
    max-width: 580px !important; /* تقليل عرض الفقرة */
    margin: 0 auto !important;
}

/* الفقرة الأولى - تصغير الخط */
[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] p.text-base::before {
    content: "محمد الحكير فنان سعودي ومؤسس آرت باي ميم. يرسم شخصيات وعناصر تحمل دلالات مفتوحة تترك مساحة لتفسير المشاهد، مما يمنح أعماله بعداً شعورياً يتجاوز الشكل الظاهري.";
    display: block;
    font-size: 0.95rem !important; /* تصغير الخط إلى 0.95 */
    color: rgba(255, 255, 255, 0.65) !important; /* جعل الأبيض أهدأ قليلاً */
    line-height: 1.7 !important;
    margin-bottom: 20px !important;
}

/* الفقرة الثانية - تصغير الخط */
[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] p.text-base::after {
    content: "امتد هذا العالم الفني إلى العطور، حيث استُلهمت كل تركيبة من لوحة أصلية، لتكون امتداداً طبيعياً لرؤيته الفنية بروح مختلفة.";
    display: block;
    font-size: 0.95rem !important;
    color: rgba(255, 255, 255, 0.65) !important;
    line-height: 1.7 !important;
}

/* 5. تنسيق الرياض — غراس (تصغير الخط والخطوط الجانبية) */
[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] .btn {
    background: transparent !important;
    border: none !important;
    color: rgba(125, 211, 252, 0.4) !important;
    font-size: 10px !important; /* تصغير الخط */
    letter-spacing: 0.25em !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 15px !important; /* تقليل المسافة بين الخطوط */
    margin-top: 40px !important;
    pointer-events: none;
}

/* تصغير الخطوط الجانبية */
[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] .btn::before,
[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] .btn::after {
    content: "";
    height: 1px;
    width: 80px; /* تقصير طول الخطوط */
    background: linear-gradient(90deg, transparent, rgba(125, 211, 252, 0.2), transparent);
}

/* 6. التوسيط */
[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] .theme-container,
[section-id="d24ea3f7-91ca-4f97-8ed9-5386fe64dd40"] .flex-col {
    align-items: center !important;
    width: 100% !important;
}
/* ---------------------- */


/* 1. خلفية السكشن بالكامل لتتناسق مع الهوية الجديدة */
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] {
    background-color: #081C2E !important;
    padding-top: 100px !important;
}

/* 2. توسيط الحاوية العلوية وإخفاء رابط "جميع المنتجات" التقليدي */
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] .flex.items-center.justify-between {
    justify-content: center !important;
    flex-direction: column !important;
    text-align: center !important;
    margin-bottom: 60px !important;
}

[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] a[href*="/categories/"] {
    display: none !important; /* إخفاء جميع المنتجات لجعل التركيز على العنوان */
}

/* 3. تحويل العنوان "المجموعة/خمس لوحات..." ليكون سطرين فاخرين */
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] h2 {
    font-size: 0 !important; /* إخفاء النص الأصلي */
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 15px !important;
}

/* السطر العلوي: المجموعة */
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] h2::before {
    content: "المجموعة";
    font-size: 14px !important;
    color: #7dd3fc !important;
    letter-spacing: 0.4em !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    display: block;
}

/* السطر السفلي: خمس لوحات. خمسة عطور. */
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] h2::after {
    content: "خمس لوحات. خمسة عطور.";
    font-size: clamp(1.5rem, 5vw, 3rem) !important;
    color: white !important;
    font-weight: 600 !important;
    display: block;
    line-height: 1.2;
}

/* 4. إضافة الخط الأزرق المتدرج أسفل العنوان */
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] .flex.items-center.justify-between::after {
    content: "";
    display: block;
    width: 100px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #38bdf8, transparent);
    margin-top: 30px;
}




/* ------------ */ 
/* 1. ضبط خلفية السكشن والمسافات */
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] {
    background-color: #081C2E !important;
    padding-top: 90px !important;
    border: none !important;
}

/* 2. توسيط منطقة العنوان بالكامل */
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] .flex.items-center.justify-between {
    justify-content: center !important;
    flex-direction: column !important;
    text-align: center !important;
    margin-bottom: 50px !important;
}

/* 3. تنسيق العنوان ليصبح سطرين فاخرين */
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] h2 {
    font-size: 0 !important; /* إخفاء النص الأصلي */
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
}

/* السطر الأول: إصدار محدود */
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] h2::before {
    content: "إصدار محدود";
    font-size: 13px !important;
    color: #7dd3fc !important; /* اللون السماوي */
    letter-spacing: 0.35em !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    display: block;
}

/* السطر الثاني: طبعات أصلية */
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] h2::after {
    content: "طبعات أصلية";
    font-size: clamp(1.5rem, 4vw, 3rem) !important;
    color: white !important;
    font-weight: 700 !important;
    display: block;
    line-height: 1.1;
}

/* 4. إضافة الخط الأزرق المتدرج (Divider) أسفل العنوان */
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] .flex.items-center.justify-between::after {
    content: "";
    display: block;
    width: 80px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #38bdf8, transparent);
    margin-top: 25px;
}

























/* --- 1. تطبيق الخلفية وتوحيد الهوية للسكاشن الثلاثة --- */
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"],
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"],
[section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] {
    background-color: #081C2E !important;
}

/* --- 2. تنسيق العناوين (المجموعة / إصدار محدود) في المنتصف سطرين --- */
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] h2,
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] h2 {
    font-size: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
}

/* سطر "المجموعة" و "إصدار محدود" */
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] h2::before { content: "المجموعة"; }
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] h2::before { content: "إصدار محدود"; }

[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] h2::before,
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] h2::before {
    font-size: 13px !important;
    color: #7dd3fc !important;
    letter-spacing: 0.35em !important;
    margin-bottom: 10px;
}

/* سطر "خمس لوحات" و "طبعات أصلية" */
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] h2::after { content: "خمس لوحات. خمسة عطور."; }
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] h2::after { content: "طبعات أصلية"; }

[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] h2::after,
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] h2::after {
    font-size: clamp(1.8rem, 4vw, 3rem) !important;
    color: white !important;
    font-weight: 700 !important;
    display: block;
}

/* الخط الأزرق تحت العنوان */
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] .flex.items-center.justify-between::after,
[section-id="fdae27e7-c582-4526-a70a-07601d735b42"] .flex.items-center.justify-between::after {
    content: "";
    display: block;
    width: 80px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #38bdf8, transparent);
    margin: 25px auto 0 !important;
}

/* --- 3. تنسيق كروت المنتجات (تصغير الحجم + السعر يسار) --- */
[data-product-card] {
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid rgba(56, 189, 248, 0.2) !important;
    padding: 12px !important;
    border-radius: 10px !important;
    max-width: 300px !important; /* تصغير الكرت */
    margin: 0 auto !important;
    transition: all 0.3s ease !important;
}

/* السعر والعملة لجهة اليسار */
[data-product-card] p.text-foreground.text-sm {
    text-align: left !important;
    display: flex !important;
    justify-content: flex-start !important;
    direction: ltr !important;
    color: #7dd3fc !important;
    font-weight: bold;
    margin-top: 10px !important;
}

/* اسم المنتج لجهة اليمين */
[data-product-card] h3 a {
    text-align: right !important;
    color: white !important;
    display: block !important;
}

/* --- 4. تنسيق أزرار "أضف للسلة" (نص أبيض + توهج) --- */
[data-add-to-cart], [section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] .btn {
    background: transparent !important;
    border: 1px solid #38bdf8 !important;
    color: #ffffff !important; /* الكتابة بيضاء دائماً */
    font-weight: 600 !important;
    border-radius: 4px !important;
    transition: 0.4s !important;
}

[data-add-to-cart]:hover, [section-id="719aa0e2-255a-4565-82d1-e7fab58606de"] .btn:hover {
    box-shadow: 0 0 15px rgba(56, 189, 248, 0.8) !important; /* توهج الإطار */
    background: rgba(56, 189, 248, 0.05) !important;
    color: #ffffff !important;
}

/* --- 5. تعديلات الجوال (منتج واحد في السطر + كرت صغير) --- */
@media (max-width: 767px) {
    [data-grid-root="true"] {
        grid-template-columns: 1fr !important; /* منتج واحد */
        padding: 0 50px !important; /* تصغير الكرت عن طريق الهوامش */
    }
    
    [data-product-card] {
        max-width: 270px !important;
    }

 
}



header {
    border-bottom: none !important;
    box-shadow: none !important;
}
/* إخفاء زر البحث */
button[commandfor="search-dialog"] {
    display: none !important;
}





















/* --- تنسيق سكشن الهيرو الإنجليزي (English Hero Section) --- */

/* 1. السكشن الرئيسي والخلفية */
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] {
    background-color: #081C2E !important;
    min-height: 80vh !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

/* إخفاء الصورة الأصلية والطبقة الشفافة */
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] picture,
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] .bg-primary.absolute.inset-0 {
    display: none !important;
}

/* 2. إجبار الحاويات الداخلية على التوسط */
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] .theme-container,
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] .flex-col,
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] .flex {
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
}

/* 3. تنسيق النص الصغير العلوي (Art by Meem) */
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] span.text-xs {
    color: #7dd3fc !important;
    letter-spacing: 0.4em !important;
    font-weight: 600;
    margin-bottom: 20px;
    display: block;
    text-transform: uppercase;
}

/* 4. تحويل العنوان الرئيسي لسطرين (ART BEYOND | CANVAS) */
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] h1 {
    font-size: 0 !important; /* إخفاء النص الأصلي */
    line-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

/* السطر الأول: ART BEYOND */
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] h1::before {
    content: "ART BEYOND";
    display: block;
    font-size: clamp(2.5rem, 7vw, 5.5rem) !important;
    color: white !important;
    font-weight: 800 !important;
    line-height: 1.1;
    margin-bottom: 5px;
}

/* السطر الثاني: CANVAS (مع التدرج) */
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] h1::after {
    content: "CANVAS";
    display: block;
    font-size: clamp(2.5rem, 7vw, 5.5rem) !important;
    font-weight: 800 !important;
    background: linear-gradient(to bottom, #6293CD, #4F8DCB);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1.1;
}

/* 5. تنسيق الوصف الإنجليزي وتقسيمه */
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] p.text-base {
    font-size: 0 !important;
    line-height: 0 !important;
    margin: 30px auto !important;
}

/* الجزء الأول من الوصف */
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] p.text-base::before {
    content: "Where original paintings become fine fragrances. Five artworks. Five scents. One vision.";
    display: block;
    font-size: 1.1rem !important;
    color: rgba(255, 255, 255, 0.7) !important;
    line-height: 1.6;
    margin-bottom: 15px;
    max-width: 600px;
}

/* السطر الأخير: Crafted in Grasse, France */
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] p.text-base::after {
    content: "Crafted in Grasse, France";
    display: block;
    font-size: 0.85rem !important;
    color: #4A879D !important;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-weight: 500;
}

/* 6. تنسيق زر Explore Meem (نص أبيض وتوهج) */
[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] .btn {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid #38bdf8 !important;
    color: white !important;
    padding: 14px 40px !important;
    border-radius: 0 !important;
    backdrop-filter: blur(10px);
    transition: all 0.4s ease !important;
    margin-top: 20px !important;
    text-transform: uppercase;
    font-weight: 600;
}

[section-id="1b497acf-92ac-40d7-8c15-2863eabb7353"] .btn:hover {
    box-shadow: 0 0 15px rgba(56, 189, 248, 0.8) !important;
    background: rgba(56, 189, 248, 0.05) !important;
    color: white !important;
    transform: translateY(-3px);
}
/* --- تنسيق سكشن About the Artist الإنجليزي --- */

/* 1. ضبط الخلفية والوهج والدمج */
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] {
    background-color: #081C2E !important; 
    background-image: radial-gradient(circle at center, rgba(56, 189, 248, 0.12) 0%, transparent 65%) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    padding: 80px 20px !important; 
    min-height: auto !important;
}

/* إخفاء الصورة الأصلية */
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] picture,
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] .bg-primary.absolute.inset-0 {
    display: none !important;
}

/* 2. تنسيق العنوان الصغير (ABOUT THE ARTIST) */
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] span.text-xs {
    color: #7dd3fc !important;
    letter-spacing: 0.3em !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    margin-bottom: 12px !important;
    display: block !important;
}

/* 3. تنسيق العنوان الرئيسي */
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] h2 {
    color: white !important;
    font-size: 1.8rem !important;
    font-weight: 600 !important;
    margin-bottom: 30px !important;
    letter-spacing: -0.5px !important;
}

/* 4. تنسيق الوصف وتقسيمه */
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] p.text-base {
    font-size: 0 !important;
    max-width: 580px !important;
    margin: 0 auto !important;
}

/* الفقرة الأولى */
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] p.text-base::before {
    content: "Mohammad Alhokair is a Saudi artist and the founder of Art by Meem. He creates characters and elements with open symbolism, allowing space for personal interpretation and emotional connection.";
    display: block;
    font-size: 0.95rem !important;
    color: rgba(255, 255, 255, 0.65) !important;
    line-height: 1.7 !important;
    margin-bottom: 20px !important;
}

/* الفقرة الثانية */
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] p.text-base::after {
    content: "His artistic world extends into fragrance, with each scent inspired by an original painting — an extension of his artistic vision.";
    display: block;
    font-size: 0.95rem !important;
    color: rgba(255, 255, 255, 0.65) !important;
    line-height: 1.7 !important;
}

/* 5. تحويل الزر إلى نص فاخر مع خطوط جانبية (Riyadh — Grasse) */
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] .btn {
    background: transparent !important;
    border: none !important;
    color: rgba(125, 211, 252, 0.4) !important;
    font-size: 10px !important;
    letter-spacing: 0.25em !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 15px !important;
    margin-top: 40px !important;
    pointer-events: none;
    text-transform: uppercase;
}

/* الخطوط الجانبية للزر */
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] .btn::before,
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] .btn::after {
    content: "";
    height: 1px;
    width: 40px;
    background: linear-gradient(90deg, transparent, rgba(125, 211, 252, 0.2), transparent);
}

/* 6. ضمان التوسيط الكامل */
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] .theme-container,
[section-id="b8756e4f-397d-4b3e-bc69-f2beaddf0472"] .flex-col {
    align-items: center !important;
    width: 100% !important;
}
/* --- 1. خلفية السكشن الإنجليزي والمسافات --- */
[section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] {
    background-color: #081C2E !important;
    padding-top: 90px !important;
}

/* --- 2. توسيط منطقة العنوان بالكامل --- */
[section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] .flex.items-center.justify-between {
    justify-content: center !important;
    flex-direction: column !important;
    text-align: center !important;
    margin-bottom: 50px !important;
}

/* --- 3. تنسيق العنوان الإنجليزي (سطرين) --- */
[section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] h2 {
    font-size: 0 !important; /* إخفاء النص الأصلي */
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
}

/* السطر العلوي: Limited Edition */
[section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] h2::before {
    content: "Limited Edition";
    font-size: 13px !important;
    color: #7dd3fc !important; /* لون سماوي */
    letter-spacing: 0.35em !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    display: block;
}

/* السطر السفلي: Original Prints */
[section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] h2::after {
    content: "Original Prints";
    font-size: clamp(1.8rem, 4vw, 3rem) !important;
    color: white !important;
    font-weight: 700 !important;
    display: block;
    line-height: 1.1;
}

/* الخط الأزرق المتدرج أسفل العنوان الإنجليزي */
[section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] .flex.items-center.justify-between::after {
    content: "";
    display: block;
    width: 80px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #38bdf8, transparent);
    margin: 25px auto 0 !important;
}

/* --- 4. تنسيق كروت المنتجات والسعر (جهة اليسار) --- */
[section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] [data-product-card] {
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid rgba(56, 189, 248, 0.2) !important;
    padding: 12px !important;
    border-radius: 10px !important;
    max-width: 300px !important;
    margin: 0 auto !important;
    transition: all 0.3s ease !important;
}

/* نقل السعر والعملة لجهة اليسار في النسخة الإنجليزية */
[section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] p.text-foreground.text-sm {
    text-align: left !important;
    display: flex !important;
    justify-content: flex-start !important;
    flex-direction: row-reverse !important; /* لضمان بقاء الرقم يسار العملة بشكل صحيح */
    color: #7dd3fc !important;
    font-weight: bold !important;
    margin-top: 10px !important;
}

/* اسم المنتج في اليمين (أو اليسار حسب رغبتك، هنا جعلته يسار ليتناسق مع الإنجليزية) */
[section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] [data-product-card] h3 a {
    text-align: left !important;
    color: white !important;
    display: block !important;
}

/* --- 5. تنسيق زر "Add to Cart" --- */
[section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] [data-add-to-cart] {
    background: transparent !important;
    border: 1px solid #38bdf8 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    transition: 0.4s !important;
}

[section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] [data-add-to-cart]:hover {
    box-shadow: 0 0 15px rgba(56, 189, 248, 0.8) !important;
    background: rgba(56, 189, 248, 0.05) !important;
    color: #ffffff !important;
}

/* --- 6. تعديلات الجوال (منتج واحد في السطر) --- */
@media (max-width: 767px) {
    [section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] [data-grid-root="true"] {
        grid-template-columns: 1fr !important;
        padding: 0 50px !important;
    }
    
    [section-id="7d9e1430-b1cd-4957-84ff-81874ac17198"] [data-product-card] {
        max-width: 270px !important;
    }
}
/* --- 1. خلفية السكشن الإنجليزي والمسافات --- */
[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] {
    background-color: #081C2E !important;
    padding-top: 100px !important;
}

/* --- 2. توسيط منطقة العنوان بالكامل وإخفاء رابط المنتجات --- */
[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] .flex.items-center.justify-between {
    justify-content: center !important;
    flex-direction: column !important;
    text-align: center !important;
    margin-bottom: 60px !important;
}

[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] a[href*="/categories/"] {
    display: none !important;
}

/* --- 3. تنسيق العنوان الإنجليزي (سطرين) --- */
[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] h2 {
    font-size: 0 !important; /* إخفاء النص الأصلي */
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

/* السطر العلوي: The Collection */
[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] h2::before {
    content: "The Collection";
    font-size: 13px !important;
    color: #7dd3fc !important; /* لون سماوي */
    letter-spacing: 0.35em !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    margin-bottom: 12px;
    display: block;
}

/* السطر السفلي: Five Paintings. Five Scents. */
[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] h2::after {
    content: "Five Paintings. Five Scents.";
    font-size: clamp(1.8rem, 4vw, 3rem) !important;
    color: white !important;
    font-weight: 700 !important;
    display: block;
    line-height: 1.2;
}

/* الخط الأزرق المتدرج أسفل العنوان */
[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] .flex.items-center.justify-between::after {
    content: "";
    display: block;
    width: 100px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #38bdf8, transparent);
    margin-top: 30px;
}

/* --- 4. تنسيق كروت المنتجات والسعر (جهة اليسار) --- */
[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] [data-product-card] {
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid rgba(56, 189, 248, 0.2) !important;
    padding: 12px !important;
    border-radius: 10px !important;
    max-width: 300px !important;
    margin: 0 auto !important;
    transition: all 0.3s ease !important;
}

/* السعر جهة اليسار */
[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] p.text-foreground.text-sm {
    text-align: left !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    color: #7dd3fc !important;
    font-weight: bold !important;
    margin-top: 10px !important;
}

/* اسم المنتج جهة اليسار */
[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] [data-product-card] h3 a {
    text-align: left !important;
    color: white !important;
    display: block !important;
}

/* --- 5. تنسيق زر "Add to cart" --- */
[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] [data-add-to-cart] {
    background: transparent !important;
    border: 1px solid #38bdf8 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    transition: 0.4s !important;
}

[section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] [data-add-to-cart]:hover {
    box-shadow: 0 0 15px rgba(56, 189, 248, 0.8) !important;
    background: rgba(56, 189, 248, 0.05) !important;
}

/* --- 6. تعديلات الجوال (منتج واحد في السطر) --- */
@media (max-width: 767px) {
    [section-id="ece9efa9-c55a-4b10-bbd8-0f0f7142e33e"] [data-grid-root="true"] {
        grid-template-columns: 1fr !important;
        padding: 0 50px !important;
    }
}