/* ==========================================
   DESIGN VARIABLES
   for Marcus Rosik
   by Annika Elze
========================================== */

:root{

    /* ==========================================
       FONTS
    ========================================== */

    --font-primary:"Poppins",sans-serif;
    --font-code:"Office Code Pro",monospace;


    /* ==========================================
       DESKTOP TYPOGRAPHY
    ========================================== */

    --text-body:18px;

    --text-h1:64px;
    --text-h2:44px;
    --text-h3:32px;
    --text-h4:28px;
    --text-h5:22px;
    --text-h6:18px;

    --text-lead:22px;
    --text-small:15px;
    --text-caption:14px;


    /* ==========================================
       FONT WEIGHTS
    ========================================== */

    --weight-light:300;
    --weight-normal:400;
    --weight-medium:500;
    --weight-semibold:600;


    /* ==========================================
       LINE HEIGHTS
    ========================================== */

    --line-body:1.7;
    --line-heading:1.15;

}


/* ==========================================
   TABLET
========================================== */

@media(max-width:1024px){

    :root{

        --text-body:18px;

        --text-h1:52px;
        --text-h2:40px;
        --text-h3:32px;
        --text-h4:26px;
        --text-h5:21px;
        --text-h6:18px;

        --text-lead:20px;
        --text-small:16px;
        --text-caption:14px;

    }

}


/* ==========================================
   MOBILE
========================================== */

@media(max-width:767px){

    :root{

        --text-body:16px;

        --text-h1:40px;
        --text-h2:32px;
        --text-h3:26px;
        --text-h4:22px;
        --text-h5:20px;
        --text-h6:18px;

        --text-lead:18px;
        --text-small:14px;
        --text-caption:13px;

    }

}