/* Home */
/* تنسيق القسم الرئيسي */
.grid-section {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 40px 20px;
}

.main-containerw {
    display: flex;
    width: 100%;
    max-width: 1320px; /* العرض الإجمالي الجديد للتصميم */
    align-items: center;
    justify-content: space-between;
    gap: 60px; /* المسافة بين جزء النص وجزء الصور */
}

/* --- تنسيقات المحتوى النصي (من اليمين) --- */
.text-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center; /* توسيط النص لليمين */
    text-align: right;
    max-width: 550px;
}

/* الشارة الرمادية "منصة إمبكس" */
.badge {
    background-color: #7D7D7D;
    color: #fff;
    padding: 10px 30px;
    border-radius: 25px;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 30px;
	align-items: center;
}

/* العنوان الرئيسي بألوانه المختلفة */
.main-title {
    font-size: 50px; /* حجم كبير يناسب الشاشات الكبيرة والعرض الموسع */
    font-weight: 700;
    line-height: 1.6;
}

.main-title span {
    display: block;
}

.blue-text {
    color: #123C9F; /* اللون الأزرق الدقيق من التصميم */
    font-weight: 800; /* أثقل سمك */
}

.grey-text {
    color: #6C6C6C; /* اللون الرمادي الدقيق من التصميم */
}

/* --- تنسيقات الصورة المدمجة (من اليسار) --- */
.image-gallery.combined-layout {
    flex: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    padding-right: 0; /* لم نعد بحاجة لمساحة تداخل */
}

/* الصورة المدمجة وحوافها المنحنية المتميزة */
.combined-image-wrapper {
    width: 100%;
    height: 520px; /* ارتفاع أطول قليلاً للحفاظ على النسب */
    background-color: #f3f3f3; /* للحفاظ على اللون الأساسي قبل تحميل الصورة */
    
    /* سر الحواف المتميزة: انحناء كامل لجميع الزوايا ما عدا واحدة */
    border-radius: 65px;
    border-top-right-radius: 0; /* إلغاء انحناء الزاوية العلوية اليمنى لتبدو حادة */
    
    overflow: hidden;
    position: relative;
    box-shadow: -10px 10px 30px rgba(0,0,0,0.1); /* ظل أعمق لإبرازها */
}

.merged-image {
    width: 100%;
    height: 100%;
    object-fit: contain; /* لضمان ملء الصورة للحاوية بشكل صحيح والحفاظ على النسب */
}

/* منطقة التداخل المدمجة في الصورة (Blured Overlay) */
.blured-overlay {
    position: absolute;
    width: 50%; /* تغطي نصف الصورة تقريباً */
    height: 100%;
    top: 0;
    right: 0; /* متموضعة في منطقة التداخل */
    backdrop-filter: blur(15px); /* سر الضبابية في منطقة التداخل */
    z-index: 1; /* فوق الصورة */
}

/* --- تنسيقات التجاوب (Media Query) للجوال --- */
@media (max-width: 992px) {
	
	
    .main-containerw {
		width:100% !important;
		max-width:100% !important;
        flex-direction: column-reverse; /* ترتيب عمودي، الصور فوق النص */
        gap: 80px;
    }
    
    .text-content {
        align-items: center; /* توسيط المحتوى في الجوال */
        text-align: center;
		align-items: center;
        max-width: 100%;
    }
    
    .main-title {
        font-size: 35px;
		padding-left:0px;
		padding-right:0px;
		margin :0 auto
    }
    
    .combined-image-wrapper {
        height: auto; /* ارتفاع تلقائي ليناسب الصورة */
        aspect-ratio: 16 / 9; /* الحفاظ على نسبة العرض إلى الارتفاع */
        border-radius: 0px;
        border-top-right-radius: 0;
    }
}


.text-content h2 {
    text-align: center !important;    /* النص على اليمين */
     align-self: center !important; /* العنصر نفسه على اليمين داخل flex */
    width: 100%;                     /* عرض كامل لتطبيق text-align */
}

/* تجاوب للجوال */
@media (max-width: 992px) {
    .text-content h2 {
        text-align: center !important;    /* النص في الوسط */
        align-self: center !important;    /* العنصر نفسه في الوسط */
    }
}


.left-home{
	width:45%; padding:15px;
float : right !important;
display: block; 
text-align:right;
font-size:17px; font-family: 'Cairo', Arial, sans-serif !important; color:#666
}
.right-home{
	width:45%; padding:15px;
float : left !important;
display: block; 
text-align:right;
font-size:22px; font-family: 'Cairo', Arial, sans-serif !important; color:#666
}

@media (max-width: 768px) {
.left-home{
	width:96%; margin:0	}
	
.right-home{
	width:96%; margin:0	}
.home-image {zoom :0.6; margin-left:10px}	
.grid-section {padding : 0px }

}