/** xs **/
@media (min-width: 320px) {
    html {
        font-size: var(--font-xs);
    }
}

/** sm **/
@media (min-width: 576px) {
    html {
        font-size: var(--font-sm);
    }
}

@media (min-width: 768px) {
    html {
        font-size: var(--font-md);
    }
}

@media (min-width: 992px) {
    html {
        font-size: var(--font-lg);
    }
}

@media (min-width: 1400px) {
    /* xl */
    html {
        font-size: var(--font-xl);
    }
}

@media (min-width: 1920px) {
    /* xxl */
    html {
        font-size: var(--font-fullhd);
    }
}