@media (max-width: 1536px) {
    :root {
        --text-md: 20px;
        --text-lg: 26px;
    }

    .card-width { width: 328px; }
    .card-image-height { height: 200px; }
}

@media (max-width: 1280px) {
    :root {
        --text-md: 20px;
        --text-lg: 24px;
        --text-xl: 32px;
    }

    .card-width { width: 302px; }
    .card-image-height { height: 180px; }
}

@media (max-width: 800px) {
    :root {
        --text-md: 18px;
        --text-xl: 30px;
    }
}

@media (max-width: 550px) {
    :root {
        /* --text-xl: 22px; */
    }
}

@media (max-width: 800px) {
    .card-width { width: 302px; }
    .card-image-height { height: 180px; }
}