/* =========================================================================
   gm-Theme — FlatCore-Utility-Kompatibilität (Shim)
   Der aus FlatCore migrierte Content nutzt Utility-Klassen, die es im BS5-
   gm-Theme nicht gibt (font-sizeNN, margin-NNpx-*, separator-line-*, …).
   Ohne sie rendern z.B. Trennlinien als weisse Balken und Schriftgroessen/
   Abstaende fallen weg. Hier sauber im gm-Stil nachgebildet, damit der
   Content konsistent und gestalterisch korrekt erscheint.
   (Mittelfristig durch bereinigten Content/SwiftyEdit-Bloecke abloesbar.)
   ========================================================================= */

/* ---- Bilder responsiv begrenzen (war in FlatCore global gesetzt) ----
   Ohne diese Regel rendern Content-Bilder in natuerlicher Groesse und laufen
   ueber ihren Container (z.B. Uebersicht-Kacheln: 800px-Bild in 260px-Kachel ->
   beschnitten). Spezifische Regeln (Logo max-height, .slide-img 100%) gewinnen. */
section img, article img, .box01 img, [class*="feature-box"] img {
  max-width: 100%; height: auto;
}

/* ---- Trennlinien: dezente Linie in Akzentfarbe statt weissem Balken ---- */
[class*="separator-line-horrizontal"] {
  display: block; width: 48px; height: 2px; min-height: 2px;
  background: var(--gm-sea); border: 0; padding: 0;
}
[class*="separator-line-vertical"] { width: 2px; background: var(--gm-border); border: 0; }
.center-col { margin-left: auto; margin-right: auto; }
[class*="separator-line-horrizontal"].center-col { margin-left: auto; margin-right: auto; }

/* ---- Schriftgroessen (px-Skala des Original-Designs, als rem) ---- */
.font-size16 { font-size: 1rem; }
.font-size18 { font-size: 1.125rem; }
.font-size20 { font-size: 1.25rem; }
.font-size22 { font-size: 1.375rem; }
.font-size24 { font-size: 1.5rem; }
.font-size26 { font-size: 1.625rem; }
.font-size30 { font-size: 1.875rem; }
.font-size32 { font-size: 2rem; }
.font-size36 { font-size: 2.25rem; }

/* ---- Abstaende ---- */
.no-margin  { margin: 0 !important; }
.no-padding { padding: 0 !important; }
.margin-5px-bottom  { margin-bottom: 5px; }
.margin-10px-bottom { margin-bottom: 10px; }
.margin-15px-bottom { margin-bottom: 15px; }
.margin-20px-bottom { margin-bottom: 20px; }
.margin-25px-bottom { margin-bottom: 25px; }
.margin-30px-bottom { margin-bottom: 30px; }
.margin-65px-bottom { margin-bottom: 65px; }
.margin-10px-top { margin-top: 10px; }
.margin-15px-top { margin-top: 15px; }
.margin-20px-top { margin-top: 20px; }
.margin-30px-top { margin-top: 30px; }

/* ---- Inline / Ausrichtung / Breite / Zeilenhoehe ---- */
.display-inline-block { display: inline-block; }
.vertical-align-top    { vertical-align: top; }
.vertical-align-middle { vertical-align: middle; }
.width-5  { width: 5%; }
.width-85 { width: 85%; }
.width-90 { width: 90%; }
.width-100 { width: 100%; }
.line-height-28 { line-height: 1.65; }

/* ---- Listen (FlatCore list-style-5): dezente Aufzaehlung in gm-Optik ---- */
ul[class*="list-style-"] { list-style: none; padding-left: 0; margin: 0 0 1rem; }
ul[class*="list-style-"] > li { position: relative; padding-left: 1.5em; margin-bottom: .5rem; line-height: 1.55; }
ul[class*="list-style-"] > li::before {
  content: "\2022"; color: var(--gm-sea); font-weight: 700;
  position: absolute; left: .35em; top: -.02em;
}

/* ---- Responsive Varianten (sm ≤991px, xs ≤575px, md ≥768px) ---- */
@media (min-width: 768px) {
  .md-margin-20px-top { margin-top: 20px; }
  .md-margin-30px-top { margin-top: 30px; }
}
@media (max-width: 991.98px) {
  .sm-font-size18 { font-size: 1.125rem; }
  .sm-font-size20 { font-size: 1.25rem; }
  .sm-font-size22 { font-size: 1.375rem; }
  .sm-font-size30 { font-size: 1.875rem; }
  .sm-font-size32 { font-size: 2rem; }
  .sm-margin-8px-bottom  { margin-bottom: 8px; }
  .sm-margin-15px-bottom { margin-bottom: 15px; }
  .sm-margin-20px-bottom { margin-bottom: 20px; }
  .sm-margin-30px-bottom { margin-bottom: 30px; }
  .sm-margin-15px-top { margin-top: 15px; }
  .sm-margin-20px-top { margin-top: 20px; }
}
@media (max-width: 575.98px) {
  .xs-font-size16 { font-size: 1rem; }
  .xs-font-size18 { font-size: 1.125rem; }
  .xs-font-size20 { font-size: 1.25rem; }
  .xs-font-size30 { font-size: 1.875rem; }
  .xs-margin-30px-bottom { margin-bottom: 30px; }
}