:root { --primary:#0d3791; --secondary:#eef4ff; --accent:#0f172a; --button-radius:4px; --card-radius:16px; --card-shadow:none; --card-pad:26px; --grid-gap:24px; --section-bg:transparent; --section-border:none; --section-shadow:none; --container-width:1450px; --container-padding:36px; --widget-gap-horizontal:24px; --widget-gap-vertical:36px; --widget-gap:24px; --logo-height:70px; --logo-max-width:220px; --bg:#f3f6fb; --body-background:#f3f6fb; --hero-background:#eef4ff; --footer-background:#0f172a; --header-background:rgba(255,255,255,0.88);--header-background-solid:#ffffff; --header-text:#0f172a; --header-border:rgba(219,227,239,.85); --header-shadow:0 8px 28px rgba(15,23,42,.045); --transition:.24s ease; --button-hover-transform:translateY(-2px); --button-hover-filter:none; --card-border-width:1px; --card-border-color:#dbe3ef; --active-menu-color:#0d3791; --active-menu-text:#ffffff; --active-menu-line-width:3px; --active-menu-radius:0px; --nav-hover-color:#0d3791; --nav-hover-text:#ffffff; --nav-hover-radius:0px; --submenu-radius:0px; --text:#0f172a; --hero-text:#0f172a; --hero-badge-bg:rgba(255,255,255,.16); --footer-auto-text:#ffffff; --muted:#64748b; --card:#ffffff; --line:#dbe3ef; --soft:#eef4ff; --shadow:0 18px 45px rgba(15,23,42,.10); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
html, body { overflow-x:hidden; }
html { scrollbar-gutter: stable; }
body { margin:0; font-family:"Segoe UI", "Segoe UI", Arial, Helvetica, sans-serif; color:var(--text); background:var(--body-background); line-height:1.65; }
a { color:inherit; }
.container { width:min(var(--container-width), calc(100% - var(--container-padding))); margin:0 auto; }
.section-fullwidth { width:100vw !important; max-width:none !important; margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important; border-left:0 !important; border-right:0 !important; border-radius:0 !important; }
.section-fullwidth > .container { width:min(var(--container-width), calc(100% - var(--container-padding))); margin-left:auto; margin-right:auto; }
/* Step 877: Die widgetbezogene Auswahl „Volle Browserbreite“ betrifft nicht
   nur die äußere Section-Fläche, sondern auch den eigentlichen Widget-Inhalt.
   Der globale responsive Seitenabstand bleibt erhalten; die feste zentrale
   Websitebreite wird für diesen Widget-Abschnitt jedoch aufgehoben. */
.section-fullwidth.cms-widget-browser-fullwidth > .container {
  width:calc(100% - var(--container-padding)) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.hero.section-fullwidth, .section-fullwidth.hero { padding-left:0 !important; padding-right:0 !important; }
.hero.section-fullwidth .hero-grid, .section-fullwidth.hero .hero-grid { width:min(var(--container-width), calc(100% - var(--container-padding))); max-width:none; margin-left:auto; margin-right:auto; padding-left:0; padding-right:0; }
.hero.hero-fullwidth.section-fullwidth .hero-grid, .section-fullwidth.hero.hero-fullwidth .hero-grid { width:min(1480px, calc(100% - var(--container-padding))); }
.header { position:relative; top:auto; z-index:20; background:var(--header-background); backdrop-filter:blur(16px); border-bottom:1px solid var(--header-border); box-shadow:var(--header-shadow); }
body.nav-layout-vertikal-links { --side-nav-width:260px; --vertical-content-offset:clamp(24px, 3vw, 48px); }
body.nav-layout-vertikal-links .header,
body.nav-layout-vertikal-links .header.sticky { position:fixed; top:0; left:0; bottom:0; right:auto; width:var(--side-nav-width); height:100vh; z-index:1000; border-bottom:0; border-right:1px solid var(--header-border); overflow-y:auto; }
body.nav-layout-vertikal-links .header + main { padding-top:0 !important; }
body.nav-layout-vertikal-links .nav { width:100%; min-height:100%; flex-direction:column !important; align-items:stretch; justify-content:flex-start; padding:24px 18px; gap:22px; }
body.nav-layout-vertikal-links .nav .logo { width:100%; justify-content:flex-start; }
body.nav-layout-vertikal-links .nav .menu { width:100%; display:flex; justify-content:flex-start; margin:0; }
body.nav-layout-vertikal-links .menu-list { width:100%; flex-direction:column; align-items:stretch; gap:8px; }
body.nav-layout-vertikal-links .menu-list a { display:block; width:100%; padding:10px 12px; border-radius:12px; }
body.nav-layout-vertikal-links main,
body.nav-layout-vertikal-links .hero,
body.nav-layout-vertikal-links .hero-banner,
body.nav-layout-vertikal-links .site-footer { margin-left:var(--side-nav-width); width:calc(100% - var(--side-nav-width)); }
body.nav-layout-vertikal-links .hero > .container,
body.nav-layout-vertikal-links .hero .hero-grid,
body.nav-layout-vertikal-links .widget-section > .container,
body.nav-layout-vertikal-links main > .container,
body.nav-layout-vertikal-links .site-footer > .container { margin-left:var(--vertical-content-offset); margin-right:auto; width:min(var(--container-width), calc(100% - var(--container-padding) - var(--vertical-content-offset))); }
body.nav-layout-vertikal-links .section-fullwidth { width:calc(100vw - var(--side-nav-width)) !important; margin-left:0 !important; margin-right:0 !important; }
body.nav-layout-vertikal-links .section-fullwidth > .container { margin-left:var(--vertical-content-offset); margin-right:auto; }

/* Step 329/330: optional einklappbare vertikale Navigation auf Desktop, weich animiert. */
@media (min-width:821px) {
 body.nav-layout-vertikal-links.vertical-menu-collapsible { transition: none; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible .menu-toggle { display:inline-flex; flex:0 0 auto; margin:0; color:var(--header-text); }
 body.nav-layout-vertikal-links.vertical-menu-collapsible .nav { position:relative; flex-direction:row !important; flex-wrap:wrap; align-content:flex-start; align-items:center; column-gap:10px; row-gap:22px; transition:padding 280ms ease, gap 280ms ease; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible .nav .logo { width:auto; min-width:0; flex:1 1 0; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible .nav .menu { flex:0 0 100%; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible .header,
 body.nav-layout-vertikal-links.vertical-menu-collapsible .header.sticky { transition:width 280ms ease; will-change:width; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible main,
 body.nav-layout-vertikal-links.vertical-menu-collapsible .hero,
 body.nav-layout-vertikal-links.vertical-menu-collapsible .hero-banner,
 body.nav-layout-vertikal-links.vertical-menu-collapsible .site-footer { transition:margin-left 280ms ease, width 280ms ease; will-change:margin-left,width; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible .nav .logo,
 body.nav-layout-vertikal-links.vertical-menu-collapsible .nav .menu { transition:opacity 180ms ease, transform 220ms ease, visibility 0s linear 0s; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed { --side-nav-width:76px; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed .header,
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed .header.sticky { width:var(--side-nav-width); overflow:hidden; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed .nav { padding:18px 12px; align-items:center; gap:10px; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed .menu-toggle { margin:0 auto; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed .nav .logo,
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed .nav .menu { opacity:0; transform:translateX(-10px); visibility:hidden; pointer-events:none; height:0; overflow:hidden; flex:0 0 0; width:0; }
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed main,
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed .hero,
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed .hero-banner,
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed .site-footer { margin-left:var(--side-nav-width) !important; width:calc(100% - var(--side-nav-width)) !important; }
 @media (prefers-reduced-motion: reduce) {
  body.nav-layout-vertikal-links.vertical-menu-collapsible .header,
  body.nav-layout-vertikal-links.vertical-menu-collapsible .header.sticky,
  body.nav-layout-vertikal-links.vertical-menu-collapsible main,
  body.nav-layout-vertikal-links.vertical-menu-collapsible .hero,
  body.nav-layout-vertikal-links.vertical-menu-collapsible .hero-banner,
  body.nav-layout-vertikal-links.vertical-menu-collapsible .site-footer,
  body.nav-layout-vertikal-links.vertical-menu-collapsible .nav,
  body.nav-layout-vertikal-links.vertical-menu-collapsible .nav .logo,
  body.nav-layout-vertikal-links.vertical-menu-collapsible .nav .menu { transition:none !important; }
 }
}

/* Layoutsystem 2.0 Phase 4: Sidebar-Layout gezielt vom normalen vertikalen Menü trennen. */
body.website-layout-sidebar-left { --side-nav-width:290px; --vertical-content-offset:clamp(28px, 3.4vw, 58px); }
body.website-layout-sidebar-left .header,
body.website-layout-sidebar-left .header.sticky { background:var(--header-background); box-shadow:var(--header-shadow); }
body.website-layout-sidebar-left .nav { padding:30px 22px; gap:24px; }
body.website-layout-sidebar-left .nav .logo { font-size:1.28rem; line-height:1.25; }
body.website-layout-sidebar-left .nav .site-logo { max-width:100%; object-fit:contain; }
body.website-layout-sidebar-left .menu-list { gap:10px; }
body.website-layout-sidebar-left .menu-list a { padding:11px 13px; font-weight:750; }
/* Layoutsystem 2.0 Phase 6: Inhaltslayout nur im Sidebar-Modus aufwerten.
   Standard/Klassisch bleibt unberuehrt. */
body.website-layout-sidebar-left main { padding:0; }
body.website-layout-sidebar-left main > .widget-section:first-child { margin-top:0; }
body.website-layout-sidebar-left .widget-section { margin-block:0; }
body.website-layout-sidebar-left .widget-section > .container,
body.website-layout-sidebar-left main > .container { max-width:1120px; }
body.website-layout-sidebar-left .hero .hero-grid { align-items:center; gap:clamp(28px, 4vw, 64px); }
body.website-layout-sidebar-left .hero img,
body.website-layout-sidebar-left .hero-banner img,
body.website-layout-sidebar-left .image-text img,
body.website-layout-sidebar-left .card img { border-radius:calc(var(--card-radius) + 6px); }
body.website-layout-sidebar-left .section-fullwidth > .container { max-width:1180px; }
/* Layoutsystem 2.0 Phase 7: Responsive-Verhalten nur fuer Sidebar-Layout.
   Standard/Klassisch und das normale vertikale Menue bleiben unveraendert. */
@media (max-width:1180px) and (min-width:821px) {
 body.website-layout-sidebar-left { --side-nav-width:250px; --vertical-content-offset:clamp(22px, 3vw, 42px); }
 body.website-layout-sidebar-left .nav { padding:24px 18px; }
 body.website-layout-sidebar-left .menu-list a { padding:10px 11px; font-size:.96rem; }
}
@media (max-width:980px) and (min-width:821px) {
 body.website-layout-sidebar-left { --side-nav-width:225px; --vertical-content-offset:24px; }
 body.website-layout-sidebar-left .nav { padding:22px 16px; gap:18px; }
 body.website-layout-sidebar-left .nav .logo { font-size:1.08rem; }
 body.website-layout-sidebar-left .menu-list { gap:7px; }
 body.website-layout-sidebar-left .menu-list a { padding:9px 10px; font-size:.92rem; }
 body.website-layout-sidebar-left .widget-section > .container,
 body.website-layout-sidebar-left main > .container { max-width:960px; }
}
@media (max-width:820px) {
 body.website-layout-sidebar-left { --side-nav-width:0px; --vertical-content-offset:0px; }
 body.website-layout-sidebar-left .header,
 body.website-layout-sidebar-left .header.sticky { position:relative !important; left:auto; right:auto; top:auto; bottom:auto; width:100%; height:auto; border-right:0; border-bottom:1px solid var(--header-border); overflow:visible; }
 body.website-layout-sidebar-left .header + main { padding-top:0 !important; }
 body.website-layout-sidebar-left main,
 body.website-layout-sidebar-left .hero,
 body.website-layout-sidebar-left .hero-banner,
 body.website-layout-sidebar-left .site-footer { margin-left:0 !important; width:auto !important; }
 body.website-layout-sidebar-left .nav { min-height:auto; padding:14px 0; flex-direction:row !important; align-items:center; flex-wrap:wrap; gap:10px; }
 body.website-layout-sidebar-left .nav .logo { width:auto; flex:1 1 auto; justify-content:flex-start; }
 body.website-layout-sidebar-left .nav .menu { display:none; flex:0 0 100%; width:100%; margin:8px 0 0 0; }
 body.website-layout-sidebar-left .nav.is-open .menu { display:flex; }
 body.website-layout-sidebar-left .menu-list { width:100%; flex-direction:column; align-items:stretch; gap:6px; }
 body.website-layout-sidebar-left .menu-list a { width:100%; padding:10px 12px; }
 body.website-layout-sidebar-left .hero > .container,
 body.website-layout-sidebar-left .hero .hero-grid,
 body.website-layout-sidebar-left .widget-section > .container,
 body.website-layout-sidebar-left main > .container,
 body.website-layout-sidebar-left .site-footer > .container { margin-left:auto !important; margin-right:auto !important; width:min(var(--container-width), calc(100% - var(--container-padding))) !important; max-width:none; }
 body.website-layout-sidebar-left .section-fullwidth { width:100vw !important; margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important; }
 body.website-layout-sidebar-left .section-fullwidth > .container { margin-left:auto !important; margin-right:auto !important; }
 body.website-layout-sidebar-left main { padding:24px 0 44px; }
}
.nav { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:var(--grid-gap); }
.menu-toggle { display:none; border:1px solid var(--header-border); background:rgba(127,127,127,.12); color:var(--header-text); border-radius:12px; width:44px; height:40px; align-items:center; justify-content:center; font-size:1.45rem; font-weight:850; line-height:1; cursor:pointer; }
.menu-toggle-icon { position:relative; width:20px; height:16px; display:inline-block; pointer-events:none; }
.menu-toggle-icon span { position:absolute; left:0; width:20px; height:2px; border-radius:999px; background:currentColor; transform-origin:center; transition:top .22s ease, transform .22s ease, opacity .16s ease; }
.menu-toggle-icon span:nth-child(1) { top:0; }
.menu-toggle-icon span:nth-child(2) { top:7px; }
.menu-toggle-icon span:nth-child(3) { top:14px; }
.menu-toggle[aria-expanded="true"] .menu-toggle-icon span:nth-child(1) { top:7px; transform:rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-toggle-icon span:nth-child(2) { opacity:0; transform:scaleX(.25); }
.menu-toggle[aria-expanded="true"] .menu-toggle-icon span:nth-child(3) { top:7px; transform:rotate(-45deg); }
@media (prefers-reduced-motion:reduce) {
 .menu-toggle-icon span { transition:none; }
}

.nav-logo-links { flex-direction:row; }
.nav-logo-rechts { flex-direction:row-reverse; }
.nav-logo-zentriert { flex-direction:column; justify-content:center; gap:14px; }
.nav-menu-links .menu { justify-content:flex-start; margin-right:auto; }
.nav-menu-zentriert .menu { justify-content:center; margin-left:auto; margin-right:auto; }
.nav-menu-rechts .menu { justify-content:flex-end; margin-left:auto; }
.header.sticky { position:fixed; top:0; left:0; right:0; width:100%; z-index:1000; }
.header.below-hero-header { position:relative; z-index:999; }
.header.below-hero-header.sticky { position:relative; top:auto; left:auto; right:auto; width:100%; }
.header.below-hero-header.is-stuck { position:fixed; top:0; left:0; right:0; width:100%; z-index:1000; }
.below-hero-header-spacer { display:none; height:0; }
.below-hero-header-spacer.is-active { display:block; }
.header:not(.sticky) { position:relative; top:auto; }
.header.sticky + main { padding-top:78px; }
.header.below-hero-header.sticky + main { padding-top:0; }
.header-kompakt.sticky + main { padding-top:56px; }
.header-klassisch.sticky + main { padding-top:78px; }
.header-breit.sticky + main { padding-top:104px; }
.header-kompakt.sticky + .hero, .header-kompakt.sticky + .hero-banner { margin-top:56px; }
.header-klassisch.sticky + .hero, .header-klassisch.sticky + .hero-banner { margin-top:78px; }
.header-breit.sticky + .hero, .header-breit.sticky + .hero-banner { margin-top:104px; }
.header-kompakt.sticky + main [id] { scroll-margin-top:72px; }
.header-klassisch.sticky + main [id] { scroll-margin-top:94px; }
.header-breit.sticky + main [id] { scroll-margin-top:120px; }
body.nav-layout-vertikal-links main [id] { scroll-margin-top:16px; }
.header-kompakt .nav { min-height:56px; }
.header-klassisch .nav { min-height:78px; }
.header-breit .nav { min-height:104px; }

/* Abschnittsstile wurden entfernt. Inhaltsbereiche verwenden dauerhaft
   das bisherige klassische Layout ohne zusätzliche Hauptkarte oder Außenabstände. */

/* Klassischer Hero: automatische Textfarbe aus dem Designsystem. */
.hero:not(.hero-overlay-fullwidth) :where(h1,h2,h3,h4,p,span,small,strong,a,div) {
 color:var(--hero-text) !important;
}
.hero:not(.hero-overlay-fullwidth) .eyebrow,
.hero:not(.hero-overlay-fullwidth) .badge,
.hero:not(.hero-overlay-fullwidth) .pill {
 color:var(--hero-text) !important;
 border-color:color-mix(in srgb, var(--hero-text) 28%, transparent);
}



/* Layout & Abstände / Design-System: Widget-Karten nutzen --card-radius, --card-pad und --card-shadow */
.section { padding:calc(var(--widget-gap-vertical) / 2) 0; }
.widget-section { padding:calc(var(--widget-gap-vertical) / 2) 0 !important; }
.widget-row { column-gap:var(--widget-gap-horizontal) !important; row-gap:var(--widget-gap-vertical) !important; margin-bottom:0 !important; }
.widget-row:last-child { margin-bottom:0 !important; }
.card, .widget-plain { padding:var(--card-pad); }


@media (max-width:760px) {
 .widget-row { grid-template-columns:1fr !important; }
 .widget-row.has-horizontal-spacing { display:flex !important; flex-wrap:wrap; }
 .widget-row.has-horizontal-spacing > .spacing-horizontal-slot { max-width:100%; }
 .widget-slot { grid-column:1 / -1 !important; }
}

/* Step 990: Smartphone-Textbreite tatsächlich freigeben.
   Die spätere <=820px-Regel setzt .container fest auf 100%-28px und hatte die
   Step-989-Variable deshalb wirkungslos gemacht. Auf echten Smartphones wird
   die tatsächlich wirksame Containerbreite nun auf 100%-20px gesetzt
   (= ca. 10px Außenrand je Seite). Zusätzlich erhalten textlastige
   Abschnittsüberschriften mit eigener Oberfläche statt 34px nur 18px
   horizontalen Innenabstand. Desktop und Tablet bleiben unverändert. */
@media (max-width:820px) {
 /* Step 992: Auf Tablet und Smartphone ist die Kopfzeile ein eigener,
    stabiler Bereich über der Headergrafik. Sticky bleibt möglich, liegt aber
    im normalen Seitenfluss. Dadurch verschiebt oder überlagert die Navigation
    die Headergrafik nicht mehr. */
 .header,
 .header.sticky,
 .header.header-kompakt.sticky,
 .header.header-klassisch.sticky,
 .header.header-breit.sticky {
   position:sticky !important;
   top:0 !important;
   left:auto !important;
   right:auto !important;
   width:100% !important;
   height:auto !important;
   z-index:1000;
   overflow:visible !important;
 }
 .header .nav {
   position:relative;
   min-height:72px !important;
   padding-top:10px !important;
   padding-bottom:10px !important;
 }
 .header.sticky + main,
 .header.header-kompakt.sticky + main,
 .header.header-klassisch.sticky + main,
 .header.header-breit.sticky + main {
   padding-top:0 !important;
 }
 .header.sticky + .hero,
 .header.sticky + .hero-banner,
 .header.header-kompakt.sticky + .hero,
 .header.header-kompakt.sticky + .hero-banner,
 .header.header-klassisch.sticky + .hero,
 .header.header-klassisch.sticky + .hero-banner,
 .header.header-breit.sticky + .hero,
 .header.header-breit.sticky + .hero-banner {
   margin-top:0 !important;
 }
 .header.below-hero-header,
 .header.below-hero-header.sticky,
 .header.below-hero-header.is-stuck {
   position:sticky !important;
   top:0 !important;
   left:auto !important;
   right:auto !important;
   width:100% !important;

   /* Step 999: backdrop-filter erzeugt für position:fixed-Nachfahren
      einen eigenen Bezugskontext. Beim Header UNTERHALB der Hero-Grafik
      wurde die viewportbezogene top-Position des Menüs deshalb nochmals
      ab Headerposition gerechnet. Das Menü landete deutlich zu tief.
      Mobil muss dieser Header deshalb für das Overlay neutral bleiben. */
   backdrop-filter:none !important;
   -webkit-backdrop-filter:none !important;
   filter:none !important;
   transform:none !important;
   perspective:none !important;
   contain:none !important;
   will-change:auto !important;
 }
 .below-hero-header-spacer,
 .below-hero-header-spacer.is-active {
   display:none !important;
   height:0 !important;
 }
 /* Step 994: Burger-Menü als echtes viewport-breites Overlay.
    Die Menüfläche ist nicht mehr an den schmaleren .container gebunden,
    sondern füllt die komplette verfügbare Browserbreite. Die obere Position
    wird beim Öffnen per JS an die reale Unterkante der Kopfzeile gekoppelt. */
 .header .nav .menu,
 body.nav-layout-vertikal-links .header .nav .menu {
   position:fixed !important;
   top:var(--cms-mobile-menu-top,72px) !important;
   left:0 !important;
   right:0 !important;
   width:100% !important;
   max-width:none !important;
   margin:0 !important;
   padding:10px 14px 14px !important;
   background:var(--header-background) !important;
   border-top:1px solid var(--header-border);
   border-bottom:1px solid var(--header-border);
   box-shadow:0 18px 34px rgba(15,23,42,.18);
   z-index:1001;
   max-height:calc(100vh - var(--cms-mobile-menu-top,72px)) !important;
   max-height:calc(100dvh - var(--cms-mobile-menu-top,72px)) !important;
   overflow-y:auto !important;
   overflow-x:hidden !important;
   overscroll-behavior:contain;
   -webkit-overflow-scrolling:touch;
 }
 .header .nav:not(.is-open) .menu,
 body.nav-layout-vertikal-links .header .nav:not(.is-open) .menu {
   display:none !important;
 }
 .header .nav.is-open .menu,
 body.nav-layout-vertikal-links .header .nav.is-open .menu {
   display:flex !important;
 }

 /* Step 998: Bei "Navigation unterhalb des Headers" ist das geöffnete Menü
    ein echtes, halbtransparentes Overlay. Es füllt die komplette
    Resthöhe unterhalb der mobilen Navigationsleiste bis zum Viewport-Ende.
    Der Inhalt darunter bleibt sichtbar, wird aber nicht verschoben; gescrollt wird nur im Menü. */
 .header.below-hero-header .nav.is-open .menu {
   /* Step 999: echtes Viewport-Overlay.
      top wird aus der realen Unterkante der mobilen Navigationsleiste
      berechnet, bottom:0 bindet das Menü direkt an den unteren Viewport.
      Keine abgeleiteten vh-Höhen mehr. */
   position:fixed !important;
   top:var(--cms-mobile-menu-top,72px) !important;
   bottom:0 !important;
   left:0 !important;
   right:0 !important;
   width:100vw !important;
   height:auto !important;
   min-height:0 !important;
   max-height:none !important;
   margin:0 !important;
   background:var(--header-background) !important;
   align-items:flex-start !important;
   align-content:flex-start !important;
   box-sizing:border-box !important;
   opacity:1 !important;
   overflow-y:auto !important;
   overflow-x:hidden !important;
   backdrop-filter:none !important;
   -webkit-backdrop-filter:none !important;
   z-index:2147483000 !important;
 }
 .header.below-hero-header .nav.is-open .menu-list {
   flex:0 0 auto;
   align-self:flex-start;
 }

 body.mobile-nav-open {
   overflow:hidden !important;
 }
 .header .menu-list {
   width:100%;
   max-height:none !important;
   overflow:visible !important;
   overscroll-behavior:contain;
 }

 /* Step 994: Untermenüs auf Smartphone/Tablet als Accordion.
    Sie sind standardmäßig geschlossen und öffnen sich nur beim Antippen
    des Pfeils. Dadurch bleibt auch eine umfangreiche Navigation übersichtlich. */
 .header .has-submenu > a {
   display:flex !important;
   align-items:center !important;
   gap:8px !important;
 }
 .header .submenu-marker {
   display:inline-flex !important;
   align-items:center !important;
   justify-content:center !important;
   flex:0 0 36px !important;
   width:36px !important;
   height:36px !important;
   margin-left:auto !important;
   border-radius:9px;
   cursor:pointer;
   user-select:none;
   color:inherit !important;
   background:rgba(127,127,127,.08);
   transition:background-color .18s ease, color .18s ease;
 }
 .header .submenu-marker .submenu-chevron {
   display:inline-block !important;
   font-size:1rem !important;
   line-height:1 !important;
   color:currentColor !important;
   transition:transform .18s ease, color .18s ease;
 }
 .header .menu-list a:hover .submenu-marker,
 .header .menu-list a:focus .submenu-marker,
 .header .submenu-marker:hover,
 .header .submenu-marker:focus {
   color:var(--nav-hover-text) !important;
   background:color-mix(in srgb,var(--nav-hover-text) 12%,transparent);
   outline:none;
 }
 .header .has-submenu > .submenu,
 body.nav-layout-vertikal-links .header .has-submenu > .submenu {
   display:none !important;
   position:static !important;
   opacity:1 !important;
   visibility:visible !important;
   transform:none !important;
   width:calc(100% - 12px) !important;
   min-width:0 !important;
   margin:3px 0 7px 12px !important;
   padding:4px 0 4px 12px !important;
   border:0 !important;
   border-left:3px solid var(--line) !important;
   border-radius:0 !important;
   box-shadow:none !important;
   background:transparent !important;
 }
 .header .has-submenu.is-submenu-open > .submenu,
 body.nav-layout-vertikal-links .header .has-submenu.is-submenu-open > .submenu {
   display:block !important;
 }
 .header .has-submenu.is-submenu-open > a .submenu-marker .submenu-chevron {
   transform:rotate(180deg);
 }
 .header .submenu a {
   width:100% !important;
   padding:7px 10px !important;
   white-space:normal !important;
   justify-content:flex-start !important;
 }
}

@media (max-width:520px) {
 .container {
   width:min(100% - 20px, 1160px) !important;
 }
 .section-fullwidth > .container,
 body.nav-layout-vertikal-links .hero > .container,
 body.nav-layout-vertikal-links .widget-section > .container,
 body.nav-layout-vertikal-links main > .container,
 body.nav-layout-vertikal-links .site-footer > .container {
   width:min(100% - 20px, 1160px) !important;
 }
 .section-heading-content.cms-widget-surface {
   padding-left:18px !important;
   padding-right:18px !important;
 }
}

@media (max-width:820px) {
 body.nav-layout-vertikal-links { --side-nav-width:0px; --vertical-content-offset:0px; }
 body.nav-layout-vertikal-links .header,
 body.nav-layout-vertikal-links .header.sticky { position:relative; width:100%; height:auto; border-right:0; border-bottom:1px solid var(--header-border); overflow:visible; }
 body.nav-layout-vertikal-links main,
 body.nav-layout-vertikal-links .hero,
 body.nav-layout-vertikal-links .hero-banner,
 body.nav-layout-vertikal-links .site-footer { margin-left:0; width:auto; }
 body.nav-layout-vertikal-links .hero > .container,
 body.nav-layout-vertikal-links .hero .hero-grid,
 body.nav-layout-vertikal-links .widget-section > .container,
 body.nav-layout-vertikal-links main > .container,
 body.nav-layout-vertikal-links .site-footer > .container { margin-left:auto; margin-right:auto; width:min(var(--container-width), calc(100% - var(--container-padding))); }
 body.nav-layout-vertikal-links .section-fullwidth { width:100vw !important; margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important; }
 body.nav-layout-vertikal-links .section-fullwidth > .container { margin-left:auto; margin-right:auto; }
 body.nav-layout-vertikal-links .nav { min-height:auto; padding:14px 0; flex-direction:row !important; align-items:center; flex-wrap:wrap; }
 body.nav-layout-vertikal-links .nav .logo { width:auto; flex:1 1 auto; justify-content:flex-start; }
 body.nav-layout-vertikal-links .nav .menu { display:none; flex:0 0 100%; width:100%; margin:8px 0 0 0; }
 body.nav-layout-vertikal-links .nav.is-open .menu { display:flex; }
 body.nav-layout-vertikal-links .menu-list { flex-direction:column; align-items:stretch; width:100%; gap:6px; }
 body.website-layout-sidebar-left main { padding:24px 0 44px; }
 .nav, .nav-logo-links, .nav-logo-rechts, .nav-logo-zentriert { flex-direction:column; align-items:flex-start; gap:12px; padding:14px 0; }
 .nav-menu-links .menu, .nav-menu-zentriert .menu, .nav-menu-rechts .menu { justify-content:flex-start; margin-left:0; margin-right:0; width:100%; }
 .menu-list { flex-direction:column; align-items:stretch; width:100%; }
 .menu-list > li { width:100%; }
 .menu-list a { width:100%; justify-content:space-between; }
 .submenu { position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:0; border-left:3px solid var(--line); border-radius:0; padding:4px 0 4px 14px; margin:2px 0 8px 10px; min-width:0; background:transparent; }
 .submenu a { padding:7px 10px; }
}

.logo { display:inline-flex; align-items:center; gap:10px; font-weight:850; color:var(--header-text); text-decoration:none; font-size:1.15rem; letter-spacing:-.02em; }
.logo-icon::before { content:""; width:34px; height:34px; border-radius:12px; background:var(--primary); box-shadow:0 10px 24px rgba(37,99,235,.28); flex:0 0 auto; }
.logo.has-image { gap:0; }
.logo.has-image .site-logo { display:block; height:var(--logo-height); max-width:var(--logo-max-width); width:auto; object-fit:contain; }
.logo.has-image.logo-with-icon { gap:10px; }
.logo.has-image.logo-with-icon::before { content:""; width:34px; height:34px; border-radius:12px; background:var(--primary); box-shadow:0 10px 24px rgba(37,99,235,.28); flex:0 0 auto; }
.menu { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; align-items:center; }
@font-face { font-family:'FontAwesome'; src:url('assets/fontawesome/fonts/fontawesome-webfont.ttf?v=dba411cc30') format('truetype'); font-weight:normal; font-style:normal; font-display:block; }
.fa { display:inline-block; font:normal normal normal 14px/1 FontAwesome; font-size:inherit; text-rendering:auto; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
.cms-button-content { display:inline-flex; align-items:center; justify-content:center; }
.cms-button-content .fa { flex:0 0 auto; }
.page-navigation-icon { flex:0 0 auto; width:1.1em; text-align:center; }
.page-navigation-title { min-width:0; }
.menu-list { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; align-items:center; justify-content:inherit; }
.menu-list li { position:relative; margin:0; padding:0; }
.menu-list a { display:flex; align-items:center; gap:6px; color:var(--header-text); text-decoration:none; font-weight:700; padding:9px 13px; border-radius:var(--nav-hover-radius); transition:background .2s ease, color .2s ease; white-space:nowrap; }
/* Step 652: Mehrzeilige horizontale Navigation automatisch luftig darstellen. */
@media (min-width:821px) {
 body:not(.nav-layout-vertikal-links):not(.website-layout-sidebar-left) .nav.nav-menu-wrapped {
   min-height:0;
   padding-top:16px;
   padding-bottom:16px;
 }
 body:not(.nav-layout-vertikal-links):not(.website-layout-sidebar-left) .nav.nav-menu-wrapped .menu-list {
   row-gap:12px;
 }
}
.menu-list a:hover { color:var(--nav-hover-text); background:var(--nav-hover-color); }
.menu-list a.is-active { box-shadow:inset 0 var(--active-menu-line-width) 0 var(--active-menu-color),inset 0 calc(-1 * var(--active-menu-line-width)) 0 var(--active-menu-color);border-radius:0; }
.menu-list a.is-active:hover { box-shadow:inset 0 var(--active-menu-line-width) 0 var(--active-menu-color),inset 0 calc(-1 * var(--active-menu-line-width)) 0 var(--active-menu-color);border-radius:0; }
.submenu-marker { font-size:.8em; opacity:.75; }
.submenu { list-style:none; margin:0; padding:8px; position:absolute; top:calc(100% + 6px); left:0; min-width:220px; background:var(--header-background); border:1px solid var(--header-border); border-radius:var(--submenu-radius); box-shadow:0 18px 45px rgba(15,23,42,.16); opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .18s ease, transform .18s ease, visibility .18s ease; z-index:80; }
.has-submenu:hover > .submenu, .has-submenu:focus-within > .submenu { opacity:1; visibility:visible; transform:translateY(0); }
.submenu li { width:100%; }
.submenu a { border-radius:var(--nav-hover-radius); width:100%; justify-content:flex-start; }
.submenu .submenu { top:0; left:calc(100% + 8px); }
.hero-banner { position:relative; min-height:420px; background-size:cover; background-position:center center; display:flex; align-items:center; overflow:hidden; border-bottom:none; }
.hero-banner::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(15,23,42,.56),rgba(15,23,42,.20),rgba(15,23,42,.08)); }
.hero-banner-content { position:relative; z-index:1; max-width:760px; color:#ffffff; padding:76px 0; }
.hero-banner-content .eyebrow { color:#ffffff !important; background:rgba(255,255,255,.18); border-color:rgba(255,255,255,.28); }
.hero-banner-content h1 { color:#ffffff; text-shadow:0 8px 26px rgba(0,0,0,.28); }
.hero-banner-content p { color:rgba(255,255,255,.92); font-size:1.22rem; max-width:720px; text-shadow:0 6px 20px rgba(0,0,0,.22); }
.hero-banner.no-overlay::before { display:none; }
.hero-banner.no-overlay .hero-banner-content { display:none; }
.hero-banner.height-klein { min-height:260px; }
.hero-banner.height-mittel { min-height:420px; }
.hero-banner.height-gross { min-height:620px; }
.hero-banner.height-vollbild { min-height:90vh; }

.hero { position:relative; overflow:hidden; padding:88px 0 72px; background:var(--hero-background); border-bottom:none; }
.hero-overlay-fullwidth { position:relative; isolation:isolate; width:100%; min-height:0; height:680px; padding:0; display:flex; align-items:center; overflow:hidden; box-sizing:border-box; background-size:cover; background-repeat:no-repeat; background-position:center; border-bottom:none; }
.hero-overlay-fullwidth.hero-overlay-image-only { background-size:cover; background-color:var(--hero-overlay-color); }
/* Step 844: Ein bildreiner Vollbild-Header folgt auf allen Geraetebreiten
   dem verbindlichen Headerformat 1920 x 850. Dadurch bleibt die komplette
   Grafik ohne schwarze Letterbox-Flaechen und ohne starken responsiven
   Beschnitt sichtbar. Die Regel gilt nur, wenn keine Overlay-Inhalte aktiv
   sind; Header mit Text, Buttons oder Listen behalten die gewaehlte
   Vollbildhoehe. */
.hero-overlay-fullwidth.hero-overlay-image-only.hero-overlay-height-vollbild {
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:1920 / 850;
  background-size:cover;
  background-position:center center;
}
.hero-overlay-fullwidth::before { content:""; position:absolute; inset:0; z-index:-1; background:color-mix(in srgb, var(--hero-overlay-color) calc(var(--hero-overlay-opacity) * 100%), transparent); }
.hero-overlay-fullwidth::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(0,0,0,.34),rgba(0,0,0,.08) 62%,rgba(0,0,0,.04)); }
.hero-overlay-content { width:min(var(--container-width), calc(100% - var(--container-padding))); height:100%; min-height:0; box-sizing:border-box; margin:0 auto; padding:clamp(44px,7vw,96px) 0 clamp(38px,6vw,80px); display:flex; flex-direction:column; justify-content:center; gap:clamp(24px,4vw,52px); }
.hero-overlay-copy { max-width:min(760px,72vw); }
.hero-overlay-copy h1 { color:var(--hero-overlay-text,#fff) !important; text-shadow:0 8px 30px rgba(0,0,0,.36); text-wrap:balance; }
.hero-overlay-copy p { color:var(--hero-overlay-text,#fff) !important; opacity:.94; text-shadow:0 5px 20px rgba(0,0,0,.28); text-wrap:pretty; }
/* Links- und rechtsbündige Hero-Texte nutzen bewusst mehr Breite als die zentrierte Variante. */
.hero-overlay-align-left .hero-overlay-copy,
.hero-overlay-align-right .hero-overlay-copy { width:100%; max-width:min(1080px,88vw); }
.hero-overlay-align-left .hero-overlay-copy p,
.hero-overlay-align-right .hero-overlay-copy p { max-width:min(980px,100%); }
.hero-overlay-copy .eyebrow { display:inline-flex; width:auto; color:var(--hero-overlay-text,#fff) !important; background:color-mix(in srgb,var(--hero-overlay-text,#fff) 14%,transparent); border:1px solid color-mix(in srgb,var(--hero-overlay-text,#fff) 36%,transparent); }
/* Ausgeblendete Hero-Elemente behalten ihren Layoutplatz, damit die Listenfelder
   unabhängig von Badge, Text und Buttons an derselben vertikalen Position bleiben. */
.hero-overlay-slot-hidden { visibility:hidden !important; pointer-events:none !important; user-select:none !important; }
.hero-overlay-align-left { align-items:flex-start; text-align:left; }
.hero-overlay-align-left .hero-overlay-copy { align-self:flex-start; text-align:left; }
.hero-overlay-align-left .hero-overlay-copy :where(p,div,ul,ol,li) { text-align:left !important; }
.hero-overlay-align-left .hero-overlay-copy p { margin-left:0; margin-right:auto; }
.hero-overlay-align-left .hero-actions { justify-content:flex-start; }
.hero-overlay-align-left .hero-overlay-features,
.hero-overlay-align-left .hero-overlay-features .hero-feature { text-align:left; }
.hero-overlay-align-center { align-items:center; text-align:center; }
.hero-overlay-align-center .hero-overlay-copy { width:100%; max-width:880px; align-self:center; text-align:center; }
.hero-overlay-align-center .hero-overlay-copy :where(p,div,ul,ol,li) { text-align:center !important; }
.hero-overlay-align-center .hero-overlay-copy p { margin-left:auto; margin-right:auto; }
.hero-overlay-align-center .hero-actions { justify-content:center; }
.hero-overlay-align-center .hero-overlay-features,
.hero-overlay-align-center .hero-overlay-features .hero-feature { text-align:center; }
.hero-overlay-align-right { align-items:flex-end; text-align:right; }
.hero-overlay-align-right .hero-overlay-copy { align-self:flex-end; text-align:right; }
.hero-overlay-align-right .hero-overlay-copy :where(p,div,ul,ol,li) { text-align:right !important; }
.hero-overlay-align-right .hero-overlay-copy p { margin-left:auto; margin-right:0; }
.hero-overlay-align-right .hero-actions { justify-content:flex-end; }
.hero-overlay-align-right .hero-overlay-features,
.hero-overlay-align-right .hero-overlay-features .hero-feature { text-align:right; }
.hero-overlay-features {
  position:absolute;
  z-index:1;
  right:var(--hero-feature-right-gap,100px);
  bottom:var(--hero-feature-bottom-gap,100px);
  width:min(var(--container-width),calc(100% - var(--hero-feature-right-gap,100px) - var(--container-padding)));
}
.hero-overlay-features .hero-feature-list { grid-template-columns:repeat(3,minmax(0,1fr)); }
.hero-overlay-features .hero-feature-list.hero-feature-count-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.hero-overlay-features-vertical { width:min(420px,calc(100% - var(--container-padding))); }
.hero-overlay-features-vertical .hero-feature-list,
.hero-overlay-features-vertical .hero-feature-list.hero-feature-count-4 { grid-template-columns:1fr; }
.hero-overlay-features .hero-feature { background:var(--hero-feature-background,rgba(8,20,38,.70)); border-color:var(--hero-feature-border,rgba(255,255,255,.18)); backdrop-filter:blur(10px); }
.hero-overlay-features .hero-feature strong, .hero-overlay-features .hero-feature span { color:var(--hero-feature-text,#fff) !important; }
.hero-overlay-height-klein { height:420px; min-height:0; }
.hero-overlay-height-mittel { height:540px; min-height:0; }
.hero-overlay-height-gross { height:680px; min-height:0; }
.hero-overlay-height-vollbild { height:calc(100vh - 78px); height:calc(100svh - 78px); min-height:0; }
/* Die gewählte Höhe bleibt auch bei vier Karten verbindlich. */
.hero-overlay-fullwidth.hero-overlay-feature-count-4.hero-overlay-height-klein { height:420px; min-height:0; }
.hero-overlay-fullwidth.hero-overlay-feature-count-4.hero-overlay-height-mittel { height:540px; min-height:0; }
.hero-overlay-fullwidth.hero-overlay-feature-count-4.hero-overlay-height-gross { height:680px; min-height:0; }
.hero-overlay-fullwidth.hero-overlay-feature-count-4.hero-overlay-height-vollbild { height:calc(100vh - 78px); height:calc(100svh - 78px); min-height:0; }
@media (max-width:900px) { .hero-overlay-content { padding:48px 0 40px; } .hero-overlay-features { right:16px; width:min(100% - 32px,var(--container-width)); } .hero-overlay-features-vertical { display:none !important; } .hero-overlay-copy { max-width:100%; } .hero-overlay-features-horizontal .hero-feature-list { grid-template-columns:repeat(3,minmax(0,1fr)); } .hero-overlay-features-horizontal .hero-feature-list.hero-feature-count-4 { grid-template-columns:repeat(4,minmax(0,1fr)); } .hero-overlay-features-vertical .hero-feature-list, .hero-overlay-features-vertical .hero-feature-list.hero-feature-count-4 { grid-template-columns:1fr; } }
@media (max-width:760px) { .hero-overlay-features-horizontal { width:calc(100% - 16px); } .hero-overlay-features-horizontal .hero-feature-list { gap:5px; } .hero-overlay-features-horizontal .hero-feature { min-height:0; padding:7px 5px 6px; border-radius:12px; } .hero-overlay-features-horizontal .hero-feature strong { margin-bottom:3px; font-size:clamp(.58rem,2.6vw,.76rem); line-height:1.15; } .hero-overlay-features-horizontal .hero-feature span { font-size:clamp(.52rem,2.25vw,.68rem); line-height:1.25; } .hero-overlay-features-vertical { --hero-feature-responsive-scale:.42; width:calc((100% - 16px) / var(--hero-feature-responsive-scale)); } .hero-overlay-features-vertical .hero-feature-list { gap:7px; } }
@media (max-width:760px) { .hero-overlay-fullwidth { background-position:center; } .hero-overlay-height-klein { height:420px; min-height:0; } .hero-overlay-height-mittel { height:540px; min-height:0; } .hero-overlay-height-gross { height:680px; min-height:0; } .hero-overlay-height-vollbild { height:calc(100vh - 64px); height:calc(100svh - 64px); min-height:0; } .hero-overlay-content { width:min(100% - 32px, var(--container-width)); } .hero-overlay-align-right { align-items:flex-start; text-align:left; } .hero-overlay-align-right .hero-overlay-copy { align-self:flex-start; text-align:left; } .hero-overlay-align-right .hero-overlay-copy :where(p,div,ul,ol,li) { text-align:left !important; } .hero-overlay-align-right .hero-overlay-copy p { margin-left:0; margin-right:auto; } .hero-overlay-align-right .hero-actions { justify-content:flex-start; } .hero-overlay-align-right .hero-overlay-features, .hero-overlay-align-right .hero-overlay-features .hero-feature { text-align:left; } }
.hero:not(.hero-overlay-fullwidth),
.hero:not(.hero-overlay-fullwidth) h1,
.hero:not(.hero-overlay-fullwidth) h2,
.hero:not(.hero-overlay-fullwidth) h3,
.hero:not(.hero-overlay-fullwidth) h4,
.hero:not(.hero-overlay-fullwidth) p,
.hero:not(.hero-overlay-fullwidth) span,
.hero:not(.hero-overlay-fullwidth) small,
.hero:not(.hero-overlay-fullwidth) strong,
.hero:not(.hero-overlay-fullwidth) .eyebrow,
.hero:not(.hero-overlay-fullwidth) .subtitle,
.hero:not(.hero-overlay-fullwidth) .hero-text,
.hero:not(.hero-overlay-fullwidth) .hero-content,
.hero:not(.hero-overlay-fullwidth) .hero-content *,
.hero:not(.hero-overlay-fullwidth) .container > * {
 color:var(--hero-text) !important;
}
.hero::after { content:""; position:absolute; right:-120px; top:-160px; width:420px; height:420px; border-radius:50%; background:rgba(37,99,235,.12); filter:blur(2px); }
.hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:1.08fr .92fr; gap:48px; align-items:center; }
.hero.hero-fullwidth .hero-grid { max-width:none; width:100%; padding-left:clamp(24px,5vw,96px); padding-right:clamp(24px,5vw,96px); }
.cms-animate { opacity:1; --cms-slide-distance:160px; --cms-slide-y-distance:54px; transform:none; transition-property:opacity, transform; transition-timing-function:cubic-bezier(.16,1,.3,1); will-change:opacity, transform; }
html.cms-js .cms-animate { opacity:0; transform:translate3d(0,0,0); }
.cms-animate.cms-anim-fast { transition-duration:.5s; --cms-slide-distance:90px; --cms-slide-y-distance:34px; }
.cms-animate.cms-anim-normal { transition-duration:1s; --cms-slide-distance:160px; --cms-slide-y-distance:54px; }
.cms-animate.cms-anim-slow { transition-duration:1.8s; --cms-slide-distance:260px; --cms-slide-y-distance:74px; }
.cms-animate.cms-anim-very-slow { transition-duration:2.5s; --cms-slide-distance:360px; --cms-slide-y-distance:92px; }
html.cms-js .cms-animate.cms-anim-fade { transform:none; }
html.cms-js .cms-animate.cms-anim-from-left { transform:translate3d(calc(var(--cms-slide-distance) * -1),0,0); }
html.cms-js .cms-animate.cms-anim-from-right { transform:translate3d(var(--cms-slide-distance),0,0); }
html.cms-js .cms-animate.cms-anim-from-top { transform:translate3d(0,calc(var(--cms-slide-y-distance) * -1),0); }
html.cms-js .cms-animate.cms-anim-from-bottom { transform:translate3d(0,var(--cms-slide-y-distance),0); }
html.cms-js .cms-animate.cms-anim-zoom { transform:scale(.92); }
html.cms-js .cms-animate.is-visible { opacity:1; transform:none; }
html.cms-hero-animation-suppressed .hero-widget.cms-animate,
html.cms-hero-animation-suppressed .hero-widget .cms-animate { opacity:1 !important; transform:none !important; transition:none !important; transition-delay:0s !important; will-change:auto !important; }
@media (prefers-reduced-motion: reduce) { .cms-animate { opacity:1 !important; transform:none !important; transition:none !important; } }
@media (max-width: 768px) { .cms-animate { opacity:1 !important; transform:none !important; transition:none !important; will-change:auto !important; } }
.eyebrow { display:inline-flex; align-items:center; gap:8px; color:var(--primary); background:rgba(37,99,235,.09); border:1px solid rgba(37,99,235,.16); border-radius:999px; padding:7px 12px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; font-size:.78rem; margin-bottom:18px; }
h1 { font-size:clamp(2rem,3.4vw,3.5rem); line-height:1.08; margin:0 0 20px; letter-spacing:-.045em; color:#0b1220; overflow-wrap:anywhere; }
.hero p { font-size:1.2rem; color:#475569; margin:0 0 30px; max-width:720px; }
.hero-img { width:100%; border-radius:var(--card-radius); box-shadow:var(--card-shadow); border:1px solid rgba(255,255,255,.75); }
.hero-card { min-height:330px; border-radius:var(--card-radius); padding:var(--card-pad); background:linear-gradient(160deg,rgba(255,255,255,.92),rgba(255,255,255,.58)); border:1px solid rgba(255,255,255,.9); box-shadow:var(--card-shadow); display:grid; align-content:end; position:relative; overflow:hidden; }
.hero-card::before { content:""; position:absolute; inset:26px 26px auto auto; width:110px; height:110px; border-radius:28px; background:var(--primary); opacity:.9; }
.hero-card-content { position:relative; z-index:2; display:flex; flex-direction:column; gap:8px; font-weight:850; font-size:1.65rem; line-height:1.18; letter-spacing:-.03em; color:#0f172a; }
.hero-card-line { display:block; }

/* v4.7.5 – Startseiten-Header: sekundärer Button sichtbar */
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.hero-actions .btn.btn-secondary { background:#ffffff !important; color:var(--primary) !important; border:1px solid rgba(37,99,235,.24); box-shadow:0 12px 24px rgba(15,23,42,.08); }
.hero-actions .btn.btn-secondary:empty::before { content:"Screenshots ansehen"; color:var(--primary) !important; }
.hero-visual { display:flex; flex-direction:column; gap:28px; }
.hero-screenshot-wrap { width:100%; }
.hero-features-wrap { width:100%; }
.cms-screenshot-card { background:linear-gradient(160deg,rgba(255,255,255,.96),rgba(255,255,255,.72)); border:1px solid rgba(255,255,255,.92); border-radius:28px; padding:16px; box-shadow:0 28px 80px rgba(15,23,42,.16); }
.cms-screenshot-card.hero-image-background-custom { background:var(--hero-image-background); }
.cms-screenshot-card.hero-image-background-transparent { background:transparent !important; border-color:transparent !important; border-width:0 !important; box-shadow:none !important; padding:0 !important; }
.cms-screenshot-card img { display:block; width:100%; height:auto; border-radius:18px; border:1px solid rgba(15,23,42,.10); box-shadow:0 18px 45px rgba(15,23,42,.10); }
.cms-screenshot-card.hero-image-background-transparent img { border-color:transparent !important; border-width:0 !important; box-shadow:none !important; }
.cms-screenshot-caption { margin-top:10px; font-size:.88rem; font-weight:750; color:#64748b !important; text-align:center; }
.hero-feature-list { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.hero-feature { background:rgba(255,255,255,.78); border:1px solid rgba(255,255,255,.9); box-shadow:0 14px 32px rgba(15,23,42,.08); border-radius:20px; padding:15px 15px 14px; min-height:96px; display:flex; flex-direction:column; justify-content:flex-start; }
.hero-feature strong { display:block; margin-bottom:6px; font-size:.98rem; color:#0f172a !important; }
.hero-feature span { display:block; font-size:.9rem; line-height:1.45; color:#475569 !important; }
@media (max-width:900px) { .hero-feature-list { grid-template-columns:1fr; } }
@media (max-width:760px) { .hero-actions { align-items:stretch; } .hero-actions .btn { width:100%; } .cms-screenshot-card { padding:10px; border-radius:22px; } .cms-screenshot-card img { border-radius:14px; } }
.btn { display:inline-flex; align-items:center; justify-content:center; padding:13px 21px; background:var(--primary); color:#ffffff !important; border:1px solid var(--primary); border-radius:var(--button-radius); text-decoration:none; font-weight:850; box-shadow:0 14px 26px rgba(37,99,235,.22); transition:transform var(--transition), box-shadow var(--transition), background-color var(--transition), color var(--transition), border-color var(--transition), filter var(--transition); cursor:pointer; }
.btn:hover { transform:var(--button-hover-transform); filter:var(--button-hover-filter); background:#1d4ed8; border-color:#1d4ed8; color:#ffffff !important; box-shadow:0 20px 36px rgba(37,99,235,.34); }
.hero .hero-actions .btn { color:#ffffff !important; }
.hero .hero-actions .btn.btn-secondary { background:#ffffff !important; color:var(--primary) !important; border:1px solid rgba(37,99,235,.32); box-shadow:0 12px 24px rgba(15,23,42,.08); }
.hero .hero-actions .btn.btn-secondary:hover { background:var(--primary) !important; border-color:var(--primary); color:#ffffff !important; box-shadow:0 20px 36px rgba(37,99,235,.28); }
.hero .hero-actions .btn.btn-secondary:empty::before { content:"Screenshots ansehen"; color:inherit !important; }
.section { padding:42px 0; }


.editor-paragraph-space {
  display:block;
  height:.9em;
}

/* Kompaktere Textausgabe aus dem Editor */
.card p,
.widget-plain p,
.image-text p {
  margin-top:0;
  margin-bottom:.75em;
}
.card p:last-child,
.widget-plain p:last-child,
.image-text p:last-child {
  margin-bottom:0;
}
.card p + p,
.widget-plain p + p,
.image-text p + p {
  margin-top:0;
}
.card br + br,
.widget-plain br + br,
.image-text br + br {
  display:block;
  content:"";
  margin-top:.15em;
}

.card { background:rgba(255,255,255,.96); border:1px solid var(--line); border-radius:var(--card-radius); padding:var(--card-pad); box-shadow:var(--card-shadow); }

/* Sichtbare Design-System-Overrides */
.card-style-flach .card,
.card-style-flach .mini-card,
.card-style-flach .single-image-widget img,
.card-style-flach .image-text img,
.card-style-flach .gallery img,
.card-style-flach .slider {
  box-shadow:none !important;
}

.card-style-leichter-schatten .card,
.card-style-leichter-schatten .mini-card,
.card-style-leichter-schatten .single-image-widget img,
.card-style-leichter-schatten .image-text img,
.card-style-leichter-schatten .gallery img,
.card-style-leichter-schatten .slider {
  box-shadow:0 10px 25px rgba(15,23,42,.08) !important;
}

.card-style-moderner-schatten .card,
.card-style-moderner-schatten .mini-card,
.card-style-moderner-schatten .single-image-widget img,
.card-style-moderner-schatten .image-text img,
.card-style-moderner-schatten .gallery img,
.card-style-moderner-schatten .slider {
  box-shadow:0 18px 45px rgba(15,23,42,.12) !important;
}

.card-style-hervorgehoben .card,
.card-style-hervorgehoben .mini-card,
.card-style-hervorgehoben .single-image-widget img,
.card-style-hervorgehoben .image-text img,
.card-style-hervorgehoben .gallery img,
.card-style-hervorgehoben .slider {
  box-shadow:0 34px 90px rgba(15,23,42,.24) !important;
  border-color:rgba(15,23,42,.16) !important;
}

.corner-style-eckig .card,
.corner-style-eckig .mini-card,
.corner-style-eckig .single-image-widget img,
.corner-style-eckig .image-text img,
.corner-style-eckig .gallery img,
.corner-style-eckig .slider { border-radius:4px !important; }

.corner-style-leicht-gerundet .card,
.corner-style-leicht-gerundet .mini-card,
.corner-style-leicht-gerundet .single-image-widget img,
.corner-style-leicht-gerundet .image-text img,
.corner-style-leicht-gerundet .gallery img,
.corner-style-leicht-gerundet .slider { border-radius:16px !important; }

.corner-style-rund .card,
.corner-style-rund .mini-card,
.corner-style-rund .single-image-widget img,
.corner-style-rund .image-text img,
.corner-style-rund .gallery img,
.corner-style-rund .slider { border-radius:28px !important; }

/* Abschnittsüberschriften stehen im Inhaltsfluss zwischen normalen Widgets.
   Deshalb bilden ihre beiden halben vertikalen Widgetabstände zusammen mit
   dem benachbarten Widgetbereich exakt den global eingestellten Widgetabstand. */
.section-heading-widget {
  text-align:center;
  padding:calc(var(--widget-gap-vertical) / 2) 0;
}
.section-heading-content { max-width:860px; margin:0 auto; text-align:center; }
/* Step 924: Die normale Widget-/Vorlagenbreite „Volle Breite“ muss bei der
   Abschnittsüberschrift auch den sichtbaren Inneninhalt freigeben. Die globale
   Breitenlogik bleibt unverändert; nur diese Vorlage hebt bei width-full ihre
   historische 860/760-px-Begrenzung auf. */
.section-heading-content.section-heading-content-width-full {
  width:100%;
  max-width:none;
}
.section-heading-content.section-heading-content-width-full p {
  width:100%;
  max-width:none;
}
/* Step 816: Sobald die Abschnittsüberschrift einen eigenen Widget-Hintergrund
   verwendet, ist sie wie die Vorlage „Einleitung“ eine vollständige Kartenfläche.
   Breite und Innenabstand werden deshalb nur für die aktivierte Oberfläche an
   die Einleitung angeglichen. Die bisherige schmale, transparente Standard-
   Abschnittsüberschrift bleibt unverändert. */
.section-heading-content.cms-widget-surface {
  width:100%;
  max-width:none;
  padding:34px;
}
/* Eine Abschnittsüberschrift mit eigener Widget-Oberfläche bleibt ebenfalls im
   einheitlichen vertikalen Widgetraster. */
.section-heading-widget:has(.section-heading-content.cms-widget-surface) {
  padding-bottom:calc(var(--widget-gap-vertical) / 2) !important;
}
.section-heading-content h2 { margin-bottom:12px; }
.section-heading-content p { margin:0 auto; max-width:760px; font-size:1.05rem; line-height:1.65; }
.intro-widget-section { padding:15px 0 !important; }
.intro-card{width:100%;box-sizing:border-box;background:linear-gradient(135deg,#ffffff 0%,#eef4ff 100%);border:1px solid #dbeafe;border-radius:24px;padding:34px;box-shadow:0 18px 50px rgba(15,23,42,.08)}
.intro-card .eyebrow{font-size:.86rem;font-weight:800;color:#2563eb;text-transform:uppercase;letter-spacing:.08em;margin:0 0 10px}
.intro-card h2{margin:.1rem 0 .7rem;font-size:clamp(2rem,4vw,3rem);letter-spacing:-.045em;color:#0f172a;line-height:1.08}
.intro-card p{max-width:none;color:#475569;font-size:1.08rem;line-height:1.75;margin:0}
.section h2 { font-size:clamp(1.65rem,3vw,2.45rem); line-height:1.15; margin:0 0 16px; letter-spacing:-.035em; color:#0b1220; }
.section p { color:#334155; }
.widget-row { display:grid; grid-template-columns:repeat(6, minmax(0, 1fr)); column-gap:var(--widget-gap-horizontal); row-gap:var(--widget-gap-vertical); align-items:start; margin-bottom:0; }
.cms-spacing { display:block; padding:0; margin:0; border:0; background:transparent; pointer-events:none; }
.cms-spacing-vertical { width:100%; }
.cms-spacing-horizontal { height:1px; max-width:100%; }
.widget-row.has-horizontal-spacing { display:flex; flex-wrap:nowrap; align-items:flex-start; }
.widget-row.has-horizontal-spacing > .widget-slot.width-full { flex:1 1 100%; }
.widget-row.has-horizontal-spacing > .widget-slot.width-half { flex:1 1 50%; }
.widget-row.has-horizontal-spacing > .widget-slot.width-third { flex:1 1 33.333%; }
.widget-row.has-horizontal-spacing > .widget-slot.width-two-third { flex:1 1 66.667%; }
.widget-row.has-horizontal-spacing > .spacing-horizontal-slot { flex-grow:0; flex-shrink:0; }
.spacing-vertical-slot { grid-column:1 / -1 !important; }
/* Step 637: Ein vertikales Abstand-Widget darf keine globalen Section- oder
   Widget-Abstände zusätzlich erhalten. Der eingegebene Pixelwert ist damit
   exakt der tatsächlich erzeugte Leerraum. */
.widget-section.spacing-vertical-section {
  padding:0 !important;
  margin:0 !important;
}
.widget-section.spacing-vertical-section:first-of-type,
.widget-section.spacing-vertical-section:last-of-type {
  padding-top:0 !important;
  padding-bottom:0 !important;
}
.widget-section.spacing-vertical-section > .container,
.widget-section.spacing-vertical-section .widget-row,
.widget-section.spacing-vertical-section .widget-slot {
  margin-top:0 !important;
  margin-bottom:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}
.widget-slot { min-width:0; align-self:start; grid-column:span 6; }
.widget-slot.width-full { grid-column:span 6; }
.widget-slot.width-half { grid-column:span 3; }
.widget-slot.width-third { grid-column:span 2; }
.widget-slot.width-two-third { grid-column:span 4; }
.widget-slot > .card, .widget-slot > .widget-plain { height:auto; align-self:start; }
.widget-plain { min-width:0; }



/* Step 487: Einheitlicher optionaler Widget-Hintergrund ohne zusätzliche Layout-Hülle.
   Die Klasse wird direkt auf die bereits vorhandene äußerste Widgetfläche gesetzt.
   Dadurch bleiben widgeteigene Breiten, Höhen, Grid-/Flex-Regeln und iframe-Maße erhalten. */
.cms-widget-surface {
  background:var(--cms-widget-bg, #ffffff) !important;
  border:1px solid var(--card-border, #dbe3ef);
  border-radius:var(--radius, 16px);
  box-shadow:var(--shadow, 0 12px 30px rgba(15,23,42,.10));
  box-sizing:border-box;
  min-width:0;
}
.cms-widget-surface.is-transparent {
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
/* Step 488: Automatische Kontrastfarbe für Widgets mit bewusst gesetztem
   Widget-Hintergrund. Bei transparenten Widgets wird die Farbe des umgebenden
   Containers bzw. des Seitenhintergrunds ausgewertet. Funktionsflächen wie
   Buttons, Eingabefelder, Karten, iframes und Mediencontainer bleiben unberührt. */
.cms-widget-surface.cms-widget-auto-contrast {
  color:var(--cms-widget-text, #0f172a) !important;
}
.cms-widget-surface.cms-widget-auto-contrast h1,
.cms-widget-surface.cms-widget-auto-contrast h2,
.cms-widget-surface.cms-widget-auto-contrast h3,
.cms-widget-surface.cms-widget-auto-contrast h4,
.cms-widget-surface.cms-widget-auto-contrast h5,
.cms-widget-surface.cms-widget-auto-contrast h6,
.cms-widget-surface.cms-widget-auto-contrast p,
.cms-widget-surface.cms-widget-auto-contrast li,
.cms-widget-surface.cms-widget-auto-contrast label,
.cms-widget-surface.cms-widget-auto-contrast legend,
.cms-widget-surface.cms-widget-auto-contrast summary,
.cms-widget-surface.cms-widget-auto-contrast strong,
.cms-widget-surface.cms-widget-auto-contrast small,
.cms-widget-surface.cms-widget-auto-contrast .widget-title,
.cms-widget-surface.cms-widget-auto-contrast .widget-subtitle,
.cms-widget-surface.cms-widget-auto-contrast .muted {
  color:var(--cms-widget-text, #0f172a) !important;
}
.cms-widget-surface.cms-widget-auto-contrast a:not(.btn):not(.button):not([class*="button"]),
.cms-widget-surface.cms-widget-auto-contrast a:not(.btn):not(.button):not([class*="button"]):visited {
  color:var(--cms-widget-text, #0f172a) !important;
  text-decoration-color:color-mix(in srgb, var(--cms-widget-text, #0f172a) 55%, transparent);
}


/* Gleiche Höhe für nebeneinanderliegende Widgets */
.widget-row.equal-height { align-items:stretch !important; }
.widget-row.equal-height .widget-slot {
  display:flex !important;
  align-self:stretch !important;
  height:100% !important;
}
.widget-row.equal-height .widget-slot > .card,
.widget-row.equal-height .widget-slot > .widget-plain {
  width:100% !important;
  min-height:100% !important;
  height:100% !important;
  display:flex !important;
  flex-direction:column !important;
}
.widget-row.equal-height .widget-slot > .card.image-text-forced {
  display:flex !important;
  flex-direction:column !important;
}

.grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:0; }
.cards-widget { width:100%; }

/* Step 831/832: Datenschutzfreundliches Social-Sharing-Widget. */
.social-sharing-widget { width:100%; box-sizing:border-box; }
.social-sharing-widget.cms-widget-surface { padding:var(--widget-pad,26px); }
.social-sharing-widget.cms-widget-surface > h2 { margin-top:0; margin-bottom:16px; }
.social-sharing-widget.cms-widget-surface > p { margin-top:0; margin-bottom:16px; }
.social-sharing-widget.social-floating.cms-widget-surface { width:auto; padding:10px; }
.social-sharing-widget.social-align-left { text-align:left; }
.social-sharing-widget.social-align-center { text-align:center; }
.social-sharing-widget.social-align-right { text-align:right; }
.social-share-buttons { display:flex; flex-wrap:wrap; gap:var(--share-gap,10px); align-items:center; }
.social-align-left .social-share-buttons { justify-content:flex-start; }
.social-align-center .social-share-buttons { justify-content:center; }
.social-align-right .social-share-buttons { justify-content:flex-end; }
.social-sharing-widget .social-share-btn { min-height:var(--share-size,42px); min-width:var(--share-size,42px); padding:0 16px; display:inline-flex; align-items:center; justify-content:center; gap:9px; overflow:hidden; border:0; border-radius:var(--share-radius,8px) !important; background:var(--share-bg,#2563eb); color:var(--share-fg,#fff); font:inherit; font-weight:700; cursor:pointer; transition:transform .18s ease,filter .18s ease,box-shadow .18s ease; }
/* Step 873: Bei Icon + Text wird der Icon-Bereich dezent von der Buttonfläche abgesetzt. */
.social-sharing-widget.social-icon-text:not(.social-shape-circle) .social-share-btn { padding:0; gap:0; }
.social-sharing-widget.social-icon-text:not(.social-shape-circle) .social-share-icon { align-self:stretch; display:inline-flex; align-items:center; justify-content:center; min-width:var(--share-size,42px); padding:0 10px; box-sizing:border-box; background:rgba(0,0,0,.10); }
.social-sharing-widget.social-icon-text:not(.social-shape-circle) .social-share-label { padding:0 16px 0 12px; }
.social-sharing-widget.social-icons-only .social-share-btn { width:var(--share-size,42px); max-width:var(--share-size,42px); padding:0; }
.social-sharing-widget.social-shape-square .social-share-btn { border-radius:0 !important; }
.social-sharing-widget .social-share-btn:hover { transform:translateY(-2px); filter:brightness(.94); box-shadow:0 8px 18px rgba(15,23,42,.16); }
.social-sharing-widget .social-share-btn:focus-visible { outline:3px solid color-mix(in srgb,var(--share-bg) 35%,#fff); outline-offset:2px; }
.social-sharing-widget .social-share-icon { display:inline-block; font-family:'FontAwesome'; font-style:normal; font-weight:normal; line-height:1; font-size:calc(var(--share-size,42px) * .43); text-rendering:auto; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
.social-copy-note { min-height:1.5em; margin-top:8px; color:var(--muted); font-size:.92rem; }
/* Step 960: Lokaler Bestätigungsdialog für die optionale 2-Klick-Lösung.
   Bis zur Bestätigung wird keinerlei externer Sharing-Dienst aufgerufen. */
.social-share-confirm-backdrop { position:fixed; inset:0; z-index:10050; display:none; align-items:center; justify-content:center; padding:20px; background:rgba(15,23,42,.48); }
.social-share-confirm-backdrop.is-open { display:flex; }
.social-share-confirm-dialog { width:min(520px,100%); box-sizing:border-box; padding:22px; border-radius:14px; background:#fff; color:#0f172a; text-align:left; box-shadow:0 24px 60px rgba(15,23,42,.28); }
.social-share-confirm-dialog h3 { margin:0 0 10px; font-size:1.15rem; color:#0f172a; }
.social-share-confirm-dialog p { margin:0; line-height:1.55; color:#334155; }
.social-share-confirm-privacy { margin-top:10px !important; font-size:.94rem; }
.social-share-confirm-privacy a { color:#1d4ed8; font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.social-share-confirm-privacy a:focus-visible { outline:3px solid rgba(37,99,235,.35); outline-offset:2px; border-radius:3px; }
.social-share-confirm-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; margin-top:18px; }
.social-share-confirm-actions button { min-height:40px; padding:8px 14px; border-radius:8px; border:1px solid #cbd5e1; background:#fff; color:#0f172a; font:inherit; font-weight:700; cursor:pointer; }
.social-share-confirm-actions .social-share-confirm-go { border-color:#2563eb; background:#2563eb; color:#fff; }
.social-share-confirm-actions button:focus-visible { outline:3px solid rgba(37,99,235,.35); outline-offset:2px; }
.social-sharing-widget.social-floating { position:fixed; z-index:900; width:auto; max-width:min(92vw,360px); margin:0; }
.social-sharing-widget.social-floating-left { left:var(--share-edge,12px); }
.social-sharing-widget.social-floating-right { right:var(--share-edge,12px); }
.social-sharing-widget.social-float-top { top:var(--share-edge,12px); }
.social-sharing-widget.social-float-center { top:50%; transform:translateY(-50%); }
.social-sharing-widget.social-float-bottom { bottom:var(--share-edge,12px); }
.social-sharing-widget.social-floating .social-share-buttons { display:inline-grid; grid-auto-flow:row; grid-template-columns:max-content; align-items:stretch; justify-items:stretch; }
.social-sharing-widget.social-floating.social-align-left .social-share-buttons { justify-self:start; }
.social-sharing-widget.social-floating.social-align-center .social-share-buttons { justify-self:center; }
.social-sharing-widget.social-floating.social-align-right .social-share-buttons { justify-self:end; }
.social-sharing-widget.social-floating .social-share-btn { width:100%; max-width:100%; justify-content:flex-start; }
.social-sharing-widget.social-floating.social-icons-only .social-share-buttons { align-items:center; }
.social-sharing-widget.social-floating > h2,.social-sharing-widget.social-floating > p { display:none; }
@keyframes cmsShareBounce{0%,100%{transform:translateY(0)}35%{transform:translateY(-7px)}65%{transform:translateY(-3px)}}
@keyframes cmsShareSlide{0%{transform:translateX(-8px);opacity:.25}100%{transform:translateX(0);opacity:1}}
.social-animation-bounce.social-anim-load .social-share-btn { animation:cmsShareBounce .65s ease both; }
.social-animation-slide.social-anim-load .social-share-btn { animation:cmsShareSlide .45s ease both; }
.social-animation-bounce.social-anim-hover .social-share-btn:hover { animation:cmsShareBounce .65s ease; }
.social-animation-slide.social-anim-hover .social-share-btn:hover { animation:cmsShareSlide .45s ease; }
@media (prefers-reduced-motion:reduce){.social-sharing-widget .social-share-btn{animation:none !important;transition:none !important}}
@media (max-width:900px){
  .social-sharing-widget .social-share-btn{padding:0 12px}
  .social-sharing-widget.social-icons-only .social-share-btn{padding:0}
  .social-share-buttons{gap:8px}
  .social-sharing-widget.social-floating:not(.social-floating-mobile-enabled){position:static;left:auto;right:auto;top:auto;bottom:auto;transform:none;max-width:none;width:100%;}
  .social-sharing-widget.social-floating:not(.social-floating-mobile-enabled) .social-share-buttons{flex-direction:row;flex-wrap:wrap;align-items:center;}
  .social-sharing-widget.social-floating:not(.social-floating-mobile-enabled).social-align-left .social-share-buttons{justify-content:flex-start;}
  .social-sharing-widget.social-floating:not(.social-floating-mobile-enabled).social-align-center .social-share-buttons{justify-content:center;}
  .social-sharing-widget.social-floating:not(.social-floating-mobile-enabled).social-align-right .social-share-buttons{justify-content:flex-end;}
  .social-sharing-widget.social-floating:not(.social-floating-mobile-enabled) > h2,.social-sharing-widget.social-floating:not(.social-floating-mobile-enabled) > p{display:block;}
}

/* Step 802: Wird für das Infokarten-Widget ein eigener Widget-Hintergrund
   gesetzt, benötigen Überschrift und Kartenraster denselben inneren Abstand.
   Die Oberfläche liegt direkt auf .cards-widget; deshalb wird der Abstand hier
   ohne zusätzliche Wrapper-Ebene ergänzt. Transparente und farbige Flächen
   behalten damit exakt dieselbe Geometrie. */
.cards-widget.cms-widget-surface { padding:var(--card-pad); }
.cards-widget.has-widget-heading .grid3 { margin-top:24px; }
/* Das Kartenraster erzeugt keinen eigenen Außenabstand. Der Abstand zu
   benachbarten Widgets und Vorlagen kommt ausschließlich aus dem globalen
   vertikalen Widgetabstand. */
.cards-widget .grid3 { width:100%; box-sizing:border-box; margin-bottom:0; }
.cards-widget.cards-cols-1 .grid3 { grid-template-columns:1fr; }
.cards-widget.cards-cols-1 .mini-card { width:100%; box-sizing:border-box; }
.cards-widget.cards-cols-2 .grid3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.cards-widget.cards-cols-3 .grid3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.cards-widget.cards-cols-4 .grid3 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.cards-widget.cards-cols-5 .grid3 { grid-template-columns:repeat(5,minmax(0,1fr)); }
.cards-widget.cards-cols-6 .grid3 { grid-template-columns:repeat(6,minmax(0,1fr)); }
.mini-card { background:#fff; border:1px solid var(--line); border-radius:var(--card-radius); padding:var(--card-pad); display:flex; flex-direction:column; gap:11px; box-shadow:var(--card-shadow); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.mini-card:hover { transform:translateY(-3px); box-shadow:0 20px 42px rgba(15,23,42,.11); border-color:rgba(37,99,235,.28); }
/* Step 942: Optionales Hover-Overlay für Infokarten. Das Overlay liegt nur
   visuell über der Karte und blockiert weder Buttons noch Links. */
.mini-card.has-hover-overlay { position:relative; overflow:hidden; }
.mini-card-hover-overlay { position:absolute; inset:0; z-index:5; display:flex; align-items:center; justify-content:center; padding:22px; box-sizing:border-box; border-radius:inherit; background:var(--card-hover-bg,rgba(15,23,42,.72)); color:var(--card-hover-text,#fff); opacity:0; pointer-events:none; transition:opacity .28s ease; text-align:center; }
.mini-card-button-wrap { position:relative; z-index:6; display:flex; width:100%; }
.mini-card-button-wrap.mini-card-button-left { justify-content:flex-start; }
.mini-card-button-wrap.mini-card-button-center { justify-content:center; }
.mini-card-button-wrap.mini-card-button-right { justify-content:flex-end; }
.mini-card-button-wrap .btn { align-self:auto; margin-top:auto; }
.mini-card-hover-text { max-width:90%; font-weight:700; line-height:1.45; }
@media (hover:hover) and (pointer:fine) {
  .mini-card.has-hover-overlay:hover .mini-card-hover-overlay,
  .mini-card.has-hover-overlay:focus-within .mini-card-hover-overlay { opacity:1; }
}
@media (hover:none), (pointer:coarse) { .mini-card-hover-overlay { display:none; } }
@media (prefers-reduced-motion:reduce) { .mini-card-hover-overlay { transition:none; } }
/* Step 943: Trifft eine Akzentkante auf das Hover-Overlay, darf dessen
   Rundung an genau dieser Seite keine hellen Kartenecken freilegen. Die
   äußere Kartenrundung und die sichtbare Akzentkante bleiben unverändert. */
.cards-widget.cards-accent-top .mini-card-hover-overlay { border-radius:0 0 var(--card-radius) var(--card-radius); }
.cards-widget.cards-accent-bottom .mini-card-hover-overlay { border-radius:var(--card-radius) var(--card-radius) 0 0; }
.cards-widget.cards-accent-left .mini-card-hover-overlay { border-radius:0 var(--card-radius) var(--card-radius) 0; }
.cards-widget.cards-accent-right .mini-card-hover-overlay { border-radius:var(--card-radius) 0 0 var(--card-radius); }
/* Step 930: Die Akzentkante muss nach der allgemeinen Karten-Border stehen.
   Zuvor wurden border-top/-bottom/-left/-right direkt danach durch
   .mini-card { border:1px solid ... } wieder überschrieben. */
.cards-widget.cards-accent-top .mini-card { border-top:var(--cards-accent-width,3px) solid var(--cards-accent-color,#f5b400); }
.cards-widget.cards-accent-bottom .mini-card { border-bottom:var(--cards-accent-width,3px) solid var(--cards-accent-color,#f5b400); }
.cards-widget.cards-accent-left .mini-card { border-left:var(--cards-accent-width,3px) solid var(--cards-accent-color,#f5b400); }
.cards-widget.cards-accent-right .mini-card { border-right:var(--cards-accent-width,3px) solid var(--cards-accent-color,#f5b400); }
/* Gestaffelte Infokarten-Animation: Der Animations-Wrapper trennt die
   Scroll-Transition von der eigenen Hover-Transition der Karte. */
.cms-card-reveal { min-width:0; display:flex; }
.cms-card-reveal > .mini-card,
.cms-card-reveal > .hero-feature { width:100%; box-sizing:border-box; }
.mini-card h3, .mini-card .mini-card-title { margin:0 0 6px; font-size:1.2rem; letter-spacing:-.02em; }
.mini-card p { margin:0; color:#475569; }
.mini-card img { width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:var(--card-radius); border:1px solid var(--line); margin-bottom:6px; }
.mini-card .btn { align-self:flex-start; margin-top:auto; padding:11px 16px; font-size:.94rem; }
.cards-widget.cards-compact .grid3 { gap:14px; }
.cards-widget.cards-compact .mini-card { padding:calc(var(--card-pad) * .78); gap:8px; }
.cards-widget.cards-compact .mini-card h3, .cards-widget.cards-compact .mini-card .mini-card-title { font-size:1.08rem; }
.cards-widget.cards-image .grid3 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; align-items:stretch; }
.cards-widget.cards-image .mini-card { padding:0; overflow:hidden; gap:0; display:flex; flex-direction:column; }
.cards-widget.cards-image .mini-card img { width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; display:block; border:0; border-radius:0; margin:0; background:#eef2ff; }
.cards-widget.cards-image .mini-card h3, .cards-widget.cards-image .mini-card .mini-card-title, .cards-widget.cards-image .mini-card p, .cards-widget.cards-image .mini-card .btn { margin-left:var(--card-pad); margin-right:var(--card-pad); }
.cards-widget.cards-image .mini-card h3, .cards-widget.cards-image .mini-card .mini-card-title { margin-top:var(--card-pad); }
.cards-widget.cards-image .mini-card p { flex:1; }
.cards-widget.cards-image .mini-card .btn { margin-bottom:var(--card-pad); align-self:flex-start; }
.cards-widget.cards-screenshots .grid3 { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; align-items:stretch; }
.cards-widget.cards-screenshots .mini-card { padding:22px; overflow:hidden; gap:0; display:flex; flex-direction:column; border-radius:20px; border:1px solid #dbe3ef; box-shadow:0 16px 42px rgba(15,23,42,.08); background:#fff; }
.cards-widget.cards-screenshots .mini-card:hover { transform:translateY(-3px); box-shadow:0 20px 52px rgba(15,23,42,.12); }
.cards-widget.cards-screenshots .mini-card img { width:100%; height:180px; aspect-ratio:auto; object-fit:contain; object-position:center center; display:block; border:1px solid #dbe3ef; border-radius:16px; margin:0 0 18px; background:#fff; }
.cards-widget.cards-screenshots .mini-card h3, .cards-widget.cards-screenshots .mini-card .mini-card-title { margin:0 0 10px; font-size:1.18rem; color:#0f172a; }
.cards-widget.cards-screenshots .mini-card p { margin:0; color:#64748b; line-height:1.55; flex:1; }
.cards-widget.cards-screenshots .mini-card .btn { margin:16px 0 0; align-self:flex-start; }
.mini-card.screenshot-lightbox { cursor:pointer; transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.mini-card.screenshot-lightbox:hover { transform:translateY(-4px); box-shadow:0 26px 70px rgba(15,23,42,.18); border-color:rgba(37,99,235,.28); }
.mini-card.screenshot-lightbox:focus-visible { outline:3px solid rgba(37,99,235,.45); outline-offset:4px; }
.cards-image-lightbox { cursor:pointer; }
.cards-image-lightbox:focus-visible { outline:3px solid rgba(37,99,235,.45); outline-offset:4px; border-radius:inherit; }
@media(max-width:1280px) { .cards-widget.cards-cols-5 .grid3, .cards-widget.cards-cols-6 .grid3 { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:1050px) { .cards-widget.cards-cols-4 .grid3, .cards-widget.cards-cols-5 .grid3, .cards-widget.cards-cols-6 .grid3 { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:1050px) { .cards-widget.cards-screenshots .grid3 { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:720px) { .cards-widget.cards-screenshots .grid3 { grid-template-columns:1fr; } .cards-widget.cards-screenshots .mini-card img { height:auto; } }
.text-widget table, .cms-text-table { width:100%; border-collapse:collapse; margin:18px 0; overflow:hidden; border-radius:14px; }
.text-widget th, .text-widget td, .cms-text-table th, .cms-text-table td { border:1px solid var(--line); padding:10px 12px; text-align:left; vertical-align:top; }
.text-widget th, .cms-text-table th { background:#f8fafc; color:#0f172a; font-weight:700; }
@media(max-width:720px) { .text-widget table, .cms-text-table { display:block; overflow-x:auto; white-space:nowrap; } }
/* Step 901: Normale Textzeilen im Text-Widget kompakt halten. Der Editor
   speichert einfache Zeilenumbrüche als <br>; dafür soll nicht die globale
   Fließtext-Zeilenhöhe des Themes gelten. Strukturierte Inhalte wie Listen,
   Tabellen und Überschriften behalten ihre bestehenden Regeln. */
.text-widget > p { line-height:1.4; }
.cms-list { list-style:none; padding-left:1.55em; }
.cms-list > li { position:relative; }
.cms-list > li::before { position:absolute; left:-1.35em; font-weight:700; }
.cms-list-arrow > li::before { content:'→'; }
.cms-list-check > li::before { content:'✓'; }
.cms-list-dash > li::before { content:'–'; }
.cms-code-block { margin:18px 0; padding:12px 14px 12px 48px; border:1px solid #d7dee8; border-radius:4px; background:#f8fafc; color:#0f172a; font-family:"Courier New",Consolas,monospace; font-size:.92rem; line-height:1.55; overflow-x:auto; }
.cms-code-block > li { padding-left:10px; white-space:nowrap; }
.cms-code-block > li::marker { color:#64748b; font-variant-numeric:tabular-nums; }
.cms-code-block code { font:inherit; color:inherit; background:transparent; white-space:pre; }
@media(max-width:720px) { .cms-code-block { padding-left:40px; font-size:.86rem; } }
.text-widget-actions { display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin-top:22px; }
.text-widget-actions .btn { margin:0; }
.text-widget-actions .btn.btn-secondary { background:#ffffff !important; color:var(--primary) !important; border:1px solid rgba(37,99,235,.24); box-shadow:0 12px 24px rgba(15,23,42,.08); }
.text-widget-actions .btn.btn-secondary:hover { background:var(--primary) !important; border-color:var(--primary); color:#ffffff !important; box-shadow:0 20px 36px rgba(37,99,235,.28); }
.cards-widget.cards-pricing .grid3 { grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); }
.cards-widget.cards-pricing .mini-card { text-align:center; align-items:center; }
.cards-widget.cards-pricing .mini-card .btn { align-self:center; }

/* Step 759: Die äußere Widget-Breite und die interne Tarifanzahl sind
   unabhängig. Eine Preistabelle mit „Volle Breite“ nutzt deshalb den gesamten
   zugewiesenen Widget-Slot; die Karten teilen diesen Platz gleichmäßig auf. */
/* Step 762: Die Preistabelle verwendet dieselbe äußere widget-plain-Hülle wie
   die Vergleichstabelle. Dadurch liegen Überschrift und Inhalt bei gesetztem
   Widget-Hintergrund im einheitlichen Karten-Innenabstand. */
.pricing-widget { width:100%; min-width:0; box-sizing:border-box; }
.pricing-widget .pricing-grid { display:grid; width:100%; min-width:0; box-sizing:border-box; gap:22px; margin-top:24px; justify-items:stretch; }
.pricing-widget.pricing-cols-1 .pricing-grid { grid-template-columns:1fr; }
.pricing-widget.pricing-cols-2 .pricing-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.pricing-widget.pricing-cols-3 .pricing-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.pricing-widget.pricing-cols-4 .pricing-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.pricing-card { width:100%; min-width:0; box-sizing:border-box; position:relative; overflow:hidden; background:var(--card); border:1px solid var(--line); border-radius:var(--card-radius); padding:34px 30px; box-shadow:var(--card-shadow); display:flex; flex-direction:column; gap:18px; min-height:100%; }
.pricing-card.is-highlight { border-color:var(--primary); transform:translateY(-4px); }
.pricing-card h3 { margin:0; text-align:center; font-size:1.35rem; }
.pricing-subtitle { margin:-12px 0 8px; text-align:center; color:var(--muted); }
.pricing-offer { display:flex; flex-direction:column; align-items:center; gap:5px; margin:2px 0 -2px; text-align:center; }
.pricing-offer-label { display:inline-flex; align-items:center; justify-content:center; min-height:26px; padding:4px 12px; border-radius:999px; background:color-mix(in srgb, var(--primary) 12%, white); color:var(--primary); font-size:.78rem; font-weight:800; letter-spacing:.02em; }
.pricing-old-price { color:var(--muted); font-size:1.15rem; font-weight:700; line-height:1.2; text-decoration:line-through; text-decoration-thickness:2px; }
.pricing-price { display:flex; align-items:flex-start; justify-content:center; gap:6px; margin:4px 0 10px; color:#1f2937; }
.pricing-price strong { font-size:clamp(2.4rem,5vw,4rem); line-height:.95; letter-spacing:-.06em; }
.pricing-price span { color:var(--muted); align-self:flex-end; padding-bottom:8px; }
.pricing-features { display:grid; gap:13px; padding:20px 0 4px; border-top:1px solid var(--line); margin:0; list-style:none; }
.pricing-features li { position:relative; padding-left:26px; color:#334155; }
.pricing-features li::before { content:'✓'; position:absolute; left:0; color:var(--primary); font-weight:800; }
.pricing-card .btn { align-self:center; min-width:180px; text-align:center; margin-top:auto; }
.pricing-badge { position:absolute; top:18px; right:-42px; transform:rotate(45deg); background:var(--primary); color:#fff; font-weight:800; font-size:.78rem; padding:8px 44px; box-shadow:0 12px 28px rgba(15,23,42,.16); }
@media(max-width:1050px){ .pricing-widget.pricing-cols-4 .pricing-grid, .pricing-widget.pricing-cols-3 .pricing-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:720px){ .pricing-widget .pricing-grid { grid-template-columns:1fr !important; } .pricing-card { padding:28px 24px; } }

.comparison-table { width:100%; border-collapse:separate; border-spacing:0; overflow:hidden; border-radius:18px; border:1px solid var(--line); background:#fff; }
.comparison-table th, .comparison-table td { padding:15px 18px; text-align:left; border-bottom:none; }
.comparison-table th { background:#f8fafc; color:#0f172a; }
.comparison-table tr:last-child td { border-bottom:0; }
.comparison-table td:nth-child(2), .comparison-table td:nth-child(3) { font-weight:700; }

/* Download-Seite: Widget-Ausgabe optisch identisch zur MASTER-Version */
.download-widget-section { padding:15px 0 !important; }
.download-widget-section:first-child { padding-top:42px !important; }
.download-widget-section:last-child { padding-bottom:42px !important; }
.download-widget-section .widget-row { display:block !important; }
.download-widget-section .widget-slot { display:block !important; }
/* Step 766: Der Download-Hauptbereich unterstützt die allgemeine Widget-Breite.
   Die bisherigen Download-Seiten-Regeln schalteten jede Download-Reihe pauschal
   auf display:block und hoben damit 1/3, 1/2 und 2/3 vollständig auf. Nur für
   diese Vorlage wird deshalb das normale 6-Spalten-Raster wieder aktiviert. */
.download-widget-section.download-main-widget-section .widget-row {
  display:grid !important;
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;
}
.download-widget-section.download-main-widget-section .widget-slot.width-full { grid-column:span 6 !important; }
.download-widget-section.download-main-widget-section .widget-slot.width-half { grid-column:span 3 !important; }
.download-widget-section.download-main-widget-section .widget-slot.width-third { grid-column:span 2 !important; }
.download-widget-section.download-main-widget-section .widget-slot.width-two-third { grid-column:span 4 !important; }
.download-intro{background:linear-gradient(135deg,#ffffff 0%,#eef4ff 100%);border:1px solid #dbeafe;border-radius:24px;padding:34px;box-shadow:0 18px 50px rgba(15,23,42,.08)}
.download-intro .eyebrow{font-size:.86rem;font-weight:800;color:#2563eb;text-transform:uppercase;letter-spacing:.08em;margin:0 0 10px}
.download-intro h2{margin:.1rem 0 .7rem;font-size:clamp(2rem,4vw,3rem);letter-spacing:-.045em}
.download-intro p{max-width:820px;color:#475569;font-size:1.08rem;line-height:1.75}
.download-main-card{background:#fff;border:1px solid #dbe3ef;border-radius:26px;padding:34px;box-shadow:0 20px 55px rgba(15,23,42,.10);display:grid;grid-template-columns:1.25fr .75fr;gap:30px;align-items:start}
.download-main-card h1,.download-main-card h2,.download-main-card h3,.download-main-card h4,.download-main-card h5,.download-main-card h6{margin:.2rem 0 .7rem}
.download-main-card p{color:#475569;line-height:1.75}
.download-install-note{margin-top:18px;padding:14px 16px;border:1px solid #dbe3ef;border-radius:14px;background:#f8fafc;color:#475569}
.download-install-note-title{display:block;margin-bottom:8px;color:#0f172a;font-weight:700}
.download-install-note p strong,
.download-install-note li strong{display:inline;margin:0;color:inherit;font-weight:700}
.download-install-note p{margin:0 0 8px;line-height:1.6}
.download-install-note p:last-child{margin-bottom:0}
.download-install-note ol{margin:8px 0 0;padding-left:24px}
.download-install-note li{margin:6px 0;line-height:1.6}
.download-install-note code{padding:2px 5px;border-radius:5px;background:#e2e8f0;color:#0f172a;font-size:.92em}
.download-badge{display:inline-flex;align-items:center;gap:8px;background:#eff6ff;color:#2563eb;border:1px solid #bfdbfe;border-radius:999px;padding:8px 12px;font-weight:800;font-size:.86rem}
.download-meta-column{display:flex;flex-direction:column;align-items:stretch;gap:0;min-width:0}
.download-version-sticker{position:relative;width:184px;height:184px;margin:-12px auto -2px;filter:drop-shadow(0 12px 16px rgba(15,23,42,.22));transform:rotate(7deg);flex:0 0 auto}
.download-version-sticker::before{content:"";position:absolute;inset:0;background:#fff;clip-path:polygon(29% 2%,72% 2%,98% 29%,98% 71%,71% 98%,29% 98%,2% 71%,2% 29%)}
.download-version-sticker-inner{position:absolute;inset:7px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;padding:20px 18px 15px;background:linear-gradient(145deg,#ef2348 0%,#df1236 55%,#c8082d 100%);color:#fff;clip-path:polygon(29% 2%,72% 2%,98% 29%,98% 71%,71% 98%,29% 98%,2% 71%,2% 29%);text-align:center}
.download-version-sticker-icon{font-family:"FontAwesome";font-size:38px;line-height:1;margin:0 0 6px}
.download-version-sticker-icon::before{content:"\f0a1"}
.download-version-sticker-text{display:block;max-width:138px;font-size:1.34rem;line-height:1.16;font-weight:900;letter-spacing:-.02em;overflow:visible;overflow-wrap:break-word}
.download-version-sticker-swoosh{width:74px;height:8px;margin-top:7px;border-top:6px solid rgba(255,255,255,.94);border-radius:50%;transform:rotate(4deg)}
.download-meta{display:grid;gap:12px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:20px;padding:20px}
.download-meta div{display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid #e2e8f0;padding-bottom:10px}
.download-meta div:last-child{border-bottom:0;padding-bottom:0}
.download-meta span{color:#64748b}
.download-meta strong{color:#0f172a}
.download-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}
.requirement-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.requirement-card{background:#fff;border:1px solid #dbe3ef;border-radius:22px;padding:22px;box-shadow:0 14px 40px rgba(15,23,42,.07)}
.requirement-card strong{display:block;font-size:1.05rem;margin-bottom:8px}
.requirement-card p{margin:0;color:#475569;line-height:1.6}
.install-steps{background:#fff;border:1px solid #dbe3ef;border-radius:24px;padding:30px;box-shadow:0 18px 45px rgba(15,23,42,.08)}
.install-steps h3{margin-top:0;font-size:1.7rem}
.step-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:20px}
.step{background:#f8fafc;border:1px solid #e2e8f0;border-radius:20px;padding:20px}
.step span{display:inline-flex;width:34px;height:34px;border-radius:999px;background:#2563eb;color:#fff;align-items:center;justify-content:center;font-weight:900;margin-bottom:12px}
.install-steps .step .step-number{display:inline-flex !important;width:34px !important;height:34px !important;min-width:34px !important;min-height:34px !important;border-radius:999px !important;background:#2563eb !important;color:#ffffff !important;align-items:center !important;justify-content:center !important;font-weight:900 !important;margin:0 0 12px 0 !important;line-height:1 !important;text-decoration:none !important}
.step strong{display:block;margin-bottom:8px}
.step p{margin:0;color:#475569;line-height:1.6}
.download-note{background:#f8fafc;border:1px solid #dbe3ef;border-radius:20px;padding:22px;color:#475569;line-height:1.7}
.closing-cta{background:var(--cms-widget-bg,var(--primary)) !important;color:#fff !important;border-radius:26px !important;padding:34px !important;display:flex !important;align-items:center !important;justify-content:space-between !important;gap:24px !important;box-shadow:0 24px 70px rgba(15,23,42,.20) !important}
.closing-cta h2,.closing-cta h3{color:#ffffff !important;margin:.1rem 0 .6rem !important;font-size:clamp(1.8rem,3vw,2.6rem)}
.closing-cta p{color:rgba(255,255,255,.86) !important;line-height:1.65 !important;margin:0 !important}
.closing-cta .eyebrow{display:inline-flex !important;width:max-content !important;background:rgba(255,255,255,.12) !important;color:#ffffff !important;border:1px solid rgba(255,255,255,.30) !important;border-radius:999px !important;padding:7px 12px !important;font-size:.78rem !important;font-weight:800 !important;text-transform:uppercase !important;letter-spacing:.08em !important;margin:0 0 12px !important}
.closing-cta-actions{display:grid !important;gap:12px !important;min-width:260px !important}
.closing-cta .btn,.closing-cta .btn-secondary{min-height:52px !important;height:auto !important;padding:14px 22px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;background:#ffffff !important;color:var(--primary) !important;border:2px solid #ffffff !important;border-radius:var(--button-radius) !important;font-weight:800 !important;text-decoration:none !important;box-shadow:0 14px 28px rgba(15,23,42,.12) !important}
.closing-cta .btn:hover,.closing-cta .btn-secondary:hover{background:rgba(255,255,255,.92) !important;color:var(--primary) !important;transform:translateY(-2px) !important;box-shadow:0 18px 34px rgba(15,23,42,.18) !important}
@media(max-width:900px){.requirement-grid,.step-list{grid-template-columns:repeat(2,minmax(0,1fr))}.closing-cta-actions{min-width:0}}
@media(max-width:820px){.closing-cta{display:block !important;padding:26px !important}.closing-cta-actions{min-width:0 !important;margin-top:20px !important;width:100% !important}.closing-cta .btn,.closing-cta .btn-secondary{width:100% !important;text-align:center !important}}
@media(max-width:700px){.download-main-card{grid-template-columns:1fr}.download-meta-column{align-items:center}.download-meta{width:100%;box-sizing:border-box}.download-version-sticker{display:none !important}}
@media(max-width:620px){
  /* Step 1063: Download-Hauptbereich auf Smartphones immer auf die
     tatsächlich verfügbare Breite setzen. Eine gespeicherte 1/3-, 1/2-
     oder 2/3-Desktopbreite darf den Inhalt mobil nicht verengen. */
  .download-widget-section.download-main-widget-section .widget-row{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
  }
  .download-widget-section.download-main-widget-section .widget-slot.width-full,
  .download-widget-section.download-main-widget-section .widget-slot.width-half,
  .download-widget-section.download-main-widget-section .widget-slot.width-third,
  .download-widget-section.download-main-widget-section .widget-slot.width-two-third{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    grid-column:auto !important;
    box-sizing:border-box !important;
  }
  .requirement-grid,.step-list{grid-template-columns:1fr}
  .intro-card,.download-intro,.install-steps,.closing-cta{padding:24px}
  .download-main-card{
    grid-template-columns:minmax(0,1fr) !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    gap:20px !important;
    padding:18px !important;
    overflow:hidden;
  }
  .download-main-card > *{
    min-width:0 !important;
    max-width:100% !important;
  }
  .download-badge{
    max-width:100%;
    box-sizing:border-box;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .download-version-sticker{width:156px;height:156px;margin:0 auto -2px}
  .download-version-sticker-inner{padding:19px 16px 15px}
  .download-version-sticker-icon{font-size:31px;margin-bottom:5px}
  .download-version-sticker-text{max-width:116px;font-size:1.16rem}
  .download-version-sticker-swoosh{width:62px;height:7px;margin-top:8px;border-top-width:5px}
  .download-actions{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    width:100%;
    min-width:0;
  }
  .download-actions .btn,
  .download-actions .btn-secondary{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    white-space:normal !important;
    overflow-wrap:anywhere;
    text-align:center;
  }
  .download-install-note{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
    padding:14px;
    overflow-wrap:anywhere;
    word-break:normal;
  }
  .download-install-note p,
  .download-install-note li,
  .download-install-note code{
    max-width:100%;
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  .download-install-note ol{
    padding-left:20px;
  }
  .download-meta{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    padding:16px !important;
    gap:10px;
  }
  .download-meta div{
    min-width:0;
    gap:12px;
  }
  .download-meta span,
  .download-meta strong{
    min-width:0;
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  .download-meta strong{
    text-align:right;
  }
}
.parallax-widget-section{padding-top:0 !important;padding-bottom:0 !important}
.parallax-container{position:relative;min-height:var(--parallax-min-height,430px);display:flex;align-items:center;justify-content:center;overflow:hidden;background-image:var(--parallax-image);background-size:cover;background-position:center center;background-repeat:no-repeat;background-attachment:fixed}
.parallax-overlay{position:absolute;inset:0;background:rgba(15,23,42,.58)}
.parallax-content{position:relative;z-index:1;width:min(900px,calc(100% - 48px));margin:0 auto;padding:72px 24px;text-align:center;color:#fff}
.parallax-content.parallax-content-with-columns{width:calc(100% - 48px);max-width:none}
.parallax-content h1,.parallax-content h2,.parallax-content h3{color:#fff !important;margin:0 0 16px}
.parallax-content p{color:rgba(255,255,255,.92) !important;font-size:clamp(1rem,1.5vw,1.2rem);line-height:1.65;margin:0 auto;max-width:760px}
.parallax-actions{margin-top:26px}
.parallax-actions .btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;border-radius:var(--button-radius);text-decoration:none;font-weight:800}
.parallax-columns{display:grid;gap:22px;margin-top:30px;text-align:left}
.parallax-columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.parallax-columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.parallax-columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.parallax-column{padding:18px 20px;border:1px solid rgba(255,255,255,.28);border-radius:14px;background:rgba(15,23,42,.34)}
/* Step 1131: Bei Bild/Text-Blöcken füllt das Bild seine komplette Hälfte aus.
   Nur reine Textblöcke behalten den bisherigen Innenabstand. */
.parallax-column.parallax-column-has-media{padding:0;overflow:hidden}
.parallax-column.parallax-column-media-only{padding:0;overflow:hidden;min-height:240px}
.parallax-column-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;align-items:stretch;min-height:100%}
.parallax-column-media{min-width:0;min-height:100%;overflow:hidden}
.parallax-column-media img{display:block;width:100%;height:100%;min-height:100%;object-fit:cover;border-radius:0}
.parallax-column-copy{min-width:0;padding:20px 22px;display:flex;flex-direction:column;justify-content:center}
.parallax-column-media-only .parallax-column-inner{display:block;height:100%;min-height:240px}
.parallax-column-media-only .parallax-column-media{width:100%;height:100%;min-height:240px}
.parallax-column-media-only .parallax-column-media img{width:100%;height:100%;min-height:240px;object-fit:cover}
.parallax-column-media .gallery-open{display:block;width:100%;height:100%;padding:0;border:0;background:transparent;cursor:zoom-in}
.parallax-column-media .gallery-open img{display:block;width:100%;height:100%;object-fit:cover}
.parallax-column h3{margin:0 0 8px;color:#fff !important;font-size:clamp(1rem,1.35vw,1.2rem)}
.parallax-column p{margin:0 !important;max-width:none !important;font-size:.96rem !important;line-height:1.5 !important}
.parallax-column-richtext h1,.parallax-column-richtext h2,.parallax-column-richtext h3{margin:0 0 10px;color:inherit !important}
.parallax-column-richtext p{margin:0 0 8px !important}
.parallax-column-richtext ul,.parallax-column-richtext ol{margin:8px 0;padding-left:24px;color:inherit}
.parallax-column-richtext li{margin:4px 0;line-height:1.5}
.parallax-column-richtext a{color:inherit;text-decoration:underline}
.parallax-column-richtext blockquote{margin:10px 0;padding:10px 14px;border-left:4px solid rgba(255,255,255,.65);background:rgba(255,255,255,.1);border-radius:6px}
.parallax-column-richtext table{width:100%;margin:10px 0;border-collapse:collapse;color:inherit}
.parallax-column-richtext th,.parallax-column-richtext td{padding:8px;border:1px solid rgba(255,255,255,.35);text-align:left}
@keyframes parallaxColumnFromLeft{from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:translateX(0)}}
@keyframes parallaxColumnFromRight{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:translateX(0)}}
@keyframes parallaxColumnFromBottom{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.parallax-column-from-left{animation:parallaxColumnFromLeft .65s ease-out both}
.parallax-column-from-right{animation:parallaxColumnFromRight .65s ease-out both}
.parallax-column-from-bottom{animation:parallaxColumnFromBottom .65s ease-out both}
/* Step 904: Die Breitenwahl der Parallax-Vorlage wird ausschließlich für diese
   Vorlage explizit an das 6-Spalten-Widgetraster gebunden. Damit entsprechen
   Volle Breite, 2/3, 1/2 und 1/3 exakt den übrigen Widgetbreiten, ohne die
   globale Layout-Engine oder andere Widgets zu verändern. */
.parallax-template-section .widget-row{display:grid !important;grid-template-columns:repeat(6,minmax(0,1fr)) !important}
.parallax-template-section .widget-slot.width-full{grid-column:span 6 !important}
.parallax-template-section .widget-slot.width-two-third{grid-column:span 4 !important}
.parallax-template-section .widget-slot.width-half{grid-column:span 3 !important}
.parallax-template-section .widget-slot.width-third{grid-column:span 2 !important}
.parallax-template-section .parallax-container{width:100% !important;max-width:none !important;box-sizing:border-box}
/* Step 905: Nur die Parallax-Vorlage kann den globalen Seitenrand bewusst
   ignorieren. Bei normaler Bereichsbreite bleibt die zentrale Maximalbreite
   erhalten; bei voller Browserbreite reicht der Inhalt exakt bis an den
   verfügbaren Rand. */
.parallax-template-section.parallax-ignore-page-margin > .container{width:min(var(--container-width),100%) !important;max-width:none;margin-left:auto !important;margin-right:auto !important}
.section-fullwidth.cms-widget-browser-fullwidth.parallax-template-section.parallax-ignore-page-margin > .container{width:100% !important;max-width:none !important;margin-left:0 !important;margin-right:0 !important}
@media(max-width:900px){.parallax-container{min-height:var(--parallax-min-height-tablet,360px);background-attachment:scroll}.parallax-content{padding:58px 20px;width:min(820px,calc(100% - 32px))}.parallax-columns-3,.parallax-columns-4{grid-template-columns:repeat(2,minmax(0,1fr))}.parallax-column-media-only{align-self:start;min-height:0}.parallax-column-media-only .parallax-column-inner,.parallax-column-media-only .parallax-column-media{height:auto;min-height:0}.parallax-column-media-only .parallax-column-media img{width:100%;height:auto;min-height:0;object-fit:contain}.parallax-column-media-only .gallery-open{height:auto}}

/* Step 1139: Unterhalb Desktop werden Parallax-Inhaltsblöcke konsequent
   einspaltig dargestellt. Bildblöcke bleiben proportional und vollständig. */
@media(max-width:1024px){
  .parallax-columns{
    grid-template-columns:1fr !important;
  }
  .parallax-column{
    width:100% !important;
    min-width:0 !important;
  }
  .parallax-column.parallax-column-media-only{
    min-height:0 !important;
    height:auto !important;
  }
  .parallax-column-media-only .parallax-column-inner,
  .parallax-column-media-only .parallax-column-media{
    min-height:0 !important;
    height:auto !important;
  }
  .parallax-column-media-only .parallax-column-media img,
  .parallax-column-media .gallery-open,
  .parallax-column-media .gallery-open img{
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    object-fit:contain !important;
  }
  .parallax-column-media .gallery-open{
    display:block !important;
  }
}

@media(max-width:1024px) and (orientation:landscape){
  .parallax-columns{
    grid-template-columns:1fr !important;
  }
  .parallax-column-media-only,
  .parallax-column-media-only .parallax-column-inner,
  .parallax-column-media-only .parallax-column-media,
  .parallax-column-media-only .parallax-column-media img{
    height:auto !important;
    min-height:0 !important;
  }
}
@media(max-width:620px){.parallax-container{min-height:var(--parallax-min-height-mobile,320px)}.parallax-content{padding:48px 16px;width:calc(100% - 24px)}.parallax-columns{grid-template-columns:1fr}}



/* Öffnungszeiten-Widget */
.opening-hours-widget{background:#fff;border:1px solid #dbe3ef;border-radius:24px;padding:var(--card-pad);box-shadow:var(--card-shadow);width:100%;max-width:none;box-sizing:border-box;container-type:inline-size}
.opening-hours-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px;align-items:start;margin-bottom:22px}
.opening-hours-head h2{margin:0 0 8px;color:#0f172a;line-height:1.1;overflow-wrap:anywhere}
.opening-hours-head p{margin:0;color:#475569;line-height:1.65;overflow-wrap:anywhere}
.opening-hours-status{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 16px;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-weight:850;border:1px solid #bfdbfe;white-space:nowrap;max-width:100%;box-sizing:border-box}
.opening-hours-status.is-open{background:#dcfce7;color:#166534;border-color:#bbf7d0}
.opening-hours-status.is-closed{background:#fef2f2;color:#991b1b;border-color:#fecaca}
.opening-hours-list{display:grid;gap:10px;width:100%}
.opening-hours-row{display:grid;grid-template-columns:minmax(120px,1fr) minmax(0,auto) minmax(0,1.2fr);gap:14px;align-items:center;border:1px solid #e2e8f0;background:#f8fafc;border-radius:16px;padding:14px 16px;color:#334155;min-width:0;box-sizing:border-box}
.opening-hours-row strong{color:#0f172a;min-width:0}
.opening-hours-row.is-today{border-color:#bfdbfe;background:#eff6ff;box-shadow:0 10px 28px rgba(37,99,235,.08)}
.opening-hours-times{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-width:0}
.opening-hours-time{display:inline-flex;align-items:center;border-radius:999px;padding:5px 10px;background:#ffffff;border:1px solid #dbeafe;color:#1e293b;font-weight:750;white-space:nowrap;max-width:100%;box-sizing:border-box}
.opening-hours-time.is-closed{background:#f1f5f9;border-color:#e2e8f0;color:#64748b}
.opening-hours-note{color:#64748b;font-size:.95rem;min-width:0;overflow-wrap:anywhere}
@container (max-width:720px){.opening-hours-head{grid-template-columns:1fr;gap:12px;margin-bottom:18px}.opening-hours-status{justify-self:start;white-space:normal;text-align:center;min-height:38px;padding:8px 14px}.opening-hours-row{grid-template-columns:minmax(0,1fr);gap:8px;padding:12px 14px}.opening-hours-times{gap:6px}}
@container (max-width:420px){.opening-hours-widget{border-radius:18px}.opening-hours-head h2{font-size:clamp(1.45rem, 8cqw, 2rem)}.opening-hours-row{padding:11px 12px}.opening-hours-time{padding:4px 8px;font-size:.94rem}}
@media(max-width:760px){.opening-hours-head{grid-template-columns:1fr}.opening-hours-status{justify-self:start;white-space:normal}.opening-hours-row{grid-template-columns:1fr;gap:8px}.opening-hours-times{gap:5px}}

/* FAQ-Seite: Widget-Ausgabe optisch identisch zur MASTER-Version */
.faq-widget-section { padding:15px 0 !important; }
.faq-widget-section:first-child { padding-top:42px !important; }
.faq-widget-section:last-child { padding-bottom:42px !important; }
.faq-widget-section .widget-row { display:block !important; }
.faq-widget-section .widget-slot { display:block !important; }
.faq-intro{background:linear-gradient(135deg,#ffffff 0%,#eef4ff 100%);border:1px solid #dbeafe;border-radius:24px;padding:34px;box-shadow:0 18px 50px rgba(15,23,42,.08)}
.faq-intro .eyebrow{font-size:.86rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin:0 0 10px;color:#2563eb}
.faq-intro h2{margin:0 0 10px;font-size:clamp(28px,4vw,42px);line-height:1.08;color:#0f172a}
.faq-intro p{max-width:760px;color:#475569;font-size:18px;line-height:1.65;margin:0}
.faq-group{background:#ffffff;border:1px solid #e2e8f0;border-radius:24px;padding:26px;box-shadow:0 14px 40px rgba(15,23,42,.06)}
.faq-group h2{margin:0 0 24px;color:#0f172a;font-size:24px}
.faq-list{display:grid;gap:12px}
.faq-item{border:1px solid #dbeafe;border-radius:16px;background:#f8fafc;overflow:hidden}
.faq-item summary{cursor:pointer;list-style:none;padding:18px 20px;font-weight:700;color:#0f172a;display:flex;align-items:center;justify-content:space-between;gap:16px}
.faq-widget-root.has-question-active-color .faq-item summary{transition:background-color .18s ease,color .18s ease}
.faq-widget-root.has-question-active-color .faq-item summary:hover,
.faq-widget-root.has-question-active-color .faq-item[open] summary{background-color:var(--faq-question-active-color);color:var(--faq-question-active-text)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';font-size:22px;color:var(--primary);line-height:1;font-weight:700}
.faq-widget-root.has-question-active-color .faq-item summary:hover::after,
.faq-widget-root.has-question-active-color .faq-item[open] summary::after{color:var(--faq-question-active-text)}
.faq-item[open] summary::after{content:'–'}
/* Step 1474: Geöffnete FAQ-Antworten erhalten oben denselben kleinen
   Innenabstand wie unten. */
.faq-item p{margin:0;padding:18px 20px;color:#475569;line-height:1.65}
/* Step 509: FAQ-Hintergrund einheitlich in Website- und Widget-Vorschau.
   Bei bewusst gesetztem Widget-Hintergrund bildet die FAQ-Wurzel die äußere
   Fläche. Intro, Gruppen und Fragekarten übernehmen diese Fläche, statt eigene
   feste Weiß-/Grauwerte darüberzulegen. */
.cms-widget-surface .faq-widget-root{
  background:transparent !important;
}
.cms-widget-surface .faq-intro,
.cms-widget-surface .faq-group{
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
.cms-widget-surface .faq-item{
  background:transparent !important;
  border-color:color-mix(in srgb, var(--cms-widget-text, #0f172a) 22%, transparent) !important;
  box-shadow:none !important;
}
.cms-widget-surface .faq-item summary,
.cms-widget-surface .faq-item p,
.cms-widget-surface .faq-item summary::after{
  color:var(--cms-widget-text, #0f172a) !important;
}
/* Step 957/958: Die allgemeine FAQ-Textfarbe aus Step 509 darf den expliziten
   Hover-/Aktiv-Kontrast nicht uebersteuern. In der Website liegt
   .cms-widget-surface als aeussere Flaeche vor der FAQ-Wurzel. In der separaten
   Widget-Vorschau wird dieselbe Klasse direkt auf .faq-widget-root gesetzt.
   Deshalb werden bewusst beide bestehenden Strukturvarianten abgedeckt. */
.cms-widget-surface .faq-widget-root.has-question-active-color .faq-item summary:hover,
.cms-widget-surface .faq-widget-root.has-question-active-color .faq-item[open] summary,
.cms-widget-surface.faq-widget-root.has-question-active-color .faq-item summary:hover,
.cms-widget-surface.faq-widget-root.has-question-active-color .faq-item[open] summary{
  color:var(--faq-question-active-text) !important;
}
.cms-widget-surface .faq-widget-root.has-question-active-color .faq-item summary:hover::after,
.cms-widget-surface .faq-widget-root.has-question-active-color .faq-item[open] summary::after,
.cms-widget-surface.faq-widget-root.has-question-active-color .faq-item summary:hover::after,
.cms-widget-surface.faq-widget-root.has-question-active-color .faq-item[open] summary::after{
  color:var(--faq-question-active-text) !important;
}
@media(max-width:760px){.faq-intro,.faq-group{padding:24px}.faq-item summary{align-items:flex-start}}

/* Über-uns-Seite: echte Widget-Ausgabe im MASTER-Layout */
.about-widget-section { padding:15px 0 !important; }
.about-widget-section:first-child { padding-top:42px !important; }
.about-widget-section:last-child { padding-bottom:42px !important; }
.about-widget-section .widget-row { gap:24px !important; align-items:stretch !important; }
.about-widget-section .widget-slot { display:flex !important; align-items:stretch !important; align-self:stretch !important; height:auto !important; }
.about-widget-section .widget-slot > * { flex:1 1 auto !important; }
.about-widget-section .widget-slot > .about-panel { height:100% !important; min-height:100% !important; }
.about-intro{background:linear-gradient(135deg,#ffffff 0%,#eef4ff 100%);border:1px solid #dbeafe;border-radius:24px;padding:34px;box-shadow:0 18px 50px rgba(15,23,42,.08)}
.about-intro .eyebrow,.about-cta .eyebrow{font-size:.86rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin:0 0 10px;color:#2563eb}
.about-intro h2{margin:.1rem 0 .7rem;font-size:clamp(2rem,4vw,3rem);letter-spacing:-.045em;color:#0f172a;line-height:1.08}
.about-intro p{max-width:850px;color:#475569;font-size:1.08rem;line-height:1.75;margin:0}
.about-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;width:100%}
.about-card{background:#fff;border:1px solid #dbe3ef;border-radius:22px;padding:24px;box-shadow:0 14px 40px rgba(15,23,42,.07)}
.about-card .icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#dbeafe;color:#1d4ed8;font-size:24px;margin-bottom:14px}
.about-card h3{margin:0 0 8px;color:#0f172a;font-size:1.15rem}
.about-card p{margin:0;color:#475569;line-height:1.65}
.about-panel{background:#fff;border:1px solid #dbe3ef;border-radius:24px;padding:30px;box-shadow:0 18px 45px rgba(15,23,42,.08);width:100%;height:100%;box-sizing:border-box}
.about-panel h2{margin:0 0 12px;color:#0f172a;font-size:clamp(1.6rem,3vw,2.2rem)}
.about-panel p{color:#475569;line-height:1.75;margin:0 0 14px}
.about-panel p:last-child{margin-bottom:0}
.about-list{display:grid;gap:12px;margin:18px 0 0;padding:0;list-style:none}
.about-list li{display:flex;gap:10px;align-items:flex-start;color:#334155;line-height:1.55}
.about-list li::before{content:'✓';color:#2563eb;font-weight:900}
.about-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:18px}
.about-compare-box{background:#ffffff;border:1px solid #dbe3ef;border-radius:18px;padding:20px;box-shadow:0 10px 28px rgba(15,23,42,.05)}
.about-compare-box strong{display:block;margin-bottom:10px;color:#0f172a}
.about-compare-box p{font-size:.98rem;margin:0;color:#475569;line-height:1.65}
.about-cta{background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%) !important;color:#ffffff !important;border-radius:26px !important;padding:34px !important;display:flex !important;gap:24px !important;align-items:center !important;justify-content:space-between !important;box-shadow:0 24px 70px rgba(37,99,235,.24) !important;width:100%}
.about-cta h2{color:#fff !important;margin:.1rem 0 .6rem !important;font-size:clamp(1.6rem,3vw,2.4rem)}
.about-cta p{color:#dbeafe !important;margin:0 !important;line-height:1.65 !important}
.about-cta .eyebrow{display:inline-flex !important;width:max-content !important;background:rgba(255,255,255,.12) !important;color:#bfdbfe !important;border:1px solid rgba(255,255,255,.30) !important;border-radius:999px !important;padding:7px 12px !important;font-size:.78rem !important}
.about-cta .hero-actions{display:grid !important;gap:12px !important;min-width:260px !important}
.about-cta .btn,.about-cta .btn-secondary{min-height:52px !important;height:auto !important;padding:14px 22px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;background:#ffffff !important;color:#1d4ed8 !important;border:2px solid #ffffff !important;border-radius:var(--button-radius) !important;font-weight:800 !important;text-decoration:none !important;box-shadow:0 14px 28px rgba(15,23,42,.12) !important}
.about-cta .btn:hover,.about-cta .btn-secondary:hover{background:#eff6ff !important;color:#1d4ed8 !important;transform:translateY(-2px) !important;box-shadow:0 18px 34px rgba(15,23,42,.18) !important}
@media(max-width:900px){.about-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.about-compare{grid-template-columns:1fr}.about-cta{display:block !important}.about-cta .hero-actions{margin-top:20px;min-width:0 !important}}
@media(max-width:620px){.about-intro,.about-panel,.about-card,.about-cta{padding:24px}.about-grid{grid-template-columns:1fr}.about-cta .hero-actions{display:grid;gap:10px}.about-cta .btn{width:100%;text-align:center}}

.contact-box { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin-top:20px; align-items:start; }
.contact-line { border:1px solid var(--line); border-radius:16px; padding:16px; background:#f8fafc; min-height:0; }
.contact-line:empty { display:none; }


.single-image-widget { margin:0; }
.single-image-widget img { width:100%; display:block; border-radius:var(--card-radius); border:1px solid var(--line); box-shadow:var(--card-shadow); object-fit:cover; }
.single-image-widget figcaption { margin-top:10px; color:#64748b; font-size:.96rem; line-height:1.45; }
.single-image-widget a { display:block; text-decoration:none; }

/* Bild + Text: Website-Ausgabe identisch zur Widget-Vorschau.
   Wichtig: Button bleibt im Textbereich unter dem Text; Bildposition steuert nur Bild/Text-Spalten. */
.image-text {
  gap:28px !important;
  align-items:start !important;
}
.image-text > h2 {
  margin:0 0 6px 0 !important;
}
.image-text .image-text-media img,
.gallery img {
  width:100%;
  max-width:100%;
  display:block;
  border-radius:var(--card-radius);
  border:1px solid var(--line);
  box-shadow:var(--card-shadow);
  object-fit:cover;
}
.image-text .image-text-content {
  min-width:0;
}
.image-text .image-text-content > .image-text-btn {
  width:100% !important;
  max-width:none !important;
  display:flex !important;
  justify-content:center !important;
  align-self:stretch !important;
  margin-top:30px !important;
  box-sizing:border-box !important;
}
.image-text-pos-right,
.image-text-pos-left,
.widget-row.equal-height .widget-slot > .card.image-text-pos-right,
.widget-row.equal-height .widget-slot > .card.image-text-pos-left {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(220px,44%) !important;
  gap:28px !important;
}
.image-text-pos-right-wrap,
.image-text-pos-left-wrap,
.widget-row.equal-height .widget-slot > .card.image-text-pos-right-wrap,
.widget-row.equal-height .widget-slot > .card.image-text-pos-left-wrap {
  display:block !important;
}
.image-text-pos-right-wrap > h2,
.image-text-pos-left-wrap > h2 {
  margin:0 0 16px 0 !important;
}
.image-text-pos-right-wrap .image-text-content,
.image-text-pos-left-wrap .image-text-content {
  display:block !important;
  line-height:1.75;
}
.image-text-pos-right-wrap .image-text-media,
.image-text-pos-left-wrap .image-text-media {
  width:min(44%, 360px) !important;
  max-width:100% !important;
  margin-bottom:18px !important;
}
.image-text-pos-right-wrap .image-text-media {
  float:right !important;
  margin-left:28px !important;
}
.image-text-pos-left-wrap .image-text-media {
  float:left !important;
  margin-right:28px !important;
}
.image-text-pos-right-wrap::after,
.image-text-pos-left-wrap::after,
.image-text-pos-right-wrap .image-text-content::after,
.image-text-pos-left-wrap .image-text-content::after {
  content:"";
  display:block;
  clear:both;
}
.image-text-pos-right-wrap .image-text-btn,
.image-text-pos-left-wrap .image-text-btn {
  clear:both !important;
}
.image-text-pos-right > h2,
.image-text-pos-left > h2 {
  grid-column:1 / -1 !important;
  grid-row:1 !important;
}
.image-text-pos-right > .image-text-content { grid-column:1 !important; grid-row:2 !important; }
.image-text-pos-right > .image-text-media { grid-column:2 !important; grid-row:2 !important; }
.image-text-pos-left > .image-text-media { grid-column:1 !important; grid-row:2 !important; }
.image-text-pos-left > .image-text-content { grid-column:2 !important; grid-row:2 !important; }
.image-text-pos-top,
.image-text-pos-bottom,
.widget-row.equal-height .widget-slot > .card.image-text-pos-top,
.widget-row.equal-height .widget-slot > .card.image-text-pos-bottom {
  display:flex !important;
  flex-direction:column !important;
  gap:18px !important;
}
.image-text-pos-top > h2 { order:1 !important; }
.image-text-pos-top > .image-text-media { order:2 !important; }
.image-text-pos-top > .image-text-content { order:3 !important; }
.image-text-pos-bottom > h2 { order:1 !important; }
.image-text-pos-bottom > .image-text-content { order:2 !important; }
.image-text-pos-bottom > .image-text-media { order:3 !important; }
@media (max-width:640px) {
  .image-text-pos-right,
  .image-text-pos-left,
  .widget-row.equal-height .widget-slot > .card.image-text-pos-right,
  .widget-row.equal-height .widget-slot > .card.image-text-pos-left {
    display:flex !important;
    flex-direction:column !important;
  }
  .image-text-pos-right-wrap .image-text-media,
  .image-text-pos-left-wrap .image-text-media {
    float:none !important;
    width:100% !important;
    margin:0 0 18px 0 !important;
  }
  .image-text-pos-right > h2,
  .image-text-pos-left > h2 { order:1 !important; }
  .image-text-pos-right > .image-text-content { order:2 !important; }
  .image-text-pos-right > .image-text-media { order:3 !important; }
  .image-text-pos-left > .image-text-media { order:2 !important; }
  .image-text-pos-left > .image-text-content { order:3 !important; }
}


/* Bild + Text: echte Umlauf-Varianten, getrennt vom Zwei-Spalten-Layout. */
.image-text-flow,
.widget-row.equal-height .widget-slot > .card.image-text-flow {
  display:block !important;
}
.image-text-flow > h2 {
  margin:0 0 16px 0 !important;
}
.image-text-flow-content {
  display:block !important;
  line-height:1.75 !important;
}
.image-text-flow-media {
  display:block !important;
  width:min(44%, 360px) !important;
  max-width:100% !important;
  margin-top:0 !important;
  margin-bottom:18px !important;
}
.image-text-flow-media img {
  width:100% !important;
  max-width:100% !important;
  display:block !important;
  border-radius:var(--card-radius) !important;
  border:1px solid var(--line) !important;
  box-shadow:var(--card-shadow) !important;
  object-fit:cover !important;
}
.image-text-flow-right .image-text-flow-media {
  float:right !important;
  margin-left:28px !important;
}
.image-text-flow-left .image-text-flow-media {
  float:left !important;
  margin-right:28px !important;
}
.image-text-flow-content::after,
.image-text-flow::after {
  content:"";
  display:block;
  clear:both;
}
.image-text-flow-actions {
  clear:both !important;
  margin-top:22px !important;
}
.image-text-flow-actions .image-text-btn {
  width:100% !important;
  max-width:none !important;
  display:flex !important;
  justify-content:center !important;
  box-sizing:border-box !important;
}
@media (max-width:640px) {
  .image-text-flow-media,
  .image-text-flow-right .image-text-flow-media,
  .image-text-flow-left .image-text-flow-media {
    float:none !important;
    width:100% !important;
    margin:0 0 18px 0 !important;
  }
}

.notice { border-left:6px solid var(--primary); background:linear-gradient(135deg,#ffffff,#f8fbff); }
.notice .eyebrow { display:inline-flex; width:max-content; margin:0 0 10px; padding:6px 10px; border-radius:999px; background:#eff6ff; color:var(--primary); font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.notice-actions { display:flex; flex-wrap:wrap; gap:12px; margin:18px 0 0; }
.notice-cta{background:var(--cms-widget-bg,var(--primary)) !important;color:#ffffff !important;border-radius:26px !important;padding:34px !important;display:flex !important;gap:24px !important;align-items:center !important;justify-content:space-between !important;box-shadow:0 24px 70px rgba(37,99,235,.24) !important;width:100%}
.notice-cta h2{color:#fff !important;margin:.1rem 0 .6rem !important;font-size:clamp(1.6rem,3vw,2.4rem)}
.notice-cta p{color:rgba(255,255,255,.88) !important;margin:0 !important;line-height:1.65 !important}
.notice-cta .eyebrow{display:inline-flex !important;width:max-content !important;background:rgba(255,255,255,.14) !important;color:rgba(255,255,255,.82) !important;border:1px solid rgba(255,255,255,.30) !important;border-radius:999px !important;padding:7px 12px !important;font-size:.78rem !important;font-weight:800 !important;text-transform:uppercase !important;letter-spacing:.08em !important;margin:0 0 12px !important}
.notice-cta .hero-actions{display:grid !important;gap:12px !important;min-width:260px !important}
.notice-cta .btn,.notice-cta .btn-secondary{min-height:52px !important;height:auto !important;padding:14px 22px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;background:#ffffff !important;color:var(--primary) !important;border:2px solid #ffffff !important;border-radius:var(--button-radius) !important;font-weight:800 !important;text-decoration:none !important;box-shadow:0 14px 28px rgba(15,23,42,.12) !important}
.notice-cta .btn:hover,.notice-cta .btn-secondary:hover{background:rgba(255,255,255,.92) !important;color:var(--primary) !important;transform:translateY(-2px) !important;box-shadow:0 18px 34px rgba(15,23,42,.18) !important}
@media(max-width:900px){.notice-cta{display:block !important}.notice-cta .hero-actions{margin-top:20px;min-width:0 !important}}
@media(max-width:620px){.notice-cta{padding:24px !important}.notice-cta .hero-actions{display:grid;gap:10px}.notice-cta .btn{width:100%;text-align:center}}
.comparison-table { width:100%; border-collapse:separate; border-spacing:0; overflow:hidden; border-radius:18px; border:1px solid #e2e8f0; }
.comparison-table th,.comparison-table td { padding:15px 18px; text-align:left; border-bottom:1px solid #e2e8f0; }
.comparison-table th { background:#f8fafc; color:#0f172a; }
.comparison-table tr:last-child td { border-bottom:0; }
.comparison-table td:nth-child(2),.comparison-table td:nth-child(3) { font-weight:700; }
@media(max-width:820px) { .comparison-table { font-size:.92rem; } .comparison-table th,.comparison-table td { padding:12px 10px; } }

.faq-block .faq-item { border-top:1px solid var(--line); padding:17px 0; }
.faq-block .faq-item:first-child { border-top:0; }
.faq-block .faq-item strong { display:block; margin-bottom:6px; color:#0b1220; }
.tabs-accordion { border:1px solid var(--line); border-radius:var(--card-radius); background:var(--card); overflow:hidden; box-shadow:var(--card-shadow); }
.tabs-accordion-tabs { display:flex; flex-wrap:wrap; gap:0; padding:0; border-bottom:none; background:linear-gradient(180deg, rgba(248,250,252,.95), rgba(255,255,255,.95)); }
.tabs-accordion-tab { margin:0 0 -1px 0; border:1px solid var(--line); border-left:0; border-bottom-color:var(--line); background:#f8fafc; color:var(--text); border-radius:10px 10px 0 0; padding:12px 20px; cursor:pointer; font-weight:800; }
.tabs-accordion-tab:first-child { border-left:1px solid var(--line); }
.tabs-accordion-tab.is-active { background:var(--card); border-color:var(--line); border-bottom-color:var(--card); color:var(--primary); }
.tabs-accordion-tab:hover { background:#fff; }
.tabs-accordion-panels { padding:24px; }
.tabs-accordion-panel[hidden] { display:none; }
.tabs-accordion-panel > *:first-child { margin-top:0; }
.tabs-accordion-panel > *:last-child { margin-bottom:0; }
.tabs-accordion-panel img, .tabs-accordion-detail-body img { max-width:100%; height:auto; }
.tab-content-image { margin:16px 0; }
.tab-content-image img { max-width:100%; height:auto; border-radius:10px; display:block; box-shadow:0 12px 28px rgba(15,23,42,.12); }
.tab-content-image.align-left img { margin-right:auto; }
.tab-content-image.align-center img { margin-left:auto; margin-right:auto; }
.tab-content-image.align-right img { margin-left:auto; }
.tab-content-image.w25 img { width:25%; }
.tab-content-image.w50 img { width:50%; }
.tab-content-image.w75 img { width:75%; }
.tab-content-image.w100 img { width:100%; }
.tab-content-image .gallery-open { display:block; padding:0; border:0; background:transparent; cursor:pointer; }
@media (max-width:720px) { .tab-content-image.w25 img, .tab-content-image.w50 img, .tab-content-image.w75 img { width:100%; } }
.tabs-accordion-mobile { display:none; }
.tabs-accordion-detail { border-top:1px solid var(--line); }
.tabs-accordion-detail:first-child { border-top:0; }
.tabs-accordion-detail summary { cursor:pointer; padding:16px 18px; font-weight:850; list-style:none; }
.tabs-accordion-detail summary::-webkit-details-marker { display:none; }
.tabs-accordion-detail summary::after { content:'+'; float:right; font-weight:900; color:var(--primary); }
.tabs-accordion-detail[open] summary::after { content:'–'; }
.tabs-accordion-detail-body { padding:0 18px 18px; color:var(--text); }
.tabs-accordion.is-desktop-accordion .tabs-accordion-tabs, .tabs-accordion.is-desktop-accordion .tabs-accordion-panels { display:none; }
.tabs-accordion.is-desktop-accordion .tabs-accordion-mobile { display:block; }
@media (max-width:720px) { .tabs-accordion-tabs,.tabs-accordion-panels { display:none !important; } .tabs-accordion-mobile { display:block !important; } }
.gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.gallery-item { margin:0; }
.gallery-open { display:block; width:100%; padding:0; border:0; background:transparent; cursor:pointer; text-align:left; }
.gallery-item img { aspect-ratio:4/3; object-fit:cover; transition:transform .2s ease, box-shadow .2s ease; }
.gallery-item img:hover { transform:translateY(-2px); box-shadow:0 20px 42px rgba(15,23,42,.16); }
.gallery-item figcaption { color:var(--muted); font-size:.92rem; margin-top:8px; padding:0 4px; }
.slider { position:relative; overflow:hidden; border-radius:var(--card-radius); box-shadow:var(--card-shadow); background:linear-gradient(135deg,#0f172a,#1e293b); }
.slider-track { display:flex; transition:transform .3s ease; }
.slide { min-width:100%; height:clamp(280px, 42vw, 520px); position:relative; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#0f172a,#1e293b); }
.slide img { width:100%; height:100%; object-fit:cover; display:block; }
.slider-fit-cover .slide img { object-fit:cover; }
.slider-fit-contain { background:transparent; box-shadow:none; }
.slider-fit-contain .slide { background:transparent; }
.slider-fit-contain .slide img { object-fit:contain; }
.internal-area-placeholder { background:#94a3b8; color:#fff; border:1px solid rgba(255,255,255,.8); padding:18px 20px; border-radius:4px; font-weight:700; text-align:left; }
.internal-area-live-link { display:none; }
.cms-live-site .internal-area-placeholder { display:none; }
.cms-live-site .internal-area-live-link { display:block; }
.internal-area-login { width:100%; max-width:none; margin:0; padding:30px; background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--primary) 4%,#fff)); border:1px solid #dbe3ef; border-radius:20px; box-shadow:0 18px 48px rgba(15,23,42,.11); box-sizing:border-box; }
.internal-area-runtime { width:100%; box-sizing:border-box; }
html.cms-internal-area-pending body { opacity:0; }
.internal-area-actions { margin-top:20px; display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
.internal-area-actions a { font-weight:800; }
.internal-area-edit-notice { margin:14px 0 18px; padding:12px 14px; border-radius:12px; background:#eff6ff; border:1px solid #bfdbfe; color:#1e3a8a; font-weight:700; }
.internal-area-edit-form { margin:18px 0 22px; padding:16px; border-radius:14px; background:#f8fafc; border:1px solid #dbe3ef; }
.internal-area-edit-form label { display:block; margin:0 0 8px; font-weight:800; }
.internal-area-edit-toolbar { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 10px; padding:10px; border:1px solid #dbe3ef; border-radius:12px; background:#fff; }
.internal-area-edit-toolbar button, .internal-area-edit-toolbar select, .internal-area-color-tool { box-sizing:border-box; height:34px; min-height:34px; border:1px solid #cbd5e1; border-radius:9px; background:#f8fafc; color:#0f172a; font:inherit; font-weight:800; padding:0 10px; cursor:pointer; line-height:34px; }
.internal-area-edit-toolbar button, .internal-area-color-tool { display:inline-flex; align-items:center; justify-content:center; }
.internal-area-edit-toolbar select { padding:0 28px 0 10px; }
.internal-area-edit-toolbar button:hover, .internal-area-edit-toolbar select:hover, .internal-area-color-tool:hover { background:#eef2ff; border-color:#93c5fd; }
.internal-area-color-tool { gap:6px; margin:0; vertical-align:middle; white-space:nowrap; }
.internal-area-color-tool input[type=color] { width:18px; height:18px; border:1px solid #94a3b8; border-radius:3px; padding:0; margin:0; background:transparent; cursor:pointer; display:inline-block; vertical-align:middle; -webkit-appearance:none; appearance:none; overflow:hidden; }
.internal-area-color-tool input[type=color]::-webkit-color-swatch-wrapper { padding:0; }
.internal-area-color-tool input[type=color]::-webkit-color-swatch { border:0; border-radius:2px; }
.internal-area-rich-editor { width:100%; min-height:320px; padding:14px 16px; border:1px solid #cbd5e1; border-radius:10px; font:16px/1.6 inherit; box-sizing:border-box; background:#fff; color:#0f172a; outline:none; overflow:auto; }
.internal-area-rich-editor:focus { border-color:#2563eb; box-shadow:0 0 0 4px rgba(37,99,235,.13); }
.internal-area-rich-editor ul, .internal-area-rich-editor ol { padding-left:1.4rem; }
.internal-area-picker { margin:10px 0 12px; padding:12px; border:1px solid #dbe3ef; border-radius:12px; background:#f8fafc; display:none; }
.internal-area-picker.active { display:block; }
.internal-area-picker strong { display:block; margin-bottom:8px; color:#0f172a; }
.internal-area-picker .picker-row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:8px; }
.internal-area-picker select, .internal-area-picker input { min-height:34px; border:1px solid #cbd5e1; border-radius:9px; background:#fff; color:#0f172a; font:inherit; padding:6px 10px; min-width:220px; }
.internal-area-picker button { min-height:34px; border:1px solid #cbd5e1; border-radius:9px; background:#fff; color:#0f172a; font:inherit; font-weight:800; padding:6px 10px; cursor:pointer; }
.internal-area-special-chars { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.internal-area-special-chars button { min-width:34px; padding:6px 8px; }
.internal-area-rich-editor img { max-width:100%; height:auto; border-radius:10px; }
.internal-area-rich-editor table, .internal-area-card table { width:100%; border-collapse:collapse; margin:16px 0; background:#fff; }
.internal-area-rich-editor th, .internal-area-rich-editor td, .internal-area-card th, .internal-area-card td { border:1px solid #dbe3ef; padding:10px 12px; text-align:left; vertical-align:top; }
.internal-area-rich-editor th, .internal-area-card th { background:#f8fafc; color:#0f172a; font-weight:800; }
.internal-area-table-builder { overflow:auto; margin-top:10px; }
.internal-area-table-builder table { width:100%; border-collapse:collapse; background:#fff; }
.internal-area-table-builder td, .internal-area-table-builder th { border:1px solid #cbd5e1; padding:4px; }
.internal-area-table-builder input { width:100%; min-width:0 !important; box-sizing:border-box; border:0; padding:7px 8px; font:inherit; background:transparent; }
.internal-area-picker input.internal-area-small-input { min-width:72px; width:72px; }
.internal-area-picker label.inline-option { display:flex; align-items:center; gap:7px; font-weight:700; margin:0; }
.internal-area-picker label.inline-option input { min-width:0; width:auto; }
.internal-area-card img { max-width:100%; height:auto; border-radius:10px; }
.internal-area-card figure { max-width:100%; margin:16px 0; }
.internal-area-card figure img { display:block; }
.internal-area-edit-form textarea { width:100%; min-height:320px; padding:12px 14px; border:1px solid #cbd5e1; border-radius:10px; font:14px/1.55 Consolas, "Courier New", monospace; resize:vertical; box-sizing:border-box; background:#fff; color:#0f172a; }
.internal-area-edit-form .btn { margin-top:12px; }
.internal-area-success { margin:14px 0 18px; padding:12px 14px; border-radius:12px; background:#ecfdf5; border:1px solid #bbf7d0; color:#166534; font-weight:700; }
.internal-area-login label { display:block; margin:0 0 8px; font-weight:800; }
.internal-area-login input[type=password] { width:100%; padding:12px 14px; border:1px solid #cbd5e1; border-radius:10px; font:inherit; }
.internal-area-login button { margin-top:14px; }
.internal-area-error { color:#b91c1c; font-weight:700; }
.internal-area-login-alert { display:grid; gap:3px; margin:16px 0 18px; padding:14px 16px; border:1px solid #fecaca; border-radius:12px; background:#fef2f2; color:#991b1b; }
.internal-area-login-alert strong { font-weight:800; }
.internal-area-login-countdown { margin-top:4px; font-weight:800; }
.internal-area-login input:disabled,.internal-area-login button:disabled { opacity:.58; cursor:not-allowed; }
.slide-caption { position:absolute; left:22px; right:22px; bottom:18px; width:max-content; max-width:calc(100% - 44px); background:rgba(15,23,42,.78); color:#fff; padding:10px 14px; border-radius:14px; }
.slider-prev,.slider-next { position:absolute; top:50%; transform:translateY(-50%); z-index:2; border:0; border-radius:999px; width:44px; height:44px; font-size:32px; cursor:pointer; }
.slider-prev { left:14px; } .slider-next { right:14px; }
.before-after-wrap { width:100%; max-width:900px; margin-left:auto; margin-right:auto; }
.before-after { --before-after-position:50%; position:relative; width:100%; aspect-ratio:4/3; overflow:hidden; border-radius:var(--card-radius); box-shadow:var(--card-shadow); background:#e2e8f0; touch-action:pan-y; user-select:none; -webkit-user-select:none; }
.before-after-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; pointer-events:none; }
.before-after-image-before { z-index:2; clip-path:inset(0 calc(100% - var(--before-after-position)) 0 0); }
.before-after-image-after { z-index:1; }
.before-after-label { position:absolute; z-index:4; top:14px; padding:7px 10px; border-radius:999px; background:rgba(15,23,42,.72); color:#fff; font-size:.88rem; font-weight:800; line-height:1; pointer-events:none; }
.before-after-label-before { left:14px; }
.before-after-label-after { right:14px; }
.before-after-divider { position:absolute; z-index:5; top:0; bottom:0; left:var(--before-after-position); width:3px; transform:translateX(-50%); background:#fff; box-shadow:0 0 0 1px rgba(15,23,42,.16),0 0 12px rgba(15,23,42,.28); pointer-events:none; }
.before-after-handle { position:absolute; z-index:6; top:50%; left:var(--before-after-position); width:48px; height:48px; transform:translate(-50%,-50%); border:3px solid #fff; border-radius:50%; background:rgba(15,23,42,.72); color:#fff; box-shadow:0 6px 18px rgba(15,23,42,.28); cursor:ew-resize; display:flex; align-items:center; justify-content:center; font:800 22px/1 Arial,sans-serif; padding:0; touch-action:none; }
.before-after-handle:focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
.before-after-caption { margin-top:10px; color:var(--muted); font-size:.92rem; }
.before-after.is-dragging .before-after-handle { cursor:grabbing; }
@media (max-width:720px) { .before-after-label { top:10px; padding:6px 9px; font-size:.82rem; } .before-after-label-before { left:10px; } .before-after-label-after { right:10px; } .before-after-handle { width:44px; height:44px; } }
@media (max-width:820px) and (orientation:landscape) and (max-height:500px) {
 .before-after-wrap { max-width:min(100%, calc((100vh - 52px) * 4 / 3)); max-width:min(100%, calc((100dvh - 52px) * 4 / 3)); }
}

.occupancy-calendar-widget { background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:26px; box-shadow:var(--shadow); width:100%; max-width:none; box-sizing:border-box; }
.occupancy-calendar-widget h2 { margin-top:0; }
.occupancy-calendar-intro { color:var(--muted); margin-bottom:18px; }
.occupancy-calendar-months { display:grid; grid-template-columns:repeat(var(--occ-month-columns,1), minmax(0,1fr)); gap:22px; width:100%; }
.occupancy-calendar-month { min-width:0; width:100%; }
.occupancy-calendar-month-title { text-align:center; font-weight:800; margin:0 0 12px; }
.occupancy-calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); width:100%; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.occupancy-calendar-dayname, .occupancy-calendar-day { min-height:38px; display:flex; align-items:center; justify-content:center; border-right:1px solid var(--line); border-bottom:none; font-weight:700; min-width:0; }
.occupancy-calendar-dayname:nth-child(7n), .occupancy-calendar-day:nth-child(7n) { border-right:0; }
.occupancy-calendar-dayname { background:#f8fafc; color:var(--muted); font-size:.88rem; }
.occupancy-calendar-day { background:var(--occ-free-bg,#85db24); color:var(--occ-free-text,#333333); }
.occupancy-calendar-day.is-empty { background:#f8fafc; color:#cbd5e1; }
.occupancy-calendar-day.is-occupied { background:var(--occ-busy-bg,#ffffff); color:var(--occ-busy-text,#333333); }
.occupancy-calendar-legend { display:flex; gap:16px; align-items:center; flex-wrap:wrap; margin-top:16px; color:var(--muted); font-weight:700; }
.occupancy-calendar-legend span { display:inline-flex; align-items:center; gap:7px; }
.occupancy-calendar-legend i { width:16px; height:16px; border:1px solid var(--line); display:inline-block; border-radius:3px; }
.occupancy-calendar-legend .free i { background:var(--occ-free-bg,#85db24); }
.occupancy-calendar-legend .busy i { background:var(--occ-busy-bg,#ffffff); }
.occupancy-calendar-details { margin:12px 0 0; padding:0; list-style:none; color:var(--muted); font-size:.9rem; }
.occupancy-calendar-details li { display:flex; justify-content:space-between; gap:10px; padding:5px 0; border-bottom:none; }
.occupancy-calendar-details li:last-child { border-bottom:0; }
.occupancy-calendar-details strong { color:var(--text); text-align:right; }
@media(max-width:700px) { .occupancy-calendar-months { grid-template-columns:1fr; } }

.event-calendar-widget { background:var(--event-widget-bg,#fff); border:1px solid var(--line); border-radius:var(--radius); padding:26px; box-shadow:var(--shadow); width:100%; box-sizing:border-box; --event-accent:var(--accent); }
.event-calendar-widget.is-transparent { background:transparent !important; border-color:transparent !important; box-shadow:none !important; }
.event-calendar-widget.is-transparent .event-calendar-month,
.event-calendar-widget.is-transparent .event-calendar-month-title,
.event-calendar-widget.is-transparent .event-calendar-dayname,
.event-calendar-widget.is-transparent .event-calendar-day,
.event-calendar-widget.is-transparent .event-calendar-day.is-empty { background:transparent !important; }
.event-calendar-widget h2 { margin-top:0; }
.event-calendar-intro { color:var(--muted); margin-bottom:18px; }
.event-calendar-toolbar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; margin:0 0 18px; }
.event-calendar-controls { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.event-calendar-toolbar input,.event-calendar-toolbar select { min-height:40px; border:1px solid var(--line); border-radius:10px; padding:8px 11px; background:#fff; color:var(--text); }
.event-calendar-search { width:min(100%,320px); min-width:280px; }
.event-calendar-view-buttons { display:flex; flex-wrap:wrap; gap:6px; }
.event-calendar-view-buttons button { border:1px solid var(--line); background:#fff; color:var(--text); border-radius:9px; padding:9px 12px; cursor:pointer; font-weight:700; }
.event-calendar-view-buttons button.is-active { background:var(--event-accent); color:#fff; border-color:var(--event-accent); }
.event-calendar-view[hidden] { display:none !important; }
.event-calendar-month { border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.event-calendar-month-title { padding:14px 16px; font-size:1.1rem; font-weight:800; text-align:center; background:#f8fafc; border-bottom:none; }
.event-calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); }
.event-calendar-dayname { padding:9px 5px; text-align:center; font-size:.84rem; font-weight:800; color:var(--muted); background:#f8fafc; border-right:1px solid var(--line); border-bottom:none; }
.event-calendar-dayname:nth-child(7n) { border-right:0; }
.event-calendar-day { min-height:105px; padding:7px; border-right:1px solid var(--line); border-bottom:none; min-width:0; }
.event-calendar-day:nth-child(7n) { border-right:0; }
.event-calendar-day.is-empty { background:#fafafa; }
.event-calendar-date { display:block; font-weight:800; margin-bottom:6px; }
.event-calendar-lanes { display:grid; gap:4px; }
.event-calendar-lane { min-height:38px; min-width:0; }
.event-calendar-lane.is-placeholder { visibility:hidden; pointer-events:none; }
.event-calendar-chip { display:-webkit-box; width:100%; min-height:38px; border:0; border-left:4px solid var(--event-color,var(--event-accent)); background:color-mix(in srgb,var(--event-color,var(--event-accent)) 12%,white); border-radius:7px; padding:5px 6px; margin:0; text-align:left; color:var(--text); font-size:.78rem; font-weight:800; line-height:1.2; cursor:pointer; overflow:hidden; white-space:normal; overflow-wrap:anywhere; box-sizing:border-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.event-calendar-chip.is-multiday { border-left:0; border-radius:0; margin-left:-7px; margin-right:-7px; width:calc(100% + 14px); padding-left:10px; padding-right:10px; }
.event-calendar-chip.is-multiday.is-segment-start { margin-left:0; width:calc(100% + 7px); border-radius:7px 0 0 7px; }
.event-calendar-chip.is-multiday.is-segment-end { margin-right:0; width:calc(100% + 7px); border-radius:0 7px 7px 0; }
.event-calendar-chip.is-multiday.is-segment-start.is-segment-end { width:100%; margin-left:0; margin-right:0; border-radius:7px; }
.event-calendar-chip.is-multiday.is-week-start:not(.is-segment-start) { margin-left:0; width:calc(100% + 7px); }
.event-calendar-chip.is-multiday.is-week-end:not(.is-segment-end) { margin-right:0; width:calc(100% + 7px); }
.event-calendar-chip.is-multiday.is-month-start:not(.is-segment-start),.event-calendar-chip.is-multiday.is-month-end:not(.is-segment-end) { box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--event-color,var(--event-accent)) 35%,transparent); }
.event-calendar-list { display:grid; gap:13px; }
.event-calendar-card { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:15px; align-items:start; border:1px solid var(--line); border-left:5px solid var(--event-color,var(--event-accent)); border-radius:13px; padding:15px; background:#fff; }
.event-calendar-datebox { min-width:58px; text-align:center; border-radius:10px; background:#f8fafc; padding:7px 8px; }
.event-calendar-datebox strong { display:block; font-size:1.45rem; line-height:1; }
.event-calendar-datebox span { display:block; margin-top:4px; color:var(--muted); font-size:.78rem; font-weight:800; text-transform:uppercase; }
.event-calendar-card h3 { margin:0 0 6px; font-size:1.05rem; }
.event-calendar-meta { color:var(--muted); font-size:.9rem; display:flex; flex-wrap:wrap; gap:8px 14px; }
.event-calendar-category { display:inline-flex; margin-top:8px; border-radius:999px; padding:4px 8px; background:color-mix(in srgb,var(--event-color,var(--event-accent)) 12%,white); font-size:.78rem; font-weight:800; }
.event-calendar-details-button { border:1px solid var(--line); background:#fff; border-radius:9px; padding:8px 10px; cursor:pointer; font-weight:700; }
.event-calendar-dialog { width:min(680px,calc(100vw - 32px)); border:0; border-radius:16px; padding:0; box-shadow:0 24px 70px rgba(15,23,42,.28); }
.event-calendar-dialog::backdrop { background:rgba(15,23,42,.58); }
.event-calendar-dialog-inner { position:relative; padding:24px; max-height:calc(100vh - 64px); overflow-y:auto; box-sizing:border-box; }
.event-calendar-dialog-close { position:absolute; top:16px; right:16px; z-index:2; border:0; background:#f1f5f9; border-radius:999px; width:36px; height:36px; cursor:pointer; font-size:1.2rem; }
.event-calendar-dialog h3 { margin:0 42px 10px 0; }
.event-calendar-dialog-image { display:block; clear:both; width:min(100%,560px); height:auto; max-height:320px; object-fit:contain; border-radius:12px; margin:0 auto 18px; background:#f8fafc; }
.event-calendar-dialog-placeholder { width:min(100%,560px); height:220px; margin:0 auto 18px; border-radius:12px; box-sizing:border-box; }
.event-calendar-dialog-map { margin-top:18px; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#f8fafc; }
.event-calendar-dialog-map iframe { display:block; width:100%; height:300px; border:0; }
.event-calendar-dialog-map-title { padding:10px 12px; font-weight:800; background:#f8fafc; border-bottom:none; }
.event-calendar-title-row { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 6px; }
.event-calendar-title-row h3 { margin:0; }
.event-calendar-dialog-title-row { padding-right:44px; margin-bottom:10px; }
.event-calendar-dialog-title-row h3 { margin:0; }
.event-calendar-badge { display:inline-flex; align-items:center; min-height:25px; padding:3px 9px; border-radius:999px; font-size:.76rem; font-weight:900; line-height:1; background:#eef2ff; color:#3730a3; white-space:nowrap; }
.event-calendar-badge.is-today { background:#dcfce7; color:#166534; }
.event-calendar-badge.is-new { background:#dbeafe; color:#1d4ed8; }
.event-calendar-badge.is-sold-out { background:#fef3c7; color:#92400e; }
.event-calendar-badge.is-registration-required { background:#e0f2fe; color:#075985; }
.event-calendar-badge.is-cancelled { background:#fee2e2; color:#b91c1c; }
.event-calendar-corner-badge { position:absolute; top:18px; right:-43px; z-index:3; min-width:132px; padding:8px 38px; transform:rotate(45deg); text-align:center; color:#fff; font-size:.74rem; font-weight:900; line-height:1; box-shadow:0 10px 24px rgba(15,23,42,.18); pointer-events:none; }
.event-calendar-corner-badge span { display:block; }
.event-calendar-corner-badge.is-today { background:#16a34a; }
.event-calendar-corner-badge.is-new { background:#2563eb; }
.event-calendar-corner-badge.is-sold-out { background:#d97706; }
.event-calendar-corner-badge.is-registration-required { background:#0284c7; min-width:154px; right:-48px; top:16px; padding-top:7px; padding-bottom:7px; line-height:1.08; }
.event-calendar-corner-badge.is-cancelled { background:#dc2626; }
.event-calendar-card.is-cancelled,.event-calendar-presentation-card.is-cancelled { opacity:.72; }
.event-calendar-card.is-cancelled h3,.event-calendar-presentation-card.is-cancelled h3 { text-decoration:line-through; }
.event-calendar-registration-hint { margin-top:14px; padding:12px 14px; border-left:4px solid #0284c7; border-radius:10px; background:#f0f9ff; color:#0c4a6e; display:grid; gap:4px; }
.event-calendar-registration-hint strong { font-weight:900; }
.event-calendar-registration-hint span { font-size:.9rem; line-height:1.45; }
.event-calendar-registration-card-hint { margin-top:10px; padding:9px 10px; border-left:3px solid #0284c7; border-radius:8px; background:#f0f9ff; color:#0c4a6e; display:grid; gap:2px; }
.event-calendar-registration-card-hint strong { font-size:.82rem; font-weight:900; }
.event-calendar-registration-card-hint span { font-size:.78rem; line-height:1.35; }
.event-calendar-countdown { margin-top:8px; padding:9px 11px; border-radius:10px; background:color-mix(in srgb,var(--event-color,var(--event-accent)) 10%,#f8fafc); color:var(--text); font-size:.86rem; font-weight:800; }
.event-calendar-dialog-share { margin-top:18px; padding-top:16px; border-top:1px solid var(--line); }
.event-calendar-dialog-share strong { display:block; margin-bottom:9px; }
.event-calendar-share-buttons { display:flex; flex-wrap:wrap; gap:8px; }
.event-calendar-share-button { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:8px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--text); font-weight:800; text-decoration:none; cursor:pointer; }
.event-calendar-share-button:hover { border-color:var(--event-color,var(--event-accent)); color:var(--event-color,var(--event-accent)); }
.event-calendar-card[hidden], .event-calendar-chip[hidden], .event-calendar-presentation-card[hidden] { display:none !important; }
.event-calendar-grid-view { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.event-calendar-presentation-card { position:relative; border:1px solid var(--line); border-top:5px solid var(--event-color,var(--event-accent)); border-radius:14px; background:#fff; overflow:hidden; min-width:0; display:flex; flex-direction:column; }
.event-calendar-presentation-image { width:100%; height:180px; object-fit:contain; display:block; background:transparent; padding:12px; box-sizing:border-box; }
.event-calendar-image-placeholder { width:100%; height:180px; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; padding:18px; text-align:center; color:var(--muted); background:linear-gradient(135deg,color-mix(in srgb,var(--event-color,var(--event-accent)) 12%,#f8fafc),#f8fafc 58%,color-mix(in srgb,var(--event-color,var(--event-accent)) 7%,#eef2f7)); }
.event-calendar-image-placeholder svg { width:58px; height:58px; stroke:var(--event-color,var(--event-accent)); opacity:.9; }
.event-calendar-image-placeholder strong { color:var(--text); font-size:.96rem; }
.event-calendar-image-placeholder span { font-size:.8rem; }
.event-calendar-presentation-body { padding:15px; display:flex; flex-direction:column; gap:9px; flex:1; }
.event-calendar-presentation-body h3 { margin:0; font-size:1.05rem; }
.event-calendar-presentation-description { color:var(--muted); font-size:.9rem; line-height:1.5; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.event-calendar-presentation-card .event-calendar-details-button { margin-top:auto; width:100%; }
.event-calendar-slider-wrap,.event-calendar-carousel-wrap { position:relative; }
.event-calendar-slider { overflow:hidden; }
.event-calendar-slider .event-calendar-presentation-card { display:none; grid-template-columns:minmax(220px,34%) minmax(0,1fr); flex-direction:row; min-height:280px; }
.event-calendar-slider .event-calendar-presentation-card.is-current { display:grid; }
.event-calendar-slider .event-calendar-presentation-card.is-current.is-animating { animation-duration:.70s; animation-timing-function:cubic-bezier(.22,.68,.24,1); animation-fill-mode:both; }
.event-calendar-slider-animation-left .event-calendar-presentation-card.is-current.is-animating { animation-name:eventCalendarSlideFromLeft; }
.event-calendar-slider-animation-right .event-calendar-presentation-card.is-current.is-animating { animation-name:eventCalendarSlideFromRight; }
.event-calendar-slider-animation-top .event-calendar-presentation-card.is-current.is-animating { animation-name:eventCalendarSlideFromTop; }
.event-calendar-slider-animation-bottom .event-calendar-presentation-card.is-current.is-animating { animation-name:eventCalendarSlideFromBottom; }
.event-calendar-slider-animation-zoom .event-calendar-presentation-card.is-current.is-animating { animation-name:eventCalendarSoftZoom; }
@keyframes eventCalendarSlideFromLeft { from { opacity:0; transform:translateX(-54px); } to { opacity:1; transform:translateX(0); } }
@keyframes eventCalendarSlideFromRight { from { opacity:0; transform:translateX(54px); } to { opacity:1; transform:translateX(0); } }
@keyframes eventCalendarSlideFromTop { from { opacity:0; transform:translateY(-38px); } to { opacity:1; transform:translateY(0); } }
@keyframes eventCalendarSlideFromBottom { from { opacity:0; transform:translateY(38px); } to { opacity:1; transform:translateY(0); } }
@keyframes eventCalendarSoftZoom { from { opacity:0; transform:scale(.94); } to { opacity:1; transform:scale(1); } }
@media (prefers-reduced-motion:reduce) { .event-calendar-slider .event-calendar-presentation-card.is-current.is-animating { animation:none !important; } }
.event-calendar-slider .event-calendar-presentation-image { width:100%; height:280px; max-height:280px; object-fit:contain; align-self:center; padding:18px; box-sizing:border-box; }
.event-calendar-slider .event-calendar-image-placeholder { height:280px; max-height:280px; align-self:center; }
.event-calendar-nav { display:flex; justify-content:center; align-items:center; gap:10px; margin-top:14px; }
.event-calendar-nav button { border:1px solid var(--line); background:#fff; border-radius:999px; min-width:42px; height:42px; cursor:pointer; font-size:1.1rem; font-weight:800; }
.event-calendar-nav button:hover { border-color:var(--event-accent); color:var(--event-accent); }
.event-calendar-slider-status { color:var(--muted); font-size:.9rem; min-width:64px; text-align:center; }
.event-calendar-carousel { display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 48px)/4); gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; scroll-behavior:smooth; padding:2px; }
.event-calendar-carousel::-webkit-scrollbar { display:none; }
.event-calendar-carousel .event-calendar-presentation-card { scroll-snap-align:start; }
.event-calendar-empty { padding:24px; text-align:center; color:var(--muted); border:1px dashed var(--line); border-radius:12px; }
.event-calendar-list-media,.event-calendar-modern-date { display:none; }
.event-calendar-presentation-media { position:relative; min-width:0; }
.event-calendar-widget.is-modern .event-calendar-card { position:relative; grid-template-columns:minmax(180px,28%) minmax(0,1fr); grid-template-rows:auto auto; gap:0; min-height:0; padding:0; overflow:hidden; border:0; border-radius:22px; background:var(--event-color,var(--event-accent)); box-shadow:0 12px 28px rgba(15,23,42,.12); }
.event-calendar-widget.is-modern .event-calendar-card .event-calendar-datebox { display:none; }
.event-calendar-widget.is-modern .event-calendar-list-media { display:block; position:relative; grid-row:1 / span 2; min-height:0; align-self:stretch; background:transparent; overflow:hidden; }
.event-calendar-widget.is-modern .event-calendar-list-media .event-calendar-presentation-image,.event-calendar-widget.is-modern .event-calendar-list-media .event-calendar-image-placeholder { width:100%; height:100%; min-height:0; padding:0; object-fit:cover; }
.event-calendar-widget.is-modern .event-calendar-list-content { min-width:0; padding:22px 24px 14px; color:#fff; display:flex; flex-direction:column; gap:10px; }
.event-calendar-widget.is-modern .event-calendar-list-content .event-calendar-title-row { min-height:30px; }
.event-calendar-widget.is-modern .event-calendar-list-content .event-calendar-meta { min-height:24px; }
.event-calendar-widget.is-modern .event-calendar-list-extras { display:flex; flex-direction:column; gap:10px; min-height:0; margin-top:0; }
.event-calendar-widget.is-modern .event-calendar-list-content h3,.event-calendar-widget.is-modern .event-calendar-list-content .event-calendar-meta,.event-calendar-widget.is-modern .event-calendar-list-content .event-calendar-presentation-description { color:#fff; }
.event-calendar-widget.is-modern .event-calendar-list-content .event-calendar-category { order:-1; margin:0; padding:0; border-radius:0; background:transparent; color:rgba(255,255,255,.82); text-transform:uppercase; letter-spacing:.06em; }
.event-calendar-widget.is-modern .event-calendar-card > .event-calendar-details-button { grid-column:2; grid-row:2; align-self:end; margin:0 24px 20px; border-color:rgba(255,255,255,.55); background:rgba(255,255,255,.12); color:#fff; }
.event-calendar-widget.is-modern .event-calendar-card > .event-calendar-details-button:hover { background:#fff; color:var(--event-color,var(--event-accent)); }
.event-calendar-widget.is-modern .event-calendar-presentation-card { border:0; border-radius:22px; background:var(--event-color,var(--event-accent)); box-shadow:0 12px 28px rgba(15,23,42,.12); }
.event-calendar-widget.is-modern .event-calendar-presentation-media { display:block; position:relative; height:205px; overflow:hidden; background:transparent; }
.event-calendar-widget.is-modern .event-calendar-presentation-image,.event-calendar-widget.is-modern .event-calendar-image-placeholder { width:100%; height:100%; max-height:none; padding:0; object-fit:cover; background:transparent; }
.event-calendar-widget.is-modern .event-calendar-image-placeholder { color:rgba(255,255,255,.82); background:linear-gradient(135deg,color-mix(in srgb,var(--event-color,var(--event-accent)) 82%,#111827),color-mix(in srgb,var(--event-color,var(--event-accent)) 52%,#111827)); }
.event-calendar-widget.is-modern .event-calendar-image-placeholder svg { stroke:#fff; }
.event-calendar-widget.is-modern .event-calendar-image-placeholder strong { color:#fff; }
/* Optionale Bildbühnen für freigestellte Veranstaltungsbilder. */
.event-calendar-list-media,.event-calendar-presentation-media { position:relative; isolation:isolate; overflow:hidden; }
.event-calendar-list-media.has-image::before,.event-calendar-list-media.has-image::after,.event-calendar-presentation-media.has-image::before,.event-calendar-presentation-media.has-image::after { content:""; position:absolute; pointer-events:none; z-index:0; }
.event-calendar-list-media.has-image .event-calendar-presentation-image,.event-calendar-presentation-media.has-image .event-calendar-presentation-image { position:relative; z-index:2; }
.event-calendar-widget .has-image.image-bg-neutral { background:linear-gradient(145deg,#f8fafc,#e2e8f0); }
.event-calendar-widget .has-image.image-bg-gradient { background:linear-gradient(135deg,color-mix(in srgb,var(--event-color,var(--event-accent)) 24%,#f8fafc),#f8fafc 52%,color-mix(in srgb,var(--event-color,var(--event-accent)) 16%,#dbeafe)); }
.event-calendar-widget .has-image.image-bg-glow { background:radial-gradient(circle at 50% 48%,color-mix(in srgb,var(--event-color,var(--event-accent)) 38%,#fff) 0,transparent 48%),linear-gradient(145deg,#f8fafc,#dbeafe); }
.event-calendar-widget .has-image.image-bg-glow::before { inset:12% 18%; border-radius:50%; background:color-mix(in srgb,var(--event-color,var(--event-accent)) 48%,transparent); filter:blur(28px); opacity:.82; }
.event-calendar-widget .has-image.image-bg-glow .event-calendar-presentation-image { object-fit:contain!important; padding:14px!important; filter:drop-shadow(0 14px 18px rgba(15,23,42,.28)); }
.event-calendar-widget .has-image.image-bg-depth3d { background:radial-gradient(circle at 35% 22%,color-mix(in srgb,var(--event-color,var(--event-accent)) 48%,#fff) 0,transparent 34%),linear-gradient(145deg,color-mix(in srgb,var(--event-color,var(--event-accent)) 34%,#172033),#07111f 72%); }
.event-calendar-widget .has-image.image-bg-depth3d::before { left:9%; right:9%; bottom:5%; height:27%; border-radius:50%; background:radial-gradient(ellipse at center,rgba(255,255,255,.34),rgba(255,255,255,.08) 42%,transparent 72%); transform:perspective(280px) rotateX(64deg); filter:blur(2px); opacity:.86; }
.event-calendar-widget .has-image.image-bg-depth3d::after { inset:0; background:linear-gradient(115deg,transparent 0 36%,rgba(255,255,255,.16) 45%,transparent 54% 100%); opacity:.55; }
.event-calendar-widget .has-image.image-bg-depth3d .event-calendar-presentation-image { object-fit:contain!important; padding:15px!important; transform:translateY(-3px) scale(.96); filter:drop-shadow(0 20px 20px rgba(0,0,0,.42)) drop-shadow(0 3px 5px rgba(255,255,255,.2)); }
.event-calendar-widget.is-modern .event-calendar-modern-date { display:flex; position:absolute; top:0; left:0; z-index:4; width:68px; min-height:66px; box-sizing:border-box; flex-direction:column; align-items:center; justify-content:center; border-radius:0 0 18px 0; background:color-mix(in srgb,var(--event-color,var(--event-accent)) 88%,#0f172a); color:#fff; text-transform:uppercase; box-shadow:0 8px 20px rgba(15,23,42,.18); }
.event-calendar-widget.is-modern .event-calendar-modern-date span { font-size:.72rem; font-weight:900; letter-spacing:.08em; line-height:1; }
.event-calendar-widget.is-modern .event-calendar-modern-date strong { margin-top:3px; font-size:1.72rem; line-height:1; }
.event-calendar-widget.is-modern .event-calendar-presentation-body { padding:20px 22px 22px; color:#fff; }
.event-calendar-widget.is-modern .event-calendar-presentation-body h3,.event-calendar-widget.is-modern .event-calendar-presentation-body .event-calendar-meta,.event-calendar-widget.is-modern .event-calendar-presentation-body .event-calendar-presentation-description { color:#fff; }
.event-calendar-widget.is-modern .event-calendar-presentation-body .event-calendar-category { order:-1; margin:0; padding:0; border-radius:0; background:transparent; color:rgba(255,255,255,.82); text-transform:uppercase; letter-spacing:.06em; }
.event-calendar-widget.is-modern .event-calendar-presentation-body .event-calendar-countdown { background:rgba(255,255,255,.16); color:#fff; }
.event-calendar-widget.is-modern .event-calendar-presentation-body .event-calendar-registration-card-hint { border-left-color:#fff; background:rgba(255,255,255,.14); color:#fff; }
.event-calendar-widget.is-modern .event-calendar-presentation-card .event-calendar-details-button { border-color:rgba(255,255,255,.55); background:rgba(255,255,255,.12); color:#fff; }
.event-calendar-widget.is-modern .event-calendar-presentation-card .event-calendar-details-button:hover { background:#fff; color:var(--event-color,var(--event-accent)); }
.event-calendar-widget.is-modern .event-calendar-slider .event-calendar-presentation-card { grid-template-columns:minmax(260px,42%) minmax(0,1fr); min-height:0; }
.event-calendar-widget.is-modern .event-calendar-slider .event-calendar-presentation-media { height:auto; min-height:0; align-self:stretch; }
.event-calendar-widget.is-modern .event-calendar-slider .event-calendar-presentation-image,.event-calendar-widget.is-modern .event-calendar-slider .event-calendar-image-placeholder { height:100%; min-height:0; max-height:none; }
@media(max-width:820px) { .event-calendar-widget.is-modern .event-calendar-slider .event-calendar-presentation-card { grid-template-columns:1fr; } .event-calendar-widget.is-modern .event-calendar-slider .event-calendar-presentation-media { height:230px; } .event-calendar-widget.is-modern .event-calendar-slider .event-calendar-presentation-image,.event-calendar-widget.is-modern .event-calendar-slider .event-calendar-image-placeholder { height:100%; max-height:none; } }
@media(max-width:760px) { .event-calendar-widget.is-modern .event-calendar-card { grid-template-columns:1fr; grid-template-rows:auto auto auto; min-height:0; } .event-calendar-widget.is-modern .event-calendar-list-media { grid-row:auto; min-height:220px; } .event-calendar-widget.is-modern .event-calendar-list-media .event-calendar-presentation-image,.event-calendar-widget.is-modern .event-calendar-list-media .event-calendar-image-placeholder { min-height:220px; } .event-calendar-widget.is-modern .event-calendar-list-extras { min-height:0; } .event-calendar-widget.is-modern .event-calendar-card > .event-calendar-details-button { grid-column:1; grid-row:auto; } }
@media(max-width:1050px) { .event-calendar-grid-view { grid-template-columns:repeat(3,minmax(0,1fr)); } .event-calendar-carousel { grid-auto-columns:calc((100% - 32px)/3); } }
@media(max-width:820px) { .event-calendar-grid-view { grid-template-columns:repeat(2,minmax(0,1fr)); } .event-calendar-carousel { grid-auto-columns:calc((100% - 16px)/2); } .event-calendar-slider .event-calendar-presentation-card { grid-template-columns:1fr; } .event-calendar-slider .event-calendar-presentation-image,.event-calendar-slider .event-calendar-image-placeholder { height:220px; max-height:220px; } }
@media(max-width:760px) { .event-calendar-month-view { overflow-x:auto; } .event-calendar-month { min-width:720px; } .event-calendar-card { grid-template-columns:auto minmax(0,1fr); } .event-calendar-details-button { grid-column:1/-1; width:100%; } .event-calendar-search { min-width:0; width:100%; } .event-calendar-controls { width:100%; } .event-calendar-controls select { width:100%; } }
@media(max-width:560px) { .event-calendar-grid-view { grid-template-columns:1fr; } .event-calendar-carousel { grid-auto-columns:100%; } }


.downloads { display:grid; gap:10px; }
.download-item { display:block; padding:14px 16px; border:1px solid var(--line); border-radius:16px; background:#fff; font-weight:700; }

.lightbox { position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; padding:28px 98px 24px; background:rgba(10,15,28,.42); backdrop-filter:blur(24px) saturate(1.20); -webkit-backdrop-filter:blur(24px) saturate(1.20); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .28s ease, visibility .28s ease; }
.lightbox::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 50% 42%,rgba(37,99,235,.14),transparent 48%),linear-gradient(180deg,rgba(2,6,23,.10),rgba(2,6,23,.28)); }
.lightbox.is-open { opacity:1; visibility:visible; pointer-events:auto; }
.lightbox-shell { position:relative; z-index:1; width:min(1180px, calc(100vw - 220px)); max-height:94vh; display:grid; grid-template-rows:auto minmax(0,1fr) auto auto; gap:14px; transform:translateY(12px) scale(.965); opacity:.86; transition:transform .28s cubic-bezier(.2,.8,.2,1), opacity .28s ease; }
.lightbox.is-open .lightbox-shell { transform:translateY(0) scale(1); opacity:1; }
.lightbox-topbar { position:relative; z-index:5; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; min-height:52px; color:#e2e8f0; pointer-events:none; }
.lightbox-titlewrap { grid-column:2; min-width:0; max-width:min(520px,72vw); padding:0; border-radius:999px; background:transparent; border:0; box-shadow:none; text-align:center; }
.lightbox-title { display:none; }
.lightbox-counter { display:inline-flex; align-items:center; justify-content:center; margin:0; padding:6px 13px; min-height:28px; border-radius:999px; font-size:.86rem; line-height:1; color:#e0f2fe; font-weight:900; background:rgba(37,99,235,.48); border:1px solid rgba(147,197,253,.45); box-shadow:0 10px 28px rgba(15,23,42,.26); }
.lightbox-stage { position:relative; min-height:0; display:flex; align-items:center; justify-content:center; overflow:visible; }
.lightbox-content { position:relative; max-width:100%; max-height:74vh; text-align:center; }
.lightbox-imgwrap { position:relative; display:inline-flex; align-items:center; justify-content:center; max-width:100%; max-height:74vh; border-radius:24px; background:linear-gradient(145deg,rgba(255,255,255,.26),rgba(255,255,255,.05)); padding:1px; box-shadow:0 38px 130px rgba(0,0,0,.52),0 0 0 1px rgba(255,255,255,.08); }
.lightbox-imgwrap.is-switching { animation:lightboxSwitch .22s ease; }
@keyframes lightboxSwitch { 0% { opacity:.35; transform:scale(.985); } 100% { opacity:1; transform:scale(1); } }
.lightbox img { display:block; max-width:100%; max-height:74vh; margin:0 auto; border-radius:23px; background:#fff; box-shadow:0 1px 0 rgba(255,255,255,.18) inset; }
.lightbox-caption { justify-self:center; max-width:min(880px,90vw); color:#dbeafe; line-height:1.45; text-align:center; padding:12px 18px; border-radius:18px; background:rgba(15,23,42,.42); border:1px solid rgba(255,255,255,.14); box-shadow:0 14px 40px rgba(0,0,0,.20); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.lightbox-caption strong { display:block; color:#f8fafc; font-size:.98rem; margin-bottom:2px; }
.lightbox button { border:1px solid rgba(255,255,255,.20); border-radius:999px; background:rgba(15,23,42,.42); color:#fff; cursor:pointer; box-shadow:0 18px 50px rgba(0,0,0,.26); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); transition:transform .18s ease, background .18s ease, border-color .18s ease, opacity .18s ease; }
.lightbox button:hover { background:rgba(37,99,235,.82); border-color:rgba(255,255,255,.42); }
.lightbox-close { position:absolute; z-index:6; top:0; right:0; width:52px; height:52px; font-size:30px; line-height:1; pointer-events:auto; background:rgba(15,23,42,.34) !important; }
.lightbox-close:hover { transform:scale(1.07); background:rgba(239,68,68,.82) !important; }
.lightbox-prev,.lightbox-next { position:absolute; top:50%; z-index:2; width:62px; height:62px; font-size:36px; line-height:1; opacity:.56; transform:translateY(-50%); background:rgba(15,23,42,.34) !important; }
.lightbox-prev { left:-82px; } .lightbox-next { right:-82px; }
.lightbox-prev:hover,.lightbox-next:hover { transform:translateY(-50%) scale(1.09); opacity:1; background:rgba(37,99,235,.78) !important; }
.lightbox-thumbs { display:flex; justify-content:center; gap:8px; overflow-x:auto; padding:2px 8px 4px; scrollbar-width:thin; }
.lightbox-thumb { position:relative; flex:0 0 auto; width:72px; height:46px; padding:0; overflow:hidden; border-radius:12px !important; opacity:.62; background:rgba(15,23,42,.46) !important; }
.lightbox-thumb img { width:100%; height:100%; object-fit:cover; border-radius:10px; box-shadow:none; background:#fff; }
.lightbox-thumb.is-active { opacity:1; border-color:rgba(96,165,250,.96); box-shadow:0 0 0 2px rgba(37,99,235,.34),0 10px 28px rgba(0,0,0,.28); }
.lightbox-thumb:hover { transform:translateY(-2px); opacity:1; }
body.lightbox-lock { overflow:hidden; }
@media (hover:hover) { .lightbox-prev,.lightbox-next { opacity:.34; } .lightbox:hover .lightbox-prev,.lightbox:hover .lightbox-next { opacity:.74; } }
@media (max-width:980px) { .lightbox { padding:18px 58px; } .lightbox-shell { width:min(100%,900px); } .lightbox-prev { left:-50px; } .lightbox-next { right:-50px; } .lightbox-content,.lightbox-imgwrap,.lightbox img { max-height:76vh; } }
@media (max-width:760px) {
  .lightbox { align-items:stretch; padding:6px; background:rgba(10,15,28,.78); backdrop-filter:blur(18px) saturate(1.12); -webkit-backdrop-filter:blur(18px) saturate(1.12); }
  .lightbox-shell { width:100%; height:100%; max-height:none; display:block; transform:scale(.985); }
  .lightbox.is-open .lightbox-shell { transform:scale(1); }
  .lightbox-stage { width:100%; height:100%; min-height:0; overflow:hidden; }
  .lightbox-content { width:100%; height:100%; max-width:none; max-height:none; display:flex; align-items:center; justify-content:center; }
  .lightbox-imgwrap { width:100%; height:100%; max-width:none; max-height:none; display:flex; border-radius:14px; padding:0; background:transparent; box-shadow:none; }
  .lightbox img { width:100%; height:100%; max-width:none; max-height:none; object-fit:contain; border-radius:12px; background:transparent; box-shadow:none; }
  .lightbox-topbar { position:absolute; z-index:7; top:8px; left:8px; right:8px; display:flex; align-items:flex-start; justify-content:space-between; min-height:0; pointer-events:none; }
  .lightbox-titlewrap { display:block; max-width:calc(100% - 54px); padding:0; background:transparent; border:0; box-shadow:none; text-align:left; }
  .lightbox-title { display:none; }
  .lightbox-counter { margin:0; padding:5px 10px; min-height:26px; font-size:.78rem; background:rgba(15,23,42,.66); border-color:rgba(255,255,255,.22); }
  .lightbox-close { position:absolute; top:0; right:0; width:40px; height:40px; font-size:25px; background:rgba(15,23,42,.68) !important; }
  .lightbox-prev,.lightbox-next { position:absolute; top:50%; width:40px; height:48px; font-size:30px; opacity:.86; background:rgba(15,23,42,.58) !important; box-shadow:0 8px 24px rgba(0,0,0,.24); }
  .lightbox-prev { left:4px; } .lightbox-next { right:4px; }
  .lightbox-caption { position:absolute; z-index:6; left:10px; right:10px; bottom:10px; max-width:none; max-height:22vh; overflow:auto; margin:0; padding:8px 11px; border-radius:12px; font-size:.82rem; line-height:1.35; text-align:left; background:rgba(15,23,42,.68); }
  .lightbox-caption strong { font-size:.88rem; margin:0; }
  .lightbox-thumbs { display:none; }
}
@media (max-width:760px) and (orientation:landscape) {
  .lightbox { padding:4px; }
  .lightbox-imgwrap { border-radius:10px; }
  .lightbox img { border-radius:8px; }
  .lightbox-caption { left:50%; right:auto; bottom:6px; width:min(62vw,620px); transform:translateX(-50%); max-height:18vh; padding:6px 10px; }
  .lightbox-close { width:38px; height:38px; font-size:23px; }
  .lightbox-prev,.lightbox-next { width:38px; height:44px; }
}
.muted { color:var(--muted); }
.contact-box { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:18px; }
.contact-line { background:#f8fafc; border:1px solid var(--line); border-radius:var(--card-radius); padding:17px; }
.contact-form-card { position:relative; overflow:hidden; }
.contact-form-card::before { content:""; position:absolute; inset:0 0 auto 0; height:7px; background:linear-gradient(90deg,var(--primary),var(--accent)); }
.contact-intro { max-width:none; width:100%; color:#475569; margin:0 0 28px; line-height:1.75; }
.contact-form { margin-top:12px; width:100%; }

.contact-form-section .contact-panel { background:#fff; border:1px solid #dbe3ef; border-radius:24px; padding:30px; box-shadow:0 18px 45px rgba(15,23,42,.08); }
.contact-form-section .contact-panel h2 { margin:0 0 10px; color:#0f172a; font-size:clamp(1.5rem,3vw,2.1rem); }
.contact-form-combo { display:grid; gap:24px; align-items:start; width:100%; }
.contact-form-combo.info-right { grid-template-columns:minmax(0,1.25fr) minmax(280px,.85fr); }
.contact-form-combo.info-above,.contact-form-combo.info-below { grid-template-columns:1fr; }
.contact-form-combo.info-above .contact-form-info-grid,.contact-form-combo.info-below .contact-form-info-grid { grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }
.contact-form-combo.info-right .contact-form-info-grid { grid-template-columns:1fr; }
.contact-form-info-grid { display:grid; gap:18px; align-items:stretch; }
.contact-form-info-grid .contact-info-card { height:100%; box-sizing:border-box; }
.contact-form-info-grid .contact-info-card a { white-space:nowrap; word-break:normal; overflow-wrap:normal; hyphens:none; }
.contact-form-info-grid .contact-info-card .btn { margin-top:16px; }
@media(max-width:900px) { .contact-form-combo.info-right { grid-template-columns:1fr; } .contact-form-combo.info-right .contact-form-info-grid { grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); } }
.contact-panel-intro { color:#475569; line-height:1.7; margin:0 0 16px; }
.contact-panel-intro p { margin:0 0 16px; }
.contact-form-support { margin-top:18px; width:100%; }
.contact-form-support .form-grid { display:grid; gap:16px; }
.contact-form-support .form-field label { font-weight:800; color:#0f172a; margin-bottom:7px; display:block; }
.contact-form-support input,.contact-form-support textarea { width:100%; border:1px solid #cbd5e1; border-radius:14px; padding:13px 14px; font:inherit; background:#fff; color:#0f172a; box-sizing:border-box; }
.contact-form-support textarea { min-height:150px; resize:vertical; }
.contact-form-support input:focus,.contact-form-support textarea:focus { outline:2px solid rgba(37,99,235,.22); border-color:#2563eb; }
.contact-form-support .form-check { display:flex; gap:10px; align-items:flex-start; color:#475569; line-height:1.55; font-size:.95rem; }
.contact-form-support .form-check input { width:auto; margin-top:4px; }
.contact-form-support .form-actions { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.contact-form-support .form-note { font-size:.9rem; color:#64748b; }
@media(max-width:620px) { .contact-form-section .contact-panel { padding:24px; } .contact-form-support .form-actions { display:grid; } .contact-form-support .form-actions .btn { width:100%; } }

/* Kontaktseite: widgetbasierte MASTER-Struktur */
.contact-widget-section { padding:15px 0 !important; }
.contact-widget-section:first-child { padding-top:42px !important; }
.contact-widget-section:last-child { padding-bottom:42px !important; }
.contact-widget-section .widget-row { gap:24px !important; align-items:start !important; }
.contact-intro-card{background:linear-gradient(135deg,#ffffff 0%,#eef4ff 100%);border:1px solid #dbeafe;border-radius:24px;padding:34px;box-shadow:0 18px 50px rgba(15,23,42,.08)}
.contact-intro-card .eyebrow{font-size:.86rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin:0 0 10px;color:#2563eb}
.contact-intro-card h2{margin:.1rem 0 .7rem;font-size:clamp(2rem,4vw,3rem);letter-spacing:-.045em;color:#0f172a;line-height:1.08}
.contact-intro-card p{max-width:850px;color:#475569;font-size:1.08rem;line-height:1.75;margin:0}
.contact-widget-section .contact-panel{background:#fff;border:1px solid #dbe3ef;border-radius:24px;padding:30px;box-shadow:0 18px 45px rgba(15,23,42,.08);height:100%;box-sizing:border-box}
.contact-widget-section .contact-panel h2{margin:0 0 10px;color:#0f172a;font-size:clamp(1.5rem,3vw,2.1rem)}
.contact-panel-intro{color:#475569;line-height:1.7;margin:0 0 16px}.contact-panel-intro p{margin:0 0 16px}
.contact-info-list{display:grid;gap:18px;height:100%}
.contact-info-card{background:#fff;border:1px solid #dbe3ef;border-radius:22px;padding:24px;box-shadow:0 14px 40px rgba(15,23,42,.07)}
.contact-info-card .icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#dbeafe;color:#1d4ed8;font-size:24px;margin-bottom:14px}
.contact-info-card h3{margin:0 0 8px;color:#0f172a;font-size:1.15rem}.contact-info-card p{margin:0;color:#475569;line-height:1.65}.contact-info-card a{font-weight:800;white-space:nowrap;word-break:normal;overflow-wrap:normal;hyphens:none}
.contact-help{background:#f8fafc;border:1px solid #e2e8f0;border-radius:22px;padding:24px}.contact-help h3{margin:0 0 8px;color:#0f172a}.contact-help p{margin:0 0 16px;color:#475569;line-height:1.65}
.contact-cta{background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%) !important;color:#fff !important;border-radius:26px !important;padding:34px !important;display:flex !important;gap:20px !important;align-items:center !important;justify-content:space-between !important;box-shadow:0 24px 70px rgba(37,99,235,.24) !important}
.contact-cta h2{color:#fff !important;margin:.1rem 0;font-size:clamp(1.6rem,3vw,2.4rem)}.contact-cta p{color:#dbeafe !important;margin:0;line-height:1.65}.contact-cta .eyebrow{display:inline-flex;width:max-content;background:rgba(255,255,255,.12);color:#bfdbfe;border:1px solid rgba(255,255,255,.30);border-radius:999px;padding:7px 12px;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin:0 0 12px}
.contact-cta .hero-actions{display:grid;gap:12px;min-width:260px}.contact-cta .btn,.contact-cta .btn-secondary{min-height:52px;padding:14px 22px;display:inline-flex;align-items:center;justify-content:center;background:#ffffff !important;color:#1d4ed8 !important;border:2px solid #ffffff !important;font-weight:800;text-decoration:none;box-shadow:0 14px 28px rgba(15,23,42,.12)}
@media(max-width:900px){.contact-widget-section .widget-row{grid-template-columns:1fr !important}.contact-cta{display:block !important}.contact-cta .hero-actions{margin-top:20px}}
@media(max-width:620px){.contact-intro-card,.contact-widget-section .contact-panel,.contact-info-card,.contact-help,.contact-cta{padding:24px !important}.contact-cta .hero-actions{display:grid;gap:10px}.contact-cta .btn{width:100%;text-align:center}.contact-form-support .form-actions{display:grid}.contact-form-support .form-actions .btn{width:100%}}

/* Step 134: Mobile Widget-Zeilen robust einspaltig stapeln (z. B. Google Maps + YouTube). */
@media(max-width:820px){
  .widget-section .container .widget-row,
  .widget-section .container .widget-row.equal-height{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    --cols:1 !important;
    gap:var(--widget-gap-vertical, 22px) !important;
  }
  .widget-section .container .widget-row > .widget-slot,
  .widget-section .container .widget-row.equal-height > .widget-slot{
    grid-column:1 / -1 !important;
    min-width:0 !important;
    width:100% !important;
    display:block !important;
    height:auto !important;
  }
  .widget-row.equal-height .widget-slot > .card,
  .widget-row.equal-height .widget-slot > .widget-plain{
    min-height:0 !important;
    height:auto !important;
  }
  .google-maps-widget,
  .youtube-widget,
  .google-maps-consent-placeholder,
  .youtube-consent-placeholder,
  .youtube-widget-wrap{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }
  iframe.google-maps-embed,
  iframe.youtube-embed,
  .cookie-protected-embed{
    width:100% !important;
    max-width:100% !important;
  }
}

.form-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:18px; width:100%; }
.form-field { display:flex; flex-direction:column; gap:7px; }
.form-field.full { grid-column:1 / -1; width:100%; }
.form-field label { font-weight:850; color:#0f172a; font-size:.95rem; }
.form-field input, .form-field textarea { width:100%; border:1px solid #cbd5e1; border-radius:16px; background:#f8fafc; padding:13px 15px; font:inherit; color:#0f172a; outline:none; transition:border-color .18s ease, box-shadow .18s ease, background .18s ease; }
.form-field textarea { min-height:230px; resize:vertical; display:block; }
.form-field input:focus, .form-field textarea:focus { border-color:var(--primary); background:#fff; box-shadow:0 0 0 4px rgba(37,99,235,.13); }
.form-check { grid-column:1 / -1; display:flex; align-items:flex-start; gap:11px; background:#f8fafc; border:1px solid var(--line); border-radius:var(--card-radius); padding:14px 16px; color:#334155; }
.form-check input { margin-top:5px; width:18px; height:18px; accent-color:var(--primary); }
.form-check a { color:var(--primary); font-weight:800; }
.form-actions { grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-top:4px; }
.form-note { color:var(--muted); font-size:.94rem; }
.form-local-note { display:none; grid-column:1 / -1; border:1px solid #f59e0b; background:#fffbeb; color:#92400e; border-radius:var(--card-radius); padding:14px 16px; font-weight:700; }
.form-hp { position:absolute !important; left:-5000px !important; opacity:0 !important; height:0 !important; width:0 !important; overflow:hidden !important; }
.form-description { grid-column:1 / -1; color:#475569; line-height:1.65; }
.form-divider { grid-column:1 / -1; border:0; border-top:1px solid var(--line); margin:8px 0; }
.form-field select { width:100%; border:1px solid #cbd5e1; border-radius:16px; background:#f8fafc; padding:13px 15px; font:inherit; color:#0f172a; outline:none; }
.form-help { display:block; margin-top:7px; color:#64748b; font-size:.88rem; line-height:1.45; }
.form-error { display:none; margin-top:7px; color:#b91c1c; font-size:.9rem; font-weight:700; line-height:1.4; }
.form-field.has-error input,.form-field.has-error textarea,.form-field.has-error select,.form-check.has-error { border-color:#ef4444 !important; background:#fff7f7 !important; box-shadow:0 0 0 4px rgba(239,68,68,.12) !important; }
.form-field.has-error .form-error,.form-check.has-error .form-error { display:block; }
.form-label { font-weight:850; color:#0f172a; font-size:.95rem; }
.form-options { display:flex; flex-direction:column; gap:9px; background:#f8fafc; border:1px solid var(--line); border-radius:16px; padding:12px 14px; }
.form-option { display:flex; align-items:flex-start; gap:9px; color:#334155; }
.form-option input { width:18px; height:18px; margin-top:2px; accent-color:var(--primary); }
.footer { padding:34px 0; border-top:1px solid var(--line); background:#fff; color:var(--muted); }

/* Banner-Widget */
.site-banner-layer { position:fixed; inset:0; z-index:1190; pointer-events:none; overflow:hidden; contain:strict; width:100vw; height:100vh; }
.site-banner-widget { position:absolute !important; inset:auto; z-index:1; box-sizing:border-box; padding:18px 22px; border-radius:14px; box-shadow:0 18px 50px rgba(15,23,42,.22); display:flex; gap:18px; align-items:center; justify-content:space-between; line-height:1.45; --banner-x:0px; --banner-y:0px; transform:translate3d(var(--banner-x),var(--banner-y),0); margin:0 !important; contain:layout paint style; will-change:transform,opacity; backface-visibility:hidden; pointer-events:auto; }
.site-banner-widget[hidden] { display:none !important; }
.site-banner-widget.banner-pending { opacity:0; visibility:hidden; animation:none !important; }
.site-banner-widget.position-top { top:18px; bottom:auto; }
.site-banner-widget.position-bottom { bottom:18px; top:auto; }
.site-banner-widget.position-center { top:50%; bottom:auto; --banner-y:-50%; }
.site-banner-widget.align-left { left:18px; right:auto; }
.site-banner-widget.align-center { left:50%; right:auto; --banner-x:-50%; }
.site-banner-widget.align-right { right:18px; left:auto; }
.site-banner-widget.full-width { left:18px !important; right:18px !important; width:auto !important; max-width:none !important; --banner-x:0px !important; }
.site-banner-widget .site-banner-content { flex:1 1 auto; min-width:0; color:inherit !important; }
.site-banner-widget .site-banner-content p,
.site-banner-widget .site-banner-content div,
.site-banner-widget .site-banner-content span,
.site-banner-widget .site-banner-content strong,
.site-banner-widget .site-banner-content em,
.site-banner-widget .site-banner-content u,
.site-banner-widget .site-banner-content li { color:inherit !important; }
.site-banner-widget .site-banner-content p { margin:.25rem 0; }
.site-banner-widget .site-banner-content a { color:inherit !important; text-decoration:underline; }
.site-banner-widget .site-banner-close { appearance:none; border:0; border-radius:10px; padding:10px 18px; cursor:pointer; font-weight:800; background:var(--primary); color:#fff; white-space:nowrap; }
.site-banner-widget.banner-fade { animation:bannerFade .9s ease both; }
.site-banner-widget.banner-drop { animation:bannerDrop 1.05s ease both; }
.site-banner-widget.banner-rise { animation:bannerRise 1.05s ease both; }
.site-banner-widget.banner-slide-left { animation:bannerSlideLeft 1.05s ease both; }
.site-banner-widget.banner-slide-right { animation:bannerSlideRight 1.05s ease both; }
.site-banner-widget.banner-zoom { animation:bannerZoom .95s ease both; }
@keyframes bannerFade { from{opacity:0} to{opacity:1} }
@keyframes bannerDrop { from{opacity:0; transform:translate3d(var(--banner-x), calc(var(--banner-y) - 42px), 0)} to{opacity:1; transform:translate3d(var(--banner-x), var(--banner-y), 0)} }
@keyframes bannerRise { from{opacity:0; transform:translate3d(var(--banner-x), calc(var(--banner-y) + 42px), 0)} to{opacity:1; transform:translate3d(var(--banner-x), var(--banner-y), 0)} }
@keyframes bannerSlideLeft { from{opacity:0; transform:translate3d(calc(var(--banner-x) - 56px), var(--banner-y), 0)} to{opacity:1; transform:translate3d(var(--banner-x), var(--banner-y), 0)} }
@keyframes bannerSlideRight { from{opacity:0; transform:translate3d(calc(var(--banner-x) + 56px), var(--banner-y), 0)} to{opacity:1; transform:translate3d(var(--banner-x), var(--banner-y), 0)} }
@keyframes bannerZoom { from{opacity:0; transform:translate3d(var(--banner-x),var(--banner-y),0) scale(.92)} to{opacity:1; transform:translate3d(var(--banner-x),var(--banner-y),0) scale(1)} }
@media (max-width:700px) { .site-banner-widget { left:14px !important; right:14px !important; max-width:none !important; width:auto !important; flex-direction:column; align-items:stretch; --banner-x:0px !important; } .site-banner-widget .site-banner-close { width:100%; } }


.cookie-consent {
  position:fixed;
  z-index:1200;
  left:0;
  right:0;
  padding:18px;
  pointer-events:none;
  opacity:0;
  transition:opacity .25s ease;
}
.cookie-consent[hidden] { display:none !important; }
.cookie-consent-bottom { bottom:0; }
.cookie-consent-top { top:0; }
.cookie-consent-center { inset:0; display:flex; align-items:center; justify-content:center; background:rgba(15,23,42,.38); }
.cookie-consent-card { width:min(880px, calc(100vw - 36px)); max-height:min(86vh, 820px); margin:0 auto; background:#fff; color:#0f172a; border:1px solid var(--line); border-radius:var(--card-radius); box-shadow:0 24px 80px rgba(15,23,42,.25); padding:20px; pointer-events:auto; display:flex; flex-direction:column; opacity:0; transform:translate3d(0,18px,0); transition:opacity .25s ease,transform .25s ease; will-change:opacity,transform; }
.cookie-consent-top .cookie-consent-card { transform:translate3d(0,-18px,0); }
.cookie-consent-center .cookie-consent-card { transform:translate3d(0,14px,0) scale(.985); }
.cookie-consent.is-visible { opacity:1; }
.cookie-consent.is-visible .cookie-consent-card { opacity:1; transform:translate3d(0,0,0) scale(1); }
.cookie-consent-main { flex:0 0 auto; }
.cookie-consent-main h2 { margin:0 0 6px; font-size:1.28rem; }
.cookie-consent-main p { margin:0 0 14px; color:#475569; }
.cookie-consent-details { flex:1 1 auto; overflow:auto; padding-right:6px; margin:4px 0 14px; }
.cookie-consent-details[hidden] { display:none !important; }
.cookie-consent-categories { display:grid; gap:10px; margin:8px 0 12px; }
.cookie-category-panel { background:#f8fafc; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.cookie-category-head { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:start; padding:14px 16px; }
.cookie-category-title { display:flex; align-items:center; gap:8px; font-weight:850; color:#0f172a; font-size:1.02rem; }
.cookie-category-desc { display:block; color:#64748b; margin-top:4px; line-height:1.45; }
.cookie-category-required { font-size:.72rem; font-weight:800; color:#166534; background:#dcfce7; border-radius:999px; padding:2px 8px; }
.cookie-category-unused { font-size:.72rem; font-weight:800; color:#991b1b; background:#fee2e2; border-radius:999px; padding:2px 8px; }
.cookie-category-panel.is-unused { opacity:.78; background:#f8fafc; }
.cookie-category-panel.is-unused .cookie-category-title { color:#334155; }
.cookie-category-panel.is-unused .cookie-switch-ui { background:#dc2626; opacity:.8; cursor:not-allowed; }
.cookie-category-unused-note { display:block; color:#991b1b; font-weight:700; margin-top:6px; }
.cookie-switch { position:relative; display:inline-flex; align-items:center; justify-content:flex-end; width:62px; height:30px; }
.cookie-switch input { position:absolute; opacity:0; width:1px; height:1px; }
.cookie-switch-ui { position:relative; width:62px; height:30px; border-radius:999px; background:#dc2626; box-shadow:inset 0 0 0 1px rgba(15,23,42,.12); transition:background .2s ease; }
.cookie-switch-ui::before { content:'AUS'; position:absolute; right:7px; top:50%; transform:translateY(-50%); color:#fff; font-size:.63rem; font-weight:900; letter-spacing:.02em; }
.cookie-switch-ui::after { content:''; position:absolute; left:4px; top:4px; width:22px; height:22px; border-radius:50%; background:#fff; box-shadow:0 2px 6px rgba(15,23,42,.25); transition:transform .2s ease; }
.cookie-switch input:checked + .cookie-switch-ui { background:#16a34a; }
.cookie-switch input:checked + .cookie-switch-ui::before { content:'AN'; left:8px; right:auto; }
.cookie-switch input:checked + .cookie-switch-ui::after { transform:translateX(32px); }
.cookie-switch input:disabled + .cookie-switch-ui { opacity:.75; cursor:not-allowed; }
.cookie-switch input:disabled:checked + .cookie-switch-ui { background:#16a34a; }
.cookie-switch input:disabled:not(:checked) + .cookie-switch-ui { background:#dc2626; }
.cookie-info-toggle { appearance:none; border:0; background:transparent; color:var(--primary); font:inherit; font-weight:850; cursor:pointer; padding:0 16px 12px; text-align:left; }
.cookie-info-toggle:hover { text-decoration:underline; }
.cookie-service-list { display:grid; gap:0; margin:0 16px 14px; background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.cookie-service-list[hidden] { display:none !important; }
.cookie-service-row { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:start; padding:12px 14px; border-bottom:none; }
.cookie-service-row:last-child { border-bottom:0; }
.cookie-service-row strong { color:#0f172a; }
.cookie-service-row small { display:block; color:#64748b; margin-top:3px; line-height:1.4; }
.cookie-service-row a { color:var(--primary); font-weight:750; text-decoration:none; }
.cookie-service-row a:hover { text-decoration:underline; }
.cookie-privacy-note { font-size:.85rem; color:#64748b; margin:10px 0 0; }
.cookie-consent-actions { flex:0 0 auto; display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; padding-top:12px; border-top:1px solid var(--line); }
.cookie-consent-actions .btn { border:0; cursor:pointer; }
.cookie-consent-actions .cookie-accept-all,.cookie-consent-actions .cookie-necessary,.cookie-consent-actions .cookie-settings,.cookie-consent-actions .cookie-save { background:#ffffff !important; color:var(--primary) !important; border:1px solid var(--primary) !important; box-shadow:0 10px 20px rgba(15,23,42,.08) !important; opacity:1 !important; filter:none !important; }
.cookie-consent-actions .cookie-accept-all:hover,.cookie-consent-actions .cookie-necessary:hover,.cookie-consent-actions .cookie-settings:hover,.cookie-consent-actions .cookie-save:hover,.cookie-consent-actions .btn.is-selected { background:var(--primary) !important; color:#ffffff !important; border-color:var(--primary) !important; filter:none !important; opacity:1 !important; }
.cookie-consent-actions .cookie-accept-all:disabled,.cookie-consent-actions .cookie-necessary:disabled,.cookie-consent-actions .cookie-settings:disabled,.cookie-consent-actions .cookie-save:disabled { background:#ffffff !important; color:var(--primary) !important; border-color:var(--primary) !important; opacity:1 !important; cursor:pointer !important; }
@media (max-width:720px) { .cookie-consent { padding:10px; } .cookie-consent-card { width:100%; max-height:88vh; padding:16px; } .cookie-category-head,.cookie-service-row { grid-template-columns:1fr; } .cookie-switch { justify-self:start; } .cookie-consent-actions { flex-direction:column; } .cookie-consent-actions .btn { width:100%; text-align:center; } }
@media (prefers-reduced-motion:reduce) {
  .cookie-consent,.cookie-consent-card { transition:none !important; }
}

.back-to-top-page {
  position:fixed;
  z-index:999;
  width:44px;
  height:44px;
  border:0;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--primary);
  color:#fff;
  box-shadow:0 12px 28px rgba(15,23,42,.22);
  cursor:pointer;
  font-size:22px;
  line-height:1;
  opacity:0;
  visibility:hidden;
  transform:translateY(10px);
  transition:opacity .22s ease,transform .22s ease,visibility .22s ease,filter .18s ease;
}
.back-to-top-page.is-visible {
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.back-to-top-page:hover {
  filter:brightness(.95);
  transform:translateY(-2px);
}
.back-to-top-page.bottom-right {
  right:24px;
  bottom:24px;
}
.back-to-top-page.bottom-left {
  left:24px;
  bottom:24px;
}
.back-to-top-page.bottom-center {
  left:50%;
  bottom:24px;
  transform:translate(-50%,10px);
}
.back-to-top-page.bottom-center.is-visible {
  transform:translate(-50%,0);
}
.back-to-top-page.bottom-center:hover {
  transform:translate(-50%,-2px);
}
.cms-branding-block {
  padding:32px 0 42px;
}
.cms-branding-inner {
  width:min(100% - 36px, var(--container-width));
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:18px;
  padding:20px 22px;
  border:var(--card-border-width) solid var(--card-border-color);
  border-radius:var(--card-radius);
  background:#ffffff;
  box-shadow:var(--card-shadow);
}
.cms-branding-logo {
  display:block;
  object-fit:contain;
  flex:0 0 auto;
}
.cms-branding-content h2 {
  margin:0 0 6px;
  font-size:1.05rem;
}
.cms-branding-content p {
  margin:0 0 8px;
  color:var(--muted);
}
.cms-branding-link {
  color:var(--primary);
  font-weight:700;
  text-decoration:none;
}
.cms-branding-link:hover {
  text-decoration:underline;
}

@media (max-width:640px) {
  .back-to-top-page {
    width:40px;
    height:40px;
    font-size:20px;
  }
  .back-to-top-page.bottom-right {
    right:16px;
    bottom:16px;
  }
  .back-to-top-page.bottom-left {
    left:16px;
    bottom:16px;
  }
  .back-to-top-page.bottom-center {
    bottom:16px;
  }
  /* Step 818: Branding auf Smartphones als zentrierte Einspalten-Darstellung. */
  .cms-branding-block {
    padding:24px 0 32px;
  }
  .cms-branding-inner {
    width:min(100% - 28px, var(--container-width));
    flex-direction:column;
    align-items:center;
    gap:14px;
    padding:22px 18px;
    text-align:center;
  }
  .cms-branding-logo {
    flex:none;
    max-width:100%;
  }
  .cms-branding-content {
    width:100%;
    min-width:0;
  }
  .cms-branding-content h2,
  .cms-branding-content p,
  .cms-branding-link {
    overflow-wrap:break-word;
    word-break:normal;
  }
}


/* Step 240: Desktop-Korrektur für vertikale Navigation.
   Ursache: spätere Section-Style-Regeln setzten main wieder auf zentrierte
   Breite/Margins. Dadurch entstand im Desktop-Modus links zwischen
   Navigation und Header-/Inhaltsbereich ein sichtbarer Freiraum.
   Diese Regeln gelten ausschließlich oberhalb des mobilen Burger-Breakpoints. */
@media (min-width: 821px) {
 body.nav-layout-vertikal-links main,
 body.nav-layout-vertikal-links .hero,
 body.nav-layout-vertikal-links .hero-banner,
 body.nav-layout-vertikal-links .site-footer {
   margin-left:var(--side-nav-width) !important;
   margin-right:0 !important;
   width:calc(100% - var(--side-nav-width)) !important;
   max-width:none !important;
 }
 body.nav-layout-vertikal-links main {
   border-radius:0 !important;
 }
 body.nav-layout-vertikal-links .hero > .container,
 body.nav-layout-vertikal-links .hero .hero-grid,
 body.nav-layout-vertikal-links .widget-section > .container,
 body.nav-layout-vertikal-links main > .container,
 body.nav-layout-vertikal-links .site-footer > .container {
   margin-left:auto !important;
   margin-right:auto !important;
   width:min(var(--container-width), calc(100% - var(--container-padding))) !important;
 }
 body.nav-layout-vertikal-links .section-fullwidth {
   width:calc(100vw - var(--side-nav-width)) !important;
   margin-left:0 !important;
   margin-right:0 !important;
 }
}

/* Step 241: Vertikale Navigation Desktop strukturell bereinigt.
   Ursache der Restprobleme:
   - Step-240-Regeln zentrierten die Container im verbleibenden Inhaltsbereich
     wieder per margin-left:auto. Dadurch blieb auf Desktop links neben dem
     Hero-/Header-Inhalt ein großer leerer Bereich sichtbar.
   - Untermenüs nutzten auf Desktop weiterhin die horizontale Dropdown-Logik
     (position:absolute). In einer vertikalen Navigation müssen Unterpunkte
     statisch eingerückt im linken Menüfluss liegen. */
@media (min-width: 821px) {
 body.nav-layout-vertikal-links {
   --vertical-content-offset:clamp(24px, 3vw, 48px);
 }
 body.nav-layout-vertikal-links main,
 body.nav-layout-vertikal-links .hero,
 body.nav-layout-vertikal-links .hero-banner,
 body.nav-layout-vertikal-links .site-footer {
   margin-left:var(--side-nav-width) !important;
   margin-right:0 !important;
   width:calc(100% - var(--side-nav-width)) !important;
   max-width:none !important;
 }
 body.nav-layout-vertikal-links .hero > .container,
 body.nav-layout-vertikal-links .hero .hero-grid,
 body.nav-layout-vertikal-links .widget-section > .container,
 body.nav-layout-vertikal-links main > .container,
 body.nav-layout-vertikal-links .site-footer > .container {
   margin-left:var(--vertical-content-offset) !important;
   margin-right:auto !important;
   width:min(var(--container-width), calc(100% - var(--container-padding) - var(--vertical-content-offset))) !important;
   max-width:none !important;
 }
 body.nav-layout-vertikal-links .section-fullwidth {
   width:calc(100vw - var(--side-nav-width)) !important;
   max-width:none !important;
   margin-left:0 !important;
   margin-right:0 !important;
 }
 body.nav-layout-vertikal-links .section-fullwidth > .container,
 body.nav-layout-vertikal-links .hero.section-fullwidth .hero-grid,
 body.nav-layout-vertikal-links .section-fullwidth.hero .hero-grid {
   margin-left:var(--vertical-content-offset) !important;
   margin-right:auto !important;
   width:min(var(--container-width), calc(100% - var(--container-padding) - var(--vertical-content-offset))) !important;
 }
 body.nav-layout-vertikal-links .menu-list,
 body.nav-layout-vertikal-links .menu-list > li {
   width:100% !important;
 }
 body.nav-layout-vertikal-links .menu-list > li {
   position:relative !important;
 }
 body.nav-layout-vertikal-links .has-submenu > a {
   display:flex !important;
   align-items:center !important;
   justify-content:space-between !important;
   gap:8px !important;
 }
 body.nav-layout-vertikal-links .submenu {
   position:static !important;
   display:block !important;
   opacity:1 !important;
   visibility:visible !important;
   transform:none !important;
   transition:none !important;
   min-width:0 !important;
   width:calc(100% - 10px) !important;
   box-shadow:none !important;
   border:0 !important;
   border-left:3px solid var(--line) !important;
   border-radius:0 !important;
   background:transparent !important;
   padding:4px 0 4px 14px !important;
   margin:2px 0 6px 10px !important;
 }
 body.nav-layout-vertikal-links .submenu a {
   width:100% !important;
   justify-content:flex-start !important;
   padding:7px 10px !important;
   border-radius:10px !important;
   white-space:normal !important;
   font-size:.95em !important;
 }
 body.nav-layout-vertikal-links .submenu .submenu {
   top:auto !important;
   left:auto !important;
   margin-left:8px !important;
 }
}


/* Step 242: Vertikale Desktop-Navigation gezielt korrigiert.
   Wichtig: Es wird NUR der Header-/Hero-Bereich an die linke Navigation gezogen.
   Normale Inhaltscontainer behalten den Abstand aus der bestehenden Layoutlogik. */
@media (min-width: 821px) {
 body.nav-layout-vertikal-links .hero > .container,
 body.nav-layout-vertikal-links .hero .hero-grid,
 body.nav-layout-vertikal-links .hero.section-fullwidth .hero-grid,
 body.nav-layout-vertikal-links .section-fullwidth.hero .hero-grid {
   margin-left:0 !important;
   margin-right:auto !important;
   width:min(var(--container-width), calc(100% - var(--container-padding))) !important;
   max-width:none !important;
 }
 body.nav-layout-vertikal-links .submenu-marker {
   cursor:pointer !important;
   padding:2px 6px !important;
   margin-left:auto !important;
   border-radius:999px !important;
 }
 body.nav-layout-vertikal-links .submenu-marker:hover {
   background:rgba(127,127,127,.16) !important;
 }
 body.nav-layout-vertikal-links .submenu {
   display:none !important;
 }
 body.nav-layout-vertikal-links .has-submenu.is-submenu-open > .submenu {
   display:block !important;
 }
 body.nav-layout-vertikal-links .has-submenu.is-submenu-open > a .submenu-marker {
   transform:rotate(180deg);
 }
}




/* Step 243: Vertikale Desktop-Navigation final bereinigt.
   Analyse: Der Hero/Header ist inzwischen ein normales Hero-Widget innerhalb
   von <main>. Frühere Regeln behandelten jede .hero global so, als läge sie
   direkt neben der festen linken Navigation. Dadurch bekam ein Hero innerhalb
   von main zusätzlich zum main-Versatz noch einen zweiten margin-left und der
   Header-Hintergrund begann zu weit rechts. Außerdem waren normale
   Inhaltscontainer durch Step 241 zu weit nach links verschoben.
   Lösung: Nur direkte Seitenelemente neben der Navigation versetzen. Hero-
   Widgets innerhalb von main beginnen bei 0 im Hauptbereich; ihre inneren
   Container bleiben wie normale Website-Container zentriert. */
@media (min-width: 821px) {
 body.nav-layout-vertikal-links {
   --vertical-content-offset:clamp(24px, 3vw, 48px);
 }
 body.nav-layout-vertikal-links main,
 body.nav-layout-vertikal-links > .hero,
 body.nav-layout-vertikal-links > .hero-banner,
 body.nav-layout-vertikal-links > .site-footer {
   margin-left:var(--side-nav-width) !important;
   margin-right:0 !important;
   width:calc(100% - var(--side-nav-width)) !important;
   max-width:none !important;
 }
 body.nav-layout-vertikal-links main .hero,
 body.nav-layout-vertikal-links main .hero-banner,
 body.nav-layout-vertikal-links main .section-fullwidth.hero,
 body.nav-layout-vertikal-links main .hero.section-fullwidth {
   margin-left:0 !important;
   margin-right:0 !important;
   width:100% !important;
   max-width:none !important;
 }
 body.nav-layout-vertikal-links main .hero > .container,
 body.nav-layout-vertikal-links main .hero .hero-grid,
 body.nav-layout-vertikal-links main .hero.section-fullwidth .hero-grid,
 body.nav-layout-vertikal-links main .section-fullwidth.hero .hero-grid {
   margin-left:auto !important;
   margin-right:auto !important;
   width:min(var(--container-width), calc(100% - var(--container-padding))) !important;
   max-width:none !important;
 }
 body.nav-layout-vertikal-links .widget-section > .container,
 body.nav-layout-vertikal-links main > .container,
 body.nav-layout-vertikal-links .site-footer > .container {
   margin-left:auto !important;
   margin-right:auto !important;
   width:min(var(--container-width), calc(100% - var(--container-padding))) !important;
   max-width:none !important;
 }
 body.nav-layout-vertikal-links main .section-fullwidth:not(.hero) {
   width:100% !important;
   max-width:none !important;
   margin-left:0 !important;
   margin-right:0 !important;
 }
 /* Step 413: Der neue Inhalts-Container mit aktivierter Vollbreite wird
   aus der alten Begrenzung fuer normale Fullwidth-Abschnitte ausgenommen.
   Sonst gewinnt diese spezifischere Altregel gegen die eigentliche
   Container-Fullwidth-Regel. */
 body.nav-layout-vertikal-links main .section-fullwidth:not(.hero):not(.cms-content-container-fullwidth) > .container {
   margin-left:auto !important;
   margin-right:auto !important;
   width:min(var(--container-width), calc(100% - var(--container-padding))) !important;
 }
 body.nav-layout-vertikal-links > .hero > .container,
 body.nav-layout-vertikal-links > .hero .hero-grid,
 body.nav-layout-vertikal-links > .hero-banner > .container,
 body.nav-layout-vertikal-links > .site-footer > .container {
   margin-left:auto !important;
   margin-right:auto !important;
   width:min(var(--container-width), calc(100% - var(--container-padding))) !important;
 }
}

/* Step 244: Bei vertikaler Navigation darf nur der Hero-HINTERGRUND am
   linken Menü andocken. Wenn die Header-Vorlage "Volle Browserbreite" nutzt,
   muss auch der innere Header-Inhalt die verfügbare Breite rechts neben der
   Navigation nutzen. Normale Inhaltscontainer bleiben unverändert. */
@media (min-width: 821px) {
 body.nav-layout-vertikal-links main .hero.hero-fullwidth > .container,
 body.nav-layout-vertikal-links main .hero.hero-fullwidth .hero-grid,
 body.nav-layout-vertikal-links main .hero.section-fullwidth.hero-fullwidth > .container,
 body.nav-layout-vertikal-links main .hero.section-fullwidth.hero-fullwidth .hero-grid,
 body.nav-layout-vertikal-links main .section-fullwidth.hero.hero-fullwidth > .container,
 body.nav-layout-vertikal-links main .section-fullwidth.hero.hero-fullwidth .hero-grid {
   width:100% !important;
   max-width:none !important;
   margin-left:0 !important;
   margin-right:0 !important;
   padding-left:clamp(24px, 5vw, 96px) !important;
   padding-right:clamp(24px, 5vw, 96px) !important;
 }
}


/* Step 590: Full-Width-Header bei vertikaler Navigation korrekt aus dem
   gepolsterten main-Inhaltsbereich herausbrechen.

   Der Header ist ein Kind von <main>. Bei vertikaler Navigation ist <main>
   bereits um die Navigationsbreite verschoben. Die bisherige spaetere
   Step-243-Regel setzte den Full-Width-Header innerhalb von main jedoch nur
   auf width:100%. Dadurch blieb die Innenpolsterung des gestalteten main-
   Bereichs links und rechts sichtbar und der Header wirkte eingerueckt.

   Die Breite wird deshalb aus der tatsaechlich verfuegbaren Browserbreite
   rechts neben der Navigation berechnet. Der symmetrische negative Versatz
   gleicht ausschliesslich die main-Innenpolsterung aus. Horizontale Navigation,
   normale Header und alle Inhaltsbereiche bleiben unberuehrt. */
@media (min-width: 821px) {
 body.nav-layout-vertikal-links main > .hero.section-fullwidth,
 body.nav-layout-vertikal-links main > .section-fullwidth.hero {
   width:calc(100vw - var(--side-nav-width)) !important;
   max-width:none !important;
   margin-left:calc((100% - (100vw - var(--side-nav-width))) / 2) !important;
   margin-right:0 !important;
 }

 /* Step 594: Beim Ein- und Ausfahren der vertikalen Navigation müssen
    Sidebar, main und der darin liegende Full-Width-Header dieselbe
    280-ms-Bewegung verwenden. Ohne eigenen Übergang sprang die aus
    --side-nav-width berechnete Headerbreite sofort auf den Zielwert,
    während Navigation und main noch animierten. Dadurch wurde kurzfristig
    der weiße main-Hintergrund als Spalt sichtbar. */
 body.nav-layout-vertikal-links.vertical-menu-collapsible main > .hero.section-fullwidth,
 body.nav-layout-vertikal-links.vertical-menu-collapsible main > .section-fullwidth.hero {
   transition:width 280ms ease, margin-left 280ms ease !important;
   will-change:width, margin-left;
 }
}



/* Step 596: Vertikale Navigation und Header aus einer einzigen animierten
   Breitenvariable steuern.

   Ursache des kurz sichtbaren Spalts: --side-nav-width sprang beim Umschalten
   sofort auf den Zielwert, waehrend Sidebar, main und einzelne Hero-Regeln
   ihre eigenen width-/margin-Transitions abspielten. Dadurch existierten
   waehrend der 280 ms mehrere voneinander abweichende Zwischenbreiten.

   Die Navigationsbreite selbst wird jetzt als typisierte CSS-Variable
   animiert. Sidebar, main und alle daraus abgeleiteten Breiten lesen in jedem
   Frame denselben Wert. Ein Hero innerhalb von main erhaelt keinen zweiten
   Seitenversatz und keine eigene Layoutanimation. */
@property --side-nav-width {
  syntax: "<length>";
  inherits: true;
  initial-value: 260px;
}

@media (min-width: 821px) {
 body.nav-layout-vertikal-links.vertical-menu-collapsible {
   transition:--side-nav-width 280ms ease !important;
 }
 body.nav-layout-vertikal-links.vertical-menu-collapsible .header,
 body.nav-layout-vertikal-links.vertical-menu-collapsible .header.sticky,
 body.nav-layout-vertikal-links.vertical-menu-collapsible main,
 body.nav-layout-vertikal-links.vertical-menu-collapsible > .hero,
 body.nav-layout-vertikal-links.vertical-menu-collapsible > .hero-banner,
 body.nav-layout-vertikal-links.vertical-menu-collapsible > .site-footer {
   transition:none !important;
 }
 body.nav-layout-vertikal-links.vertical-menu-collapsible main {
   margin-left:var(--side-nav-width) !important;
   margin-right:0 !important;
   width:calc(100% - var(--side-nav-width)) !important;
   max-width:none !important;
 }
 body.nav-layout-vertikal-links.vertical-menu-collapsible main > .hero,
 body.nav-layout-vertikal-links.vertical-menu-collapsible main > .hero-banner,
 body.nav-layout-vertikal-links.vertical-menu-collapsible main > .hero.section-fullwidth,
 body.nav-layout-vertikal-links.vertical-menu-collapsible main > .section-fullwidth.hero,
 body.nav-layout-vertikal-links.vertical-menu-collapsible main > .hero-overlay-fullwidth {
   margin-left:0 !important;
   margin-right:0 !important;
   width:100% !important;
   max-width:none !important;
   transition:none !important;
 }
}

/* Step 830/887: Vollbild-Header bei vertikaler Desktop-Navigation.
   Ohne einklappbare Navigation bleibt die bisherige Viewporthöhe erhalten.
   Bei einer ausgeklappten einklappbaren Sidebar richtet sich die Headerhöhe
   dagegen nach dem tatsächlichen Seitenverhältnis des Headerbildes und der
   verbleibenden Inhaltsbreite. Das Bild bleibt mit cover flächenfüllend, wird
   aber weder unter die Sidebar geschoben noch durch contain mit Balken ergänzt. */
@media (min-width: 821px) {
 body.nav-layout-vertikal-links main > .hero-overlay-height-vollbild {
   height:100vh !important;
   height:100svh !important;
   min-height:0 !important;
 }
 body.nav-layout-vertikal-links.vertical-menu-collapsible:not(.vertical-nav-collapsed)
 main > .hero-overlay-fullwidth.hero-overlay-height-vollbild {
   height:max(420px, calc((100vw - var(--side-nav-width)) / var(--hero-image-ratio, 2.258824))) !important;
   min-height:0 !important;
   background-size:cover !important;
   background-position:center center !important;
 }
}

/* Step 890/892: Responsive Header-Skalierung fuer breite Full-Width-Header.

   Ursache des verbleibenden Fehlers bei horizontaler Navigation: Step 891
   beschraenkte die seitenverhaeltnisbasierte Hoehe dort auf die CSS-Klasse
   .hero-overlay-image-only. Die Projekte Handwerk, Stadtbaeckerei und
   WP Dienstleistungen besitzen jedoch sichtbare Overlay-Elemente und erhalten
   diese Klasse deshalb nicht. Die neue Regel konnte bei ihnen folglich nie
   greifen, waehrend bildreine Referenzprojekte bereits korrekt aussahen.

   Tablet und Smartphone verwenden jetzt fuer Full-Width-Header bei horizontaler
   und vertikaler Navigation denselben Berechnungsweg. Bei Navigation unterhalb
   des Headers liegt der Hero direkt unter <body> statt innerhalb von <main>;
   deshalb wird auch dieser zweite, bereits vorhandene Ausgabepfad explizit
   erfasst. Position, Overlay-Inhalte und Navigationslogik bleiben unveraendert. */
@media (max-width: 820px) {
 body main > .hero-overlay-fullwidth,
 body > .hero-overlay-fullwidth {
   height:calc(100vw / var(--hero-image-ratio, 2.258824)) !important;
   min-height:0 !important;
   background-size:cover !important;
   background-position:center center !important;
 }
}

/* Step 531: Full-Width-Hero im eingeklappten vertikalen Menü.
   Der allgemeine Navigationsversatz gilt sowohl für <main> als auch für
   .hero. Da der Overlay-Hero innerhalb von <main> gerendert wird, erhielt
   er den Sidebar-Versatz ein zweites Mal. Für genau diesen verschachtelten
   Hero wird der doppelte Versatz zurückgesetzt. */
@media (min-width: 821px) {
 body.nav-layout-vertikal-links.vertical-menu-collapsible.vertical-nav-collapsed main > .hero-overlay-fullwidth {
   margin-left:0 !important;
   margin-right:0 !important;
   width:100% !important;
   max-width:none !important;
 }
}

/* Step 412: Inhalts-Container mit "Volle Browserbreite" verwendet
   dieselbe Breitenlogik wie der bereits funktionierende Header/Hero.
   Horizontal: bis 1480 px mit den globalen Seitenabständen.
   Vertikal: gesamte verfügbare Inhaltsbreite rechts neben der Navigation
   mit denselben responsiven Innenabständen wie der Fullwidth-Hero. */
.cms-content-container-fullwidth > .container {
  width:min(1480px, calc(100% - var(--container-padding))) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

@media (min-width: 821px) {
 body.nav-layout-vertikal-links main .cms-content-container-fullwidth > .container {
   width:100% !important;
   max-width:none !important;
   margin-left:0 !important;
   margin-right:0 !important;
   padding-left:0 !important;
   padding-right:0 !important;
   box-sizing:border-box !important;
 }
 /* Step 449: Bei vertikaler Navigation bleibt die äußere Containerfläche
    browserbreit. Die innere Gruppierung selbst darf jedoch keine zweite
    Breitenbegrenzung erzeugen. Stattdessen erhalten die enthaltenen Widget-
    Container exakt dieselbe Breitenregel wie Widgets außerhalb des Containers. */
 body.nav-layout-vertikal-links main .cms-content-container-fullwidth .cms-content-container-inner {
   width:100% !important;
   max-width:none !important;
   margin-left:0 !important;
   margin-right:0 !important;
 }
 body.nav-layout-vertikal-links main .cms-content-container-fullwidth .cms-content-container-inner > .widget-section > .container {
   width:min(var(--container-width), calc(100% - var(--container-padding))) !important;
   max-width:none !important;
   margin-left:auto !important;
   margin-right:auto !important;
   padding-left:0 !important;
   padding-right:0 !important;
   box-sizing:border-box !important;
 }
}

/* Step 418: Im Fullwidth-Modus darf der globale .section-Innenabstand
   nicht zusätzlich oberhalb und unterhalb der Container-Inhalte wirken.
   Der vertikale Abstand wird ausschließlich vom im Widget eingestellten
   Container-Innenabstand bestimmt. */
.cms-content-container-fullwidth {
  padding-top:0 !important;
  padding-bottom:0 !important;
}

/* Step 422: Im Fullwidth-Modus bleibt nur die äußere Containerfläche
   browserbreit. Die enthaltene Widget-Gruppe verwendet exakt dieselbe normale
   Inhaltsbreite wie identische Widgets außerhalb eines Containers. Der im
   Container eingestellte Innenabstand wirkt dort weiterhin nur oben/unten. */
.cms-content-container-fullwidth .cms-content-container-inner {
  width:min(var(--container-width), calc(100% - var(--container-padding))) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* Step 877: Abschließende Prioritätsregel für normale Widgets mit expliziter
   Bereichsbreite „Volle Browserbreite“. Frühere Navigations- und Fullwidth-
   Kompatibilitätsregeln dürfen diese bewusste Auswahl nicht wieder auf die
   zentrale Websitebreite begrenzen. */
.section-fullwidth.cms-widget-browser-fullwidth > .container {
  width:calc(100% - var(--container-padding)) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
@media (min-width: 821px) {
  body.nav-layout-vertikal-links main .section-fullwidth.cms-widget-browser-fullwidth:not(.hero) > .container {
    width:calc(100% - var(--container-padding)) !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
}

/* Step 417: Container-Innenabstand und Widget-Abstand sind getrennte
   Größen. Der Benutzerwert bestimmt ausschließlich den Abstand zur äußeren
   Containerkante. Zwischen den enthaltenen Widgets bleibt dagegen der globale
   vertikale Widget-Abstand erhalten. Er wird je zur Hälfte auf die benachbarten
   Widget-Abschnitte verteilt; außen entsteht dadurch kein zusätzlicher Abstand. */
.cms-content-container-inner > .widget-section {
  padding-top:calc(var(--widget-gap-vertical) / 2) !important;
  padding-bottom:calc(var(--widget-gap-vertical) / 2) !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
}
.cms-content-container-inner > .widget-section:first-of-type {
  padding-top:0 !important;
}
.cms-content-container-inner > .widget-section:last-of-type {
  padding-bottom:0 !important;
}
.cms-content-container-inner > .widget-section > .container {
  width:100% !important;
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
  padding-left:0 !important;
  padding-right:0 !important;
  box-sizing:border-box !important;
}

@media (max-width: 820px) {
 .container { width:min(100% - 28px, 1160px); }
 .nav { align-items:center; flex-direction:row !important; flex-wrap:wrap; padding:14px 0; gap:10px; }
 .nav-logo-links, .nav-logo-rechts, .nav-logo-zentriert { flex-direction:row !important; justify-content:space-between; }
 .nav .logo { flex:1 1 auto; }
 .menu-toggle { display:inline-flex; flex:0 0 auto; margin-right:8px; }
 .nav .menu { display:none; flex:0 0 100%; width:100%; justify-content:flex-start; margin:8px 0 0 0; }
 .nav.is-open .menu { display:flex; }
 body.nav-layout-vertikal-links .nav .menu { display:none; flex:0 0 100%; width:100%; justify-content:flex-start; margin:8px 0 0 0; }
 body.nav-layout-vertikal-links .nav.is-open .menu { display:flex; }
 .nav-menu-links .menu, .nav-menu-zentriert .menu, .nav-menu-rechts .menu { justify-content:flex-start; margin-left:0; margin-right:0; width:100%; }
 .menu-list { flex-direction:column; align-items:stretch; width:100%; gap:6px; }
 .menu-list > li { width:100%; }
 .menu-list a { width:100%; justify-content:space-between; }
 .submenu { position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:0; border-left:3px solid var(--line); border-radius:0; padding:4px 0 4px 14px; margin:2px 0 8px 10px; min-width:0; background:transparent; }
 body.nav-layout-vertikal-links .submenu { display:none !important; }
 body.nav-layout-vertikal-links .has-submenu.is-submenu-open > .submenu { display:block !important; }
 body.nav-layout-vertikal-links .has-submenu.is-submenu-open > a .submenu-marker { transform:rotate(180deg); }
 .submenu a { padding:7px 10px; }
 .hero { padding:52px 0 42px; }
 .hero-grid, .contact-box, .form-grid { grid-template-columns:1fr; }
.mini-card-fa-icon { width:100%; margin:0 0 12px; line-height:1; text-align:center; color:var(--primary); }
 .grid3, .gallery, .widget-row, .before-after, .cards-widget.cards-image .grid3 { grid-template-columns:1fr; }
 .cards-widget.cards-cols-2 .grid3, .cards-widget.cards-cols-3 .grid3, .cards-widget.cards-cols-4 .grid3, .cards-widget.cards-cols-5 .grid3, .cards-widget.cards-cols-6 .grid3 { grid-template-columns:1fr !important; }
 .text-widget-actions { align-items:stretch; }
 .text-widget-actions .btn { width:100%; }
 .hero-card { min-height:230px; }
 .slide { height:clamp(220px, 62vw, 360px); }
 .slide-caption { left:14px; right:14px; bottom:12px; max-width:calc(100% - 28px); }
}

/* Step 395: Funktionskorrektur Effekte & Rahmen.
   Die erweiterten Theme-Werte gelten jetzt sichtbar für die regulären
   Kartenoberflächen des CMS und nicht nur für einzelne Sonderlayouts. */
.card,
.mini-card,
.contact-info-card,
.intro-card,
.cms-screenshot-card,
.hero-feature,
.cms-branding-inner {
  border-width:var(--card-border-width) !important;
  border-style:solid !important;
  border-color:var(--card-border-color) !important;
  transition:border-color var(--transition), border-width var(--transition), transform var(--transition), box-shadow var(--transition);
}

@media (max-width:820px) {
 .image-text-layout { display:flex !important; flex-direction:column !important; }
 
}

/* Step 994: Im Smartphone-Querformat werden Hauptpunkte weiterhin
   kompakt zweispaltig angeordnet. Öffnet ein Hauptpunkt sein Untermenü,
   belegt dieser Eintrag die volle Breite; das Accordion bleibt dadurch
   auch bei vielen Unterpunkten lesbar und die Gesamtfläche intern scrollbar. */
@media (max-width:820px) and (orientation:landscape) and (max-height:500px) {
 .header .nav.is-open .menu,
 body.nav-layout-vertikal-links .header .nav.is-open .menu {
   padding:8px 12px 10px !important;
   scrollbar-gutter:stable;
 }
 .header.below-hero-header .nav.is-open .menu {
   top:var(--cms-mobile-menu-top,72px) !important;
   bottom:0 !important;
   height:auto !important;
   min-height:0 !important;
   max-height:none !important;
   background:var(--header-background) !important;
 }
 .header .nav.is-open .menu-list,
 body.nav-layout-vertikal-links .header .nav.is-open .menu-list {
   display:grid !important;
   grid-template-columns:repeat(2,minmax(0,1fr)) !important;
   gap:4px 12px !important;
   width:100% !important;
   align-items:start !important;
 }
 .header .nav.is-open .menu-list > li,
 body.nav-layout-vertikal-links .header .nav.is-open .menu-list > li {
   width:100% !important;
   min-width:0 !important;
 }
 .header .nav.is-open .menu-list > li.is-submenu-open,
 body.nav-layout-vertikal-links .header .nav.is-open .menu-list > li.is-submenu-open {
   grid-column:1 / -1 !important;
 }
 .header .nav.is-open .menu-list > li > a,
 body.nav-layout-vertikal-links .header .nav.is-open .menu-list > li > a {
   width:100% !important;
   min-height:36px !important;
   padding:7px 9px !important;
   font-size:.92rem !important;
   line-height:1.2 !important;
   white-space:normal !important;
   overflow-wrap:anywhere;
   justify-content:flex-start !important;
 }
 .header .nav.is-open .menu-list > li.is-submenu-open > .submenu {
   display:grid !important;
   grid-template-columns:repeat(2,minmax(0,1fr)) !important;
   gap:2px 10px !important;
   width:calc(100% - 12px) !important;
 }
}


.google-maps-widget{overflow:hidden}
.google-maps-embed{display:block;border-radius:inherit}
.google-maps-placeholder{padding:18px;border:1px dashed #cbd5e1;border-radius:10px;color:#64748b;background:#f8fafc}
.google-maps-consent-placeholder{min-height:260px;display:flex;align-items:center;justify-content:center;padding:24px;border:1px dashed #cbd5e1;border-radius:var(--card-radius);background:#f8fafc;color:#334155;text-align:center}
.google-maps-consent-inner{max-width:520px;margin:0 auto}
.google-maps-consent-inner strong{display:block;font-size:1.15rem;margin-bottom:8px;color:#0f172a}
.google-maps-consent-inner p{margin:0 0 14px;color:#64748b}
.google-maps-consent-placeholder.is-loaded{padding:0;border:0;background:transparent;display:block;text-align:initial}
.youtube-widget-wrap{width:100%;max-width:var(--youtube-max-width,860px)}
.youtube-widget-wrap.align-left{margin-right:auto}
.youtube-widget-wrap.align-center{margin-left:auto;margin-right:auto}
.youtube-widget-wrap.align-right{margin-left:auto}
.youtube-consent-placeholder{position:relative;min-height:260px;display:flex;align-items:center;justify-content:center;padding:24px;border:1px dashed #cbd5e1;border-radius:var(--card-radius);background:#f8fafc;color:#334155;text-align:center;aspect-ratio:16/9;overflow:hidden}
.youtube-consent-placeholder.ratio-4-3{aspect-ratio:4/3}
.youtube-consent-placeholder.ratio-1-1{aspect-ratio:1/1}
.youtube-consent-placeholder.is-rounded{border-radius:var(--card-radius)}
.youtube-consent-placeholder.has-shadow{box-shadow:var(--card-shadow)}
.youtube-consent-inner{max-width:520px;margin:0 auto}
.youtube-consent-inner strong{display:block;font-size:1.15rem;margin-bottom:8px;color:#0f172a}
.youtube-consent-inner p{margin:0 0 14px;color:#64748b}
.youtube-consent-placeholder.is-loaded{padding:0;border:0;background:transparent;display:block;text-align:initial}
.youtube-consent-placeholder iframe{position:absolute;inset:0;width:100%!important;height:100%!important}
.youtube-placeholder-empty{padding:22px;border:1px dashed #cbd5e1;border-radius:var(--card-radius);background:#f8fafc;color:#64748b}

.cms-table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:1px}
.cms-table-clip{width:100%;min-width:560px;overflow:hidden;border-radius:0;background:var(--table-cell-bg,#ffffff)}
.cms-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--table-cell-bg,#ffffff);color:var(--table-cell-text,#1f2937)}
.cms-table th,.cms-table td{padding:var(--table-cell-padding,12px);border:0;border-right:var(--table-border-width,1px) solid var(--table-border,#d1d5db);border-bottom:var(--table-border-width,1px) solid var(--table-border,#d1d5db);text-align:left;vertical-align:top;white-space:normal}
.cms-table tr>*:first-child{border-left:var(--table-border-width,1px) solid var(--table-border,#d1d5db)}
.cms-table thead tr:first-child>*{border-top:var(--table-border-width,1px) solid var(--table-border,#d1d5db)}
.cms-table>tbody:first-child>tr:first-child>*{border-top:var(--table-border-width,1px) solid var(--table-border,#d1d5db)}
.cms-table thead tr:first-child>*:first-child,.cms-table>tbody:first-child>tr:first-child>*:first-child{border-top-left-radius:0}
.cms-table thead tr:first-child>*:last-child,.cms-table>tbody:first-child>tr:first-child>*:last-child{border-top-right-radius:0}
.cms-table tbody tr:last-child>*:first-child{border-bottom-left-radius:0}
.cms-table tbody tr:last-child>*:last-child{border-bottom-right-radius:0}
.cms-table th{background:var(--table-head-bg,#1f2937);color:var(--table-head-text,#ffffff);font-weight:700}
.cms-table.is-zebra tbody tr:nth-child(even) td{background:var(--table-zebra-bg,#f8fafc)}
.cms-table .align-center{text-align:center}.cms-table .align-right{text-align:right}.cms-table .align-left{text-align:left}
.cms-table-link{color:var(--primary);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.cms-table-button{display:inline-flex;align-items:center;justify-content:center;padding:8px 13px;font-size:.92rem;white-space:nowrap}
.cms-table-icon{display:inline-flex;align-items:center;gap:7px;font-size:1.15em;line-height:1}
.cms-table-icon>span+span{font-size:.88em}
.cms-table-badge{display:inline-flex;align-items:center;justify-content:center;padding:5px 10px;border-radius:999px;background:var(--badge-bg);color:var(--badge-text);font-size:.82rem;font-weight:700;line-height:1.15;white-space:nowrap}
@media(max-width:820px){.cms-table-clip{min-width:640px}.cms-table th,.cms-table td{padding:max(8px,calc(var(--table-cell-padding,12px) * .8))}}

.site-footer{margin-top:56px;background:var(--footer-bg,var(--footer-background,#0f172a));color:var(--footer-text,#e5e7eb);padding:42px 0 30px}
.site-footer a{color:var(--footer-link,#fff);text-decoration:none}.site-footer a:hover{text-decoration:underline}
.site-footer-cookie-button{appearance:none;border:0;padding:0;margin:0;background:transparent;color:var(--footer-link,#fff);font:inherit;line-height:inherit;cursor:pointer;text-decoration:none}.site-footer-cookie-button:hover{text-decoration:underline}
.site-footer-inner{width:min(var(--container-width),calc(100% - var(--container-padding)));max-width:none;margin:0 auto;display:grid;grid-template-columns:1.15fr 1fr .9fr;gap:42px;align-items:start}
.site-footer-block h3{margin:0 0 10px;color:var(--footer-heading,#fff);font-size:1rem}
.site-footer-block p,.site-footer-block div{color:var(--footer-text,#cbd5e1);line-height:1.7}
.site-footer-contact-line{margin:0}
.site-footer-links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 8px}
.site-footer-link-item{display:inline-flex;align-items:baseline;white-space:nowrap}
.site-footer-link-item:not(:last-child)::after{content:"·";margin-left:8px;color:var(--footer-text,#cbd5e1);opacity:.9}
.site-footer-social{margin-top:10px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.site-footer-social .site-footer-link-item:not(:last-child)::after{display:none}
.site-footer-social-link{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.site-footer-social-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid currentColor;border-radius:50%;font-size:.78rem;font-weight:800;line-height:1;transition:transform .15s ease,background-color .15s ease}
.site-footer-social-link:hover{text-decoration:none!important}
.site-footer-social-link:hover .site-footer-social-icon{transform:translateY(-1px);background:rgba(255,255,255,.14)}
.site-footer-copy{font-size:.95rem}
.site-footer-bottom{width:min(var(--container-width),calc(100% - var(--container-padding)));max-width:none;margin:30px auto 0;padding-top:18px;border-top:1px solid rgba(255,255,255,.22);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px 18px;color:var(--footer-text,#cbd5e1);font-size:.95rem;line-height:1.5}
.site-footer-bottom span{white-space:nowrap}
.site-footer-bottom a{color:var(--footer-link,#fff);font-weight:700;text-decoration:none}
.site-footer-bottom a:hover{text-decoration:underline}
@media (max-width:760px){.site-footer-inner{grid-template-columns:1fr;gap:22px}.site-footer-bottom{flex-direction:column;gap:8px}.site-footer-bottom span{white-space:normal}}

.hero:not(.hero-overlay-fullwidth)::after{background:#0d37911f;}
.hero:not(.hero-overlay-fullwidth)::before{display:none!important;}