/*sizes nav*/

body {
    --burger-line-height: clamp(2px, 0.11rem + 0.06vw, 3px);
    --nav-icon-height: clamp(14px, 0.568rem + 0.78vw, 24px);
    --nav-icon-width: clamp(32px, 5vw, 44px);
    --nav-icon-padding-X: 2.4vw;
    --nav-icon-padding-Y: calc(var(--nav-bar-pad) + (var(--height-logo-wappen) / 2));
    --heigt-icon: 25px;
    --height-logo-wappen: clamp(60px, 15vw, 78px);
    --height-logo-txt: clamp(28px, 4.2vw, 38px);
    --gap-logo: 13px;
    --nav-bar-pad: 24px;
    --trans-dur: 0.8s;
}

/*sizes,pad,marg*/

:root {
    --h1-font-size: min(calc(20px + (33 - 20) * ((100vw - 375px) / (1720 - 375))), 35px);
    --h2-font-size: min(calc(18px + (20 - 18) * ((100vw - 375px) / (1720 - 375))), 20px);
    --h3-font-size: min(calc(16px + (23 - 16) * ((100vw - 375px) / (1720 - 375))), 27px);
    /* wie H1 */
    --h4-font-size: min(calc(15px + (18 - 15) * ((100vw - 375px) / (1720 - 375))), 30px);
    --h5-font-size: min(calc(15px + (16 - 15) * ((100vw - 375px) / (1720 - 375))), 16px);
    --h6-font-size: 15px;
    /* bleibt gleich */
    --btn-font-size: min(calc(14px + (16 - 14) * ((100vw - 375px) / (1720 - 375))), 16px);
    /* gleiche Größe wie H5 */
    --base-font-size: min(calc(14px + (17 - 14) * ((100vw - 375px) / (1720 - 375))), 17px);
    --base-font-size-small: min(calc(14px + (15 - 14) * ((100vw - 375px) / (1720 - 375))), 15px);
    --base-font-size-large: min(calc(19px + (19 - 18) * ((100vw - 375px) / (1720 - 375))), 19px);
    /* Fließtext */
    --btn-small-font-size: min(calc(14px + (15 - 14) * ((100vw - 375px) / (1720 - 375))), 15px);
    /* bleibt gleich */

    /**spacing*/
    --gap-s: min(calc(10px + (15 - 10) * ((100vw - 375px) / (1720 - 375))), 10px);
    --gap-m: min(calc(15px + (30 - 15) * ((100vw - 375px) / (1720 - 375))), 30px);
    --gap-l: min(calc(30px + (50 - 30) * ((100vw - 375px) / (1720 - 375))), 50px);
    --gap-xl: min(calc(50px + (80 - 50) * ((100vw - 375px) / (1720 - 375))), 80px);
    --gap-2xl: min(calc(80px + (150 - 80) * ((100vw - 375px) / (1720 - 375))), 150px);
    --cont-gap: min(calc(100px + (250 - 100) * ((100vw - 375px) / (1720 - 375))), 250px);
}

/* Border Color */

/* :root {
    --ast-border-color : #dddddd;
} */
:root {
    --ast-border-color : #a31717 !important;
}

/*fonts*/

:root {
    --mainfont: 'Avenir Light';
    --headlinefont: 'Daubenton';
}


/*VC*/

@media (min-width: 1720px) {
    /*----------------- ELEMENT -------------*/
    /*----------------- END ELEMENT ---------*/
}

@media (max-width: 1500px) {
    :root {
        --polaroid-gap: 6vw;
    }
}

@media (max-width: 1200px) {
    /*----------------- ELEMENT -------------*/
    /*----------------- END ELEMENT ---------*/
}

@media (max-width: 1024px) {
    :root {
        --polaroid-gap: 8vw;
    }
}

@media (max-width: 990px) {
    /*----------------- ELEMENT -------------*/
    /*----------------- END ELEMENT ---------*/
}

@media (max-width: 768px) {
    /*----------------- ELEMENT -------------*/
    /*----------------- END ELEMENT ---------*/
}

@media (max-width: 576px) {}

@media (max-width: 420px) {
    /*----------------- ELEMENT -------------*/
    /*----------------- END ELEMENT ---------*/
}

@media (max-width: 320px) {
    /*----------------- ELEMENT -------------*/
    /*----------------- END ELEMENT ---------*/
}