


@media (max-width: 1024px) {
    .grid--features,
    .grid--games {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .grid--testimonials {
        grid-template-columns: 1fr;
    }

    .stats--three {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }

    .contact-layout {
        grid-template-columns: 1fr;
    }

    .server-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hero__inner {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .hero__content {
        order: 2;
    }

    .hero__showcase {
        order: 1;
    }

    .hero__actions {
        justify-content: center;
    }

    .eyebrow::before {
        display: none;
    }
}


@media (max-width: 860px) {
    .stats--three {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .server-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .cta-band__inner {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
        padding: 32px 24px;
    }

    .game-hero {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 24px;
    }

    .game-hero__media {
        max-width: 200px;
        margin: 0 auto;
    }

    .contact-layout {
        gap: 20px;
    }

    .section {
        padding: clamp(40px, 6vw, 80px) 0;
    }
}


@media (max-width: 740px) {
    .grid--games,
    .grid--features {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .gaming-footer .footer-grid {
        padding: 24px 0;
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .trust-badges .container {
        padding: 24px 16px;
    }

    .footer-bottom .container {
        padding: 16px;
    }

    
    .games-bento {
        gap: 16px;
    }

    .game-card {
        padding: 20px;
    }

    .game-card--featured .game-card__media img {
        width: 90px;
        height: 90px;
    }

    
    .server-logo-item {
        width: 100px;
        height: 100px;
    }

    .server-logo-item img {
        width: 65px;
        height: 65px;
    }

    .server-logo-track {
        gap: 14px;
        padding: 0 12px;
    }

    .server-logo-rail {
        padding: 14px;
    }

    
    .hero__showcase {
        min-height: clamp(180px, 50vw, 280px);
    }

    .hero__character-img {
        max-height: min(45vh, 320px);
    }

    
    .section-head {
        margin-bottom: 32px;
    }

    
    .card {
        padding: 20px;
    }

    .server-card {
        padding-top: 20px;
    }

    
    .field {
        padding: 12px 16px;
    }

    .toolbar {
        flex-direction: column;
        gap: 12px;
    }

    .toolbar .field,
    .toolbar select.field {
        width: 100%;
    }

    
    .btn {
        padding: 12px 20px;
        font-size: 0.9rem;
    }

    .btn--large {
        padding: 14px 32px;
        font-size: 1rem;
    }

    .hero__actions {
        flex-direction: column;
        gap: 12px;
    }

    .hero__actions .btn {
        width: 100%;
    }

    
    .faq__q {
        padding: 16px;
    }

    .faq__a {
        padding: 0 16px 16px;
    }
}


@media (max-width: 480px) {
    .container {
        padding-inline: 16px;
    }

    .hero__title {
        font-size: clamp(1.8rem, 7vw, 2.5rem);
    }

    .hero__lead {
        font-size: 1rem;
    }

    .section-head h1,
    .section-head h2 {
        font-size: clamp(1.5rem, 5vw, 2rem);
    }

    .stat__value {
        font-size: clamp(1.6rem, 6vw, 2.2rem);
    }

    .server-logo-item {
        width: 85px;
        height: 85px;
    }

    .server-logo-item img {
        width: 55px;
        height: 55px;
    }

    .cta-band__inner {
        padding: 24px 20px;
    }

    .cta-band__inner h2 {
        font-size: 1.2rem;
    }

    
    .features-grid {
        gap: 20px;
    }

    .feature-item {
        flex-direction: column;
        text-align: center;
        gap: 8px;
    }

    .gaming-footer .trust-seals {
        gap: 16px;
    }

    .gaming-footer .trust-seals img {
        max-height: 70px;
    }

    .footer-legal-links {
        flex-direction: column;
        gap: 12px;
    }
}


@media (max-height: 700px) and (orientation: landscape) {
    .hero {
        min-height: auto;
    }

    .hero__inner {
        padding: clamp(100px, 10vh, 140px) 0 clamp(40px, 6vh, 60px);
    }

    .hero__showcase {
        min-height: clamp(150px, 30vh, 250px);
    }
}


@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-img,
    .footer-logo-img {
        image-rendering: -webkit-optimize-contrast;
    }
}


@media print {
    .gaming-header,
    .gaming-footer,
    .hero__video,
    .hero__showcase-glow,
    .mobile-menu,
    .toast {
        display: none !important;
    }

    body.site {
        background: white;
        color: black;
    }

    body.site::before,
    .site-grid-bg {
        display: none;
    }

    .card {
        border: 1px solid #ccc;
        box-shadow: none;
        background: white;
    }

    .card::before {
        display: none;
    }

    a {
        color: black;
        text-decoration: underline;
    }
}
