@import url(https://fonts.bunny.net/css?family=montserrat:300,300i,400,400i,500,500i,600,600i);

:root {
    --bs-color-main: #0C2959;
    --bs-color-second: #AE633F;

    --bs-font-family: 'Montserrat', Arial, Helvetica, sans-serif;
    --bs-font-main-color: var(--bs-color-main);
    --bs-font-text-headers-main-color: var(--bs-font-main-color);

    --bs-border-radius: 0.625em;

    --bs-link-color: oklch(from #8694ac calc(l - 0.15) calc(c + 0.03) h);
    --bs-link-hover-color: var(--bs-color-second);
    --bs-link-text-decoration: none;
    --bs-button-hover-background: var(--bs-color-second);

    --bs-hero-image-filter: brightness(85%);
    --bs-hero-margin-top: 6em;

    --bs-criteria-background: var(--bs-color-main);
    --bs-footer-background: var(--bs-color-main);
    --bs-swiper-background-odd: oklch(from var(--bs-color-main-background) 98% 0.02 h);
    --bs-swiper-background-even: oklch(from var(--bs-color-second) calc(l + 1) calc(c - 0.06) h);

    --logo-width: clamp(6em, 45%, 10em);
    --logo-width-mobile: 8em;

    --bs-top-position-heroText-mobile: 6.5rem;
}

.selection .button {
    background: var(--bs-color-invert);
    color: var(--bs-font-main-color);

    &:hover {
        background: var(--bs-button-hover-background);
        color: var(--bs-font-main-color);
    }
}