/* u0645u0644u0641 CSS u062eu0627u0635 u0628u062au062du0633u064au0646 u0627u0644u062au062cu0627u0648u0628 u0645u0639 u0627u0644u0623u062cu0647u0632u0629 u0627u0644u0645u062du0645u0648u0644u0629 */

/* u0642u0648u0627u0639u062f u0639u0627u0645u0629 u0644u0644u0623u062cu0647u0632u0629 u0627u0644u0645u062du0645u0648u0644u0629 */
@media (max-width: 767px) {
    /* u062au062du0633u064au0646u0627u062a u0639u0627u0645u0629 */
    body {
        overflow-x: hidden;
    }
    
    /* u062au062du0633u064au0646u0627u062a u0644u0644u0646u0627u0641u0628u0627u0631 */
    .navbar .nav-container {
        padding: 0.5rem 1rem;
        position: relative;
    }
    
    .logo {
        font-size: 1.2rem;
        z-index: 1001;
    }
    
    /* u0625u0635u0644u0627u062d u0645u0634u0643u0644u0629 u0627u0644u0631u0645u0648u0632 u0641u064a u0642u0633u0645 u0627u0644u0645u0645u064au0632u0627u062a */
    .feature-icon {
        background: linear-gradient(135deg, var(--primary-color), var(--secondary-color)) !important;
        color: #fff !important;
        visibility: visible !important;
        opacity: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .feature-icon i {
        font-size: 2.2rem;
        text-shadow: 0 2px 4px rgba(0,0,0,0.2);
        color: #fff !important;
        visibility: visible !important;
        opacity: 1 !important;
        display: inline-block !important;
    }
    
    /* u062au062du0633u064au0646u0627u062a u0627u0644u0642u0627u0626u0645u0629 u0627u0644u0645u062du0645u0648u0644u0629 */
    .menu-toggle {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        background-color: transparent;
        border: none;
        cursor: pointer;
        z-index: 1001;
        position: relative;
    }
    
    .menu-toggle i {
        font-size: 1.5rem;
        color: #fff;
        transition: all 0.3s ease;
    }
    
    .nav-links {
        position: fixed;
        top: 0;
        right: -100%;
        width: 80%;
        height: 100vh;
        background: rgba(0, 0, 0, 0.8);
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 2rem 0;
        transition: all 0.3s ease;
        box-shadow: -5px 0 15px rgba(0, 0, 0, 0.1);
        z-index: 1000;
    }
    
    .nav-links.active {
        right: 0;
    }
    
    .nav-links li {
        margin: 1rem 0;
    }
    
    .nav-links a {
        font-size: 1.1rem;
        color: #fff !important;
    }
    
    /* u062au062du0633u064au0646u0627u062a u0644u0635u0641u062du0629 u0627u0644u062eu062fu0645u0629 u0627u0644u0631u0626u064au0633u064au0629 */
    .service-hero {
        height: auto !important;
        min-height: 40vh;
        padding: 5rem 1rem 2rem !important;
    }
    
    .service-hero-content {
        width: 100%;
    }
    
    .service-hero-content h1 {
        font-size: 1.8rem !important;
        margin-bottom: 1rem !important;
        line-height: 1.3;
    }
    
    .service-hero-content p {
        font-size: 1rem !important;
        line-height: 1.5;
    }
    
    /* u062au062du0633u064au0646u0627u062a u0644u0623u0642u0633u0627u0645 u0627u0644u0635u0641u062du0629 */
    .service-description,
    .service-features,
    .why-choose-us,
    .testimonials,
    .cta-section {
        padding: 3rem 1rem !important;
    }
    
    .service-intro {
        padding: 1.5rem !important;
        margin: 0 0.5rem !important;
    }
    
    .service-intro h2,
    .service-features h2,
    .why-choose-us h2,
    .testimonials h2 {
        font-size: 1.6rem !important;
        margin-bottom: 1.5rem !important;
        line-height: 1.3;
    }
    
    .service-intro p {
        font-size: 1rem !important;
        line-height: 1.6 !important;
        text-align: justify;
    }
    
    /* u062au062du0633u064au0646u0627u062a u0644u0628u0637u0627u0642u0627u062a u0627u0644u0645u0645u064au0632u0627u062a */
    .features-grid {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
    }
    
    .feature-box {
        position: relative !important;
        z-index: 5 !important;
    }
    
    .feature-card {
        padding: 1.2rem !important;
    }
    
    .feature-card h3 {
        font-size: 1.2rem !important;
    }
    
    .feature-card p {
        font-size: 0.95rem !important;
    }
    
    /* u062au062du0633u064au0646u0627u062a u0644u0644u062cu062fu0648u0644 u0627u0644u0645u0642u0627u0631u0646 */
    .comparison-table-container {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin: 0 -1rem;
        padding: 0 1rem;
        position: relative;
    }
    
    .comparison-table {
        font-size: 0.85rem !important;
        min-width: 600px;
    }
    
    .comparison-header {
        padding: 0.7rem !important;
    }
    
    .comparison-cell {
        padding: 0.7rem !important;
    }
    
    /* u062au062du0633u064au0646u0627u062a u0644u0642u0633u0645 u0627u0644u062au0639u0644u064au0642u0627u062a */
    .testimonial-slider {
        padding: 1rem 0 !important;
    }
    
    .testimonial-card {
        padding: 1.2rem !important;
        border-radius: 15px !important;
        margin: 0 0.5rem !important;
    }
    
    .testimonial-content p {
        font-size: 0.9rem !important;
        line-height: 1.5 !important;
    }
    
    .testimonial-author img {
        width: 45px !important;
        height: 45px !important;
    }
    
    .author-info h4 {
        font-size: 0.95rem !important;
    }
    
    .author-info p {
        font-size: 0.8rem !important;
    }
    
    .testimonial-tag {
        font-size: 0.7rem !important;
        padding: 0.2rem 0.6rem !important;
        margin-top: 0.3rem !important;
        margin-left: 0.3rem !important;
    }
    
    .testimonial-nav {
        margin-top: 1rem !important;
    }
    
    .testimonial-arrow {
        width: 35px !important;
        height: 35px !important;
        margin: 0 0.5rem !important;
    }
    
    .testimonial-dots {
        margin-top: 1rem !important;
    }
    
    .testimonial-dot {
        width: 8px !important;
        height: 8px !important;
        margin: 0 3px !important;
    }
    
    /* u062au062du0633u064au0646u0627u062a u0644u0642u0633u0645 u062fu0639u0648u0629 u0644u0644u0639u0645u0644 */
    .cta-section h2 {
        font-size: 1.6rem !important;
    }
    
    .cta-section p {
        font-size: 0.95rem !important;
    }
    
    .cta-btn {
        padding: 0.8rem 2rem !important;
        font-size: 1rem !important;
        display: block !important;
        width: 80% !important;
        margin: 0 auto !important;
        text-align: center !important;
    }
    
    /* u062au062du0633u064au0646u0627u062a u0644u0644u0641u0648u062au0631 */
    footer {
        padding: 2rem 1rem !important;
    }
    
    footer h3 {
        font-size: 1.2rem !important;
    }
    
    footer p, footer a {
        font-size: 0.9rem !important;
    }
}

/* u062au062du0633u064au0646u0627u062a u0645u062eu0635u0635u0629 u0644u0642u0633u0645 u0644u0645u0627u0630u0627 u062au062eu062au0627u0631u0646u0627 u0648u062cu062fu0648u0644 u0627u0644u0645u0642u0627u0631u0646u0629 */
@media (max-width: 767px) {
    /* u062au062du0633u064au0646 u0642u0633u0645 u0644u0645u0627u0630u0627 u062au062eu062au0627u0631u0646u0627 */
    .why-choose-us {
        padding: 2.5rem 0.5rem !important;
        overflow: hidden !important;
        position: relative !important;
    }
    
    .why-choose-us h2 {
        font-size: 1.5rem !important;
        margin-bottom: 1.5rem !important;
        text-align: center !important;
        color: #333 !important;
    }
    
    /* u062du0627u0648u064au0629 u0627u0644u062cu062fu0648u0644 */
    .table-container {
        position: relative !important;
        margin-bottom: 2rem !important;
    }
    
    /* u0625u062eu0641u0627u0621 u0627u0644u062cu062fu0648u0644 u0627u0644u0623u0635u0644u064a u0639u0644u0649 u0627u0644u062cu0648u0627u0644 */
    .comparison-table {
        display: none !important;
    }
    
    /* u062au0635u0645u064au0645 u0628u0637u0627u0642u0627u062a u0627u0644u0645u0642u0627u0631u0646u0629 u0644u0644u062cu0648u0627u0644 */
    .comparison-cards-mobile {
        display: flex !important;
        flex-direction: column !important;
        gap: 1rem !important;
        width: 100% !important;
    }
    
    .comparison-mobile-card {
        background: #fff !important;
        border-radius: 10px !important;
        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1) !important;
        overflow: hidden !important;
    }
    
    .comparison-mobile-header {
        background: linear-gradient(135deg, var(--primary-color), var(--secondary-color)) !important;
        color: #fff !important;
        padding: 0.8rem !important;
        text-align: center !important;
        font-weight: bold !important;
        font-size: 1rem !important;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15) !important;
    }
    
    .comparison-items-container {
        display: flex !important;
        flex-direction: row !important;
        width: 100% !important;
    }
    
    .comparison-item {
        flex: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        padding: 0.5rem !important;
        text-align: center !important;
        border-left: 1px solid #eee !important;
    }
    
    .comparison-item:last-child {
        border-left: none !important;
    }
    
    .comparison-item-title {
        font-weight: bold !important;
        font-size: 0.8rem !important;
        margin-bottom: 0.5rem !important;
        color: #666 !important;
    }
    
    .comparison-item-value {
        font-size: 0.9rem !important;
        line-height: 1.4 !important;
    }
    
    .comparison-item-value.highlight {
        color: var(--primary-color) !important;
        font-weight: bold !important;
        text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) !important;
        position: relative !important;
    }
    
    .comparison-item-value.highlight::after {
        content: '' !important;
        position: absolute !important;
        bottom: -2px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        width: 40px !important;
        height: 2px !important;
        background: var(--secondary-color) !important;
        border-radius: 2px !important;
    }
}

/* u062au062du0633u064au0646u0627u062a u0625u0636u0627u0641u064au0629 u0644u0644u0647u0648u0627u062au0641 u0627u0644u0635u063au064au0631u0629 */
@media (max-width: 480px) {
    .comparison-item-title {
        font-size: 0.75rem !important;
    }
    
    .comparison-item-value {
        font-size: 0.85rem !important;
    }
    
    .service-hero-content h1 {
        font-size: 1.6rem !important;
    }
    
    .service-intro h2,
    .service-features h2,
    .why-choose-us h2,
    .testimonials h2 {
        font-size: 1.4rem !important;
    }
    
    .testimonial-card {
        padding: 1rem !important;
    }
    
    .testimonial-content p {
        font-size: 0.85rem !important;
    }
    
    .testimonial-author img {
        width: 40px !important;
        height: 40px !important;
    }
    
    .why-choose-us::after {
        content: none !important;
    }
}

/* u062au062du0633u064au0646u0627u062a u0644u062au0648u062cu064au0647 u0627u0644u062cu0648u0627u0644 (Landscape) */
@media (max-width: 767px) and (orientation: landscape) {
    .service-hero {
        min-height: 60vh;
    }
    
    .features-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* تحسينات رأس الصفحة للصفحة الرئيسية وصفحة المقالات على الجوال */
@media (max-width: 767px) {
    /* قواعد عامة للقائمة المتنقلة */
    .nav-container {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 0.5rem 1rem !important;
        position: relative !important;
    }
    
    .nav-links {
        position: fixed !important;
        top: 0 !important;
        right: -100% !important;
        width: 80% !important;
        height: 100vh !important;
        background: rgba(0, 0, 0, 0.8) !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 2rem 0 !important;
        transition: all 0.3s ease !important;
        box-shadow: -5px 0 15px rgba(0, 0, 0, 0.1) !important;
        z-index: 1000 !important;
        display: flex !important;
    }
    
    .nav-links.active {
        right: 0 !important;
    }
    
    .nav-links li {
        margin: 1rem 0 !important;
        list-style: none !important;
    }
    
    .nav-links a {
        font-size: 1.1rem !important;
        color: #fff !important;
        text-decoration: none !important;
    }
    
    .menu-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 40px !important;
        height: 40px !important;
        background-color: transparent !important;
        border: none !important;
        cursor: pointer !important;
        z-index: 1001 !important;
        position: relative !important;
    }
    
    .menu-toggle i {
        font-size: 1.5rem !important;
        color: #fff !important;
        transition: all 0.3s ease !important;
    }
}

/* قواعد إضافية للقائمة المتنقلة في الصفحة الرئيسية وصفحة المقالات */
@media (max-width: 767px) {
    /* قواعد محددة للصفحة الرئيسية */
    body:not(.call-center-management):not(.cloud-call-center):not(.crm-system):not(.chatbot-ai-solutions) .nav-links {
        display: flex !important;
    }
}