/* ==========================================================================
   Gemeinsamer Footer aller Seiten (2026-10-30)
   Dunkler, mehrspaltiger Footer der Startseite. Wird auf allen Seiten geladen,
   auch auf den Branchenseiten, die weder site.css noch rahmen.css kennen.
   Deshalb eigenständig: eigene Farben und Schriften, keine Variablen von außen.
   ========================================================================== */
@font-face{font-family:"Bricolage Grotesque";src:url(/assets/fonts/bricolage-grotesque-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(/assets/fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(/assets/fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}

.site-footer{
  --f-bg:#102C26; --f-text:#A8BDB4; --f-strong:#EEF4F0; --f-line:#2E4A40;
  --f-gutter:clamp(20px,5vw,64px);
  position:relative;background:var(--f-bg);color:var(--f-text);
  font:400 14px/1.55 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  padding:88px 0 32px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility
}
/* Bach als Wellenlinie oben */
.site-footer::before{content:"";position:absolute;left:0;right:0;top:28px;height:14px;opacity:.5;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='14' viewBox='0 0 48 14'%3E%3Cpath d='M0 7c6-6 12 6 24 0s18 6 24 0' fill='none' stroke='%2396D2B6' stroke-width='1.5'/%3E%3C/svg%3E") repeat-x 0 0/48px 14px}
.footer-wrap{max-width:calc(1600px + 2*var(--f-gutter));margin:0 auto;padding:0 var(--f-gutter)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px}
.footer-col{display:flex;flex-direction:column;gap:10px;font-size:14px}
.footer-col p{margin:0;text-wrap:pretty}
.site-footer .footer-brand{display:flex;align-items:center;gap:10px;margin-bottom:8px;color:var(--f-strong);text-decoration:none;
  font:700 22px/1.55 "Bricolage Grotesque",system-ui,sans-serif;letter-spacing:-.04em}
.site-footer .brand-mark{width:28px;height:auto;fill:none;stroke:currentColor;stroke-width:1.7;color:var(--f-strong)}
.footer-head{font:500 10.5px/1.55 "IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:1.6px;text-transform:uppercase;color:var(--f-strong);margin-bottom:4px}
nav.footer-col a{color:var(--f-text);text-decoration:none}
nav.footer-col a:hover,nav.footer-col a:active{color:var(--f-strong);text-decoration:underline}
.footer-bottom{margin-top:48px;font-size:13px}
.footer-bottom p{margin:0}
.footer-bottom>p:first-child{padding-top:24px;border-top:1px solid var(--f-line)}
.footer-bottom .footer-note{margin:12px 0 0;font-size:12px;opacity:.8}
.site-footer :focus-visible{outline:3px solid var(--f-strong);outline-offset:3px}

@media (max-width:1024px){
  .footer-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footer-about{grid-column:1/-1}
}
@media (max-width:767px){
  .footer-grid{grid-template-columns:minmax(0,1fr)}
}
@media print{.site-footer{display:none}}