@media (max-width: 1100px) {
    .header-inner { padding: 10px 8px; }
    .movie-grid { grid-template-columns: repeat(4, 1fr); gap: 16px; }
}
@media (max-width: 900px) {
    .nav-links { display: none; }
    .nav-links.open {
        display: flex; position: absolute; top: 100%; left: 0; right: 0;
        background: #0f0f18; padding: 12px 20px; flex-wrap: wrap;
        border-bottom: 1px solid rgba(255,255,255,0.06);
        gap: 6px; z-index: 99;
        overflow: visible;
    }
    .nav-links.open .dropdown-content,
    .nav-links.open .genre-dropdown-content {
        top: calc(100% + 10px);
        left: 50%;
        right: auto;
        transform: translateX(-50%);
        width: min(210px, calc(100vw - 44px));
        max-width: calc(100vw - 44px);
        max-height: 50vh;
        overflow-y: auto;
        grid-template-columns: 1fr;
    }
    .nav-links.open #phimDropdown {
        grid-template-columns: 1fr;
    }
    .nav-links.open #phimDropdown a:last-child {
        grid-column: auto;
    }
    .nav-links.open .dropdown-content a,
    .nav-links.open .genre-dropdown-content a {
        font-size: 0.74rem;
    }
    .menu-toggle { display: block; order: -1; }
    .search-toggle { display: block; order: 2; margin-left: auto; }
    .logo { order: 0; flex: 1; text-align: center; }
    .header-inner { flex-wrap: wrap; }
    .search-box { display: none; order: 3; width: 100%; }
    .search-box.show { display: block; }
    .search-box input { flex: 1; width: 100%; }
    .scroll-top-btn.in-list { bottom: 161px; width: 42px; height: 40px; }
    .scroll-top-btn.in-detail { bottom: 69px; width: 42px; height: 40px; }
    .movie-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .movie-card .info { padding: 8px; min-height: 54px; }
    .movie-card .info h3 { font-size: 0.86rem; min-height: 1.25em; }
    .movie-card .info .movie-submeta { font-size: 0.74rem; }
    footer { position: fixed; }
    .container { padding-bottom: 60px; }
    .pagination { margin-bottom: 40px; }
}

@media (min-width: 768px) and (max-width: 900px) {
    .movie-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
    }

    .pagination {
        gap: 8px;
    }

    .pagination button {
        font-size: 0.95rem;
        padding: 0.65em 1em;
        min-width: 2.8em;
        min-height: 2.45em;
    }
}