🌟 المقدمة التحفيزية:
“يا بطل.. العالم كله يتصفح الإنترنت من الهواتف ! هل تريد لموقع ‘أكاديمية قياوي ‘ أن يظهر رائعاً على الحاسوب ، وصغيراً جداً على الهاتف ؟ طبعاً لا ! اليوم ستتعلم كيف تجعل موقعك ذكياً ، يتغير شكله وتنسيقه تلقائياً ليناسب حجم أي شاشة ، من أصغر هاتف إلى أكبر شاشة عرض .”

💡 المفهوم :
نستخدم ما يسمى بـ Media Queries . وهي مثل “المجسات” التي تشعر بحجم الشاشة .

💻 كود التحدي :

@media (max-width: 600px) {
    .btn-academy {
        width: 100%; /* اجعل الزر يملأ عرض الشاشة في الهواتف */
    }
}