/* ==========================================================================
   responsive.css — 768 / 1024 / 1280 breakpoints
   ========================================================================== */

/* --- Tablet (768px) ------------------------------------------------------- */
@media (min-width: 768px) {
    .grid--2 {
        grid-template-columns: 1fr 1fr;
    }

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

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

    .two-col {
        grid-template-columns: 1fr 1fr;
    }

    .site-footer__grid {
        grid-template-columns: 2fr 1fr 1fr;
    }

    .stat-table .col-priority-2 {
        display: table-cell;
    }
}

/* --- Desktop (1024px) ----------------------------------------------------- */
@media (min-width: 1024px) {
    .container {
        padding-left: var(--s-24);
        padding-right: var(--s-24);
    }

    /* Header nav visible */
    .site-header__nav {
        display: flex;
    }

    .site-header__utility {
        display: flex;
    }

    .site-header__age-badge {
        display: block;
    }

    .site-header__hamburger {
        display: none;
    }

    .site-header__mobile-menu {
        display: none !important;
    }

    /* Grids */
    .grid--3 {
        grid-template-columns: 1fr 1fr 1fr;
    }

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

    /* Table priority columns visible */
    .stat-table .col-priority-2,
    .stat-table .col-priority-3 {
        display: table-cell;
    }

    /* Hero stats bigger */
    .hero__stat-number {
        font-size: 3rem;
    }
}

/* --- Wide (1280px) -------------------------------------------------------- */
@media (min-width: 1280px) {
    .container {
        padding-left: var(--s-32);
        padding-right: var(--s-32);
    }
}

/* --- Mobile-only hides (below 768) ---------------------------------------- */
@media (max-width: 767px) {
    .stat-table .col-priority-2,
    .stat-table .col-priority-3 {
        display: none;
    }

    .hero__stats {
        gap: var(--s-24);
    }

    .hero__stat-number {
        font-size: 2rem;
    }

    .site-footer__partners {
        flex-direction: column;
        align-items: flex-start;
    }

    .site-footer__compliance {
        flex-direction: column;
        align-items: flex-start;
    }

    .filter-bar {
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: var(--s-8);
    }

    .filter-bar__btn {
        flex-shrink: 0;
    }

    .tabs {
        overflow-x: auto;
        flex-wrap: nowrap;
    }

    .tabs__btn {
        flex-shrink: 0;
        white-space: nowrap;
    }
}
