:root {

    --brand-light: #F8F7F1;
    --brand-dark: #141211;
    --brand-light-hover: #FFFFFF;
    --brand-dark-hover: #010101;
    --brand-accent-a: #C0714B;
    --brand-accent-b: #E5AD87;

    --header: 3rem;
    --subheader-a: 2.2rem;
    --subheader-b: 2rem;
    --body: 1.5rem;
    --megamenu: 1.05rem;
    --form: 1.5rem;
    --button-text: 1.4rem;

    --p-s: 1.5rem;
    --p-m: 1.5rem;
    --p-l: 2rem;

    --breakpoint-lg: 769px;
    --transition-base: all .3s ease-in-out;

}

@media screen and (min-width: 769px){

    :root {

        --header: 6.5rem; /* 65px */
        --subheader-a: 4.8rem; /* 48px */
        --subheader-b: 3.5rem; /* 35px */
        --body: 1.9rem; /* 19px */
        --megamenu: 1.6rem; /* 16px */
        --form: 1.5rem; /* 19px */
        --button-text: 1.6rem;

        --p-s: 3.3rem; /* 33 */
        --p-ms: 7rem; /* 70 */
        --p-m: 7.7rem; /* 77 */
        --p-l: 12.6rem; /* 126 */

    }

}