/* Shared Hergert navigation; visual reference: Grain footer, Mobbin. */
:root{--header-height:104px;--nav-clearance:120px;--chrome-paper:#f2f3ef}
.site-header{position:sticky;top:0;z-index:20;background:#fff;transition:box-shadow .2s ease}
.site-header.is-scrolled{box-shadow:0 8px 24px -16px #20221e66}
.site-header .header{height:var(--header-height)}
.site-header .brand{min-width:0;flex-shrink:0}
.brand-logo{display:block;width:248px;height:auto;max-width:100%}
.site-header #mobile-menu{margin:0;background:#fff;max-height:calc(100dvh - var(--header-height));overflow-y:auto}
.site-header.is-embedded{position:relative;will-change:transform}
.site :is([id],.legal-copy section){scroll-margin-top:var(--nav-clearance)}
.legal-page .legal-toc{top:var(--nav-clearance)}
body .site-footer.footer-redesign{background:var(--chrome-paper);color:var(--ink);padding:64px var(--gutter) 22px;border-top:1px solid var(--line);text-align:left}
.footer-layout{display:grid;grid-template-columns:1.2fr 1.25fr .9fr .85fr;gap:clamp(24px,3vw,56px);align-items:start}
.footer-layout>*{min-width:0}
.footer-identity .brand{min-width:0;max-width:280px;margin:-12px 0 14px -16px}
.footer-identity .brand-logo{width:280px}
.footer-identity p{font-size:16px;line-height:1.65;color:var(--muted);margin:0 0 24px}
.footer-layout h2{font-family:inherit;font-size:15px;font-weight:650;line-height:1.4;letter-spacing:0;margin:0 0 18px}
.footer-social{display:flex;gap:12px}
.footer-social a{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #c6c9c0;border-radius:50%;transition:background .2s,color .2s}
.footer-social a:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.footer-social a span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.footer-social svg{width:20px;height:20px}
.footer-contact>a{display:flex;align-items:center;min-height:44px;width:fit-content}
.footer-phone{font-size:24px;font-weight:550;letter-spacing:-.02em;line-height:1.3}
.footer-email{font-size:14px;overflow-wrap:anywhere}
.footer-contact address{font-size:14px;font-style:normal;line-height:1.75;margin:18px 0 10px;color:var(--muted)}
.footer-contact-link{font-size:14px;font-weight:600;gap:14px}
.footer-contact-link svg{width:19px;height:19px}
.footer-group{display:flex;flex-direction:column;align-items:flex-start}
.footer-group a{display:flex;align-items:center;min-height:44px;font-size:14px;line-height:1.5;padding:5px 0}
.footer-redesign a:not(.brand):not(.footer-social a):hover{text-decoration:underline;text-underline-offset:5px}
.footer-bottom{border-top:1px solid #ccd0c5;margin-top:48px;padding-top:18px;display:flex;align-items:center;gap:32px;font-size:12px;color:var(--muted)}
.footer-bottom p{margin:0;margin-right:auto}.footer-bottom nav{display:flex;gap:24px}.footer-bottom a{display:inline-flex;align-items:center;min-height:44px}.back-to-top{gap:8px}.back-to-top svg{width:16px;height:16px}
@media(max-width:1100px){.site-header .header{gap:20px}.site-header .desktop-nav{gap:22px}.site-header .brand-logo{width:210px}.site-header .request-long{display:none}.site-header .request-short{display:inline}.footer-layout{grid-template-columns:1fr 1fr;gap:40px 56px}}
@media(max-width:760px){:root{--header-height:84px;--nav-clearance:100px}.site-header .header{gap:10px}.site-header .brand-logo{width:166px}.footer-layout{gap:32px 24px}.footer-identity,.footer-contact{grid-column:1/-1}.footer-identity .brand{max-width:260px}.footer-identity p{margin-bottom:18px}.footer-contact{padding-top:26px;border-top:1px solid #ccd0c5}.footer-bottom{flex-wrap:wrap;gap:0 24px;margin-top:32px}.footer-bottom p{width:100%;margin-bottom:8px}.footer-bottom .back-to-top{margin-left:auto}body .site-footer.footer-redesign{padding-top:44px}.site-header #mobile-menu{gap:12px;flex-wrap:wrap}}
@media(max-width:380px){.site-header .header{padding-inline:16px;gap:8px}.site-header .brand-logo{width:130px}.site-header .header-actions{gap:4px}.site-header .request{padding-inline:10px}.footer-group a{font-size:13px}}
@media(prefers-reduced-motion:reduce){.site-header,.footer-social a{transition:none}}
/* W18 (Mia 11.10.2026): Leistungen mit Unterseiten. Link plus Aufklappknopf (WAI-ARIA APG Disclosure Navigation); mobil eingerückt, immer sichtbar. */
.desktop-nav .nav-item{position:relative;display:flex;align-items:center;margin-right:calc(-1 * var(--space-2))}
.desktop-nav .nav-sub-toggle{display:flex;align-items:center;justify-content:flex-start;width:44px;min-height:48px;padding:0 0 0 8px;margin-right:-12px}
.desktop-nav .nav-sub-toggle svg{width:16px;height:16px;transition:transform 180ms var(--ease)}
.desktop-nav .nav-item.is-open .nav-sub-toggle svg{transform:rotate(180deg)}
.desktop-nav .nav-sub-toggle[aria-expanded="true"]{text-decoration:none}
.desktop-nav .nav-sub{display:none;position:absolute;top:calc(100% + var(--space-1));left:calc(-1 * var(--space-4));z-index:2;min-width:232px;margin:0;padding:var(--space-2) 0;list-style:none;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-control);box-shadow:var(--shadow-control)}
.desktop-nav .nav-item.is-open .nav-sub{display:block}
.desktop-nav .nav-sub a{display:flex;align-items:center;min-height:var(--target-min);padding:0 var(--space-4);font-size:var(--font-label);white-space:nowrap}
.site-header #mobile-menu{display:block;padding:var(--space-2) var(--gutter) var(--space-5)}
#mobile-menu :is(.menu-list,.menu-sub){list-style:none;margin:0;padding:0}
.site-header #mobile-menu .menu-sub a{min-height:var(--target-min);padding-left:var(--space-5);font-size:var(--font-label);color:var(--muted)}
@media(prefers-reduced-motion:reduce){.desktop-nav .nav-sub-toggle svg{transition:none}}
:root[data-motion="reduced"] .desktop-nav .nav-sub-toggle svg{transition:none}
/* Der gedrehte Winkel ist ein Zustand, keine Bewegung: neu.css setzt bei reduzierter Bewegung button svg{transform:none!important}, das hebt hier nur den offenen Zustand auf. */
:root[data-motion="reduced"] .desktop-nav .nav-item.is-open .nav-sub-toggle svg{transform:rotate(180deg)!important}
/* Feinschliff vor Übergabe (Vera 11.10.2026) */
/* A3/F7: Die Logodatei hat links 5,7 % Leerraum; die Bildmarke steht damit auf der Inhaltskante wie in der Fußzeile. */
.site-header .brand-logo{translate:-5.7% 0}
/* F21: Logo-Link am Handy mindestens 44 px hoch. */
.site-header .brand{min-height:var(--target-min);justify-content:center;justify-self:start}
/* F6: Menü steht unabhängig von der Breite des rechten Knopfs fest (sonst springt es zwischen Seiten um 13 px). */
@media(min-width:1101px){.site-header .header{display:grid;grid-template-columns:minmax(max-content,1fr) auto minmax(max-content,1fr)}.site-header .header-actions{justify-self:end}}
/* K1: gleicher Abstand nach dem Aufklapppfeil von „Leistungen“ wie zwischen den übrigen Menüpunkten. */
.desktop-nav .nav-item.has-sub{margin-right:var(--space-2)}
/* F20: Untermenü beginnt auf der Kopfkante statt halb darin. */
.desktop-nav .nav-sub{top:calc(100% + 28px)}
/* B11: offenes Handy-Menü mit Kante zum Inhalt. */
.site-header #mobile-menu{border-bottom:1px solid var(--line);box-shadow:var(--shadow-control)}
/* B8/F11: Brotkrumen am Handy mit 44 px Trefferfläche, Zeilenhöhe bleibt. */
.breadcrumb a{display:inline-flex;align-items:center;min-height:var(--target-min);margin-block:-11px}
/* Ben 26.10.2026 B1 (WCAG 2.4.11): Fokus und Sprungziele nicht unter der festen Kopfzeile. Unten hält einwilligung.js
   bei offenem Banner scroll-padding-bottom frei. B2: Zusatz für Bildschirmleser, sichtbar bleibt der Linktext. */
html{scroll-padding-top:calc(var(--header-height) + 16px)}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}