/* ============================================================
   MOBAN 8-10-46 — responsive.css
   768px: máy tính bảng — 480px: điện thoại — poster về 1 cột
   ============================================================ */

/* ---------- ≤ 1024px ---------- */
@media (max-width: 1024px) {
    .poster-field__wall { grid-template-columns: repeat(3, minmax(0, 1fr)); }

    .site-footer__cols { grid-template-columns: 1fr 1fr; }

    .overlay-menu.is-open .overlay-menu__link:nth-child(4) { margin-left: 10vw; }
    .overlay-menu.is-open .overlay-menu__link:nth-child(5) { margin-left: 14vw; }
}

/* ---------- ≤ 768px ---------- */
@media (max-width: 768px) {
    :root { --header-h: 64px; }

    .site-header__logo img { max-height: 40px; }

    .site-header__actions .btn--pulse { padding: 11px 18px; font-size: 12px; }

    .overlay-menu { padding-top: 100px; gap: 6vh; }
    .overlay-menu__link { font-size: clamp(24px, 6vw, 34px); gap: 14px; }
    .overlay-menu.is-open .overlay-menu__link:nth-child(2) { margin-left: 8vw; }
    .overlay-menu.is-open .overlay-menu__link:nth-child(3) { margin-left: 16vw; }
    .overlay-menu.is-open .overlay-menu__link:nth-child(4) { margin-left: 6vw; }
    .overlay-menu.is-open .overlay-menu__link:nth-child(5) { margin-left: 12vw; }

    .hero__content { padding-bottom: 90px; }
    .hero__line { font-size: clamp(38px, 11vw, 64px); }
    .hero__cta .btn { flex: 1 1 auto; text-align: center; }

    .ticker__track { font-size: 13px; gap: 24px; }

    .poster-field__wall {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px 18px;
    }

    .news-strip__grid,
    .loop__grid,
    .related__grid { grid-template-columns: 1fr 1fr; }

    .features__grid { display: flex; flex-direction: column; }
    .feature-card { grid-area: auto; }

    .article__cta { flex-direction: column; align-items: flex-start; }
}

/* ---------- ≤ 480px ---------- */
@media (max-width: 480px) {
    /* Poster rải rác hội tụ về một cột, bỏ xoay và âm lề */
    .poster-field__wall {
        grid-template-columns: 1fr;
        gap: 22px;
        padding-bottom: 30px;
    }
    .poster-card:nth-child(4n+1),
    .poster-card:nth-child(4n+2),
    .poster-card:nth-child(4n+3),
    .poster-card:nth-child(4n+4) {
        transform: none;
        margin: 0;
        z-index: auto;
    }
    .poster-card:nth-child(5),
    .poster-card:nth-child(8) { margin: 0; }
    .poster-card.reveal.is-visible:nth-child(4n+1),
    .poster-card.reveal.is-visible:nth-child(4n+2),
    .poster-card.reveal.is-visible:nth-child(4n+3),
    .poster-card.reveal.is-visible:nth-child(4n+4) { transform: none; }
    .poster-card.reveal.is-visible:hover,
    .poster-card.reveal.is-visible:focus-within,
    .poster-card.reveal.is-visible.is-revealed { transform: scale(1.02); }
    .poster-card__img { aspect-ratio: 4 / 3; }

    .news-strip__grid,
    .loop__grid,
    .related__grid { grid-template-columns: 1fr; }

    .site-footer__cols { grid-template-columns: 1fr; gap: 28px; }

    .hero__line { font-size: clamp(32px, 12vw, 46px); }
    .hero__cta { flex-direction: column; }
    .btn--big { padding: 15px 26px; font-size: 15px; width: 100%; text-align: center; }

    .overlay-menu.is-open .overlay-menu__link { margin-left: 0 !important; }
    .overlay-menu__link { font-size: 22px; }

    .article-nav { flex-direction: column; }
}