/* =====================================================
   CARD RESPONSIVE STYLES
   Using ZOOM for proportional scaling (including text)
   ===================================================== */

/* === 960px BREAKPOINT - Mobile layout === */
@media (max-width: 960px) {
    .mtc-card-listing, [class*="mtc-card-listing"] {
        grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
        gap: 15px;
    }

    #mtc-content-area, [id^="mtc-content-area"] {
        width: 100%;
        padding: 15px;
    }
}

/* === 768px BREAKPOINT - Homepage/Page grid === */
@media (max-width: 768px) {
    body.home .mtc-card-listing,
    body.page-id-2 .mtc-card-listing {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }
}

/* === 763px BREAKPOINT - Card centering === */
@media (max-width: 763px) {
    .mtc-card-listing {
        place-items: center;
        display: grid;
        gap: 25px;
    }
}

/* === 500px BREAKPOINT - Zoom 0.95 === */
@media (max-width: 500px) {
    .mtc-card-listing,
    [class*="mtc-card-listing"] {
        grid-template-columns: 1fr;
        gap: 15px;
        padding: 0 10px;
        justify-items: center;
    }

    /* Zoom scales EVERYTHING: dimensions, text, padding */
    .mtc-card {
        zoom: 0.95 !important;
    }

    #mtc-content-area, [id^="mtc-content-area"] {
        width: 100%;
        padding: 0 5px;
    }
}

/* === 420px BREAKPOINT - Zoom 0.88 === */
@media (max-width: 420px) {
    .mtc-card {
        zoom: 0.88 !important;
    }

    .mtc-card-listing,
    [class*="mtc-card-listing"] {
        padding: 0 8px;
    }
}

/* === 380px BREAKPOINT - Zoom 0.82 === */
@media (max-width: 380px) {
    .mtc-card {
        zoom: 0.82 !important;
    }

    .mtc-card-listing,
    [class*="mtc-card-listing"] {
        gap: 12px;
        padding: 0 5px;
    }
}

/* === 350px BREAKPOINT - Zoom 0.75 === */
@media (max-width: 350px) {
    .mtc-card {
        zoom: 0.75 !important;
    }

    .mtc-card-listing,
    [class*="mtc-card-listing"] {
        gap: 10px;
        padding: 0 5px;
    }
}

/* === 320px BREAKPOINT - Zoom 0.68 === */
@media (max-width: 320px) {
    .mtc-card {
        zoom: 0.68 !important;
    }

    .mtc-card-listing,
    [class*="mtc-card-listing"] {
        gap: 5px;
        padding: 0;
    }

    #mtc-content-area, [id^="mtc-content-area"] {
        padding: 0;
    }
}