/* ============================================
   RESPONSIVE — Media Queries
   ============================================ */

/* === LARGE DESKTOP (< 1400px) === */
@media (max-width: 1400px) {
    :root {
        --container-max: 1140px;
    }
}

/* === DESKTOP (< 1200px) === */
@media (max-width: 1200px) {
    :root {
        --container-max: 960px;
        --font-size-hero: 3.5rem;
        --font-size-4xl: 2rem;
    }

    .faction-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* === TABLET (< 992px) === */
@media (max-width: 992px) {
    :root {
        --container-max: 720px;
        --font-size-hero: 3rem;
        --section-padding: 3.5rem 0;
    }

    /* Navbar mobile */
    .navbar-menu {
        display: none;
    }

    .navbar-actions {
        display: none;
    }

    .navbar-toggle {
        display: flex;
    }

    /* Hero split → stack vertically */
    .hero-content {
        flex-direction: column;
        text-align: center;
        gap: var(--space-2xl);
    }

    .hero-left {
        text-align: center;
    }

    .hero-actions {
        justify-content: center;
    }

    .hero-right {
        max-width: 560px;
        width: 100%;
    }

    /* News grid */
    .news-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Profile sidebar */
    .profile-layout {
        grid-template-columns: 1fr;
    }

    .profile-sidebar {
        position: relative;
        top: 0;
        height: auto;
        border-right: none;
        border-bottom: 1px solid rgba(201, 179, 137, 0.08);
    }

    .profile-content {
        padding: var(--space-xl);
    }

    /* Register grid */
    .register-grid {
        grid-template-columns: 1fr;
    }

    /* Download specs */
    .download-specs {
        gap: var(--space-lg);
    }

    /* Rankings table scroll */
    .rankings-wrapper {
        overflow-x: auto;
    }
}

/* === MOBILE LANDSCAPE (< 768px) === */
@media (max-width: 768px) {
    :root {
        --font-size-hero: 2.5rem;
        --font-size-3xl: 1.75rem;
        --font-size-2xl: 1.35rem;
        --section-padding: 3rem 0;
        --space-4xl: 4rem;
        --space-5xl: 5rem;
    }

    .container {
        padding: 0 var(--space-md);
    }

    /* Grid collapses */
    .grid-2, .grid-3, .grid-4 {
        grid-template-columns: 1fr;
    }

    .news-grid {
        grid-template-columns: 1fr;
    }

    .faction-grid {
        grid-template-columns: 1fr;
    }

    /* Hero adjustments */
    .hero-actions {
        flex-direction: column;
        align-items: center;
    }

    .hero-actions .btn {
        width: 100%;
        max-width: 300px;
    }

    .hero-right {
        max-width: 100%;
    }

    /* Server status stacks */
    .server-status-inner {
        flex-direction: column;
        gap: var(--space-md);
    }

    /* Section headers */
    .section-header h2 {
        font-size: var(--font-size-2xl);
    }

    /* Account card */
    .account-card {
        padding: var(--space-xl);
    }

    .account-page {
        padding: var(--space-md);
    }

    /* Dashboard grid */
    .dashboard-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Download specs 2x2 on tablet */
    .download-specs {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Transaction table scroll */
    .transaction-table-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Tabs scroll */
    .tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .tab-item {
        white-space: nowrap;
        padding: var(--space-md) var(--space-lg);
    }
}

/* === MOBILE PORTRAIT (< 576px) === */
@media (max-width: 576px) {
    :root {
        --font-size-hero: 2rem;
        --font-size-3xl: 1.5rem;
        --navbar-height: 60px;
    }

    .hero-title .gold {
        font-size: 0.5em;
    }

    .hero-logo {
        width: 140px;
    }

    /* Smaller padding */
    .account-card {
        padding: var(--space-lg);
        border-radius: var(--border-radius-md);
    }

    .account-links {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    /* Table font size */
    .table-fantasy tbody td,
    .table-fantasy thead th {
        padding: var(--space-sm);
        font-size: var(--font-size-xs);
    }

    /* Character items */
    .character-item {
        flex-direction: column;
        text-align: center;
    }

    .character-details {
        justify-content: center;
        flex-wrap: wrap;
    }

    /* Dashboard single column on small screens */
    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    /* Scroll-to-top repositioned */
    .scroll-to-top {
        bottom: 1rem;
        right: 1rem;
        width: 40px;
        height: 40px;
    }

    /* Download specs single column */
    .download-specs {
        grid-template-columns: 1fr;
    }
}