/* ============================================================
   Moban 8-10-28 — Responsive (768px / 480px)
   ============================================================ */

@media (max-width: 992px) {
    .content-layout,
    .single-layout {
        grid-template-columns: minmax(0, 1fr) 260px;
        gap: 24px;
    }
}

/* ------------------ Tablet / mobile lớn ------------------ */
@media (max-width: 768px) {
    .header-inner {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 12px;
        padding: 10px 0;
        min-height: 60px;
    }

    .site-logo { order: 1; }
    .nav-toggle { order: 2; display: inline-flex; margin-left: auto; }
    .header-actions { order: 3; margin-left: 8px; }

    .main-nav {
        order: 4;
        flex-basis: 100%;
        display: none;
        padding: 8px 0 4px;
    }

    body.menu-open .main-nav { display: block; }

    .nav-menu {
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
    }

    .nav-menu li a {
        display: block;
        padding: 11px 14px;
    }

    .btn-login { padding: 8px 14px; font-size: 13px; }
    .btn-register { padding: 8px 14px; font-size: 13px; }

    .content-layout,
    .single-layout {
        display: block;
    }

    .main-col,
    .sidebar-col { width: 100%; }

    .sidebar-col { margin-top: 36px; }

    .gallery-head { padding-top: 28px; }
    .gallery-note { margin-left: 0; flex-basis: 100%; }

    .news-link { flex-direction: column; }
    .news-thumb { flex: none; height: 190px; }

    .cta-inner {
        flex-direction: column;
        align-items: flex-start;
        padding: 28px 24px;
    }

    .entry-content { padding: 22px 20px; }
}

/* ------------------ Mobile nhỏ ------------------ */
@media (max-width: 480px) {
    .container { padding: 0 14px; }

    .header-actions .btn-login { display: none; }

    .logo-img { max-height: 40px; }

    .poster-gallery { padding-left: 14px; padding-right: 14px; }

    .poster-track { gap: 16px; }

    .poster-slide { width: 86vw; }

    .poster-caption {
        flex-direction: column;
        align-items: flex-start;
        padding: 12px 14px;
    }

    .icon-strip { padding-left: 14px; padding-right: 14px; }

    .game-tile {
        flex-basis: 138px;
        padding: 12px 10px;
    }

    .game-tile-img { width: 96px; height: 96px; }
    .game-tile-name { font-size: 12.5px; }

    .news-thumb { height: 160px; }
    .news-body { padding: 14px 16px; }
    .news-title { font-size: 16px; }

    .btn-lg { width: 100%; text-align: center; }

    .cta-inner { padding: 24px 18px; }

    .pagination-bar .page-numbers { min-width: 36px; padding: 6px 10px; font-size: 13px; }

    .entry-content { padding: 18px 14px; font-size: 15px; }
}