/* Mobile Fixes CSS */
/* Các sửa lỗi cho mobile devices */

@media (max-width: 768px) {
    /* Fix cho menu mobile */
    .main-header {
        padding: 0.5rem 0;
    }
    
    .hamburger {
        display: block !important;
    }
    
    .main-nav {
        display: none;
    }
    
    /* Fix cho video section */
    .hero-video {
        height: 50vh;
        min-height: 300px;
    }
    
    .video-wrapper iframe {
        height: 100%;
    }
    
    /* Fix cho cards */
    .card-services {
        margin-bottom: 1rem;
    }
    
    .posts-cards-wrap {
        grid-template-columns: 1fr !important;
        gap: 1rem;
    }
    
    /* Fix cho buttons */
    .btn-kai {
        padding: 8px 16px !important;
        font-size: 0.9rem !important;
    }
    
    /* Fix cho text */
    .kai-title {
        font-size: 1.3rem !important;
    }
    
    /* Fix cho spacing */
    .container-fluid {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    /* Fix cho footer */
    .footer-content {
        flex-direction: column;
        text-align: center;
    }
    
    .footer-info,
    .footer-links,
    .footer-contact {
        margin-bottom: 2rem;
    }
}

@media (max-width: 480px) {
    /* Extra small devices */
    .kai-title {
        font-size: 1.1rem !important;
    }
    
    .btn-kai {
        padding: 6px 12px !important;
        font-size: 0.8rem !important;
    }
    
    .hero-video {
        height: 40vh;
        min-height: 250px;
    }
}