/* Tablet */
@media (max-width: 1024px) {
    .nav-brand h2 { font-size: 20px; }
    .nav-brand .logo { height: 45px; }
    .hero { padding: 120px 0; min-height: 450px; background-position: center; }
    .hero-content { margin-left: 30px; max-width: 350px; }
    .hero-content h1 { font-size: 26px; }
    .hero-buttons .btn { padding: 10px 25px; font-size: 15px; }
    .about-grid, .inspect-item { grid-template-columns: 1fr; }
    .inspect-item.reverse { direction: ltr; }
    .product-full { grid-template-columns: 1fr; }
    .contact-grid { grid-template-columns: 1fr; }
    .vm-grid { grid-template-columns: 1fr; }
    .timeline::before { left: 30px; }
    .timeline-item { flex-direction: column; padding-left: 60px; }
    .timeline-year { text-align: left; padding-right: 0; }
    .about-image { padding: 30px; }
    .about-image img { max-height: 350px; }
    .banner-section { height: 500px; }
    .banner-content { margin-left: 50px; }
    .banner-content h1 { font-size: 52px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
    .footer-col:first-child { grid-column: 1 / -1; text-align: center; }
    .footer-col:first-child h3::after { left: 50%; transform: translateX(-50%); }
    .footer-col:first-child .footer-logo { margin: 0 auto 15px; }
    .footer-col:first-child p { text-align: center; }
    .footer-col:first-child .social-links { justify-content: center; }
}

/* Mobile */
@media (max-width: 768px) {
    .navbar { padding: 8px 0; }
    .nav-brand { gap: 10px; }
    .nav-brand h2 { font-size: 16px; }
    .nav-brand .logo { height: 45px; }
    .hamburger { display: flex; }
    .nav-menu { position: fixed; left: -100%; top: 58px; flex-direction: column; background: var(--white); width: 100%; text-align: center; transition: 0.3s; box-shadow: 0 10px 27px rgba(0,0,0,0.05); padding: 20px 0; gap: 0; z-index: 999; }
    .nav-menu.active { left: 0; }
    .nav-menu li { margin: 15px 0; }
    .hamburger.active span:nth-child(1) { transform: rotate(45deg) translate(8px, 8px); }
    .hamburger.active span:nth-child(2) { opacity: 0; }
    .hamburger.active span:nth-child(3) { transform: rotate(-45deg) translate(8px, -8px); }
    .welcome-grid { grid-template-columns: 1fr; gap: 40px; }
    .welcome-content { padding-left: 0; text-align: center; }
    .welcome-image-wrapper { padding-right: 0; }
    .welcome-heading { font-size: 32px; }
    .welcome-description { font-size: 16px; }
    .welcome-section { padding: 60px 0; }
    .welcome-content h2 { font-size: 32px; text-align: center; }
    .welcome-content p { font-size: 16px; }
    .banner-section { height: 400px; }
    .banner-content { margin: 0 auto; text-align: center; max-width: 90%; }
    .banner-content h1 { font-size: 36px; }
    .banner-btn { padding: 14px 35px; font-size: 18px; }
    
    .hero { padding: 80px 0; min-height: 400px; background-position: center; background-size: cover; }
    .hero-content { margin-left: 20px; max-width: 90%; }
    .hero-content h1 { font-size: 24px; }
    .hero-buttons { flex-direction: column; gap: 10px; }
    .hero-buttons .btn { width: 100%; text-align: center; padding: 10px 20px; font-size: 14px; }
    
    .page-header { padding: 40px 0; margin-top: 58px; }
    .page-header h1 { font-size: 28px; }
    .page-header p { font-size: 14px; }
    
    .section-padding { padding: 40px 0; }
    .section-header h2 { font-size: 24px; }
    .section-header p { font-size: 14px; }
    
    .about-image { padding: 20px; }
    .about-image img { max-height: 300px; }
    
    .solutions-grid, .industries-grid, .features-grid, .products-grid, .expertise-grid { grid-template-columns: 1fr; gap: 20px; }
    .partners-grid { grid-template-columns: repeat(2, 1fr); gap: 15px; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    
    .product-full-img { padding: 30px; }
    .product-full-img i { font-size: 60px; }
    .product-full-content { padding: 30px 20px; }
    .product-full-content h3 { font-size: 24px; }
    
    .inspect-img { padding: 40px; }
    .inspect-img i { font-size: 80px; }
    .inspect-content h3 { font-size: 24px; }
    
    .about-overview h2 { font-size: 28px; }
    .about-overview .lead { font-size: 18px; }
    
    .stat-num { font-size: 36px; }
    
    .vm-card { padding: 30px 20px; }
    
    .tech-item { flex-direction: column; gap: 20px; }
    
    .timeline::before { left: 20px; }
    .timeline-item { padding-left: 50px; }
    .timeline-year { font-size: 20px; }
    
    .footer-grid { grid-template-columns: 1fr; gap: 30px; text-align: center; }
    .footer-col h3::after, .footer-col h4::after { left: 50%; transform: translateX(-50%); }
    .footer-col p { text-align: center; }
    .footer-col ul li a::before { display: none; }
    .footer-col ul li:hover a { transform: translateX(0); }
    .contact-info li { justify-content: center; }
    .social-links { justify-content: center; }
    .footer-col .footer-logo { margin: 0 auto 15px; }
    
    .cta h2 { font-size: 28px; }
    .cta p { font-size: 16px; }
}

/* Small Mobile */
@media (max-width: 480px) {
    .navbar { padding: 8px 0; }
    .nav-brand h2 { font-size: 13px; }
    .nav-brand .logo { height: 40px; }
    .nav-menu { top: 54px; }
    .hero { padding: 60px 0; min-height: 350px; }
    .hero-content { margin-left: 15px; max-width: 95%; }
    .hero-content h1 { font-size: 20px; }
    .hero-buttons .btn { padding: 8px 18px; font-size: 13px; }
    .page-header { padding: 35px 0; margin-top: 54px; }
    .page-header h1 { font-size: 24px; }
    .page-header p { font-size: 13px; }
    .section-padding { padding: 30px 0; }
    .section-header { margin-bottom: 30px; }
    .section-header h2 { font-size: 22px; }
    .section-header p { font-size: 13px; }
    .about-image { padding: 15px; }
    .about-image img { max-height: 250px; }
    .banner-section { height: 350px; }
    .banner-content h1 { font-size: 28px; }
    .banner-btn { padding: 12px 28px; font-size: 16px; }
    .partners-grid { grid-template-columns: 1fr; }
    .stats-grid { grid-template-columns: 1fr; }
    .stat-num { font-size: 32px; }
    .product-full-content h3, .inspect-content h3 { font-size: 20px; }
    .card-icon, .vm-icon { width: 60px; height: 60px; }
    .card-icon i, .vm-icon i { font-size: 28px; }
    .tech-icon { width: 60px; height: 60px; }
    .tech-icon i { font-size: 28px; }
    .info-icon { width: 50px; height: 50px; }
    .info-icon i { font-size: 20px; }
    .footer-col .footer-logo { max-width: 100px; }
    .footer-col p { font-size: 13px; }
    .footer-col h3, .footer-col h4 { font-size: 18px; }
}