/* ==========================================================================
   RESPONSIVE - Mobile/Tablet/Desktop
   ========================================================================== */

/* ---------- Large Tablet / Small Desktop ---------- */
@media (max-width: 1100px) {
    .container { padding: 0 20px; }
    
    .main-nav ul { gap: 2px; }
    .nav-link { padding: 8px 12px; font-size: 14px; }
    
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }
    
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ---------- Tablet ---------- */
@media (max-width: 900px) {
    .section { padding: 70px 0; }
    
    .menu-toggle { display: flex; }
    
    .main-nav {
        position: fixed;
        top: 0;
        right: -100%;
        width: 80%;
        max-width: 320px;
        height: 100vh;
        background: var(--bg-darker);
        border-left: 1px solid var(--border);
        padding: 100px 30px 30px;
        transition: right var(--transition);
        z-index: 999;
        overflow-y: auto;
    }
    .main-nav.active { right: 0; }
    
    .main-nav ul {
        flex-direction: column;
        gap: 8px;
    }
    
    .nav-link {
        display: block;
        padding: 14px 20px;
        font-size: 16px;
        border-bottom: 1px solid var(--border-light);
        border-radius: 0;
    }
    .nav-link::before { display: none; }
    .nav-link:hover, .nav-link.active {
        background: var(--gold-soft);
        padding-right: 28px;
    }
    
    .hero {
        padding: 100px 0 60px;
        min-height: auto;
    }
    
    .hero-content {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }
    
    .hero-text { order: 1; }
    .hero-visual { order: 0; height: 350px; }
    
    .hero-circle {
        width: 220px;
        height: 220px;
    }
    .orbit-1 { width: 290px; height: 290px; }
    .orbit-2 { width: 350px; height: 350px; }
    .orbit-3 { width: 410px; height: 410px; }
    
    .hero-cta { justify-content: center; }
    .hero-badge { margin: 0 auto 20px; }
    .hero-desc { margin-left: auto; margin-right: auto; }
    
    .about-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .pricing-card.featured {
        transform: scale(1);
    }
    
    /* Disable custom cursor */
    .cursor-dot, .cursor-ring { display: none; }
    body { cursor: auto; }
}

/* ---------- Mobile ---------- */
@media (max-width: 600px) {
    .container { padding: 0 16px; }
    .section { padding: 60px 0; }
    
    .logo-img { width: 44px; height: 44px; }
    .logo-title { font-size: 17px; }
    .logo-subtitle { font-size: 10px; }
    
    .hero { padding: 90px 0 50px; }
    .hero-visual { height: 280px; }
    .hero-circle { width: 180px; height: 180px; }
    .orbit-1 { width: 230px; height: 230px; }
    .orbit-2 { width: 280px; height: 280px; }
    .orbit-3 { width: 330px; height: 330px; }
    
    .btn {
        padding: 13px 24px;
        font-size: 14px;
    }
    
    .section-head { margin-bottom: 40px; }
    
    .form-row {
        grid-template-columns: 1fr;
        gap: 0;
    }
    
    .career-form, .contact-form { padding: 24px 18px; }
    
    .info-card { padding: 24px 18px; }
    .info-row {
        flex-direction: column;
        gap: 4px;
    }
    
    .footer-grid {
        grid-template-columns: 1fr;
        text-align: center;
    }
    
    .footer-col ul li a:hover { padding-right: 0; }
    
    .newsletter-form {
        flex-direction: column;
    }
    
    .stats-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .stat-item h3 { font-size: 2.4rem; }
    
    .team-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
    
    .team-info { padding: 14px 10px; }
    .team-info h3 { font-size: 0.92rem; }
    .team-info span { font-size: 0.75rem; }
    
    .marquee-track span { font-size: 13px; }
    
    #backToTop {
        width: 44px;
        height: 44px;
        bottom: 20px;
        left: 20px;
    }
    
    .contact-item {
        flex-direction: column;
        text-align: center;
        align-items: center;
    }
    .contact-item:hover { transform: translateY(-4px); }
}

/* ---------- Tiny mobile ---------- */
@media (max-width: 380px) {
    .hero-title { font-size: 2rem; }
    .hero-desc { font-size: 0.95rem; }
    
    .logo-text { display: none; }
    
    .team-grid { grid-template-columns: 1fr; }
}

/* ---------- Landscape Mobile ---------- */
@media (max-height: 500px) and (orientation: landscape) {
    .hero { min-height: auto; padding: 100px 0 40px; }
    .hero-visual { height: 250px; }
}

/* ---------- Print ---------- */
@media print {
    .hero-visual, .marquee, #backToTop, .menu-toggle, 
    .scroll-progress, #preloader, .cursor-dot, .cursor-ring,
    .hero-particles {
        display: none !important;
    }
    body { background: white; color: black; }
}