@font-face {
    font-family: 'Fira Sans';
    src: url('../Fonts/FiraSans-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Fira Sans Medium';
    src: url('../Fonts/FiraSans-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Fira Sans SemiBold';
    src: url('../Fonts/FiraSans-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}


:root body {
    /* --- Farben --------------------------------------------------- */
    /* Akzentfarbe (Buttons, Links, Hervorhebungen) */
    --color-primary-100: #005c8e;
    /* hellere Variante der Akzentfarbe */
    --color-primary-75: #005c8e;

    /* Neutraltöne: 0 = Weiß/Hintergrund … 90 = fast Schwarz/Text */
    --color-neutral-0: #FFFFFF;
    --color-neutral-10: #e5eef3;
    --color-neutral-20: #b2cedd;
    --color-neutral-30: #99bed2;
    --color-neutral-40: #7fadc6;
    --color-neutral-50: #669dbb;
    --color-neutral-60: #4c8db0;
    --color-neutral-70: #337da5;
    --color-neutral-80: #196c99;
    --color-neutral-90: #005c8e;

    /* --- Schriften ------------------------------------------------ */
    /* Überschriften */
    --headline-family: "Fira Sans", Arial, sans-serif !important;
    --headline-weight: 500;

    /* Fließtext */
    --body-family: "Fira Sans", Arial, sans-serif !important;

    /* Unterzeilen, Titel, Labels (Buttons, Navigation) */
    --subline-family: "Fira Sans", Arial, sans-serif !important;
    --title-family: "Fira Sans", Arial, sans-serif !important;
    --label-family: "Fira Sans", Arial, sans-serif !important;

    /* --- Sonstiges ------------------------------------------------ */
    /* Eckenradius */
    --corners-s: 8px;
    --corners-m: 16px;
    --corners-l: 24px;
}

/* ------------------------------------------------------------------
 *
 * ------------------------------------------------------------------ */
body, .headline {
    font-family: "Fira Sans", Arial, sans-serif !important;
    font-weight: 400 !important;
}
h2.headline {
    font-size: 40px !important;
}
h3.headline {
    font-size: 34px !important;
}
.header {
    background: #ffffff !important;
    height: 180px !important;
    margin-bottom: 20px !important;
}
.header a {
    color: var(--color-primary-100);
}
header a img, .header__logo {
    width: 400px !important;
    height: 180px !important;
}
.header__nav-item {
    font-size: 1.5rem !important;
}
.header__nav-item:hover {
    color: var(--color-neutral-70) !important;
}
.header__nav-list {
    border-radius: 0 !important;
}
.component {
    background: #ffffff !important;
}

.button {
    border-radius: 0 !important;
}
.button__content {
    color: var(--color-primary-100) !important;
}

.hero .button__content, .header__menu-button .button__content {
    color: #ffffff !important;
}

.image {
    border-radius: 0 !important;
}

main .image {
    border: 1px solid #aaaaaa !important;
}