/* Media Query للشاشات الصغيرة (أقل من 576px) */
@media (max-width: 576px) {
    body {
        font-size: clamp(12px, 1rem, 14px); /* تصغير حجم النص في الشاشات الصغيرة */
    }

    h1 {
        font-size: clamp(1.5rem, 4vw, 2rem); /* تصغير حجم العنوان */
    }

    h2 {
        font-size: clamp(1.25rem, 3.5vw, 1.75rem); /* تصغير حجم العنوان الفرعي */
    }

    h3 {
        font-size: clamp(1rem, 3vw, 1.5rem); /* تصغير حجم العناوين الثانوية */
    }

    h4, h5, h6 {
        font-size: clamp(0.9rem, 2.5vw, 1.25rem); /* تصغير العناوين الصغيرة */
    }

    /* النصوص العادية (الروابط والفقرات) */
    p, li, a {
        font-size: clamp(10px, 1rem, 14px); /* نصوص أصغر للشاشات الصغيرة */
    }

    .mega-menu-title {
        font-size: clamp(10px, 1rem, 14px); /* نصوص أصغر للشاشات الصغيرة */
    }

    .mega-sub-title {
        font-size: clamp(10px, 1rem, 14px); /* نصوص أصغر للشاشات الصغيرة */
    }

    .small-text {
        font-size: clamp(8px, 0.9rem, 10px); /* نصوص صغيرة جدًا للشاشات الصغيرة */
    }
}

/* Media Query للأجهزة الأكبر من 576px ولكن أقل من 768px */
@media (max-width: 768px) {
    body {
        font-size: clamp(13px, 1rem, 16px); /* تصغير الحجم قليلاً في الشاشات المتوسطة */
    }

    h1 {
        font-size: clamp(1.75rem, 4vw, 2.5rem);
    }

    h2 {
        font-size: clamp(1.5rem, 4vw, 2rem);
    }

    h3 {
        font-size: clamp(1.25rem, 3vw, 1.75rem);
    }

    h4, h5, h6 {
        font-size: clamp(1rem, 2.5vw, 1.25rem);
    }

    p, li, a {
        font-size: clamp(10px, 1.1rem, 15px); /* نصوص مرنة على الشاشات المتوسطة */
    }

    .mega-menu-title {
        font-size: clamp(10px, 1.1rem, 15px); /* نصوص مرنة على الشاشات المتوسطة */
    }

    .mega-sub-title {
        font-size: clamp(10px, 1.1rem, 15px); /* نصوص مرنة على الشاشات المتوسطة */
    }

    .small-text {
        font-size: clamp(9px, 0.95rem, 12px);
    }
}

/* Media Query للشاشات الأكبر من 1200px */
@media (min-width: 992px) {
    p, li, a {
        font-size: clamp(10px, 1.1rem, 15px); /* تصغير الروابط قليلاً للشاشات الكبيرة */
    }
    .mega-menu-title {
        font-size: clamp(10px, 1.1rem, 15px); /* تصغير الروابط قليلاً للشاشات الكبيرة */
    }
    .mega-sub-title {
        font-size: clamp(10px, 1.1rem, 15px); /* تصغير الروابط قليلاً للشاشات الكبيرة */
    }
}