.mod_visitors .invisible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    float: left;
	width:0px;
	height:0px;
}
/**
 * CLICKPRESS CSS-Grid
 * @author: Stefan Schulz-Lauterbach
 *
 * thanks to Dinko Skopljak for co-working
 */
.justify-items-start {
  justify-items: start;
}

.justify-items-center {
  justify-items: center;
}

.justify-items-end {
  justify-items: end;
}

.justify-items-stretch {
  justify-items: stretch;
}

.content-start {
  align-content: start;
}

.content-center {
  align-content: center;
}

.content-end {
  align-content: end;
}

.items-start {
  align-items: start;
}

.items-center {
  align-items: center;
}

.items-end {
  align-items: end;
}

.items-stretch {
  align-items: stretch;
}

.items-baseline {
  align-items: baseline;
}

[class*=grid_] {
  display: grid;
  grid-gap: 1rem;
}
[class*=grid_] > .block {
  margin-bottom: 0;
}

@media (min-width: 576px) {
  .grid_mobile_100 {
    grid-template-columns: 1fr;
  }
  .grid_mobile_50_50 {
    grid-template-columns: repeat(2, 1fr);
  }
  .grid_mobile_33_33_33 {
    grid-template-columns: repeat(3, 1fr);
  }
  .grid_mobile_25_25_25_25 {
    grid-template-columns: repeat(4, 1fr);
  }
  .grid_mobile_75_25 {
    grid-template-columns: 3fr 1fr;
  }
  .grid_mobile_25_75 {
    grid-template-columns: 1fr 3fr;
  }
  .grid_mobile_66_33 {
    grid-template-columns: 2fr 1fr;
  }
  .grid_mobile_33_66 {
    grid-template-columns: 1fr 2fr;
  }
  .grid_mobile_60_40 {
    grid-template-columns: 3fr 2fr;
  }
  .grid_mobile_40_60 {
    grid-template-columns: 2fr 3fr;
  }
  .grid_mobile_50_25_25 {
    grid-template-columns: 2fr 1fr 1fr;
  }
  .grid_mobile_25_50_25 {
    grid-template-columns: 1fr 2fr 1fr;
  }
  .grid_mobile_25_25_50 {
    grid-template-columns: 1fr 1fr 2fr;
  }
  .grid_mobile_40_30_30 {
    grid-template-columns: 4fr 3fr 3fr;
  }
  .grid_mobile_30_40_30 {
    grid-template-columns: 3fr 4fr 3fr;
  }
  .grid_mobile_30_30_40 {
    grid-template-columns: 3fr 3fr 4fr;
  }
  .gap_mobile_0 {
    grid-gap: 0;
  }
  .gap_mobile_1 {
    grid-gap: 1rem;
  }
  .gap_mobile_2 {
    grid-gap: 2rem;
  }
  .gap_mobile_3 {
    grid-gap: 3rem;
  }
  .gap_mobile_4 {
    grid-gap: 4rem;
  }
  .gap_mobile_5 {
    grid-gap: 5rem;
  }
  .gap_mobile_6 {
    grid-gap: 6rem;
  }
  .gap_mobile_7 {
    grid-gap: 7rem;
  }
  .gap_mobile_8 {
    grid-gap: 8rem;
  }
  .gap_mobile_9 {
    grid-gap: 9rem;
  }
  .gap_mobile_10 {
    grid-gap: 10rem;
  }
  .gap_mobile_11 {
    grid-gap: 11rem;
  }
  .gap_mobile_12 {
    grid-gap: 12rem;
  }
}
@media (min-width: 768px) {
  .grid_tablet_100 {
    grid-template-columns: 1fr;
  }
  .grid_tablet_50_50 {
    grid-template-columns: repeat(2, 1fr);
  }
  .grid_tablet_33_33_33 {
    grid-template-columns: repeat(3, 1fr);
  }
  .grid_tablet_25_25_25_25 {
    grid-template-columns: repeat(4, 1fr);
  }
  .grid_tablet_75_25 {
    grid-template-columns: 3fr 1fr;
  }
  .grid_tablet_25_75 {
    grid-template-columns: 1fr 3fr;
  }
  .grid_tablet_66_33 {
    grid-template-columns: 2fr 1fr;
  }
  .grid_tablet_33_66 {
    grid-template-columns: 1fr 2fr;
  }
  .grid_tablet_60_40 {
    grid-template-columns: 3fr 2fr;
  }
  .grid_tablet_40_60 {
    grid-template-columns: 2fr 3fr;
  }
  .grid_tablet_50_25_25 {
    grid-template-columns: 2fr 1fr 1fr;
  }
  .grid_tablet_25_50_25 {
    grid-template-columns: 1fr 2fr 1fr;
  }
  .grid_tablet_25_25_50 {
    grid-template-columns: 1fr 1fr 2fr;
  }
  .grid_tablet_40_30_30 {
    grid-template-columns: 4fr 3fr 3fr;
  }
  .grid_tablet_30_40_30 {
    grid-template-columns: 3fr 4fr 3fr;
  }
  .grid_tablet_30_30_40 {
    grid-template-columns: 3fr 3fr 4fr;
  }
  .grid_tablet_20_40_40 {
    grid-template-columns: 1fr 2fr 2fr;
  }
  .grid_tablet_40_20_40 {
    grid-template-columns: 2fr 1fr 2fr;
  }
  .grid_tablet_40_40_20 {
    grid-template-columns: 2fr 2fr 1fr;
  }
  .gap_tablet_0 {
    grid-gap: 0;
  }
  .gap_tablet_1 {
    grid-gap: 1rem;
  }
  .gap_tablet_2 {
    grid-gap: 2rem;
  }
  .gap_tablet_3 {
    grid-gap: 3rem;
  }
  .gap_tablet_4 {
    grid-gap: 4rem;
  }
  .gap_tablet_5 {
    grid-gap: 5rem;
  }
  .gap_tablet_6 {
    grid-gap: 6rem;
  }
  .gap_tablet_7 {
    grid-gap: 7rem;
  }
  .gap_tablet_8 {
    grid-gap: 8rem;
  }
  .gap_tablet_9 {
    grid-gap: 9rem;
  }
  .gap_tablet_10 {
    grid-gap: 10rem;
  }
  .gap_tablet_11 {
    grid-gap: 11rem;
  }
  .gap_tablet_12 {
    grid-gap: 12rem;
  }
}
@media (min-width: 992px) {
  .grid_desktop_100 {
    grid-template-columns: 1fr;
  }
  .grid_desktop_50_50 {
    grid-template-columns: repeat(2, 1fr);
  }
  .grid_desktop_50_25_25 {
    grid-template-columns: 2fr 1fr 1fr;
  }
  .grid_desktop_33_33_33 {
    grid-template-columns: repeat(3, 1fr);
  }
  .grid_desktop_75_25 {
    grid-template-columns: 3fr 1fr;
  }
  .grid_desktop_25_75 {
    grid-template-columns: 1fr 3fr;
  }
  .grid_desktop_66_33 {
    grid-template-columns: 2fr 1fr;
  }
  .grid_desktop_60_40 {
    grid-template-columns: 3fr 2fr;
  }
  .grid_desktop_40_60 {
    grid-template-columns: 2fr 3fr;
  }
  .grid_desktop_33_66 {
    grid-template-columns: 1fr 2fr;
  }
  .grid_desktop_50_25_25 {
    grid-template-columns: 2fr 1fr 1fr;
  }
  .grid_desktop_40_30_30 {
    grid-template-columns: 4fr 3fr 3fr;
  }
  .grid_desktop_50_25_25 {
    grid-template-columns: 2fr 1fr 1fr;
  }
  .grid_desktop_25_50_25 {
    grid-template-columns: 1fr 2fr 1fr;
  }
  .grid_desktop_25_25_50 {
    grid-template-columns: 1fr 1fr 2fr;
  }
  .grid_desktop_40_30_30 {
    grid-template-columns: 4fr 3fr 3fr;
  }
  .grid_desktop_30_40_30 {
    grid-template-columns: 3fr 4fr 3fr;
  }
  .grid_desktop_30_30_40 {
    grid-template-columns: 3fr 3fr 4fr;
  }
  .grid_desktop_20_40_40 {
    grid-template-columns: 1fr 2fr 2fr;
  }
  .grid_desktop_40_20_40 {
    grid-template-columns: 2fr 1fr 2fr;
  }
  .grid_desktop_40_40_20 {
    grid-template-columns: 2fr 2fr 1fr;
  }
  .grid_desktop_25_25_25_25 {
    grid-template-columns: repeat(4, 1fr);
  }
  .grid_desktop_40_20_20_20 {
    grid-template-columns: 2fr 1fr 1fr 1fr;
  }
  .grid_desktop_20_40_20_20 {
    grid-template-columns: 1fr 2fr 1fr 1fr;
  }
  .grid_desktop_20_20_40_20 {
    grid-template-columns: 1fr 1fr 2fr 1fr;
  }
  .grid_desktop_20_20_20_40 {
    grid-template-columns: 1fr 1fr 1fr 2fr;
  }
  .grid_desktop_20_20_20_20_20 {
    grid-template-columns: repeat(5, 1fr);
  }
  .gap_desktop_0 {
    grid-gap: 0;
  }
  .gap_desktop_1 {
    grid-gap: 1rem;
  }
  .gap_desktop_2 {
    grid-gap: 2rem;
  }
  .gap_desktop_3 {
    grid-gap: 3rem;
  }
  .gap_desktop_4 {
    grid-gap: 4rem;
  }
  .gap_desktop_5 {
    grid-gap: 5rem;
  }
  .gap_desktop_6 {
    grid-gap: 6rem;
  }
  .gap_desktop_7 {
    grid-gap: 7rem;
  }
  .gap_desktop_8 {
    grid-gap: 8rem;
  }
  .gap_desktop_9 {
    grid-gap: 9rem;
  }
  .gap_desktop_10 {
    grid-gap: 10rem;
  }
  .gap_desktop_11 {
    grid-gap: 11rem;
  }
  .gap_desktop_12 {
    grid-gap: 12rem;
  }
}

/*# sourceMappingURL=clickpress-grid.css.map */

/* ============ Schriften (lokal gehostet, keine Google-Verbindung) ============ */
@font-face {font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/open-sans-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/open-sans-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/open-sans-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/open-sans-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/open-sans-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/open-sans-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/work-sans-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/work-sans-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family: 'Work Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/work-sans-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family: 'Work Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/work-sans-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family: 'Work Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/work-sans-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family: 'Work Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/work-sans-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family: 'Work Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/work-sans-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family: 'Work Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/work-sans-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face {font-family: 'Work Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/work-sans-800-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family: 'Work Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../../files/themes/michel/fonts/work-sans-800-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}


/* ============ Design-Tokens (Michel-CI) ============ */
:root{
  --blau:#1c4887;          /* Michel-Primär */
  --blau-tief:#122f5a;     /* dunkler */
  --blau-nacht:#0d2244;    /* Header/Footer dunkel */
  --blau-hell:#3d7bd4;     /* Akzent/Hover */
  --blau-luft:#eaf1fa;     /* zarte Fläche */
  --gruen:#1a9e5f;         /* Verfügbar-Signal */
  --gruen-luft:#e5f5ec;
  --tinte:#1a2230;         /* Fließtext dunkel */
  --grau:#5a6472;          /* Sekundärtext */
  --grau-linie:#e4e8ee;
  --nebel:#f4f7fb;         /* Section-Bg hell */
  --weiss:#ffffff;
  --schatten:0 18px 50px rgba(18,47,90,.10);
  --schatten-kl:0 6px 20px rgba(18,47,90,.08);
  --radius:16px;
  --radius-kl:11px;
  --wrap:1200px;
  --font-h:'Work Sans',system-ui,sans-serif;
  --font-b:'Open Sans',system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font-b);color:var(--tinte);background:var(--weiss);line-height:1.65;font-size:17px;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--font-h);line-height:1.12;color:var(--blau-nacht);font-weight:700;letter-spacing:-.01em;text-wrap:balance}
p{color:var(--grau);text-wrap:pretty}
/* Zahlen nie umbrechen */
.num,.bf b{white-space:nowrap}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 26px}
section{position:relative}

/* ============ Buttons ============ */
.btn{display:inline-flex;align-items:center;gap:.55em;font-family:var(--font-h);font-weight:600;font-size:16px;
  padding:15px 28px;border-radius:60px;cursor:pointer;border:2px solid transparent;transition:.22s ease;white-space:nowrap;text-align:center}
.btn svg{width:18px;height:18px;flex:none}
.btn-primary{background:var(--blau);color:#fff;box-shadow:0 10px 26px rgba(28,72,135,.32)}
.btn-primary:hover{background:var(--blau-hell);transform:translateY(-2px);box-shadow:0 16px 34px rgba(28,72,135,.42)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn-ghost:hover{background:rgba(255,255,255,.14);border-color:#fff}
.btn-line{background:#fff;color:var(--blau);border-color:var(--grau-linie)}
.btn-line:hover{border-color:var(--blau);color:var(--blau);transform:translateY(-2px)}
.btn-lg{padding:18px 34px;font-size:17px}

/* ============ Header ============ */
.hd{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(255,255,255,.0);transition:.3s ease}
.hd.solid{background:rgba(255,255,255,.96);backdrop-filter:blur(10px);box-shadow:0 2px 22px rgba(18,47,90,.09)}
.hd-in{display:flex;align-items:center;justify-content:space-between;height:82px}
.hd-logo img{height:40px;width:auto;transition:.3s}
.hd .logo-blau{display:none}
.hd .logo-weiss{display:block}
.hd.solid .logo-blau{display:block}
.hd.solid .logo-weiss{display:none}
.nav{display:flex;align-items:center;gap:34px}
.nav a.link{font-family:var(--font-h);font-weight:500;font-size:15.5px;color:#fff;transition:.2s;position:relative}
.hd.solid .nav a.link{color:var(--blau-nacht)}
.nav a.link:hover{color:var(--blau-hell)}
.hd.solid .nav a.link:hover{color:var(--blau)}
.hd-cta{display:flex;align-items:center;gap:16px}
.hd-tel{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-h);font-weight:600;font-size:15.5px;color:#fff}
.hd.solid .hd-tel{color:var(--blau-nacht)}
.hd-tel svg{width:17px;height:17px}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.burger span{width:26px;height:2.5px;background:#fff;border-radius:3px;transition:.3s}
.hd.solid .burger span{background:var(--blau-nacht)}

/* ============ Hero ============ */
.hero{min-height:78vh;display:flex;align-items:center;color:#fff;overflow:hidden;padding:104px 0 42px}
.hero-bg{position:absolute;inset:0;z-index:-2}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:left center}
/* solide dunkle Textzone rechts (max. Kontrast), Bild links sichtbar (Hallen) */
.hero-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(260deg,#0a1c39 0%,#0a1c39 30%,rgba(10,28,57,.9) 50%,rgba(12,32,66,.55) 100%)}
.hero>.wrap{width:100%}
.hero-in{max-width:660px;position:relative;margin-left:auto}
.eyebrow{display:inline-flex;align-items:center;gap:10px;padding:0;
  font-family:var(--font-h);font-weight:600;font-size:14.5px;letter-spacing:.03em;margin-bottom:22px;color:rgba(255,255,255,.92)}
.eyebrow .dot{width:9px;height:9px;border-radius:50%;background:var(--gruen);box-shadow:0 0 0 4px rgba(26,158,95,.35);animation:puls 2s infinite}
@keyframes puls{50%{box-shadow:0 0 0 8px rgba(26,158,95,.08)}}
.hero h1{color:#fff;font-size:clamp(2.3rem,5.1vw,3.75rem);font-weight:800;margin-bottom:16px}
.hero h1 em{font-style:normal;color:#8ec0ff}
.hero-sub{font-size:clamp(1.03rem,1.6vw,1.19rem);color:rgba(255,255,255,.9);max-width:640px;margin-bottom:26px;line-height:1.55}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:28px}
.hero-trust{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.hero-trust .t{display:flex;align-items:center;gap:9px;font-family:var(--font-h);font-weight:600;font-size:15px;color:rgba(255,255,255,.9)}
.hero-trust .t:not(:last-child){padding-right:22px;border-right:1px solid rgba(255,255,255,.20)}
.hero-trust .t b{color:#8ec0ff;font-weight:800}
.hero-trust .t .ic{display:inline-flex;align-items:center;justify-content:center;background:none;width:auto;height:auto;border-radius:0}
.hero-trust svg{width:19px;height:19px;color:#8ec0ff;flex:none}

/* ============ KPI-Strip ============ */
.kpi{background:var(--blau-nacht);color:#fff;padding:0}
.kpi-in{display:grid;grid-template-columns:repeat(5,1fr)}
.kpi .k{padding:38px 20px;text-align:center;border-right:1px solid rgba(255,255,255,.10)}
.kpi .k:last-child{border-right:0}
.kpi .num{font-family:var(--font-h);font-weight:800;font-size:clamp(1.7rem,3.2vw,2.75rem);color:#fff;line-height:1}
.kpi .num span{color:#8ec0ff;font-size:.6em;font-weight:700}
.kpi .lab{font-size:14.5px;color:rgba(255,255,255,.72);margin-top:9px;font-family:var(--font-h);font-weight:500}

/* ============ Section-Basis ============ */
.sec{padding:96px 0}
.sec-nebel{background:var(--nebel)}
.tag{display:inline-block;font-family:var(--font-h);font-weight:700;font-size:13.5px;letter-spacing:.10em;text-transform:uppercase;color:var(--blau-hell);margin-bottom:14px}
.sec-head{max-width:720px;margin-bottom:52px}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
.sec-head h2{font-size:clamp(1.9rem,3.6vw,2.75rem);margin-bottom:16px}
.sec-head h2.oneline{white-space:nowrap}
.sec-head p{font-size:1.1rem}

/* ============ USP ============ */
.usp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.usp-card{background:#fff;border:1px solid var(--grau-linie);border-radius:var(--radius);padding:32px 26px;transition:.25s;position:relative;overflow:hidden}
.usp-card:hover{transform:translateY(-5px);box-shadow:var(--schatten);border-color:transparent}
.usp-ic{width:60px;height:60px;border-radius:14px;background:var(--blau-luft);display:flex;align-items:center;justify-content:center;margin-bottom:22px}
.usp-ic svg{width:30px;height:30px;color:var(--blau)}
.usp-card h3{font-size:1.32rem;margin-bottom:12px}
.usp-card p{font-size:16px}

/* ============ Verfügbare Hallen ============ */
.hallen{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.halle{background:#fff;border:1px solid var(--grau-linie);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:.25s}
.halle:hover{box-shadow:var(--schatten);transform:translateY(-4px)}
.halle-img{position:relative;aspect-ratio:16/10;overflow:hidden}
.halle-track{display:flex;height:100%;transition:transform .45s cubic-bezier(.4,0,.2,1);will-change:transform}
.halle-slide{min-width:100%;height:100%}
.halle-slide img{width:100%;height:100%;object-fit:cover;display:block}
.halle-nav{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;background:rgba(10,28,57,.5);backdrop-filter:blur(3px);border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;transition:.2s;z-index:4;opacity:0}
.halle-img:hover .halle-nav{opacity:1}
.halle-nav:hover{background:var(--blau)}
.halle-nav:disabled{opacity:0 !important;pointer-events:none}
.halle-nav.prev{left:12px}
.halle-nav.next{right:12px}
.halle-nav svg{width:20px;height:20px}
.halle-dots{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:6px;z-index:4}
.halle-dots button{width:7px;height:7px;border-radius:50%;border:0;background:rgba(255,255,255,.55);cursor:pointer;padding:0;transition:.25s}
.halle-dots button.active{background:#fff;width:20px;border-radius:4px}
.halle-badge{position:absolute;top:16px;left:16px;background:var(--gruen);color:#fff;font-family:var(--font-h);font-weight:700;font-size:12.5px;letter-spacing:.02em;padding:7px 14px;border-radius:40px;display:flex;align-items:center;gap:7px;box-shadow:0 6px 16px rgba(26,158,95,.4)}
.halle-badge .dot{width:7px;height:7px;border-radius:50%;background:#fff}
.halle-num{position:absolute;top:14px;right:16px;font-family:var(--font-h);font-weight:800;font-size:15px;color:#fff;background:rgba(13,34,68,.72);backdrop-filter:blur(3px);padding:6px 14px;border-radius:40px}
.halle-body{padding:26px 26px 28px;flex:1;display:flex;flex-direction:column}
.halle-body h3{font-size:1.4rem;margin-bottom:5px}
.halle-body .flaeche{font-family:var(--font-h);font-weight:600;color:var(--blau);font-size:1.02rem;margin-bottom:18px}
.halle-specs{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:11px 18px;margin-top:auto}
.halle-specs li{display:flex;align-items:flex-start;gap:9px;font-size:14.5px;color:var(--tinte)}
.halle-specs li svg{width:17px;height:17px;color:var(--blau-hell);flex:none;margin-top:2px}
.halle-specs li b{font-weight:600}
.hallen-note{margin-top:30px;background:var(--blau-luft);border-radius:var(--radius);padding:22px 26px;display:flex;align-items:center;gap:16px;font-size:15.5px;color:var(--blau-tief)}
.hallen-note svg{width:26px;height:26px;color:var(--blau);flex:none}
.hallen-note b{font-family:var(--font-h)}

/* ============ Leistungen ============ */
.leist{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.leist-card{background:#fff;border:1px solid var(--grau-linie);border-radius:var(--radius-kl);padding:28px 26px;display:flex;gap:18px;align-items:flex-start;transition:.22s}
.leist-card:hover{border-color:var(--blau-hell);box-shadow:var(--schatten-kl);transform:translateY(-3px)}
.leist-ic{width:48px;height:48px;border-radius:12px;background:var(--blau);display:flex;align-items:center;justify-content:center;flex:none}
.leist-ic svg{width:24px;height:24px;color:#fff}
.leist-card h4{font-size:1.12rem;margin-bottom:5px}
.leist-card p{font-size:14.5px;line-height:1.55}

/* ============ Standort (Split) ============ */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center}
.split-media{border-radius:var(--radius);overflow:hidden;box-shadow:var(--schatten);position:relative}
.split-media img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.feat-list{list-style:none;margin:26px 0 32px}
.feat-list li{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px}
.feat-list .fic{width:38px;height:38px;border-radius:10px;background:var(--blau-luft);display:flex;align-items:center;justify-content:center;flex:none}
.feat-list .fic svg{width:20px;height:20px;color:var(--blau)}
.feat-list h4{font-size:1.06rem;margin-bottom:2px}
.feat-list p{font-size:15px}
.adr{background:#fff;border:1px solid var(--grau-linie);border-radius:var(--radius-kl);padding:20px 24px;display:flex;align-items:center;gap:16px;font-family:var(--font-h);font-weight:500}
.adr svg{width:26px;height:26px;color:var(--blau);flex:none}
.adr span{display:block;font-size:13px;color:var(--grau);font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px}

/* ============ Band (Über Michel) ============ */
.band{background:var(--blau-nacht);color:#fff;overflow:hidden}
.band .split{gap:0;grid-template-columns:1fr 1fr;align-items:stretch}
.band-txt{padding:90px 60px 90px 0;position:relative;z-index:2}
.band-txt .tag{color:#8ec0ff}
.band-txt h2{color:#fff;font-size:clamp(1.8rem,3.3vw,2.5rem);margin-bottom:18px}
.band-txt p{color:rgba(255,255,255,.82);margin-bottom:18px}
.band-facts{display:flex;gap:40px;margin-top:30px;flex-wrap:wrap}
.band-facts .bf b{display:block;font-family:var(--font-h);font-weight:800;font-size:2rem;color:#8ec0ff;line-height:1}
.band-facts .bf span{font-size:14px;color:rgba(255,255,255,.72)}
.band-img{position:absolute;top:0;right:0;width:50%;height:100%;min-height:420px}
.band-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--blau-nacht) 0%,rgba(13,34,68,0) 22%)}
.band-img img{width:100%;height:100%;object-fit:cover;object-position:center top}
.band-cap{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:26px 24px 16px;font-family:var(--font-h);font-weight:600;font-size:14px;color:#fff;background:linear-gradient(transparent,rgba(6,17,36,.82))}

/* ============ O-Ton / persönlich ============ */
.oton{background:#fff;padding:82px 0}
.oton-in{max-width:920px;margin:0 auto;display:flex;gap:46px;align-items:center}
.oton-portrait{flex:none;width:184px;height:184px;border-radius:50%;overflow:hidden;box-shadow:var(--schatten);border:5px solid #fff;outline:1px solid var(--grau-linie)}
.oton-portrait img{width:100%;height:100%;object-fit:cover}
.oton-txt{position:relative}
.oton .quote{width:44px;height:44px;color:var(--blau-luft);position:absolute;top:-14px;left:-6px;z-index:0}
.oton-quote{position:relative;font-family:var(--font-h);font-weight:500;font-size:clamp(1.25rem,2.2vw,1.62rem);line-height:1.42;color:var(--blau-nacht);margin-bottom:20px;z-index:1;text-wrap:balance}
.oton-name{font-family:var(--font-h);font-weight:700;color:var(--blau-nacht);font-size:1.12rem}
.oton-rolle{font-size:14.5px;color:var(--grau)}

/* ============ Kontakt / Formular ============ */
.kontakt{background:var(--nebel)}
.k-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:48px;align-items:start}
.k-info h2{font-size:clamp(1.9rem,3.4vw,2.6rem);margin-bottom:16px}
.k-info>p{font-size:1.08rem;margin-bottom:30px}
.k-person{background:#fff;border:1px solid var(--grau-linie);border-radius:var(--radius);padding:26px;box-shadow:var(--schatten-kl);margin-bottom:22px}
.k-person .pt{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.k-person .pa{width:56px;height:56px;border-radius:50%;background:var(--blau);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-h);font-weight:700;font-size:1.3rem;flex:none}
.k-person .pn{font-family:var(--font-h);font-weight:700;font-size:1.15rem;color:var(--blau-nacht)}
.k-person .pr{font-size:14.5px;color:var(--grau)}
.k-contact{display:flex;flex-direction:column;gap:12px}
.k-contact a{display:flex;align-items:center;gap:13px;font-family:var(--font-h);font-weight:600;font-size:16px;color:var(--blau-nacht);padding:12px 16px;border-radius:11px;background:var(--nebel);transition:.2s}
.k-contact a:hover{background:var(--blau-luft);color:var(--blau)}
.k-contact svg{width:20px;height:20px;color:var(--blau);flex:none}
.k-usps{list-style:none;margin-top:8px}
.k-usps li{display:flex;gap:11px;align-items:center;font-size:15px;color:var(--tinte);margin-bottom:11px;font-family:var(--font-h);font-weight:500}
.k-usps svg{width:19px;height:19px;color:var(--gruen);flex:none}

.form-card{background:#fff;border:1px solid var(--grau-linie);border-radius:var(--radius);padding:38px;box-shadow:var(--schatten)}
.form-card h3{font-size:1.4rem;margin-bottom:6px}
.form-card .fh{font-size:15px;color:var(--grau);margin-bottom:26px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fg{margin-bottom:16px;display:flex;flex-direction:column}
.fg.full{grid-column:1/-1}
.fg label{font-family:var(--font-h);font-weight:600;font-size:14px;color:var(--blau-nacht);margin-bottom:7px}
.fg label .req{color:var(--blau-hell)}
.fg input,.fg select,.fg textarea{font-family:var(--font-b);font-size:15.5px;padding:13px 15px;border:1.5px solid var(--grau-linie);border-radius:11px;background:#fcfdfe;color:var(--tinte);transition:.18s;width:100%}
.fg textarea{resize:vertical;min-height:104px}
.fg input:focus,.fg select:focus,.fg textarea:focus{outline:none;border-color:var(--blau);background:#fff;box-shadow:0 0 0 4px rgba(28,72,135,.10)}
.fg-check{display:flex;gap:12px;align-items:flex-start;margin:6px 0 20px}
.fg-check input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--blau)}
.fg-check label{font-size:13.5px;color:var(--grau);font-family:var(--font-b);font-weight:400;line-height:1.5}
.fg-check a{color:var(--blau);text-decoration:underline}
altcha-widget{--altcha-border-width:1.5px;--altcha-border-radius:11px;--altcha-color-border:var(--grau-linie);--altcha-max-width:100%;display:block;margin-bottom:20px}
.form-note{font-size:12.5px;color:var(--grau);text-align:center;margin-top:14px}
.form-ok{display:none;text-align:center;padding:30px 10px}
.form-ok.show{display:block}
.form-ok svg{width:64px;height:64px;color:var(--gruen);margin:0 auto 18px}
.form-ok h3{font-size:1.5rem;margin-bottom:8px}

/* ============ Footer ============ */
.ft{background:#081b38;color:rgba(255,255,255,.68);padding:60px 0 30px;font-size:14.5px}
.ft-top{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px;padding-bottom:38px;border-bottom:1px solid rgba(255,255,255,.10)}
.ft-logo img{height:38px;margin-bottom:18px}
.ft-top p{color:rgba(255,255,255,.6);max-width:340px;font-size:14.5px}
.ft h5{font-family:var(--font-h);font-weight:600;color:#fff;font-size:15px;margin-bottom:16px}
.ft ul{list-style:none}
.ft ul li{margin-bottom:10px}
.ft ul a:hover{color:#8ec0ff}
.ft-contact{list-style:none}
.ft-contact li{display:flex;align-items:flex-start;gap:12px;margin-bottom:15px;color:rgba(255,255,255,.7);line-height:1.5}
.ft-contact li svg{width:18px;height:18px;color:#8ec0ff;flex:none;margin-top:3px}
.ft-contact a{color:rgba(255,255,255,.7)}
.ft-contact a:hover{color:#8ec0ff}
.ft-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:24px;font-size:13.5px}
.ft-bottom a:hover{color:#8ec0ff}

/* ============ Sticky Mobil-CTA ============ */
.mcta{display:none;position:fixed;bottom:0;left:0;right:0;z-index:90;background:#fff;border-top:1px solid var(--grau-linie);padding:11px 16px;gap:11px;box-shadow:0 -4px 20px rgba(18,47,90,.10)}
.mcta a{flex:1;justify-content:center;padding:14px}

/* Reveal-Effekt bewusst entfernt: Inhalte sind immer voll sichtbar (keine JS-/opacity-Abhängigkeit). */

/* Redaktionelle Umbrueche, nur ab Tablet/Desktop */
.nb-d{display:inline}

/* ============ Responsive ============ */
@media(max-width:980px){
  .nav,.hd-tel{display:none}
  .burger{display:flex}
  .hd-cta .btn{display:none}
  .split{grid-template-columns:1fr;gap:36px}
  .band .split{grid-template-columns:1fr}
  .band-txt{padding:66px 0}
  .band-img{position:static;width:100%;height:auto;min-height:280px;border-radius:var(--radius);overflow:hidden}
  .band-img::after{display:none}
  .k-grid{grid-template-columns:1fr;gap:36px}
  .usp-grid,.leist{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .nb-d{display:none}
  body{font-size:16px}
  .sec{padding:66px 0}
  .kpi-in{grid-template-columns:1fr 1fr}
  .kpi .k{border-right:0;border-bottom:1px solid rgba(255,255,255,.10);padding:26px 16px}
  .kpi .k:nth-child(odd){border-right:1px solid rgba(255,255,255,.10)}
  .kpi .k:last-child{grid-column:1/-1;border-right:0}
  .kpi .num{font-size:1.5rem}
  .usp-grid,.leist,.hallen{grid-template-columns:1fr}
  .sec-head h2.oneline{white-space:normal}
  .halle-nav{opacity:1;background:rgba(10,28,57,.62);width:36px;height:36px}
  .halle-specs{grid-template-columns:1fr 1fr}
  .frow{grid-template-columns:1fr}
  .form-card{padding:26px 22px}
  .hero-trust{flex-direction:column;align-items:flex-start;gap:13px}
  .hero-trust .t:not(:last-child){padding-right:0;border-right:0}
  .oton{padding:56px 0}
  .oton-in{flex-direction:column;text-align:center;gap:24px}
  .oton-portrait{width:132px;height:132px}
  .oton .quote{display:none}
  .ft-top{grid-template-columns:1fr;gap:30px}
  .hero{padding-top:110px;min-height:auto}
  .hero-in{margin-left:0}
  .hero-bg::after{background:linear-gradient(180deg,rgba(10,28,57,.84),rgba(10,28,57,.92))}
  .hero-bg img{object-position:center}
  .mcta{display:flex}
  body{padding-bottom:74px}
  .mcta a span{font-size:14px}
}

/* Mobile-Nav Overlay */
.mnav{position:fixed;inset:0;z-index:200;background:var(--blau-nacht);display:flex;flex-direction:column;padding:26px;transform:translateX(100%);transition:.35s ease;visibility:hidden}
.mnav.open{transform:none;visibility:visible}
.mnav-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px}
.mnav-top img{height:38px}
.mnav-close{background:none;border:0;color:#fff;font-size:34px;cursor:pointer;line-height:1}
.mnav a.mlink{font-family:var(--font-h);font-weight:600;font-size:1.5rem;color:#fff;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.mnav .btn{margin-top:30px;justify-content:center}
.mnav-tel{color:#8ec0ff;font-family:var(--font-h);font-weight:600;margin-top:20px;font-size:1.15rem;display:flex;align-items:center;gap:10px}

/* ============================================================
   Contao-Anpassungen
   Die Vorlage arbeitete mit eigenen Wrappern (.wrap, .hd-in, .frow).
   Contao rendert Articles, Clickpress-Grids und Formular-Widgets.
   Dieser Block bildet die Vorlage auf die Contao-Ausgabe ab.
   ============================================================ */

/* --- Contao-Grundlagen --- */
figure{margin:0}
.content-image img{width:100%;height:auto}
.invisible{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* --- Sections: der Article ersetzt section + .wrap --- */
.mod_article{position:relative}
.mod_article.sec{padding:96px 0;background:var(--weiss)}
.mod_article.sec.sec-nebel{background:var(--nebel)}
.mod_article > *{max-width:var(--wrap);margin-left:auto;margin-right:auto;padding-left:26px;padding-right:26px}
.mod_article.sec > .tag{margin-bottom:14px}

/* --- Header --- */
#header{position:fixed;top:0;left:0;right:0;z-index:100;background:transparent;transition:.3s ease}
#header.solid{background:rgba(255,255,255,.96);backdrop-filter:blur(10px);box-shadow:0 2px 22px rgba(18,47,90,.09)}
#header .inside{max-width:var(--wrap);margin:0 auto;padding:0 26px;height:82px;display:flex;align-items:center;gap:34px}
#header .hd-logo{flex:none}
#header .hd-logo img{height:40px;width:auto}
#header .logo-blau{display:none}
#header.solid .logo-blau{display:block}
#header.solid .logo-weiss{display:none}
#header .nav{margin-left:auto}
#header .nav ul{display:flex;align-items:center;gap:34px;list-style:none}
#header .nav a,#header .nav strong{font-family:var(--font-h);font-weight:500;font-size:15.5px;color:#fff;transition:.2s}
#header.solid .nav a,#header.solid .nav strong{color:var(--blau-nacht)}
#header .nav a:hover,#header .nav .active,#header .nav strong{color:var(--blau-hell)}
#header .hd-tel p{margin:0}
#header .hd-tel a{font-family:var(--font-h);font-weight:600;font-size:15.5px;color:#fff}
#header.solid .hd-tel a{color:var(--blau-nacht)}
#header .hd-cta-btn a{display:inline-flex;align-items:center;font-family:var(--font-h);font-weight:600;font-size:16px;padding:13px 24px;border-radius:60px;background:var(--blau);color:#fff;white-space:nowrap;transition:.22s ease}
#header .hd-cta-btn a:hover{background:var(--blau-hell)}
#header .burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;margin-left:auto}
#header .burger span{width:26px;height:2.5px;background:#fff;border-radius:2px;transition:.2s}
#header.solid .burger span{background:var(--blau-nacht)}

/* --- Hero --- */
.mod_article.hero{min-height:min(88vh,820px);display:flex;flex-direction:column;justify-content:center;padding:150px 0 0;background:var(--blau-nacht);overflow:hidden}
.mod_article.hero > .hero-bg{position:absolute;inset:0;max-width:none;padding:0;margin:0;z-index:0}
.mod_article.hero > .hero-bg img{width:100%;height:100%;object-fit:cover;opacity:.42}
.mod_article.hero > .hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,var(--blau-nacht) 12%,rgba(13,34,68,.72) 48%,rgba(13,34,68,.30) 100%)}
.mod_article.hero > *:not(.hero-bg){position:relative;z-index:1;width:100%}
.mod_article.hero .eyebrow p{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-h);font-weight:600;font-size:14.5px;color:#bcd3f2;letter-spacing:.02em;margin-bottom:18px}
.mod_article.hero .eyebrow .dot{width:9px;height:9px;border-radius:50%;background:var(--gruen);box-shadow:0 0 0 0 rgba(26,158,95,.6);animation:puls 2.2s infinite}
.mod_article.hero h1{font-size:clamp(2.4rem,5.4vw,4.05rem);color:#fff;max-width:15ch;margin-bottom:22px}
.mod_article.hero h1 em{font-style:normal;color:var(--blau-hell)}
.mod_article.hero .hero-sub p{font-size:clamp(1.02rem,1.5vw,1.16rem);color:#c9d8ee;max-width:56ch;margin-bottom:32px}
.mod_article.hero .hero-cta p{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:38px}
.mod_article.hero .hero-trust-wrap{padding-bottom:40px}
.mod_article.hero .hero-trust{display:flex;flex-wrap:wrap;gap:26px;color:#a9c0de;font-size:14.5px}
.mod_article.hero .hero-trust b{color:#fff;font-family:var(--font-h)}

/* --- Kennzahlen --- */
.mod_article.kpi{background:var(--blau-tief);padding:0}
.mod_article.kpi .grid_start{max-width:var(--wrap);margin:0 auto;padding:0 26px}
.mod_article.kpi .ce_cp_column_start{padding:34px 20px;text-align:center;border-right:1px solid rgba(255,255,255,.10)}
.mod_article.kpi .num{font-family:var(--font-h);font-weight:800;font-size:clamp(1.7rem,3vw,2.35rem);color:#fff;line-height:1.05}
.mod_article.kpi .num span{font-size:.55em;font-weight:600;color:var(--blau-hell);margin-left:3px}
.mod_article.kpi .lab{font-size:13.5px;color:#a9c0de;margin-top:6px}

/* --- Section-Kopf --- */
.mod_article .tag p{display:inline-block;font-family:var(--font-h);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--blau-hell);margin:0}
.mod_article h2.sec-head-h2,.mod_article > .content-headline h2{font-size:clamp(1.9rem,3.6vw,2.75rem);margin-bottom:16px}
.mod_article .sec-lead p{font-size:1.07rem;max-width:66ch;margin:0 0 44px}

/* Mittige Section-Koepfe wie in der Vorlage */
#warum .tag,#warum h2,#warum .sec-lead,
#flaechen .tag,#flaechen h2,#flaechen .sec-lead,
.mod_article.sec:has(.leist) .tag,.mod_article.sec:has(.leist) h2,.mod_article.sec:has(.leist) .sec-lead{text-align:center}
#warum .sec-lead p,#flaechen .sec-lead p,.mod_article.sec:has(.leist) .sec-lead p{margin-left:auto;margin-right:auto}

/* --- USP- und Leistungs-Karten --- */
.usp-card,.leist-card{background:#fff;border:1px solid var(--grau-linie);border-radius:var(--radius);padding:30px 26px;box-shadow:var(--schatten-kl);transition:.25s ease;height:100%}
.usp-card:hover,.leist-card:hover{transform:translateY(-4px);box-shadow:var(--schatten)}
.usp-card h3,.leist-card h4{font-size:1.12rem;margin-bottom:10px}
.usp-card p,.leist-card p{font-size:15px;margin:0}
.sec-nebel .usp-card,.sec-nebel .leist-card{background:#fff}

/* --- Hallen-Karten --- */
.hallen .ce_cp_column_start.halle{position:relative;background:#fff;border:1px solid var(--grau-linie);border-radius:var(--radius);overflow:hidden;box-shadow:var(--schatten-kl);transition:.25s ease;height:100%}
.hallen .halle:hover{box-shadow:var(--schatten)}
.halle .halle-img{position:relative;padding:0;max-width:none}
.halle .halle-img .grid_start{display:block;position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--blau-luft)}
.halle .halle-slide{margin:0}
.halle .halle-slide img{width:100%;height:100%;object-fit:cover}
.halle-img.is-slider .halle-slide{position:absolute;inset:0;opacity:0;transition:opacity .35s ease}
.halle-img.is-slider .halle-slide.active{opacity:1}
.halle-img .halle-nav{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;border:0;background:rgba(13,34,68,.62);color:#fff;cursor:pointer;opacity:0;transition:.2s;z-index:2}
.halle-img .halle-nav::before{content:'';display:block;width:9px;height:9px;border-top:2px solid #fff;border-right:2px solid #fff;margin:0 auto}
.halle-img .halle-nav.prev{left:12px}
.halle-img .halle-nav.prev::before{transform:rotate(-135deg);margin-left:14px}
.halle-img .halle-nav.next{right:12px}
.halle-img .halle-nav.next::before{transform:rotate(45deg);margin-left:10px}
.halle-img:hover .halle-nav{opacity:1}
.halle-img .halle-nav:hover{background:var(--blau)}
.halle-img .halle-nav:disabled{opacity:0;cursor:default}
.halle-img .halle-dots{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:7px;z-index:2}
.halle-img .halle-dots button{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.55);cursor:pointer;transition:.2s}
.halle-img .halle-dots button.active{width:20px;border-radius:5px;background:#fff}
.halle .halle-labels{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;padding:16px 18px;z-index:3;pointer-events:none;max-width:none}
.halle .halle-badge{display:inline-flex;align-items:center;gap:8px;background:var(--gruen);color:#fff;font-family:var(--font-h);font-weight:600;font-size:13px;padding:7px 14px;border-radius:60px;margin:0}
.halle .halle-badge .dot{width:7px;height:7px;border-radius:50%;background:#fff}
.halle .halle-num{background:rgba(13,34,68,.86);color:#fff;font-family:var(--font-h);font-weight:700;font-size:13.5px;padding:7px 14px;border-radius:60px;margin:0}
.halle .halle-body{padding:26px;max-width:none}
.halle .halle-body h3{font-size:1.18rem;margin-bottom:6px}
.halle .halle-body .flaeche{font-family:var(--font-h);font-weight:600;color:var(--blau);font-size:15px;margin-bottom:18px}
.halle .halle-specs{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:11px 18px}
.halle .halle-specs li{position:relative;padding-left:22px;font-size:14.5px;color:var(--tinte)}
.halle .halle-specs li::before{content:'';position:absolute;left:0;top:5px;width:12px;height:7px;border-left:2px solid var(--blau-hell);border-bottom:2px solid var(--blau-hell);transform:rotate(-45deg)}
.halle .halle-specs b{font-weight:700;color:var(--blau-nacht)}
.hallen-note{margin-top:34px}
.hallen-note p{background:var(--blau-luft);border-radius:var(--radius-kl);padding:22px 26px;font-size:15px;color:var(--tinte);margin:0}
.hallen-note b{color:var(--blau-nacht)}

/* --- Standort / Familienbetrieb --- */
.split .grid_start{align-items:center}
.split-media img,.band-img img{border-radius:var(--radius);box-shadow:var(--schatten)}
.feat-list{list-style:none;margin:26px 0}
.feat-list li{margin-bottom:20px}
.feat-list h4{font-size:1.03rem;margin-bottom:4px}
.feat-list p{font-size:15px;margin:0}
.adr-wrap .adr{display:flex;flex-direction:column;gap:3px;background:#fff;border:1px solid var(--grau-linie);border-radius:var(--radius-kl);padding:18px 22px;box-shadow:var(--schatten-kl)}
.adr-lab{font-family:var(--font-h);font-weight:700;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grau)}
.adr-val{font-family:var(--font-h);font-weight:600;color:var(--blau-nacht)}
.mod_article.band{background:var(--blau-nacht);padding:0}
.mod_article.band .grid_start{max-width:var(--wrap);margin:0 auto;padding:0 26px}
.mod_article.band .band-txt{padding:86px 0}
.mod_article.band h2{color:#fff;font-size:clamp(1.9rem,3.4vw,2.6rem);margin-bottom:18px}
.mod_article.band p{color:#c9d8ee}
.mod_article.band .band-facts{display:flex;flex-wrap:wrap;gap:30px;margin-top:26px}
.mod_article.band .bf{display:flex;flex-direction:column}
.mod_article.band .bf b{font-family:var(--font-h);font-weight:800;font-size:1.6rem;color:var(--blau-hell)}
.mod_article.band .bf span{font-size:13.5px;color:#a9c0de}
.mod_article.band .band-cap p{font-size:13.5px;color:#a9c0de;margin-top:12px}

/* --- O-Ton --- */
.mod_article.oton{padding:76px 0}
.oton-in .grid_start{align-items:center;gap:38px}
.oton-portrait img{border-radius:50%;aspect-ratio:1;object-fit:cover;box-shadow:var(--schatten)}
.oton-quote{font-family:var(--font-h);font-weight:600;font-size:clamp(1.25rem,2.4vw,1.75rem);color:var(--blau-nacht);line-height:1.35;margin-bottom:18px}
.oton-name{font-family:var(--font-h);font-weight:700;color:var(--blau-nacht);margin:0}
.oton-rolle{font-size:14.5px;margin:0}

/* --- Kontakt / Formular --- */
.mod_article.kontakt{background:var(--nebel)}
.k-grid .grid_start{align-items:start;gap:48px}
.k-person{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--grau-linie);border-radius:var(--radius);padding:26px;box-shadow:var(--schatten-kl);margin-bottom:22px}
.k-person .pt{width:56px;height:56px;border-radius:50%;background:var(--blau);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-h);font-weight:700;font-size:1.3rem;flex:none}
.k-person .pa{display:flex;flex-direction:column}
.k-usps{list-style:none;margin-top:18px}
.k-usps li{position:relative;padding-left:26px;font-size:15px;color:var(--tinte);margin-bottom:11px;font-family:var(--font-h);font-weight:500}
.k-usps li::before{content:'';position:absolute;left:0;top:6px;width:13px;height:7px;border-left:2px solid var(--gruen);border-bottom:2px solid var(--gruen);transform:rotate(-45deg)}
.k-form .form-card{background:#fff;border:1px solid var(--grau-linie);border-radius:var(--radius);padding:38px;box-shadow:var(--schatten)}
.form-card .widget{margin-bottom:16px;display:flex;flex-direction:column}
.form-card label{font-family:var(--font-h);font-weight:600;font-size:14px;color:var(--blau-nacht);margin-bottom:7px}
.form-card .mandatory{color:var(--blau-hell)}
.form-card input[type=text],.form-card input[type=email],.form-card input[type=tel],.form-card select,.form-card textarea{font-family:var(--font-b);font-size:15.5px;padding:13px 15px;border:1.5px solid var(--grau-linie);border-radius:11px;background:#fcfdfe;color:var(--tinte);width:100%;transition:.18s}
.form-card textarea{resize:vertical;min-height:104px}
.form-card input:focus,.form-card select:focus,.form-card textarea:focus{outline:none;border-color:var(--blau);background:#fff;box-shadow:0 0 0 4px rgba(28,72,135,.10)}
.form-card .widget-checkbox{flex-direction:row;gap:12px;align-items:flex-start;margin:6px 0 20px}
.form-card .widget-checkbox > label{display:none}
.form-card .widget-checkbox .checkbox_container{display:flex;gap:12px;align-items:flex-start;border:0;padding:0}
.form-card .widget-checkbox input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--blau)}
.form-card .widget-checkbox label{font-family:var(--font-b);font-weight:400;font-size:13.5px;color:var(--grau);line-height:1.5;margin:0}
.form-card .widget-checkbox a{color:var(--blau);text-decoration:underline}
.form-card .widget-submit{margin-top:6px}
.form-card button[type=submit]{width:100%;font-family:var(--font-h);font-weight:600;font-size:17px;padding:18px 34px;border:0;border-radius:60px;background:var(--blau);color:#fff;cursor:pointer;box-shadow:0 10px 26px rgba(28,72,135,.32);transition:.22s ease}
.form-card button[type=submit]:hover{background:var(--blau-hell);transform:translateY(-2px)}
.form-card altcha-widget{--altcha-border-width:1.5px;--altcha-border-radius:11px;--altcha-color-border:var(--grau-linie);--altcha-max-width:100%;display:block;margin-bottom:20px}
.form-card .error,.form-card p.error{color:#c0392b;font-size:14px}

/* --- Footer --- */
#footer{background:var(--blau-nacht);color:#a9c0de;padding:66px 0 26px}
#footer .inside{max-width:var(--wrap);margin:0 auto;padding:0 26px;display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px}
#footer .ft-logo{grid-column:1;grid-row:1}
#footer .ft-logo img{height:38px;width:auto}
#footer .ft-intro{grid-column:1;grid-row:2}
#footer .ft-intro p{font-size:14.5px;color:#a9c0de;margin:0}
#footer .ft-col{grid-row:1/span 2}
#footer h5{font-family:var(--font-h);font-weight:700;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:#fff;margin-bottom:16px}
#footer ul{list-style:none;display:flex;flex-direction:column;gap:10px}
#footer a{color:#a9c0de;transition:.2s}
#footer a:hover{color:#fff}
#footer .ft-bottom{grid-column:1/-1;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;border-top:1px solid rgba(255,255,255,.10);padding-top:22px;margin-top:14px}
#footer .ft-bottom p{font-size:13.5px;color:#8ba5c6;margin:0}

/* --- Rechtstexte --- */
.mod_article.legal{padding:150px 0 90px}
.mod_article.legal h1{font-size:clamp(1.9rem,3.4vw,2.6rem);margin-bottom:24px}
.legal-pending{background:var(--blau-luft);border-radius:var(--radius-kl);padding:22px 26px}
.legal-pending p{margin:0;color:var(--tinte)}

/* --- Responsive --- */
@media(max-width:980px){
  #header .nav{position:fixed;inset:0;background:var(--blau-nacht);flex-direction:column;justify-content:center;display:none;margin:0;z-index:120}
  #header.nav-open .nav{display:flex}
  #header .nav ul{flex-direction:column;gap:26px;text-align:center}
  #header .nav a,#header.solid .nav a{color:#fff;font-size:1.35rem}
  #header .burger{display:flex;order:9;z-index:130}
  #header.nav-open .burger span{background:#fff}
  #header .hd-tel,#header .hd-cta-btn{display:none}
  .split .grid_start,.k-grid .grid_start,.oton-in .grid_start{grid-template-columns:1fr}
  .mod_article.band .band-txt{padding:60px 0 20px}
}
@media(max-width:720px){
  .mod_article.sec{padding:66px 0}
  .mod_article.kpi .ce_cp_column_start{border-right:0;border-bottom:1px solid rgba(255,255,255,.10)}
  .k-form .form-card{padding:26px 20px}
  #footer .inside{grid-template-columns:1fr}
  #footer .ft-col{grid-row:auto}
  .mod_article.hero{min-height:auto;padding:130px 0 0}
}

/* --- Doppelte Grids aufloesen ---------------------------------
   Die Vorlage definierte .usp-grid, .leist, .hallen, .k-grid, .split,
   .kpi-in und .oton-in selbst als Grid. In Contao uebernimmt das
   Clickpress-Gridset die Spalten (inneres .grid_start), deshalb wird
   der aeussere Container hier wieder zum Block. Sonst entsteht ein
   Grid im Grid und die Spalten schrumpfen auf Inhaltsbreite. */
.mod_article .usp-grid,
.mod_article .leist,
.mod_article .hallen,
.mod_article .k-grid,
.mod_article .kpi-in,
.mod_article .split,
.mod_article .oton-in{display:block;max-width:var(--wrap);margin-left:auto;margin-right:auto}
.usp-grid .grid_start{gap:22px}
.leist .grid_start{gap:20px}
.hallen .grid_start{gap:28px}
.k-grid .grid_start{gap:48px;align-items:start}
.split .grid_start{gap:56px;align-items:center}
.kpi-in .grid_start{gap:0}
.oton-in{max-width:920px}
.oton-in .grid_start{gap:46px;align-items:center}
.mod_article.band .split .grid_start{gap:0;align-items:stretch}

/* --- Karten ohne Icon: die Vorlage stellte Icon und Text nebeneinander --- */
.leist-card{display:block}
.leist-card h4{margin-bottom:8px}
.feat-list li{display:block}
.usp-card{padding:32px 26px}

/* --- Ueberschriften in Spalten (nicht nur direkte Article-Kinder) --- */
.mod_article h2{font-size:clamp(1.9rem,3.6vw,2.75rem);margin-bottom:16px}
.mod_article .leist-head h2{margin-bottom:10px}
.mod_article .hero-h1 h1{font-size:clamp(2.4rem,5.4vw,4.05rem);color:#fff;max-width:15ch;margin-bottom:22px}
.mod_article .hero-h1 h1 em{font-style:normal;color:var(--blau-hell)}

/* --- Mittige Section-Koepfe --- */
#warum > .tag,#warum > .content-text.tag,#warum > .content-headline,#warum > .sec-lead,
#flaechen > .tag,#flaechen > .content-headline,#flaechen > .sec-lead,
#leistungen > .tag,#leistungen > .sec-head-h2,#leistungen > .sec-lead{text-align:center}
#warum > .sec-lead p,#flaechen > .sec-lead p,#leistungen > .sec-lead p{margin-left:auto;margin-right:auto}

/* --- Familienbetrieb: Bild randlos in der Spalte --- */
.mod_article.band .band-img{position:relative;padding:0}
.mod_article.band .band-img .content-image,.mod_article.band .band-img figure,.mod_article.band .band-img img{height:100%}
.mod_article.band .band-img img{border-radius:0;object-fit:cover;box-shadow:none}
.mod_article.band .band-cap{position:absolute;left:0;right:0;bottom:0;padding:14px 20px;background:linear-gradient(to top,rgba(13,34,68,.85),transparent)}
.mod_article.band .band-cap p{margin:0;color:#fff}

/* --- Ansprechpartner-Karte (eigene Klassen, keine Kollision mit der Vorlage) --- */
.k-person{display:flex;align-items:center;gap:16px}
.k-person .k-ini{width:56px;height:56px;flex:none;border-radius:50%;background:var(--blau);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-h);font-weight:700;font-size:1.3rem}
.k-person .k-txt{display:flex;flex-direction:column}
.k-person .k-name{font-family:var(--font-h);font-weight:700;font-size:1.15rem;color:var(--blau-nacht)}
.k-person .k-rolle{font-size:14.5px;color:var(--grau)}
.k-info .k-contact{list-style:none;display:flex;flex-direction:column;gap:12px;margin-top:18px}
.k-info .k-contact a{display:block;font-family:var(--font-h);font-weight:600;font-size:16px;color:var(--blau-nacht);padding:12px 16px;border-radius:11px;background:#fff;border:1px solid var(--grau-linie);transition:.2s}
.k-info .k-contact a:hover{background:var(--blau-luft);color:var(--blau)}
.k-info .k-usps{list-style:none}

/* --- Familienbetrieb: Gesichter muessen im Ausschnitt bleiben --- */
.mod_article.band .band-img img{object-position:center top}
@media(min-width:981px){
  .mod_article.band .band-img{min-height:420px}
}

/* --- Feinschliff --- */
.mod_article.band .band-img img{object-position:center top}
.form-card .widget-checkbox legend,.form-card fieldset legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.form-card fieldset{border:0;padding:0;margin:0}

/* --- Grid-Kinder duerfen schrumpfen (sonst Overflow auf schmalen Viewports) --- */
[class*=grid_] > *{min-width:0}
.halle,.usp-card,.leist-card{min-width:0}

/* --- Formularkopf und Schlusshinweis (Contao-Feldtyp Erklaerung) --- */
.form-card .explanation h3{font-size:1.4rem;margin-bottom:6px}
.form-card .explanation .fh{font-size:15px;color:var(--grau);margin-bottom:26px}
.form-card .explanation .fh .req{color:var(--blau-hell)}
.form-card .explanation .form-note{font-size:12.5px;color:var(--grau);text-align:center;margin-top:14px}
.form-card .widget-explanation{margin-bottom:0}

/* --- Feste CTA-Leiste auf dem Handy --- */
#footer .mcta{display:none}
@media(max-width:720px){
  #footer .mcta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:90;background:rgba(255,255,255,.97);box-shadow:0 -2px 20px rgba(18,47,90,.14);padding:10px 14px;margin:0;max-width:none}
  #footer .mcta p{display:flex;gap:10px;margin:0}
  #footer .mcta a{flex:1;justify-content:center;display:inline-flex;align-items:center;font-family:var(--font-h);font-weight:600;font-size:15px;padding:13px 10px;border-radius:60px;text-align:center}
  #footer .mcta .btn-line{background:#fff;color:var(--blau);border:2px solid var(--grau-linie)}
  #footer .mcta .btn-primary{background:var(--blau);color:#fff}
  body{padding-bottom:76px}
}

/* --- Icons (Bootstrap Icons per Insert-Tag) --- */
.usp-card .usp-ic,.leist-card .leist-ic{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:13px;background:var(--blau-luft);color:var(--blau);font-size:22px;margin-bottom:18px}
.leist-card .leist-ic{width:44px;height:44px;background:var(--blau-nacht);color:#fff;font-size:19px;margin-bottom:14px}
.feat-list li{position:relative;padding-left:46px}
.feat-list .fic{position:absolute;left:0;top:2px;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;background:var(--blau-luft);color:var(--blau);font-size:15px}
.adr-wrap .adr{position:relative;padding-left:52px}
.adr-wrap .adr > .bi{position:absolute;left:22px;top:22px;color:var(--blau);font-size:17px}
.k-info .k-contact a .bi,.k-info .k-contact a i{color:var(--blau);margin-right:8px}
#footer .ft-contact .bi{color:#8ba5c6;margin-right:8px}
.hero-trust .t .ic{margin-right:8px;color:var(--blau-hell)}
#footer .mcta .bi{margin-right:7px}

/* --- Familienbetrieb: Bild proportional, beide Gesichter bleiben im Bild --- */
.mod_article.band .band-img{min-height:0;align-self:stretch;display:flex;align-items:center}
.mod_article.band .band-img .content-image{width:100%}
.mod_article.band .band-img img{height:auto;aspect-ratio:1000/821;object-fit:cover;object-position:center}
.mod_article.band .split .grid_start{align-items:center}
/* Die Vorlage setzte .band-img auf width:50% (absolut positioniert). In Contao ist
   es eine Grid-Spalte und muss die volle Spaltenbreite einnehmen. */
.mod_article.band .band-img{width:100%;position:relative;right:auto;top:auto}

/* ============================================================
   Hero auf das Original-Layout zurueckgefuehrt
   Die Vorlage schachtelte .hero > .wrap > .hero-in: ein 660 px breiter
   Textblock, rechtsbuendig ueber dem Bild. In Contao liegen die Elemente
   direkt im Article, deshalb wird der Block hier ueber Innenabstand gesetzt.
   ============================================================ */
.mod_article.hero{min-height:78vh;padding:104px 0 42px;display:flex;flex-direction:column;justify-content:center}
.mod_article.hero > .hero-bg{position:absolute;inset:0;z-index:0;max-width:none;padding:0;margin:0}
.mod_article.hero > .hero-bg figure{height:100%}
.mod_article.hero > .hero-bg img{height:100%;opacity:1;object-fit:cover;object-position:left center}
.mod_article.hero > .hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(260deg,#0a1c39 0%,#0a1c39 30%,rgba(10,28,57,.9) 50%,rgba(12,32,66,.55) 100%)}
.mod_article.hero > *:not(.hero-bg){position:relative;z-index:1;width:100%;max-width:var(--wrap);margin-left:auto;margin-right:auto;padding-right:26px;padding-left:max(26px,calc(min(var(--wrap),100vw) - 686px))}
.mod_article.hero .hero-h1 h1{font-size:clamp(2.3rem,5.1vw,3.75rem);color:#fff;max-width:none;margin-bottom:16px;font-weight:800}
.mod_article.hero .hero-h1 h1 em{font-style:normal;color:#8ec0ff}
.mod_article.hero .eyebrow{margin-bottom:18px}
.mod_article.hero .eyebrow p{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-h);font-weight:600;font-size:14.5px;color:rgba(255,255,255,.92);margin:0}
.mod_article.hero .hero-sub{margin-bottom:26px}
.mod_article.hero .hero-sub p{font-size:clamp(1.03rem,1.6vw,1.19rem);color:rgba(255,255,255,.9);max-width:640px;line-height:1.55;margin:0}
.mod_article.hero .hero-cta{margin-bottom:28px}
.mod_article.hero .hero-cta p{display:flex;gap:14px;flex-wrap:wrap;margin:0}
.mod_article.hero .hero-trust-wrap{padding-bottom:0}
.mod_article.hero .hero-trust{margin:0}
@media(max-width:980px){
  .mod_article.hero > *:not(.hero-bg){padding-left:26px}
  .mod_article.hero{min-height:auto;padding:120px 0 48px}
}

/* --- Sektionskoepfe: die Vorlage begrenzte .sec-head auf 720 px --- */
.mod_article.sec > .tag,.mod_article.sec > .content-headline,.mod_article.sec > .sec-lead,.mod_article.sec > .sec-head-h2{max-width:calc(720px + 52px)}
#warum > .tag,#warum > .content-headline,#warum > .sec-lead,
#flaechen > .tag,#flaechen > .content-headline,#flaechen > .sec-lead,
#leistungen > .tag,#leistungen > .sec-head-h2,#leistungen > .sec-lead{margin-left:auto;margin-right:auto}
.mod_article.sec > .sec-lead{margin-bottom:52px}

/* --- Tag als Block, die Optik traegt der Absatz darin --- */
.mod_article .tag{display:block;margin-bottom:14px}
.mod_article .tag p{display:inline-block;font-family:var(--font-h);font-weight:700;font-size:13.5px;letter-spacing:.10em;text-transform:uppercase;color:var(--blau-hell);margin:0}
.mod_article.band .tag p,.mod_article.hero .tag p{color:#8ec0ff}

/* --- Kennzahlen: kein doppelter Innenabstand --- */
.mod_article.kpi .kpi-in{padding:0}
.mod_article.kpi .grid_start{padding:0}

/* --- Eyebrow als Block, damit der Textblock buendig sitzt --- */
.mod_article.hero .eyebrow{display:block}

/* --- Feinkorrektur gegen die freigegebene Fassung --- */
#header .inside{justify-content:space-between;gap:0}
#header .nav{margin:0}
#header .hd-tel{margin-left:auto;margin-right:16px}
#header .hd-cta-btn a{padding:15px 28px;font-size:16px}
.mod_article.kpi .kpi-in{padding:0 26px}
.mod_article.sec > .tag,.mod_article.sec > .content-headline,.mod_article.sec > .sec-lead,.mod_article.sec > .sec-head-h2{max-width:min(720px,100% - 52px)}
#header .inside{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:0}
#header .nav{justify-self:center}
#header .hd-tel{margin:0 20px 0 0}
.mod_article .sec-lead p{max-width:none}
.mod_article.sec > .tag,.mod_article.sec > .content-headline,.mod_article.sec > .sec-lead,.mod_article.sec > .sec-head-h2{padding-left:0;padding-right:0}
#header .hd-tel a .bi,#header .hd-tel a i{margin-right:8px;color:inherit;font-size:15px}

/* ============================================================
   Abgleich gegen die freigegebene Fassung (Messpunkte 1440 px)
   ============================================================ */

/* Familienbetrieb: Bildhaelfte laeuft im Original bis zum Bildschirmrand */
.mod_article.band .split{max-width:none}
.mod_article.band .grid_start{max-width:none;margin:0;padding:0;gap:0}
.mod_article.band .band-txt{padding:86px max(26px,calc((100vw - 1148px)/2)) 86px max(26px,calc((100vw - 1148px)/2))}
.mod_article.band .band-txt{padding-right:56px}
.mod_article.band h2{font-size:clamp(1.9rem,3.4vw,2.5rem)}
.mod_article.band .band-img img{aspect-ratio:auto;height:100%;min-height:420px}

/* O-Ton: im Original ein 920 px breiter, zentrierter Block */
.mod_article.oton{padding:82px 0}
.mod_article.oton .grid_start{max-width:920px;margin:0 auto;gap:46px}
.oton-quote{font-size:clamp(1.2rem,2.2vw,1.62rem)}

/* Kontakt: Spaltenverhaeltnis der Vorlage */
.k-grid .grid_start{grid-template-columns:.92fr 1.08fr}
.k-info h2{font-size:clamp(1.9rem,3.4vw,2.6rem)}

/* Standort */
#standort h2{font-size:clamp(1.9rem,3.4vw,2.5rem)}

/* Hinweiskasten unter den Hallen */
.hallen-note{max-width:min(1148px,100% - 52px);padding:0}

/* Hallen-Karten: Titelgroesse wie in der Vorlage */
.halle .halle-body h3{font-size:1.4rem;margin-bottom:4px}

/* Footer: Farbe und Hoehe der Vorlage */
#footer{background:#081b38;padding:60px 0 24px}
#footer .inside{gap:34px 40px}
#footer .ft-bottom{margin-top:6px;padding-top:20px}
.mod_article.band > .split{padding:0;max-width:none}

/* CTA im Header: die Optik traegt das Contao-Element (.btn), der Link darin
   darf kein zweites Mal Innenabstand bekommen. */
#header .hd-cta-btn{display:inline-flex;align-items:center;justify-content:center;padding:15px 28px;border-radius:60px;background:var(--blau);box-shadow:0 10px 26px rgba(28,72,135,.32);transition:.22s ease;white-space:nowrap}
#header .hd-cta-btn:hover{background:var(--blau-hell)}
#header .hd-cta-btn a{padding:0;background:none;box-shadow:none;color:#fff;font-family:var(--font-h);font-weight:600;font-size:16px;line-height:1.2}

/* Slider-Punkte: feste Groesse, sonst zieht der Flex-Container sie in die Breite */
.halle-img .halle-dots{align-items:center}
.halle-img .halle-dots button{flex:0 0 auto;width:7px;height:7px;min-width:0;padding:0;border:0;appearance:none;border-radius:50%;line-height:0}
.halle-img .halle-dots button.active{width:20px;border-radius:5px}
#header .hd-cta-btn{min-height:60px}

/* ============================================================
   Responsive: Reihenfolge zaehlt. Diese Regeln stehen bewusst am Ende,
   damit sie die Basis-Styles ueberschreiben.
   ============================================================ */
@media(max-width:980px){
  #header .inside{grid-template-columns:auto 1fr auto;gap:0}
  #header .hd-tel,#header .hd-cta-btn{display:none!important}
  #header .burger{display:flex;justify-self:end;order:9}
  .mod_article.hero > *:not(.hero-bg){padding-left:max(26px,calc(min(var(--wrap),100vw) - 686px))}
}
@media(max-width:720px){
  .mod_article.hero > *:not(.hero-bg){padding-left:26px}
}

/* Das Clickpress-Gridset definiert seine Mobile-Spalten erst ab 576 px.
   Darunter greift ein Ein-Spalten-Fallback, deshalb hier die Werte der Vorlage. */
/* Das Gridset kennt keine Fuenf-Spalten-Variante fuer Tablet, deshalb hier gesetzt */
.kpi-in .grid_start{grid-template-columns:repeat(5,1fr)}
@media(max-width:720px){
  .kpi-in .grid_start{grid-template-columns:1fr 1fr}
}
/* Das Spaltenverhaeltnis der Kontakt-Sektion gilt nur auf dem Desktop */
.k-grid .grid_start{grid-template-columns:1fr}
@media(min-width:981px){
  .k-grid .grid_start{grid-template-columns:.92fr 1.08fr}
}
@media(max-width:720px){
  #footer .inside{padding-left:26px;padding-right:26px}
}

/* ============================================================
   Mobiles Menue: das Overlay muss den Bildschirm fuellen. Als Grid-Kind
   des Headers schrumpfte es sonst auf die Breite seiner Rasterspalte.
   ============================================================ */
@media(max-width:980px){
  #header .nav{position:fixed;top:0;left:0;width:100vw;height:100dvh;justify-self:stretch;align-self:start;margin:0;
    background:var(--blau-nacht);display:none;flex-direction:column;align-items:center;justify-content:center;z-index:120}
  #header.nav-open .nav{display:flex}
  #header .nav ul{flex-direction:column;align-items:center;gap:26px;width:100%;padding:0}
  #header .nav li{text-align:center}
  #header .nav a,#header.solid .nav a{color:#fff;font-size:1.35rem;font-family:var(--font-h);font-weight:600}
  #header .burger{z-index:130;justify-self:end}
  #header.nav-open .burger span{background:#fff}
  #header.nav-open .burger span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  #header.nav-open .burger span:nth-child(2){opacity:0}
  #header.nav-open .burger span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
  /* Telefon und CTA erscheinen im geoeffneten Menue unter der Navigation */
  #header.nav-open .hd-tel{display:block!important;position:fixed;left:0;right:0;top:auto;bottom:22%;text-align:center;z-index:121}
  #header.nav-open .hd-tel a{color:#fff;font-size:1.05rem}
  #header.nav-open .hd-cta-btn{display:inline-flex!important;position:fixed;left:50%;transform:translateX(-50%);bottom:13%;z-index:121}
}

/* Hervorhebung in Zwischenueberschriften wie in der Vorlage */
.mod_article h2 em,.mod_article h3 em{font-style:normal;color:var(--blau-hell)}
/* Leistungs-Icons in derselben hellen Blaufläche wie die USP-Karten */
.leist-card .leist-ic{background:var(--blau-luft);color:var(--blau)}

/* Abstand zwischen Einleitung und Ansprechpartner-Karte wie in der Vorlage */
.k-info > .content-text{margin-bottom:30px}
.k-info > .content-text:last-child{margin-bottom:0}
.k-info > .tag{margin-bottom:14px}
.k-info h2{margin-bottom:16px}

/* O-Ton auf dem Handy: untereinander und zentriert wie in der Vorlage */
@media(max-width:720px){
  .mod_article.oton .grid_start{gap:24px;text-align:center}
  .mod_article.oton .oton-portrait img{margin-left:auto;margin-right:auto}
}

/* --- Formular: Zweispaltigkeit bis 720 px wie in der Vorlage --- */
@media(min-width:721px){
  .form-card .grid_start{grid-template-columns:1fr 1fr;gap:16px}
}
@media(max-width:720px){
  .form-card .grid_start{grid-template-columns:1fr}
}
/* Contao setzt die Klasse mandatory auf das Label selbst, nur der Stern soll blau sein */
.form-card label.mandatory,.form-card fieldset.mandatory legend{color:var(--blau-nacht)}
.form-card label .mandatory,.form-card legend .mandatory{color:var(--blau-hell);margin-left:3px}
.form-card .widget{margin-bottom:16px}

/* --- Footer: Copyright links, Umsetzung rechts --- */
#footer .ft-bottom .rte{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;width:100%}
#footer .ft-bottom p{margin:0}
@media(max-width:720px){
  .mod_article.oton .oton-portrait figure{margin-left:auto;margin-right:auto;width:184px}
}
@media(max-width:720px){
  .mod_article.oton .oton-portrait{width:132px;height:132px}
  .mod_article.oton .oton-portrait .content-image{display:flex;justify-content:center;width:100%;height:100%}
  .mod_article.oton .oton-portrait figure{width:100%;height:100%}
}
/* Die Vorlage gab .oton-portrait eine feste Breite fuers Flex-Layout */
.mod_article.oton .oton-portrait{width:184px;flex:none;justify-self:center}
.mod_article.oton .oton-portrait img{width:100%;height:100%;object-fit:cover}
@media(min-width:721px){.mod_article.oton .oton-portrait{width:184px;height:184px}}
@media(max-width:720px){.mod_article.oton .oton-portrait{width:132px;height:132px}}

/* Mehr Luft um den Hero-Text auf Tablet und Handy */
@media(max-width:980px){
  .mod_article.hero{padding:144px 0 64px}
  .mod_article.hero .hero-sub{margin-bottom:30px}
}
@media(max-width:720px){
  .mod_article.hero{padding:132px 0 56px}
  .mod_article.hero > *:not(.hero-bg){padding-left:32px;padding-right:32px}
  .mod_article.hero .eyebrow{margin-bottom:22px}
  .mod_article.hero .hero-cta{margin-bottom:32px}
}

/* ============================================================
   Mobiles Menue nach dem Vorbild der Vorlage: Inhalt oben,
   Punkte linksbuendig mit Trennlinien, darunter CTA und Telefon.
   ============================================================ */
@media(max-width:980px){
  #header .hd-logo{position:relative;z-index:130}
  #header .nav{justify-content:flex-start;align-items:stretch;padding:104px 26px 40px;overflow-y:auto}
  #header .nav ul{width:100%;gap:0;align-items:stretch}
  #header .nav li{text-align:left;border-bottom:1px solid rgba(255,255,255,.13)}
  #header .nav a{display:block;padding:22px 0;font-size:1.25rem;text-align:left}
  #header .nav .hd-cta-btn{display:none}
  #header.nav-open .nav .hd-cta-btn{display:flex!important;position:static;transform:none;width:100%;margin-top:30px;justify-content:center}
  #header .nav .hd-tel{display:none}
  #header.nav-open .nav .hd-tel{display:block!important;position:static;margin-top:18px;text-align:left}
  #header.nav-open .nav .hd-tel a{color:var(--blau-hell);font-size:1.05rem;display:inline-flex;align-items:center}
}

/* O-Ton: Portrait und Zitat bleiben bis 720 px nebeneinander wie in der Vorlage */
@media(min-width:721px){
  .mod_article.oton .grid_start{grid-template-columns:184px 1fr;align-items:center;gap:46px}
}
@media(max-width:980px){
  #header.nav-open .nav .hd-tel{margin:18px 0 0}
  #header.nav-open .nav .hd-tel p{margin:0}
}

/* Hero behaelt auch auf Tablet und Handy die Hoehe der Vorlage (78vh) */
@media(max-width:980px){
  .mod_article.hero{min-height:78vh}
}
@media(max-width:720px){
  .mod_article.hero{min-height:78vh}
}
/* Punkte mittig unter das Bild setzen: left/right 0 wird im Grid-Kontext verschoben */
.halle-img .halle-dots{left:50%;right:auto;transform:translateX(-50%);width:auto}

/* Footer: E-Mail als eigene Zeile, startet in der Flucht der Kontaktspalte (19.08.2026) */
#footer .ft-mail{grid-column:2/-1;margin-top:4px}
#footer .ft-mail p{margin:0;color:#a9c0de;line-height:1.5}
#footer .ft-mail a{color:#a9c0de;word-break:break-word}
#footer .ft-mail a:hover{color:#fff}
#footer .ft-mail .bi{color:#8ba5c6;margin-right:8px}
@media(max-width:720px){
  #footer .ft-mail{grid-column:1/-1}
}

/* Hallen-Specs: Spaltenzahl richtet sich nach der verfuegbaren Breite der Karte,
   damit Werte wie "Lagerhoehe bis 11,00 m" nie mitten im Wert umbrechen (20.08.2026).
   Zwei Spalten nur, wenn je Spalte mindestens 165 px Platz sind. */
#main .halle-specs{grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:10px 18px}
#main .halle-specs li b{white-space:nowrap}