/* Basis-Parameter */ :root {
  /* Farben */
  --page_color: #2F3283;
  --page_color_hover: #7C8592;
  --page_color_secondary: #b0b0b0;
  --page_color_secondary_hover: #9d9d9d;
  --page_color_white: #fff;
  --page_color_black: #000;
  --page_color_grey05: #f9f9f9;
  --page_color_grey10: #c7c7c7;
  --page_color_grey25: #c7c7c7;
  --page_color_grey40: #4b4b4b;
  --page_color_grey50: #828282;
  --page_color_grey75: #252525;
  --page_color_grey90: #f9fafb;
  --page_color_line: #C1D9E1; /* Linie unterstreichen */
  --page_color_border: #C1D9E1; /* Rahmenfarbe für Bilder, sonst transparent */
  --page_color_font: #000;
  --page_color_hg1: #e3c8d6;
  --page_color_hg2: #d3afb6;
  --page_radius: 0rem; /* Runde Ecken Bilder und Button */
  /* Font */
  --page_font_align_center: center;
  --page_font_align_left: left;
  --page_font_align_right: right;
  --page_font_awf: "Font Awesome 6 Free";
  --page_font_aws: "Font Awesome 6 Free";
  --page_font_basic: Open Sans, sans-serif, system-ui, -apple-system, "Segoe UI", Arial;
  --page_font_family: var(--page_font_basic);
  --page_font_second: 'Carrois Gothic', Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;;;;;
  --page_font_size: clamp(0.9375rem, 0.15vw + 0.9rem, 1rem); /* 15–16px */
  --page_font_size_small: calc(var(--page_font_size) - 0.15rem);
  --page_font_size_h6: calc(var(--page_font_size) * 1);
  --page_font_size_h5: calc(var(--page_font_size) * 1.25);
  --page_font_size_h4: calc(var(--page_font_size) * 1.5);
  --page_font_size_h3: calc(var(--page_font_size) * 1.75);
  --page_font_size_h2: calc(var(--page_font_size) * 2.0);
  --page_font_size_h1: calc(var(--page_font_size) * 2.5);
  --page_font_size_header: var(--page_font_size_h2);
  --page_font_size_social_share: calc(var(--page_font_size) * 1.125);
  --page_font_size_breadcrumb: 0.813rem;
  --page_font_size_top: clamp(0.75rem, 0.5vw + 0.2rem, 0.875rem);
  --page_font_line_height: 1.5;
  --page_font_line_height_headings: 1.2;
  --page_font_style_italic: italic;
  --page_font_style_normal: normal;
  --page_font_weight: 400;
  --page_font_weight_400: 400;
  --page_font_weight_500: 500;
  --page_font_weight_600: 600;
  --page_font_weight_700: 700;
  --page_font_weight_800: 800;
  --page_font_weight_900: 900;
  /* Top */
  --top_color: #aaaaaa;
  --top_color_bg: #252525;
  --top_font_size: var(--page_font_size_small);
  /* Header Menu Button */
  --header_height: 120px;
  --logo_height: 100px;
  --logo_height-mobile: 60px;
  --header_height-mobile: 60px;
  --header_height-toggler: 70px;
  --page_menu_background: rgba(0, 0, 0, 0.10);
  --page_menuoff_font_size: 1.125em;
  --page_menuoff_line-hight: 1.125em;
  --sp_megamenu_font_size: var(--page_font_size);
  --page-btn-radius: var(--page_radius); /* Wert eintragen, wenn die Rundung unabhängig von Bildern sein soll */
  --page-btn-padding-x: 0.75rem;
  --page-btn-padding-y: 0.375rem;
  /* Image */
  --page_img-border: 0px; /* 0px = ohne Rahmen */
  --page_img-border-color: var(--page_color_border); /* transparent */
  --page_image-width: 300px;
  --page_image-padding-x: 1.5rem;
  --page_image-padding-y: 1rem;
  /* Icons */
  --ico-load: "\e1d4"; /* --- Loader-Spinner */
  --ico-search: "\f002"; /* --- Lupe */
  --ico-adown: "\f107"; /* --- Angle down */
  --ico-aright: "\f105"; /* --- Angle right */
  --ico-star: "\f005"; /* --- voller Stern */
  --ico-cvdown: "\f078"; /* --- chevron-down kleiner Pfeil nach unten */
  --ico-xmark: "\f00d"; /* --- xmark Kreuz-schliessen */
  --ico-cplus: "\f055"; /* --- circle-plus Pluszeichen im Kreis */
  --ico-cminus: "\f056"; /* --- circle-minus Minuszeichen im Kreis */
  --ico-news: "\f1ea"; /* --- Newspaper */
  --ico-user: "\f007"; /* --- user createdby 900 */
  --ico-folder: "\f07c"; /* --- folder-open Category-Name 900 */
  --ico-cal: "\f073"; /* --- calendar-days Datum 900 */
  --ico-eye: "\f06e"; /* --- eye Hits 900 */
  --ico-home: "\f3c5"; /* --- location-dot Home 900 */
  --ico-list: "\f00c"; /* --- check Liste Aufzählpunkt 900 */
  --ico-danger: "\f071"; /* --- triangle-exclamation Datenschutz */
  --ico-list1: "\f0da"; /* --- caret-right Liste Aufzählpunkt 900 */
  --ico-list2: "\f192"; /* --- circle-dot Liste Aufzählpunkt 900 */
  --ico-lupe: "\f00e"; /* Lupe mit Plus für Bilder */
  --icon-liste: var(--ico-list);
  /* SP Pagebuilder */
  --page_container-width: 1280px;
  --page_container-width-wide: var(--page_container-width);
  /* --page_container-width-wide: calc(1600px + 10%); */
  --page_sp-grid: 2em;
  --page_sp-inner-row: 1.5em;
  --page_sp-row: 0em;
  /* Karte & Bilder */
  --page_gap: 1em;
  --page_karte-radius: var(--page_radius);
  --page_karte-height: 180px;
  --page_karte-icon-size: 34px;
  --page_karte-icon-box-size: 72px;
  /* bottom */
  --bottom_color: var(--page_color_grey75);
  --bottom_color_hover: var(--page_color_hover);
  --bottom_color_bg: #f5f5f5;
  --bottom_font_size: var(--page_font_size);
  --bottom_font_size_header: var(--page_font_size_h3);
  /* footer */
  --footer_color: #131310;
  --footer_color_bg: #7C8592;
  --footer_color_link: #20225A;
  --footer_color_link_hover: var(--page_color_white);
  --footer_font_size: var(--page_font_size_small);
  --footer_font_line_height: clamp(1.1em, 2vw + 0.8rem, 1.4em);
}
@media (max-width: 1024px) {
  :root {
    --page_font_size: clamp(0.875rem, 3vw + 0.5rem, 1rem);
    --page_font_size_h1: clamp(1.5rem, 6vw + 0.5rem, 2.25rem);
    --page_font_size_h2: clamp(1.375rem, 5vw + 0.5rem, 2rem);
    --page_font_size_h3: clamp(1.25rem, 4vw + 0.5rem, 1.75rem);
    --page_font_size_h4: clamp(1.125rem, 3.5vw + 0.5rem, 1.5rem);
    --page_font_size_h5: clamp(1rem, 3vw + 0.5rem, 1.25rem);
    --page_font_size_h6: clamp(0.875rem, 2.5vw + 0.25rem, 1rem);
    --page_font_size_small: clamp(0.8125rem, 2vw + 0.5rem, 0.875rem);
    --page_font_size_social_share: clamp(1.125rem, 3vw + 0.5rem, 1.25rem);
    --page_font_line_height: clamp(1.4em, 3vw + 1rem, 1.6em);
  }
}

/* ------------------------------------------------------------ Projekt-Ergaenzungen */
/* --- Formulare */
.mod-cform #cf_1, .mod-cform #cf_2, .mod-cform #cf_3, .mod-cform #cf_4, .mod-cform #cf_5 {
  --background-color: rgba(245, 245, 245, 1);
  --border: solid 1px #dddddd;
  --border-radius: 0px;
  --control-gap: 10px;
  --input-background-color: var(--page_color_white);
  --input-border-color: #cccccc;
  --input-border-radius: 3px;
  --input-color: var(--page_color_black);
  --input-padding: 10px 10px;
  --input-placeholder-color: #828282;
  --input-size: var(--page_font_size);
  --input-text-align: left;
  --label-color: var(--page_color_black);
  --label-size: var(--page_font_size);
  --label-weight: var(--page_font_weight_600);
}
.mod-cform .convertforms .cf-label, .mod-cform .convertforms .cf-control-input-desc {
  color: var(--page_color_black);
}
.mod-cform .convertforms .cf-control-input-desc {
  opacity: 1;
}
.mod-cform .convertforms .cf-control-input, .mod-cform .convertforms .cf-control-input-desc {
  font-size: var(--input-size);
}
.mod-cform .convertforms .cf-control-input h2 {
  padding-top: 0px;
}
.mod-cform .datenschutz h2:before {
  font-family: var(--page_font_aws);
  content: var(--ico-danger);
  font-weight: var(--page_font_weight_900);
  display: inline-block;
  margin-right: 0.375em;
}
/* --- Editor, Bilder und Basis-Helfer */
.cleared, .clearfix:after {
  clear: both;
  font: 0/0 serif;
  display: block;
  content: " ";
}
.bildrechts, .bildlinks, .bildvoll, .sppb-img-responsive, .wsp-beitrag-bild img {
  border-radius: var(--page_radius);
  border: var(--page_img-border) solid var(--page_img-border-color);
}
.bildrechts {
  float: right;
  margin-right: 0;
  margin-left: var(--page_image-padding-x);
  margin-bottom: var(--page_image-padding-y);
  padding: 0;
  width: var(--page_image-width);
}
.bildlinks {
  float: left;
  margin-right: var(--page_image-padding-x);
  margin-left: 0;
  margin-bottom: var(--page_image-padding-y);
  padding: 0;
  width: var(--page_image-width);
}
.bildvoll {
  float: none;
  width: 100%;
  margin-right: 0;
  margin-left: 0;
  margin-bottom: var(--page_image-padding-y);
  padding: 0;
}
hr, hr:not([size]) {
  border: 0px solid !important;
  border-bottom: 1px solid var(--page_color_line) !important;
  opacity: 1 !important;
  height: 0px !important;
  clear: both !important;
  background-color: var(--page_color_white);
}
/* Listen mit Padding, Standard-Lösung bei mehreren Zeilen */
.wsp-beitrag-liste ul, .wsp-beitrag-liste ul.liste {
  --wsp-list-icon-width: 1.5em;
  --wsp-list-gap: 0.25em;
  --wsp-list-padding: 1em;
  --wsp-list-indent: calc(var(--wsp-list-icon-width) + var(--wsp-list-gap));
  list-style: none;
  padding: 0;
  margin-left: var(--wsp-list-padding);
  margin-right: var(--wsp-list-padding);
}
.wsp-beitrag-liste ul li, .wsp-beitrag-liste ul.liste li {
  position: relative;
  padding-left: var(--wsp-list-indent);
  padding-bottom: 0.5em;
}
.wsp-beitrag-liste ul li:before, .wsp-beitrag-liste ul.liste li:before {
  content: var(--icon-liste);
  font-family: var(--page_font_aws);
  font-weight: var(--page_font_weight_900);
  position: absolute;
  left: 0;
  width: var(--wsp-list-icon-width);
  line-height: inherit;
}
/* --- SIGplus / Galerie */
/* Korrektur der Liste im Content */
.sigplus-gallery > ul {
  list-style: revert;
  margin-left: 0px;
  margin-right: 0px;
}
.sigplus-gallery > ul > li {
  padding-left: revert;
}
.sigplus-gallery img.sigplus-preview {
  width: 100%;
  height: auto; 
  aspect-ratio: 4 / 3;
  object-fit: cover; /* optional */
}
.sysgal img.sigplus-preview {
  aspect-ratio: auto;
}
.sigplus-gallery > ul > li {
  margin: 0px;
}
.sigplus-mod .img-hover-zoom, .sigplus-gallery .img-hover-zoom {
  margin: 0.5em;
}
.sigplus-mod li, .sigplus-gallery li {
  width: calc(100% / 3);
}
@media (min-width: 576px) {
  .sppb-row-container, .sp-modul .sppb-row-container {
    max-width: 540px
  }
  .sigplus-mod li, .sigplus-gallery li {
    width: calc(100% / 4);
  }
}
@media (min-width: 768px) {
  .sppb-row-container, .sp-modul .sppb-row-container {
    max-width: 720px
  }
}
@media (min-width: 992px) {
  .sppb-row-container, .sp-modul .sppb-row-container {
    max-width: 960px
  }
  .sigplus-mod li, .sigplus-gallery li {
    width: calc(100% / 5);
  }
}
@media (min-width: 1200px) {
  .container, .sppb-row-container, .sp-modul .sppb-row-container {
    max-width: var(--page_container-width);
  }
  .sigplus-mod li, .sigplus-gallery li {
    width: calc(100% / 6);
  }
}

/* Zusätzliche Galerie-Interaktionen */
.sigplus-gallery a, .sigplus-mod a {
  position: relative;
}
.sigplus-gallery a:before, .sigplus-mod a:before {
  content: "";
  display: block;
  position: absolute;
}
.sigplus-gallery img {
  display: inherit;
}
.sigplus-gallery a:hover:before, .sigplus-mod a:hover:before {
  color: var(--page_color_white);
  font-size: 2em;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: var(--page_font_aws);
  content: var(--ico-lupe);
  font-weight: var(--page_font_weight_900);
  z-index: 10;
}
.sigplus-mod .img-hover-zoom, .sigplus-gallery .img-hover-zoom {
  height: 100%; /* [1.1] Set it as per your need */
  overflow: hidden; /* [1.2] Hide the overflowing of child elements */
  border-radius: var(--page_radius);
  border: var(--page_img-border) solid var(--page_img-border-color);
}
.sigplus-gallery .img-hover-zoom {
  margin: 8px;
}
.sp-module .mod_sigplus .img-hover-zoom {
  margin: 0px !important;
}
.sigplus-gallery .img-hover-zoom img, .sigplus-mod .img-hover-zoom img {
  transition: transform .5s ease;
}
.sigplus-gallery .img-hover-zoom:hover img, .sigplus-mod .img-hover-zoom:hover img {
  transform: scale(1.2);
  filter: grayscale(100%);
}
/* --- SP Pagebuilder */
/* Für Sections mit mehreren Columns */
.wsp-row {
  padding-top: var(--page_sp-row);
  padding-right: var(--page_sp-row);
  padding-bottom: var(--page_sp-row);
  padding-left: var(--page_sp-row);
  margin-top: var(--page_sp-row);
  margin-right: var(--page_sp-row);
  margin-bottom: var(--page_sp-row);
  margin-left: var(--page_sp-row);
}

.wsp-inner-row {
  padding-top: var(--page_sp-inner-row);
  padding-bottom: var(--page_sp-inner-row);
}
/* Für Sections mit einer Column */
.wsp-grid {
  padding-top: var(--page_sp-grid);
  padding-bottom: var(--page_sp-grid);
}

/* Überschriften und Subline aus SP-Pagebuilder */

#sp-page-builder .wsp-row-head .sppb-section-title {
  padding-top: 1.5em;
  margin-bottom: 1.5em;
}
.wsp-row-head h2.sppb-title-heading, .wsp-row-head h2, .sp-modul h2 {
  color: var(--page_color);
}
/* Manuell zuschaltbar für Textumbruch und Silbentrennung */
.wsp-textbreak {
  hyphens: auto;
  overflow-wrap: break-word;
  word-break: normal;
}

/* Responsive Helfer */
@media (max-width: 575px) {
  .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    padding-right: 1rem;
    padding-left: 1rem;
  }
  .bildrechts, .bildlinks {
    float: none;
    width: 100%;
    display: block;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 25px;
    padding: 0;
  }
  .entry-header h2, .entry-header h1, h1.page-header {
    margin: 8px 0 0;
    font-size: var(--page_font_size_header);
    line-height: 1;
  }
  .mod-syswanschrift, .mod-syswopen, .mod-syswbereiche, .mod-syswrecht {
    text-align: center;
  }
  .mod-syswbereiche ul > li, .mod-syswrecht ul > li {
    border-bottom: 0px solid var(--page_color_line) !important;
    padding-bottom: 3px !important;
  }
}
@media (max-width: 991px) {
  #sp-bottom .spc-bottom {
    text-align: center;
    width: 100%;
    float: none;
    padding-bottom: 1em;
  }
  #sp-bottom ul a:before {
    display: none;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .bildrechts, .bildlinks {
    width: calc(100% / 3);
  }
}
@media (min-width: 1200px) {
  .col-xl-10 {
    flex: 0 0 auto;
    width: 100%;
  }
}
/* --- Shariff / Rechtliches */
.shariff {
  margin-top: 2em;
}

/* Hintergrundfarbe für Logo im Offcanvas:
   weiss (--page_color_white) nehmen, wenn keine Hintergrundfarbe benötigt wird. */
.offcanvas-menu .wsp-offlogo {
  background-color: var(--page_color);
}

/* --- Social Icons im Modul */
/* Container für alle Icons */
.social-icons {
  margin-top: 1rem;
  display: flex;
  gap: 1em;                 /* Abstand zwischen den Icons */
  align-items: center;       /* vertikal ausrichten */
}

/* Responsive: bis max-width 991px zentrieren */
@media (max-width: 991px) {
  .social-icons {
    justify-content: center;
  }
}

/* Links / Icons: Größe, Farbe, Hover */
.social-link {
  display: inline-flex;       /* Icon zentriert im Link */
  align-items: center;
  justify-content: center;
  width: 2.5em;                 /* feste Größe */
  height: 2.5em;
  text-decoration: none;
  color: var(--page_color);
  transition: color 0.3s;
}

.social-link:hover {
  color: var(--page_color_hover);
}

/* SVG: passt in den Link, Füllung, abgerundete Ecken */
.social-link .tribe-icon {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 8px;
  overflow: hidden;
  fill: currentColor;
}