/* WGRCMS-Step-0045 Hard Header/Hero/Menu Fix */

/* Alles, was alte Header-Lücken erzeugt, hart neutralisieren */
html, body{
  margin:0!important;
  padding:0!important;
}

body{
  background:#fff!important;
}

.site-header{
  position:relative!important;
  z-index:100!important;
  width:100%!important;
  height:82px!important;
  min-height:82px!important;
  margin:0!important;
  padding:0!important;
  background:#015da8!important;
  box-shadow:0 2px 12px rgba(0,42,86,.18)!important;
  overflow:visible!important;
}

/* alte ausgesparte/abgerundete Hintergrundflächen killen */
.site-header:before,
.site-header:after,
.header-inner:before,
.header-inner:after{
  display:none!important;
  content:none!important;
}

.header-inner{
  width:100%!important;
  max-width:1500px!important;
  height:82px!important;
  margin:0 auto!important;
  padding:0 34px!important;
  display:flex!important;
  align-items:center!important;
  gap:0!important;
  background:transparent!important;
  border-radius:0!important;
  box-shadow:none!important;
}

/* Logo links */
.brand{
  flex:0 0 310px!important;
  width:310px!important;
  max-width:310px!important;
  height:82px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
}

.brand img{
  width:275px!important;
  max-width:275px!important;
  max-height:70px!important;
  object-fit:contain!important;
  object-position:left center!important;
  display:block!important;
  background:transparent!important;
}

/* Navigation: kein Springen, keine Pillen-Verschiebung */
.main-nav{
  height:82px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:6px!important;
  margin:0 0 0 auto!important;
  padding:0!important;
  background:transparent!important;
}

.main-nav a{
  position:relative!important;
  height:82px!important;
  min-height:82px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 12px!important;
  margin:0!important;
  color:#fff!important;
  text-decoration:none!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:14px!important;
  font-weight:850!important;
  line-height:1!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  transform:none!important;
  opacity:.96!important;
  white-space:nowrap!important;
}

.main-nav a:hover{
  background:rgba(255,255,255,.10)!important;
  transform:none!important;
  box-shadow:none!important;
  opacity:1!important;
}

/* sämtliche alten Balken/Pillen zurücksetzen */
.main-nav a:before{
  display:none!important;
  content:none!important;
}

.main-nav a:after{
  content:""!important;
  position:absolute!important;
  left:12px!important;
  right:12px!important;
  bottom:0!important;
  height:4px!important;
  background:#fff!important;
  border-radius:4px 4px 0 0!important;
  display:block!important;
  transform:scaleX(0)!important;
  transform-origin:center!important;
  transition:transform .16s ease!important;
}

/* first-child darf NICHT automatisch aktiv sein */
.main-nav a:first-child{
  background:transparent!important;
  color:#fff!important;
  border:0!important;
  box-shadow:none!important;
}

.main-nav a:first-child:after{
  transform:scaleX(0)!important;
}

/* nur echte aktive Klasse markiert */
.main-nav a.active,
.main-nav a[aria-current="page"]{
  background:rgba(255,255,255,.12)!important;
  color:#fff!important;
  box-shadow:none!important;
}

.main-nav a.active:after,
.main-nav a[aria-current="page"]:after{
  transform:scaleX(1)!important;
}

/* Kontakt rechts stabil */
.header-contact{
  height:82px!important;
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  margin:0 0 0 18px!important;
  padding:0!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:700!important;
  white-space:nowrap!important;
  background:transparent!important;
}

/* Hero direkt unter Header, keine Lücke */
.hero{
  margin:0!important;
  padding-top:0!important;
  border-top:0!important;
  position:relative!important;
  top:auto!important;
}

/* Falls ein wrapper nach Header noch Abstand hat */
.site-header + .hero,
.site-header + main,
.site-header + section,
.site-header + div{
  margin-top:0!important;
}

/* frühere CSS-Schichten, die Top-Abstand erzeugen */
body > .hero{
  margin-top:0!important;
}

.hero-content{
  padding-top:66px!important;
}

/* Das Mockup-Bild soll oben direkt anschließen */
.hero{
  background-position:center center!important;
}

/* Mobile */
@media(max-width:980px){
  .site-header,
  .header-inner{
    height:auto!important;
    min-height:0!important;
  }

  .header-inner{
    padding:14px 22px!important;
    flex-wrap:wrap!important;
  }

  .brand{
    height:auto!important;
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
  }

  .brand img{
    width:250px!important;
  }

  .main-nav{
    height:auto!important;
    width:100%!important;
    justify-content:flex-start!important;
    flex-wrap:wrap!important;
    margin:12px 0 0!important;
  }

  .main-nav a{
    height:38px!important;
    min-height:38px!important;
    padding:0 11px!important;
    border-radius:6px!important;
  }

  .main-nav a:after{
    left:8px!important;
    right:8px!important;
    height:3px!important;
  }

  .header-contact{
    height:auto!important;
    margin:10px 0 0!important;
    flex-wrap:wrap!important;
  }

  .hero-content{
    padding-top:42px!important;
  }
}