/* HEADER THEME V19
   One-page route-aware header.
   No layout shift: main padding never changes when the active section changes. */

:root{
  --header-home:#0f2042;
  --header-light:#f2f4f5;
  --header-menu:#f7f8f9;
  --header-ink:#2f3237;
  --header-white:#f3f6f8;
}

/* One-page layout stays fixed while route classes change. */
body[class*="route-"] main{padding-top:0!important;}

.site-header{
  border-bottom:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  transition:background-color .28s cubic-bezier(.22,1,.36,1),color .2s ease!important;
}

/* Header follows the section underneath it. */
body.route-start .site-header{background:var(--header-home)!important;}
body.route-ueber-uns .site-header{background:var(--bg)!important;}
body.route-leistungen .site-header{background:var(--christian-bg,#f2f4f6)!important;}
body.route-arbeitsweise .site-header{background:var(--christian-surface,#f8f9fa)!important;}
body.route-kontakt .site-header{background:var(--surface)!important;}

body.route-start .site-header .brand{color:var(--header-white)!important;}
body.route-start .site-header .menu-toggle span{background:var(--header-white)!important;}
body:not(.route-start) .site-header .brand{color:var(--header-ink)!important;}
body:not(.route-start) .site-header .menu-toggle span{background:var(--header-ink)!important;}

/* Lines-only burger, no tap flash. */
.site-header .menu-toggle,
.site-header .menu-toggle:active,
.site-header .menu-toggle:focus,
.site-header .menu-toggle:focus-visible{
  position:relative!important;
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  outline:none!important;
  -webkit-tap-highlight-color:transparent!important;
}
.site-header .menu-toggle span{
  position:absolute!important;
  left:4px!important;
  top:50%!important;
  width:34px!important;
  height:2px!important;
  margin:0!important;
  transform-origin:center!important;
  transition:transform .18s ease,opacity .14s ease,background-color .18s ease!important;
}
.site-header .menu-toggle span:nth-child(1){transform:translateY(-10px)!important;}
.site-header .menu-toggle span:nth-child(2){transform:translateY(-1px)!important;}
.site-header .menu-toggle span:nth-child(3){transform:translateY(8px)!important;}
.site-header .menu-toggle.is-open span:nth-child(1){transform:translateY(-1px) rotate(45deg)!important;}
.site-header .menu-toggle.is-open span:nth-child(2){opacity:0!important;}
.site-header .menu-toggle.is-open span:nth-child(3){transform:translateY(-1px) rotate(-45deg)!important;}

/* Open menu is one continuous light surface, including the header. */
body.menu-open .site-header{background:var(--header-menu)!important;}
body.menu-open .site-header .brand{color:var(--header-ink)!important;}
body.menu-open .site-header .menu-toggle span{background:var(--header-ink)!important;}
body.menu-open .main-nav{background:var(--header-menu)!important;border-top:0!important;}

/* V4 mobile burger position lock: keep a fixed 22px right inset on all mobile sections. */
@media (max-width:700px){
  .site-header .site-header-inner{
    position:relative!important;
    padding-left:22px!important;
    padding-right:22px!important;
  }
  .site-header .menu-toggle,
  .site-header .menu-toggle:active,
  .site-header .menu-toggle:focus,
  .site-header .menu-toggle:focus-visible{
    position:absolute!important;
    right:22px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    margin:0!important;
  }
}

/* V5 mobile alignment fix: burger a bit further left */
@media (max-width:700px){
  .site-header .site-header-inner{
    padding-left:22px!important;
    padding-right:22px!important;
  }
  .site-header .menu-toggle,
  .site-header .menu-toggle:active,
  .site-header .menu-toggle:focus,
  .site-header .menu-toggle:focus-visible{
    right:30px!important;
  }
}