/* ============================================
   TV / Large screen (Full HD, 2K, 4K)
   Readable from distance, constrained width, clear focus
   ============================================ */

/* Full HD and above (1920px+) */
@media (min-width: 1920px) {
    .container {
        max-width: 1600px;
        padding-left: 48px;
        padding-right: 48px;
    }

    .gallery-section .container,
    .gallery-container-v3 {
        max-width: 1600px;
        margin-left: auto;
        margin-right: auto;
    }

    .upscale-page {
        max-width: 1400px;
        margin-left: auto;
        margin-right: auto;
    }

    .studio-v7-container {
        max-width: 1600px;
    }

    body {
        font-size: 18px;
    }

    /* Focus visible for remote / D-pad navigation */
    a:focus-visible,
    button:focus-visible,
    [tabindex]:focus-visible {
        outline: 3px solid var(--color-primary);
        outline-offset: 4px;
    }

    /* Slightly larger interactive targets */
    .nav-link,
    .btn,
    .gallery-pagination-btn,
    .btn-icon-v3 {
        min-height: 48px;
        padding-top: 12px;
        padding-bottom: 12px;
    }
}

/* 2K and above (2560px+) */
@media (min-width: 2560px) {
    .container {
        max-width: 1920px;
        padding-left: 64px;
        padding-right: 64px;
    }

    body {
        font-size: 19px;
    }

    .section {
        padding-top: 140px;
        padding-bottom: 140px;
    }

    h1 {
        font-size: clamp(3rem, 4vw, 5rem);
    }

    h2 {
        font-size: clamp(2.25rem, 3vw, 3.25rem);
    }
}

/* 4K (3840px+) */
@media (min-width: 3840px) {
    .container {
        max-width: 2200px;
        padding-left: 80px;
        padding-right: 80px;
    }

    body {
        font-size: 20px;
    }

    .section {
        padding-top: 160px;
        padding-bottom: 160px;
    }

    /* Keep cards and grids from growing too large */
    .gallery-grid-v3 {
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        gap: 36px;
    }

    .studio-v7-container {
        max-width: 1800px;
    }
}