:root {
    --fs-tiny: 12px;
    --fs-small: 14px;
    --fs-normal: 16px;
    --fs-large: 36px;

    /*typical title + subtitle + body combinations*/
    --fs-small-title: 16px;
    /*small*/
    /*tiny*/

    --fs-medium-title: 24px;
    /*normal*/
    /*small*/

    --fs-large-title: 36px;
    --fs-large-subtitle: 18px;
    /*normal*/

    --fs-huge-title: 80px;
    --fs-huge-subtitle: 18px;
    /*normal*/
}

@media screen and (max-width: 768px) {
    :root {
        --fs-tiny: 12px;
        --fs-small: 14px;
        --fs-normal: 16px;
        --fs-large: 32px;

        /*typical title + subtitle + body combinations*/
        --fs-small-title: 16px;
        /*small*/
        /*tiny*/

        --fs-medium-title: 18px;
        /*normal*/
        /*small*/

        --fs-large-title: 32px;
        --fs-large-subtitle: 16px;
        /*normal*/

        --fs-huge-title: 46px;
        --fs-huge-subtitle: 18px;
        /*normal*/
    }
}