/* MOBILE FIX - ONLY AFFECTS PHONES */
@media (max-width: 1024px) {
    /* Fix the header */
    .top-bar { flex-direction: column !important; text-align: center !important; padding: 15px !important; gap: 10px !important; }
    .contact-info { flex-direction: column !important; gap: 10px !important; }
    nav { position: relative !important; top: 0 !important; padding: 10px 0 !important; }
    nav ul { flex-wrap: wrap !important; justify-content: center !important; gap: 15px !important; padding: 0 10px !important; }
    
    /* Fix the Services dropdown */
    .dropdown-menu { position: static !important; transform: none !important; width: 100% !important; display: none; flex-direction: column !important; background: rgba(0,0,0,0.5) !important; box-shadow: none !important; border: none !important; padding: 10px !important; margin-top: 10px !important; }
    .dropdown-image { display: none !important; }
    .dropdown-links a { opacity: 1 !important; transform: none !important; padding: 10px !important; border-bottom: 1px solid rgba(255,255,255,0.05) !important; }

    /* Stack everything in 1 column */
    .services-grid, .footer-grid, .partners-layout, .details-grid, .vectors-list, .clientele-grid, .positions-grid, .values-grid { grid-template-columns: 1fr !important; gap: 20px !important; }
    .about-section, .intro-layout, .contact-layout, .job-layout, .partner-card { flex-direction: column !important; text-align: center !important; padding: 30px 15px !important; margin: 20px auto !important; width: 100% !important; }

    /* Fix Homepage Hero & Sidebar */
    .hero { flex-direction: column !important; text-align: center !important; padding: 50px 20px !important; min-height: auto !important; }
    .hero-content { margin: 0 auto !important; }
    .hero-buttons { justify-content: center !important; flex-wrap: wrap !important; }
    .sidebar-box { position: relative !important; top: auto !important; right: auto !important; transform: none !important; margin: 40px auto 0 !important; width: 100% !important; max-width: 500px !important; animation: none !important; }

    /* Big buttons for fingers */
    .hero-buttons { flex-direction: column !important; width: 100% !important; gap: 10px !important; }
    .btn-primary, .btn-secondary, .cta-btn, .submit-btn, .btn-quick-enquiry { width: 100% !important; display: block !important; padding: 15px !important; font-size: 1.1rem !important; }

    /* Fix fonts */
    .hero h1 { font-size: 32px !important; }
    .hero p { font-size: 15px !important; }
    .page-banner h1 { font-size: 28px !important; }
    .about-text h2, .intro-text h2 { font-size: 24px !important; }
    
    /* Small details */
    .logo-img { height: 50px !important; }
    .email-form { flex-direction: column !important; }
    .email-form button { padding: 12px !important; width: 100% !important; }
    .scroll-top { bottom: 90px !important; right: 20px !important; }
    .whatsapp-btn { bottom: 20px !important; right: 20px !important; width: 50px !important; height: 50px !important; }
    .whatsapp-btn svg { width: 28px !important; height: 28px !important; }
    .bottom-banner { font-size: 16px !important; padding: 20px 15px !important; }
    .captcha-box { width: 100% !important; }
}