﻿body, h1, h2, h3, h4, h5, h6 { 
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important; 
}

/* =========================================
   FOOTER UND BODY EINSTELLUNGEN
========================================= */
#sp-footer {
  background-color: #ffffff !important;
  color: #333333 !important;
  padding: 30px 0 !important;
}

#sp-footer p, 
#sp-footer span, 
#sp-footer div {
  color: #333333 !important;
  text-align: center !important;
}

#sp-bottom, .sppb-section, .footer-widgets {
  border-top: none !important;
  box-shadow: none !important;
}

#sp-main-body + section, .sppb-section:last-child, div[class="footer"] {
  border-top: none !important;
  box-shadow: none !important;
  margin-top: 0 !important;
}

body, #sp-main-body, .body-innerwrapper, section {
  border-top: none !important;
  box-shadow: none !important;
}

.com-content-category .alert, .blog .alert, div.alert { 
  display: none !important; 
}

/* =========================================
   HEADER UND NAVBAR EINSTELLUNGEN
========================================= */
#sp-header {
  background-color: #333333 !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  z-index: 9999 !important;
  padding: 0 !important;
  margin: 0 !important;
}

#sp-logo {
  display: none !important;
}

#sp-header .container, 
#sp-header .container-fluid,
#sp-header .container-inner,
#sp-header .row,
#sp-header [class*="col-"] {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

#sp-menu {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

#sp-header .sp-megamenu-wrapper {
  display: flex !important;
  justify-content: flex-start !important;
  width: 100% !important;
  padding: 0 !important;
}

#sp-header .sp-megamenu-parent {
  display: flex !important;
  justify-content: flex-start !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
  width: 100% !important;
  height: 50px !important;
}

#sp-header .sp-megamenu-parent > li > a,
#sp-header .sp-megamenu-parent > li > span {
  display: flex !important;
  align-items: center !important;
  height: 50px !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-size: 13px !important;
  color: #F2F2F2 !important;
  background-color: transparent !important;
  padding: 0 16px !important;
  margin: 0 !important;
  text-decoration: none !important;
  -webkit-transition: color .3s, background-color .3s !important;
  -moz-transition: color .3s, background-color .3s !important;
  transition: color .3s, background-color .3s !important;
}

#sp-header .sp-megamenu-parent > li:hover > a,
#sp-header .sp-megamenu-parent > li:hover > span {
  background-color: #ffffff !important;
  color: #111111 !important;
}

#sp-header .sp-megamenu-parent > li:hover > a > * {
  color: #111111 !important;
}

@media (min-width: 992px){
  #offcanvas-toggler { display: none !important; }
}
@media (max-width: 991px){
  #offcanvas-toggler {
    display: flex !important;
    align-items: center !important;
    height: 50px !important;
    margin: 0 !important;
  }
}

/* =========================================
   GLOBALE TYPOGRAPHIE - EXAKT WIE ORIGINAL
========================================= */

/* Haupt-Sektionsüberschrift (z.B. "ÜBER UNS", "VERSTÄRKUNG GESUCHT") */
.heading-section-title {
  font-size: 80px !important;
  line-height: 96px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}
@media (max-width: 1279px) {
  .heading-section-title { font-size: 72px !important; line-height: 86px !important; }
}
@media (max-width: 1023px) {
  .heading-section-title { font-size: 62px !important; line-height: 74px !important; }
}
@media (max-width: 767px) {
  .heading-section-title { font-size: 49px !important; line-height: 59px !important; }
}
@media (max-width: 480px) {
  .heading-section-title { font-size: 42px !important; line-height: 50px !important; }
}

/* Spaltenüberschriften (z.B. "IT TESTER (M/W)") */
.heading-col-title {
  font-size: 20px !important;
  line-height: 24px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}
@media (max-width: 1279px) {
  .heading-col-title { font-size: 18px !important; line-height: 22px !important; }
}
@media (max-width: 1023px) {
  .heading-col-title { font-size: 17px !important; line-height: 20px !important; }
}

/* Spalten-Details (z.B. "QUALITÄT INTELLIGENT SICHERSTELLEN") */
.col-details {
  font-weight: 500 !important;
  text-transform: uppercase !important;
  font-size: 13px !important;
  line-height: 22px !important;
  letter-spacing: 1.2px !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

/* Header-Details (z.B. "PROFIS SUCHEN PROFIS") */
.header-details {
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

/* Lead-Text */
.lead {
  font-size: 16px !important;
  line-height: 24px !important;
  letter-spacing: 1.2px !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

/* Allgemeiner Absatztext in Inhaltsbereichen */
.view .fg p,
.view .fg li {
  font-size: 13px !important;
  line-height: 1.6 !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

/* =========================================
   LAYOUT - ORIGINAL BREITE (1220px)
========================================= */
.view > .fg {
  position: relative;
  overflow: hidden;
  z-index: 400;
  padding-top: 75px;
  padding-bottom: 64px;
  -webkit-transition: -webkit-transform 0.5s, opacity 0.25s;
  transition: transform 0.5s, opacity 0.25s;
}

.colors-b {
  color: #ffffff;
  background-color: rgba(202, 214, 230, 0.8);
}

/* =========================================
   BETEILIGUNGEN - TAM GENISLIK
========================================= */
/* Helix template container kisitlamasini kaldir */
#sp-main-body .container,
#sp-main-body .container-fluid {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Tüm view/section bloklari tam genislik */
.view.x40-widget {
  width: 100% !important;
  max-width: 100% !important;
}

/* group (Beteiligungen) tam ekran */
#group {
  width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  box-sizing: border-box !important;
}

/* =========================================
   BETEILIGUNGEN WRAPPER OVERRIDE
   sp-content3 kolonunun kisitlamasini kaldir
========================================= */
#sp-content3 {
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 100% !important;
}

#sp-content3 .sp-column,
#sp-content3 .sp-module,
#sp-content3 .sp-module-content,
#sp-content3 .mod-custom {
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* group div tam genislik */
#group.colors-a {
  width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  box-sizing: border-box !important;
}

/* =========================================
   SP-CONTENT3 SECTION TAM GENISLIK OVERRIDE
========================================= */
section#sp-content3 {
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

section#sp-content3 > .container,
section#sp-content3 > .container > .container-inner,
section#sp-content3 > .container > .container-inner > .row,
section#sp-content3 > .container > .container-inner > .row > [class*="col-"] {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

section#sp-content3 .sp-column,
section#sp-content3 .sp-module,
section#sp-content3 .sp-module-content,
section#sp-content3 .mod-custom {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

/* Bootstrap container max-width'i kaldir */
section#sp-content3 .container {
  max-width: 100% !important;
}

/* =========================================
   MOBILE HEADER - NAV LINKS GIZLE
========================================= */
@media (max-width: 991px) {
  /* Masaustu nav linklerini gizle */
  #sp-header .sp-megamenu-wrapper {
    display: none !important;
  }

  /* Offcanvas acik oldugunda da megamenu gizli kalsin (offcanvas kendi menusunu gosterir) */
  #sp-header .sp-megamenu-parent {
    display: none !important;
  }
}

/* =========================================
   HAMBURGER - SAG TARAFA HIZALA
========================================= */
@media (max-width: 991px) {
  /* Header row'u flex yap, toggler saga gitsin */
  #sp-header .row,
  #sp-header .container-inner,
  #sp-header .container {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    height: 50px !important;
  }

  /* Hamburger butonu saga yasla, ortalanmis gorunsun */
  #offcanvas-toggler {
    margin-left: auto !important;
    margin-right: 12px !important;
    order: 99 !important;
  }

  /* Buton icindeki ikon rengi ve boyutu */
  #offcanvas-toggler .hamburger-inner,
  #offcanvas-toggler .hamburger-inner::before,
  #offcanvas-toggler .hamburger-inner::after {
    background-color: #f2f2f2 !important;
  }
  #offcanvas-toggler svg,
  #offcanvas-toggler i {
    color: #f2f2f2 !important;
    font-size: 22px !important;
  }
}

/* =========================================
   HAMBURGER ICON - SADECE CIZGILER BEYAZ
========================================= */
@media (max-width: 991px) {
  /* Arka plan olmadan sadece cizgiler beyaz */
  #offcanvas-toggler .hamburger-inner,
  #offcanvas-toggler .hamburger-inner::before,
  #offcanvas-toggler .hamburger-inner::after {
    background-color: #ffffff !important;
  }

  /* SVG tabanli ikon cubuklar - sadece stroke beyaz */
  #offcanvas-toggler svg path,
  #offcanvas-toggler svg rect,
  #offcanvas-toggler svg line {
    fill: none !important;
    stroke: #ffffff !important;
    stroke-width: 2 !important;
  }

  /* Font-icon (fa, glyphicon) */
  #offcanvas-toggler i,
  #offcanvas-toggler span.icon,
  #offcanvas-toggler .fa {
    color: #ffffff !important;
  }

  /* Bootstrap navbar-toggler-icon (SVG data URI) */
  #offcanvas-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='white' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !important;
  }
}
