/* Fonts (self-hosted, latin subset) */
@font-face {
    font-family: 'Manrope';
    font-style: normal;
    font-weight: 400 800;
    font-display: swap;
    src: url("../fonts/manrope-latin-var-aA_waSK.woff2") format('woff2');
}
@font-face {
    font-family: 'Spectral';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/spectral-latin-400-mUxq_x2.woff2") format('woff2');
}
@font-face {
    font-family: 'Spectral';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/spectral-latin-500-ocLd0d2.woff2") format('woff2');
}
@font-face {
    font-family: 'Spectral';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/spectral-latin-600-Aw-mq3l.woff2") format('woff2');
}

/* Design "Variante A" */
body {
    font-family: 'Manrope', sans-serif;
    color: #15282B;
    background: #fff;
}

.font-serif { font-family: 'Spectral', serif; }

.bg-brand { background: #1D479A !important; }
.bg-brand-soft { background: #EAF1FB !important; }
.text-brand { color: #1D479A !important; }
.text-accent { color: #2E6FD0 !important; }
.text-muted-blue { color: #46566E; }
.text-faded { color: #7E8AA0; }
.border-brand { border-color: #DCE7F5 !important; }

.btn-brand {
    --bs-btn-bg: #1D479A;
    --bs-btn-border-color: #1D479A;
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: #163A80;
    --bs-btn-hover-border-color: #163A80;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: #163A80;
    --bs-btn-active-border-color: #163A80;
    --bs-btn-active-color: #fff;
}
.btn-accent {
    --bs-btn-bg: #11C0F2;
    --bs-btn-border-color: #11C0F2;
    --bs-btn-color: #0B2E66;
    --bs-btn-hover-bg: #0FA9D6;
    --bs-btn-hover-border-color: #0FA9D6;
    --bs-btn-hover-color: #0B2E66;
    --bs-btn-active-bg: #0FA9D6;
    --bs-btn-active-border-color: #0FA9D6;
    --bs-btn-active-color: #0B2E66;
}

.eyebrow {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
}

a.nav-lnk { color: #5A6E70; text-decoration: none; font-weight: 500; }
a.nav-lnk.active { color: #15282B; }

/* Rahmenlos; Fokusring nur bei Tastatur-Fokus, nicht beim Mausklick */
.navbar-toggler { border: 0; }
.navbar-toggler:focus:not(:focus-visible) { box-shadow: none; }

/* Burger-Icon morpht zum X, gesteuert über aria-expanded (Bootstrap Collapse) */
.toggler-bar {
    display: block;
    width: 24px;
    height: 2px;
    border-radius: 1px;
    background: #15282B;
    transition: transform .3s ease, opacity .2s ease;
}
.toggler-bar + .toggler-bar { margin-top: 6px; }
.navbar-toggler[aria-expanded="true"] .toggler-bar:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.navbar-toggler[aria-expanded="true"] .toggler-bar:nth-child(2) { opacity: 0; }
.navbar-toggler[aria-expanded="true"] .toggler-bar:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

@media (prefers-reduced-motion: reduce) {
    .toggler-bar { transition: none; }
}

.hours-row { display: flex; justify-content: space-between; font-size: 15px; }

.wrap { max-width: 1180px; margin: 0 auto; }

/* Gestapelt (unter md) flacher Bildausschnitt, zweispaltig (ab md) 4:5 wie im Mock */
.hero-media { aspect-ratio: 3/2; }
@media (min-width: 768px) {
    .hero-media { aspect-ratio: 4/5; }
}

.hero-title {
    font-size: clamp(34px, 5vw, 56px);
    line-height: 1.07;
    letter-spacing: -.01em;
}

/* Textseiten (Impressum, Datenschutz) */
.prose { line-height: 1.65; }
.prose h1 { font-family: 'Spectral', serif; font-weight: 500; color: #1D479A; font-size: 38px; margin-bottom: 1.5rem; }
.prose h2 { font-family: 'Spectral', serif; font-weight: 500; color: #1D479A; font-size: 24px; margin-top: 2rem; margin-bottom: .75rem; }
.prose h3 { font-size: 19px; font-weight: 600; margin-top: 1.5rem; margin-bottom: .5rem; }
.prose h4 { font-size: 16px; font-weight: 600; margin-top: 1rem; margin-bottom: .5rem; }
.prose a { color: #1D479A; font-weight: 600; text-decoration: none; }
.prose-narrow { max-width: 46em; }

/* Mock ist Desktop-only: Sektionsabstände auf Mobile reduzieren */
.section-pad { padding-left: 3rem; padding-right: 3rem; }
@media (max-width: 767.98px) {
    .section-pad { padding-left: 1.25rem; padding-right: 1.25rem; }
}