:root {

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*-------------------------------------LAYOUT-------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/

    --layout-2xl: 1536px;
    --layout-xl: 1280px;
    --layout-lg: 1024px;
    --layout-md: 768px;
    --layout-sm: 640px;

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*-------------------------------------SPACING------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/

    --gap-section-y: 80px;
    --gap-safe-responsive: 24px;

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*---------------------------------------COLOR------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/

    --color-white: #FFFFFF;
    --color-gray-01: #FAFAFA;
    --color-gray-02: #F2F2F3;
    --color-gray-03: #E4E5E7;
    --color-gray-04: #D7D9DB;
    --color-gray-05: #CACCCE;
    --color-gray-06: #BCBFC2;
    --color-gray-07: #AFB2B6;
    --color-gray-08: #A1A5AA;
    --color-gray-09: #94999E;
    --color-gray-10: #878C92;
    --color-gray-11: #797F86;
    --color-gray-12: #6D7278;
    --color-gray-13: #61666B;
    --color-gray-14: #55595E;
    --color-gray-15: #494C50;
    --color-gray-16: #3D3F43;
    --color-gray-17: #313335;
    --color-gray-18: #242628;
    --color-gray-19: #18191B;
    --color-gray-20: #0C0D0D;
    --color-gray-21: #050505;
    --color-black: #000000;

    --color-yellow-11:#FFB900;

    --color-red-10: hsl(4 86% 50% / 1);

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*---------------------------------------TEXT-------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/

    /*--------------------------------------------------------------------------------*/
    /*------------------------------------FONT FAMILY---------------------------------*/
    /*--------------------------------------------------------------------------------*/

    --text-family-head: "Arco Perpetuo", sans-serif;
    --text-family-body: "Arco Perpetuo", sans-serif;

    /*--------------------------------------------------------------------------------*/
    /*-------------------------------------FONT SIZE----------------------------------*/
    /*--------------------------------------------------------------------------------*/

    /* HEAD */

    --text-head-2xl-size: 83.92px;
    --text-head-xl-size: 53.71px;
    --text-head-lg-size: 42.97px;
    --text-head-md-size: 34.38px;
    --text-head-sm-size: 27.5px;
    --text-head-xs-size: 22px;

    /* BODY */

    --text-body-xl-size: 20px;
    --text-body-lg-size: 18px;
    --text-body-md-size: 16px;
    --text-body-sm-size: 14px;
    --text-body-xs-size: 12px;

    /*--------------------------------------------------------------------------------*/
    /*-------------------------------------LINE HEIGHT--------------------------------*/
    /*--------------------------------------------------------------------------------*/

    /* HEAD */

    --text-head-line-height: 1.2em;

    /* BODY */

    --text-body-line-height: 1.5em;

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*------------------------------------ELEMENTS------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/

    --element-header-height: 96px;

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*-------------------------------------EFFECTS------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/

    --fx-shadow: 0 1px 3px 0 rgb(49 68 242 / 0.05), 0 1px 2px -1px rgb(49 68 242 / 0.05);
    --fx-shadow-sm: 0 1px 2px 0 rgb(49 68 242 / 0.05);
    --fx-shadow-md: 0 4px 6px -1px rgb(49 68 242 / 0.05), 0 2px 4px -2px rgb(49 68 242 / 0.05);
    --fx-shadow-lg: 0 10px 15px -3px rgb(49 68 242 / 0.05), 0 4px 6px -4px rgb(49 68 242 / 0.05);
    --fx-shadow-xl: 0 20px 25px -5px rgb(49 68 242 / 0.05), 0 8px 10px -6px rgb(49 68 242 / 0.05);
    --fx-shadow-xxl: 0 25px 50px -12px rgb(49 68 242 / 0.25);
    --fx-shadow-inner: inset 0 2px 4px 0 rgb(49 68 242 / 0.05);
    
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*-----------------------------------TRANSITIONS----------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------FRAME-------------------------------------*/
    /*--------------------------------------------------------------------------------*/

    --transition-fast: all calc(1/6*1s) ease-in-out;
    --transition-mid: all calc(1/3*1s) ease-in-out;
    --transition-slow: all calc(1/2*1s) ease-in-out;

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------TIMING------------------------------------*/
    /*--------------------------------------------------------------------------------*/

    --transition-timing-fast: calc(1/6*1s);
    --transition-timing-mid: calc(1/3*1s);
    --transition-timing-slow: calc(1/2*1s);

}

@media ( min-width: 640px ) {

    :root {

        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*-------------------------------------SM:TEXT------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/

        /*--------------------------------------------------------------------------------*/
        /*------------------------------------SM:FONT SIZE--------------------------------*/
        /*--------------------------------------------------------------------------------*/

        /* SM:HEAD */

        --text-head-2xl-size: 127px;
        --text-head-xl-size: 90px;
        --text-head-lg-size: 63px;
        --text-head-md-size: 45px;
        --text-head-sm-size: 31px;
        --text-head-xs-size: 22px;

    } 

}

@media ( min-width:768px ) {

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*------------------------------------MD:DEFAULT----------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/



}

@media ( min-width:1024px ) {



    :root {

        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*------------------------------------LG:SPACING----------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/

        --gap-section-y: 56px;

        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*-----------------------------------LG:ELEMENTS----------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/
        /*--------------------------------------------------------------------------------*/

        --element-header-height: 96px ; /* set dynamicly on set-css-root.js, by default 100px to avoid big scroll jumps before js loads */

    }



}

@media ( min-width:1280px ) {

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*------------------------------------XL:DEFAULT----------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/


}

@media ( min-width:1536px ) {

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*-----------------------------------XXL:DEFAULT----------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/


    
}