@font-face {
    font-family: 'OpenSans';
    font-style: normal;
    font-display: swap;
    src: url('https://public.finanz-werkzeuge.de/brokers/bonnfinanz/fonts/OpenSans-VariableFont_wdth,wght.ttf') format('truetype');
}

@font-face {
    font-family: 'OpenSans Italic';
    font-style: normal;
    font-display: swap;
    src: url('https://public.finanz-werkzeuge.de/brokers/bonnfinanz/fonts/OpenSans-Italic-VariableFont_wdth,wght.ttf') format('truetype');
}

:root {
    /*Update*/
    --bs-font-family: 'OpenSans', Arial, sans-serif;
    --bs-box-shadow: none;
    --bs-border-radius: 0;

    --bs-font-main-color: #444;
    --bs-font-text-headers-main-color: var(--bs-font-main-color);
    --bs-font-main-color-light: #fff;
    --bs-color-text-inverted: #fff;
    --bs-color-light-background: #fff;

    --bs-link-color: var(--bs-font-main-color);
    --bs-link-text-decoration: underline;
    --bs-link-hover-color: var(--bs-link-color);

    --bs-footer-background: #444;
    --bs-footer-color: #fff;
    --bs-footer-links-color: #fff;
    --bs-footer-link-hover-color: var(--bs-footer-links-color);
    --bs-footer-copyright-section-color: #fff;
    --bs-footer-links-text-decoration: none;

    --bs-header-background: #fff;
    --bs-header-color: var(--bs-font-main-color);
    --bs-header-links-color: var(--bs-font-main-color);
    --bs-header-links-text-decoration: none;
    --bs-header-box-shadow: none;

    --bs-button-background: #ea5f24;
    --bs-button-hover-background: #fff;
    --bs-button-color: #fff;
    --bs-button-hover-color: #ea5f24;
    --bs-button-border-radius: 0;
    --bs-button-border-width: 1px;
    --bs-button-border-color: #ea5f24;
    --bs-button-border: var(--bs-button-border-width) solid var(--bs-button-border-color);
    --bs-button-box-shadow: none;

    --bs-separation-header-mobil-background: oklch(from #b6b6b6 calc(l + .15) c h);
    --bs-header-mobil-menu-button-background: #ea5f24;

    --bs-swiper-background: transparent;
    --bs-button-disabled-background: #b6b6b6;
    --bs-color-main-selected: #444;
    --bs-swiper-button-color: #444;
    --bs-swiper-highlight-color: #444;
    --bs-swiper-highlight-color-2: oklch(from #ea5f24 calc(l + .15) c h);
    --bs-swiper-basic-color: var(--bs-font-main-color);
    --bs-swiper-background-odd: var(--bs-swiper-background);
    --bs-swiper-background-even: var(--bs-swiper-background);

    --bs-criteria-background: #ea5f24;
    --bs-criteria-color: #fff;
    --bs-benefits-background: #444;
    --bs-benefits-color: #fff;

    --bs-cta-background: var(--bs-button-background);
    --bs-cta-hover-background: var(--bs-button-hover-background);

    --bs-onboarding-box-background: #fff;
    --bs-section-background: #fff;
    --bs-section-calculator-background: transparent;
    --bs-page-background: #fff;

    --bs-hero-height: 36rem;
    --logo-width: 20em;
    --logo-width-mobile: 15em;
}

header .nav .logo img {
    padding: 0;
}

.hero picture {
    filter: brightness(0.8);
}