/*=====================================
    RESPONSIVE GLOBAL OVERRIDES
======================================*/


/*=====================================
    LARGE DESKTOP
======================================*/

@media (max-width: 1200px) {

    :root {

        --container-width: 100%;

        --container-padding: 35px;

    }

}


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

@media (max-width: 992px) {

    :root {

        --container-padding: 30px;

        --section-padding: 70px;

    }

    .container {

        padding-left: var(--container-padding);

        padding-right: var(--container-padding);

    }

}


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

@media (max-width: 768px) {

    :root {

        --container-padding: 20px;

        --section-padding: 60px;

    }

    .container {

        padding-left: 20px;

        padding-right: 20px;

    }

    h1 {

        line-height: 1.1;

    }

    h2 {

        line-height: 1.15;

    }

}


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

@media (max-width: 576px) {

    :root {

        --container-padding: 16px;

    }

    .container {

        padding-left: 16px;

        padding-right: 16px;

    }

    body {

        font-size: 15px;

    }

}


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

@media (max-width: 400px) {

    :root {

        --container-padding: 14px;

    }

    .container {

        padding-left: 14px;

        padding-right: 14px;

    }

}


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

@media (max-width: 768px) and (orientation: landscape) {

    #navbar {

        height: 64px;

    }

}


/*=====================================
    REDUCED MOTION
======================================*/

@media (prefers-reduced-motion: reduce) {

    html {

        scroll-behavior: auto;

    }

    *,
    *::before,
    *::after {

        animation-duration: 0.01ms !important;

        animation-iteration-count: 1 !important;

        transition-duration: 0.01ms !important;

        scroll-behavior: auto !important;

    }

}