/* ========================================
   Bagel Base AddOns
   ======================================== */

:root {
    --nav-height: 64px;
}

html {
    scroll-behavior: smooth;
}

/* Greift für alle Anker-Ziele auf der Seite */
:where([id]) {
    scroll-margin-top: calc(var(--nav-height) + 2rem);
}

.b-hero-cover,
.b-quick-facts {
    position: relative;
}

.b-hero-cover {
    background-size: cover;
    background-position: center;
    color: var(--color-white);
    padding-bottom: calc(var(--spacing) * 16);
}

.b-hero-cover::after,
.b-quick-facts.gray::after {
    position: absolute;
    inset: 0;
    content: "";
}

.b-hero-cover::after {
    background: rgba(0, 0, 0, 0.3);
}

.b-hero-cover > div {
    position: relative;
    z-index: 10;
}

.b-quick-facts {
    margin-top: calc(var(--spacing) * -12);
    z-index: 10;
}

.b-quick-facts.gray::after {
    top: calc(var(--spacing) * 12);
    background-color: var(--color-gray-50);
    z-index: -1;
}

.b-news-image img {
    border-radius: var(--radius-lg);
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}