html {
    --font-family-1: Roboto, Arial, Helvetica, sans-serif;
    --font-family-1-bold: 800;

    --font-size-base: 16px;
    --font-size-hint: .875rem; /*14px*/
    --font-size-title: 1.25rem; /*24px*/
    --font-size-headline: 1.875rem; /*30px*/
    --font-size-main-title: 2.5rem; /*40px*/

    --line-height-base: 1.1875em;
    --letter-spacing-wide: .025em;
    --letter-spacing-narrow: -.025em;

    --gap-size: 16px;
    --gap-size-half: 8px;
    --gap-size-double: 32px;

    --fd-app-header-logo-invia-height: 35px;
    --fd-app-header-logo-invia-width: 130px;
    --fd-app-header-logo-fluege-height: 20px;
    --fd-app-header-logo-fluege-width: 76px;
    --fd-app-header-height: 60px;

    --fd-drawer-z-index: 120;

    --fd-app-hero-height-visible: 182px;
    --fd-app-hero-height-full: 345px;
    --fd-app-hero-height-overlayed: 163px;
}

/* semantic tokens */
html {
    --color-action-border-focus: #2692FF;
    --color-action-border-focus-variant: #ffffff;

    --color-action-primary-background: #05a8e6;
    --color-action-primary-foreground: #ffffff;
    --color-action-primary-background-focus: #236FB1;
    --color-action-primary-background-hover: #236FB1;

    --color-area-brand-background: #013e7a;
    --color-area-brand-foreground: #ffffff;

    --color-area-neutral-subtler-background: #f3f3f3;
    --color-area-neutral-subtlest-background: #ffffff;
    --color-area-neutral-subtlest-foreground-headline: #013E7A;
    --color-area-neutral-subtlest-foreground-body: #212121;
    --color-area-neutral-subtlest-foreground-link: #236FB1;

    --color-gradient-invia-top: #B6DFE8;
    --gradient-main: linear-gradient(146deg, var(--color-gradient-invia-top) 10.55%, var(--color-area-neutral-subtler-background) 31.32%);
}

@media (max-width: 991px) {
    html {
        --content-wrapper-max-width: 100%;
    }
}

@media (min-width: 992px) {
    html {
        --content-wrapper-max-width: 1024px;
    }
}

html {
    font-size: var(--font-size-base);
    font-family: var(--font-family-1);
    color: var(--color-area-neutral-subtlest-foreground-body);
    -webkit-font-smoothing: antialiased;
}

body {
    margin: 0;
    background: var(--color-area-neutral-subtlest-background);
    /* Fixes the auto font-size adjustments on ios devices */
    --webkit-text-size-adjust: 100%;
}

@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local("Roboto Regular"), local("Roboto-Regular"), url("https://media.fluege.de/fonts/roboto/roboto-regular.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local("Roboto Bold"), local("Roboto-Bold"), url("https://media.fluege.de/fonts/roboto/roboto-bold.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local("Roboto Light"), local("Roboto-Light"), url("https://media.fluege.de/fonts/roboto/roboto-light.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}