:root {
    /* Colors */
    --primary: #183C66;
    --primary-dark: #102945;
    --primary-medium: #4BB7D9;
    --primary-light: #CAEDF7;
    --primary-light-50: #E8F6FA;
    --primary-light-75: #DDF1F7;
    --secondary: #FFB400;
    --secondary-light: #EAD5A5;
    --background-color: #FFFFFF;
    --background-color-transparent: rgba(255, 255, 255, .5);
    --border-color: #D9D9D9;
    --border-color-light: #F3F5F7;
    --border-color-dark: #B6B6B6;

    --text-color: #183C66;
    --secondary-text-color: #637FA0;

    --black: #000;
    --white: #FFF;

    /* Borders */
    --border-radius: 64px;
    --border: 1px solid var(--border-color);

    /* Dimensions */
    --section-gap: 128px;
    --page-padding: 128px;

    /* Animations */
    --transition: all .1s ease-in-out;

    /* Typography */
    --rubik-font-family: 'Rubik', sans-serif;
    --title-font-family: 'Fugaz one', sans-serif;

    --text-size: 18px;
    --text-line-height: 24px;

    /* --secondary-text-size: 12px;
    --secondary-text-line-height: 16px; */

    --title-size: 64px;
    --title-line-height: 80px;

    --sm-title-size: 36px;
    --sm-title-line-height: 50px;

    --footer-decoration-height: 144px;
}

.digiplatvorm__block.block-preview {
    --text-size: 16px;
    --text-line-height: 24px;

    --title-size: 32px;
    --title-line-height: 48px;

    --sm-title-size: 22px;
    --sm-title-line-height: 34px;
}

@media only screen and (max-width: 1800px) {
    :root {
        --page-padding: 112px;
    }
}

@media only screen and (max-width: 1700px) {
    :root {
        --title-size: 48px;
        --title-line-height: 64px;
    }
}

@media only screen and (max-width: 1600px) {
    :root {
        --page-padding: 96px;
    }
}

@media only screen and (max-width: 1500px) {
    :root {
        --title-size: 36px;
        --title-line-height: 50px;

        --sm-title-size: 28px;
        --sm-title-line-height: 36px;
    }
}

@media only screen and (max-width: 1400px) {
    :root {
        --page-padding: 80px;

        --footer-decoration-height: 128px;
    }
}

@media only screen and (max-width: 1300px) {
    :root {
        --text-size: 16px;
        --text-line-height: 24px;
    }
}

@media only screen and (max-width: 1200px) {
    :root {
        --page-padding: 64px;
    }
}

@media only screen and (max-width: 1100px) {
    :root {
        --footer-decoration-height: 96px;
    }
}

@media only screen and (max-width: 1000px) {
    :root {
        --page-padding: 48px;
    }
}

@media only screen and (max-width: 800px) {
    :root {
        --page-padding: 32px;

        --footer-decoration-height: 64px;
    }
}

@media only screen and (max-width: 600px) {
    :root {
        --page-padding: 24px;

        --footer-decoration-height: 32px;

        --sm-title-size: 18px;
        --sm-title-line-height: 22px;

        --title-size: 24px;
        --title-line-height: 36px;
    }
}