/* ===== إزالة التمرير الأفقي للخدمات على الهاتف ===== */

@media (max-width: 768px) {
    /* إعادة البطاقات للوضع الشبكي الطبيعي */
    .services-grid-new {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
        gap: 1rem !important;
        padding: 0 1rem !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
        position: relative !important;
    }
    
    /* أنماط البطاقات الطبيعية */
    .service-card-new {
        display: block !important;
        width: 100% !important;
        min-width: auto !important;
        max-width: none !important;
        height: auto !important;
        margin: 0 !important;
        position: relative !important;
        transform: none !important;
        grid-column: auto !important;
        grid-row: auto !important;
        flex: none !important;
        float: none !important;
        clear: both !important;
    }
    
    /* إزالة خصائص التمرير */
    .services-grid-new {
        overflow-x: visible !important;
        overflow-y: visible !important;
        scroll-behavior: auto !important;
        scroll-snap-type: none !important;
        -webkit-overflow-scrolling: auto !important;
    }
    
    .service-card-new {
        scroll-snap-align: none !important;
        scroll-snap-stop: auto !important;
        touch-action: auto !important;
    }
    
    /* إعادة التأثيرات الطبيعية */
    .service-card-new:hover {
        transform: translateY(-5px) !important;
        transition: transform 0.3s ease !important;
    }
    
    .service-card-new::before,
    .service-card-new::after {
        display: block !important;
    }
    
    /* إخفاء أي نقاط تمرير */
    .services-scroll-dots,
    .services-scroll-indicators {
        display: none !important;
    }
}

/* للشاشات الصغيرة جداً */
@media (max-width: 480px) {
    .services-grid-new {
        grid-template-columns: 1fr !important;
        gap: 0.8rem !important;
        padding: 0 0.8rem !important;
    }
}

@media (max-width: 360px) {
    .services-grid-new {
        grid-template-columns: 1fr !important;
        gap: 0.6rem !important;
        padding: 0 0.6rem !important;
    }
}