@media (max-width: 1024px) {
    html,
    body {
        overflow-x: hidden;
    }

    .hero .container,
    .plans-hero-layout,
    .single-grid,
    .plans-grid,
    .servers-grid,
    .services-grid,
    .benefits-grid,
    .outpost-grid {
        grid-template-columns: 1fr !important;
    }

    .hero .container {
        column-gap: 0 !important;
        row-gap: 1rem !important;
    }

    .hero-image-space,
    .plans-hero-image-space {
        display: none !important;
    }

    .filter-controls {
        position: static !important;
        top: auto !important;
    }

    .filter-controls.is-compact {
        box-shadow: none !important;
    }

    .spec-info {
        grid-template-columns: 1fr !important;
        align-items: flex-start !important;
        gap: 0.22rem !important;
    }

    .spec-label {
        white-space: normal !important;
    }

    .spec-value {
        text-align: left !important;
    }

    .spec-row:hover,
    .outpost-card:hover,
    .outpost-card.is-active {
        transform: none !important;
    }

    .outpost-recommendation {
        flex-direction: column !important;
        text-align: center !important;
    }

    .preset-btn,
    .filter-chip,
    .btn-reset,
    .search-input,
    .filter-select,
    .stepper-btn,
    .location-toggle,
    .nav-links a {
        min-height: 44px !important;
    }

    .search-clear-btn {
        width: 2.4rem !important;
        height: 2.4rem !important;
    }

    .control-head,
    .addon-inline {
        flex-wrap: wrap;
    }
}

@media (max-width: 768px) {
    .container,
    .gamebox-page .container,
    .subnav-container,
    .navbar {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .service-card > .btn,
    .plan-footer .btn-order,
    .btn-primary,
    .btn-secondary {
        width: 100% !important;
    }

    .cta-group .btn,
    .cta-group .btn.btn-primary,
    .cta-group .btn.btn-secondary {
        width: auto !important;
        padding: 1rem 1.5rem;
        font-size: 1rem;
    }

    .outpost-card {
        padding: 1.25rem 1rem !important;
    }

    .filter-group {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 480px) {
    .container,
    .gamebox-page .container,
    .subnav-container,
    .navbar {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }

    .hero-title {
        font-size: clamp(2rem, 10vw, 2.5rem) !important;
    }

    .location-badge {
        width: 100%;
        justify-content: center;
    }

    .value-pill {
        font-size: 0.75rem !important;
    }

    .control-head label {
        font-size: 0.78rem !important;
    }
}