/*  * Strategy: For 4K displays (3840x2160), we want: * - Maximum 4-5 columns in grid (not 7) * - Larger text and elements for readability * - Maintain aspect ratios and visual hierarchy */@media only screen and (min-width: 3000px) {    .selection-grid {        display: grid !important;        grid-template-columns: 1fr 1fr 1fr !important;        grid-template-rows: 1fr 1fr 1fr !important;        grid-auto-flow: row !important;        grid-auto-columns: unset !important;        grid-auto-rows: unset !important;    }    .selection-tile:nth-child(1) { grid-column: 1; grid-row: 1; }    .selection-tile:nth-child(2) { grid-column: 2; grid-row: 1; }    .selection-tile:nth-child(3) { grid-column: 3; grid-row: 1; }    .selection-tile:nth-child(4) { grid-column: 1; grid-row: 2; }    .selection-tile:nth-child(5) { grid-column: 2; grid-row: 2; }    .selection-tile:nth-child(6) { grid-column: 3; grid-row: 2; }    .selection-tile:nth-child(7) { grid-column: 1; grid-row: 3; }}@media (min-width: 3000px) and (min-height: 1200px) {    .selection-grid {        display: grid !important;        grid-template-columns: repeat(3, 1fr) !important;        grid-template-rows: repeat(3, minmax(300px, 1fr)) !important;        grid-auto-flow: unset !important;        gap: 1.5rem !important;        grid-template-areas:             "tile1 tile2 tile3"            "tile4 tile5 tile6"            "tile7 empty1 empty2" !important;    }    .selection-tile:nth-child(1) {         grid-area: tile1 !important;        grid-column: 1 / 2 !important;        grid-row: 1 / 2 !important;    }    .selection-tile:nth-child(2) {         grid-area: tile2 !important;        grid-column: 2 / 3 !important;        grid-row: 1 / 2 !important;    }    .selection-tile:nth-child(3) {         grid-area: tile3 !important;        grid-column: 3 / 4 !important;        grid-row: 1 / 2 !important;    }    .selection-tile:nth-child(4) {         grid-area: tile4 !important;        grid-column: 1 / 2 !important;        grid-row: 2 / 3 !important;    }    .selection-tile:nth-child(5) {         grid-area: tile5 !important;        grid-column: 2 / 3 !important;        grid-row: 2 / 3 !important;    }    .selection-tile:nth-child(6) {         grid-area: tile6 !important;        grid-column: 3 / 4 !important;        grid-row: 2 / 3 !important;    }    .selection-tile:nth-child(7) {         grid-area: tile7 !important;        grid-column: 1 / 2 !important;        grid-row: 3 / 4 !important;    }    .selection-tile {        min-height: 350px !important;        width: 100% !important;        height: 100% !important;    }    .selection-tile-title {        font-size: clamp(1.75rem, 2.5vw, 2.75rem) !important;        line-height: 1.1 !important;        margin-bottom: 0.5rem !important;    }    .selection-tile-date {        font-size: clamp(1rem, 1.25vw, 1.5rem) !important;        opacity: 0.9 !important;    }    .selection-tile-tagline {        font-size: clamp(1.125rem, 1.5vw, 1.75rem) !important;        line-height: 1.2 !important;    }    .selection-tile-logo {        max-height: clamp(60px, 8vh, 100px) !important;        max-width: clamp(120px, 20vw, 200px) !important;    }    .selection-tile-overlay {        padding: clamp(1.5rem, 3vw, 2.5rem) !important;    }    .grid-wrapper {        padding: 2rem 3rem !important;    }    .selection-grid {        max-width: 90vw !important;        max-height: 85vh !important;    }    .hero-content h2 {        font-size: clamp(3rem, 4vw, 5rem) !important;    }    .hero-content p {        font-size: clamp(1.25rem, 1.5vw, 2rem) !important;        max-width: 1200px !important;    }    .hero-content .hero-button {        font-size: clamp(1.125rem, 1.25vw, 1.5rem) !important;        padding: 1.25rem 2.5rem !important;    }    .hero-logo-container img {        max-height: 12rem !important;        width: auto !important;    }    header {        padding: 2rem 3rem !important;    }    .header-logo {        width: clamp(200px, 15vw, 300px) !important;    }    nav a {        font-size: clamp(1rem, 1.25vw, 1.5rem) !important;    }}@media screen and (min-width: 3000px) {    .grid-selection-container .selection-grid {        display: grid !important;        grid-template-columns: repeat(3, 1fr) !important;        grid-template-rows: repeat(3, 1fr) !important;        grid-auto-flow: initial !important;    }}@media (min-width: 3840px) and (min-aspect-ratio: 21/9) {    .selection-grid {        grid-template-columns: repeat(3, 1fr) !important;        grid-template-rows: repeat(3, 1fr) !important;        max-width: 3200px !important;        margin: 0 auto !important;    }}@media (min-width: 3840px) and (min-height: 2160px) {    .hero-content h2 {        font-size: 5.5rem !important;        line-height: 1.1 !important;    }    .hero-content p {        font-size: 2.25rem !important;        line-height: 1.4 !important;    }    .countdown-unit {        padding: 1.5rem 2rem !important;        min-width: 120px !important;    }    .countdown-unit .countdown-value {        font-size: 3rem !important;    }    .countdown-unit .countdown-label {        font-size: 1.25rem !important;    }}