/* Settings */
@import url(settings/_reset.css);
@import url(settings/_fonts.css);
@import url(settings/_vars.css);
@import url(settings/_grid.css);
@import url(settings/_extends.css);
@import url(settings/_slider.css);

/* Components */
@import url(components/_teaser.css);
@import url(components/_quickslider.css);
@import url(components/_media.css);
@import url(components/_text.css);
@import url(components/_textbox.css);
@import url(components/_accordion.css);
@import url(components/_links.css);
@import url(components/_stage.css);
@import url(components/_highlights.css);
@import url(components/_carousel.css);
@import url(components/_toggle.css);
@import url(components/_tile.css);
@import url(components/_youtube.css);

/* Partials */
@import url(partials/_header.css);
@import url(partials/_footer.css);
@import url(partials/_logo.css);
@import url(partials/_nav.css);
@import url(partials/_cookie.css);

/* Elements */
@import url(elements/_button.css);

::selection{  
    background-color: var(--color-black-010);  
}  

body {
    background: var(--color-bg);
    color: var(--color-black);
    font-family: var(--font-family-primary);
    font-size: var(--font-size-primary);
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    min-height: 100vh;
    letter-spacing: -0.25px;
    text-rendering: geometricPrecision;
    margin: 0;
    padding-top: var(--spacing-xxs);
    height: auto;
    word-break: break-word;
    overflow-wrap: break-word;
    hyphens: auto;


    @media screen and (max-width: 1024px) {
        padding-top: calc(4rem + (2 * var(--spacing-s)))
    }
}

h1,
h2 {
    font-family: var(--font-family-secondary);
    line-height: 1;
}

h3,
h4,
h5,
h6 {
    font-family: var(--font-family-primary);
    line-height: 1.1;
}

h1 {
    font-size: var(--font-size-h1);

    @media screen and (max-width: 1024px) {
        font-size: var(--font-size-h1-tablet);
    }

    @media screen and (max-width: 640px) {
        font-size: var(--font-size-h1-mobile);
    }
}

h2 {
    font-size: var(--font-size-h2);

    @media screen and (max-width: 1024px) {
        font-size: var(--font-size-h2-tablet);
    }

    @media screen and (max-width: 640px) {
        font-size: var(--font-size-h2-mobile);
    }
}

h3 {
    font-size: var(--font-size-h3);

    @media screen and (max-width: 1024px) {
        font-size: var(--font-size-h3-tablet);
    }

    @media screen and (max-width: 640px) {
        font-size: var(--font-size-h3-mobile);
    }
}

h4 {
    font-size: var(--font-size-h4);

    @media screen and (max-width: 1024px) {
        font-size: var(--font-size-h4-tablet);
    }

    @media screen and (max-width: 640px) {
        font-size: var(--font-size-h4-mobile);
    }
}

h5 {
    font-size: var(--font-size-h5);

    @media screen and (max-width: 1024px) {
        font-size: var(--font-size-h5-tablet);
    }

    @media screen and (max-width: 640px) {
        font-size: var(--font-size-h5-mobile);
    }
}

h6 {
    font-size: var(--font-size-h6);

    @media screen and (max-width: 1024px) {
        font-size: var(--font-size-h6-tablet);
    }

    @media screen and (max-width: 640px) {
        font-size: var(--font-size-h6-mobile);
    }
}