@media (max-width: 900px) {
    .hero__grid { grid-template-columns: 1fr; }
    .hero__aside { display: none; }
    .rank-featured { grid-template-columns: 1fr; }
    .review-detail__pros-cons { grid-template-columns: 1fr; }
    .guides-grid { grid-template-columns: 1fr 1fr; }
    .site-ft__grid { grid-template-columns: 1fr; gap: 28px; }
    .contact-grid { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    h1 { font-size: 1.6rem; }
    h2 { font-size: 1.3rem; }
    .section { padding: 40px 0; }
    .rankings, .reviews, .faq, .content-block { padding: 40px 0; }

    .site-hd__toggle { display: block; }
    .site-hd__nav {
        display: none;
        flex-direction: column;
        position: absolute;
        top: 60px;
        left: 0;
        right: 0;
        background: var(--slate);
        padding: 12px 20px 20px;
        box-shadow: var(--shadow-lg);
        gap: 2px;
    }
    .site-hd__nav.is-open { display: flex; }
    .site-hd__nav a { padding: 10px 12px; font-size: .92rem; }
    .site-hd__dropdown-menu {
        position: static;
        box-shadow: none;
        background: rgba(255,255,255,.05);
        border-radius: var(--radius-sm);
        margin: 4px 0 4px 12px;
        min-width: auto;
    }
    .site-hd__dropdown-menu a { color: #D1D5DB; font-size: .85rem; }
    .site-hd__dropdown-menu a:hover { background: rgba(255,255,255,.08); color: #F9FAFB; }
    .site-hd__dropdown-sep { background: rgba(255,255,255,.1); margin: 4px 0; }

    .rank-row { grid-template-columns: 28px 1fr; gap: 8px; }
    .rank-row__offer { grid-column: 1 / -1; padding-left: 36px; }
    .rank-row__cta { grid-column: 1 / -1; text-align: center; padding: 10px; }

    .review-tabs { gap: 4px; }
    .review-tabs__btn { font-size: .76rem; padding: 6px 12px; }

    .review-detail { padding: 20px; }
    .review-detail__header { flex-direction: column; }
    .review-detail__cta { width: 100%; text-align: center; justify-content: center; }

    .guides-grid { grid-template-columns: 1fr; }
    .info-grid { grid-template-columns: 1fr; }
    .game-grid { grid-template-columns: 1fr 1fr; }
    .adv-grid { grid-template-columns: 1fr; }
    .trust-bar { gap: 24px; }
    .trust-bar__icon { width: 56px; height: 56px; font-size: .85rem; }

    .data-tbl { font-size: .82rem; }
    .data-tbl th, .data-tbl td { padding: 8px 10px; }
}

@media (max-width: 480px) {
    h1 { font-size: 1.4rem; }
    .hero { padding: 32px 0; }
    .hero__aside { padding: 20px; }
    .rank-card { padding: 18px; }
    .game-grid { grid-template-columns: 1fr; }
}