/* =========================================================
   Waffelkatze Header
   Einheitliche, optisch mittige Ausrichtung auf allen Templates.
   ========================================================= */

.wp-site-blocks > .wk-header__cols.wp-block-columns,
header.wp-block-template-part .wk-header__cols.wp-block-columns{
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: clamp(28px, 4.5vw, 54px) clamp(18px, 3vw, 32px) !important;
  box-sizing: border-box !important;
  background: #ffffff !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
}

.wp-site-blocks .wk-header__col-left.wp-block-column,
header.wp-block-template-part .wk-header__col-left.wp-block-column{
  flex: 0 1 auto !important;
  width: 100% !important;
  max-width: min(1040px, 100%) !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(18px, 2.2vw, 24px) !important;
  text-align: center !important;
}

.wp-site-blocks .wk-header__col-left > .wp-block-group,
header.wp-block-template-part .wk-header__col-left > .wp-block-group{
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

.wp-site-blocks .wk-header__col-left > .wp-block-group:first-child,
header.wp-block-template-part .wk-header__col-left > .wp-block-group:first-child{
  width: auto !important;
  max-width: 100% !important;
  gap: clamp(12px, 1.6vw, 18px) !important;
  transform: translateX(clamp(-32px, -3vw, -18px)) !important;
}

.wp-site-blocks .wk-header__col-left > .wp-block-group:nth-child(2),
header.wp-block-template-part .wk-header__col-left > .wp-block-group:nth-child(2){
  width: 100% !important;
}

.wp-site-blocks .wk-header__col-left .wp-block-site-logo,
header.wp-block-template-part .wk-header__col-left .wp-block-site-logo{
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

.wp-site-blocks .wk-header__col-left .wp-block-site-logo img,
header.wp-block-template-part .wk-header__col-left .wp-block-site-logo img,
header.wp-block-template-part .wk-header__col-left .custom-logo{
  display: block !important;
  width: clamp(118px, 13vw, 156px) !important;
  max-width: none !important;
  height: auto !important;
}

.wp-site-blocks .wk-header__col-left .wp-block-site-title,
.wp-site-blocks .wk-header__col-left .wp-block-site-title a,
header.wp-block-template-part .wk-header__col-left .wp-block-site-title,
header.wp-block-template-part .wk-header__col-left .wp-block-site-title a{
  margin: 0 !important;
  padding: 0 !important;
  color: #060a28 !important;
  font-family: var(--wk-font-body, "Karla", sans-serif) !important;
  font-size: clamp(1.85rem, 2.45vw, 2.4rem) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  text-transform: none !important;
  white-space: nowrap !important;
}

.wp-site-blocks .wk-header__col-left .wp-block-navigation,
header.wp-block-template-part .wk-header__col-left .wp-block-navigation{
  width: 100% !important;
  margin: 0 auto !important;
  display: flex !important;
  justify-content: center !important;
}

.wp-site-blocks .wk-header__col-left .wp-block-navigation__responsive-container:not(.is-menu-open),
.wp-site-blocks .wk-header__col-left .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-content,
header.wp-block-template-part .wk-header__col-left .wp-block-navigation__responsive-container:not(.is-menu-open),
header.wp-block-template-part .wk-header__col-left .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-content{
  width: 100% !important;
}

.wp-site-blocks .wk-header__col-left .wp-block-navigation__container,
header.wp-block-template-part .wk-header__col-left .wp-block-navigation__container{
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(18px, 2.2vw, 28px) !important;
}

body.single-post .wp-site-blocks > .wk-header__cols.wp-block-columns{
  align-items: center !important;
}

body.single-post .wp-site-blocks .wk-header__col-left.wp-block-column{
  flex: 0 1 auto !important;
  width: min(1040px, 100%) !important;
  max-width: min(1040px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body.single-post .wp-site-blocks .wk-header__col-left > .wp-block-group:first-child{
  margin-left: auto !important;
  margin-right: auto !important;
}

body.single-post .wp-site-blocks .wk-header__col-left .wp-block-navigation{
  margin-left: auto !important;
  margin-right: auto !important;
}

@media (max-width: 768px){
  .wp-site-blocks > .wk-header__cols.wp-block-columns,
  header.wp-block-template-part .wk-header__cols.wp-block-columns{
    padding: 24px 18px 26px !important;
  }

  .wp-site-blocks .wk-header__col-left.wp-block-column,
  header.wp-block-template-part .wk-header__col-left.wp-block-column{
    gap: 14px !important;
  }

  .wp-site-blocks .wk-header__col-left > .wp-block-group:first-child,
  header.wp-block-template-part .wk-header__col-left > .wp-block-group:first-child{
    gap: 10px !important;
    transform: translateX(-10px) !important;
  }

  .wp-site-blocks .wk-header__col-left .wp-block-site-logo img,
  header.wp-block-template-part .wk-header__col-left .wp-block-site-logo img,
  header.wp-block-template-part .wk-header__col-left .custom-logo{
    width: 84px !important;
  }

  .wp-site-blocks .wk-header__col-left .wp-block-site-title,
  .wp-site-blocks .wk-header__col-left .wp-block-site-title a,
  header.wp-block-template-part .wk-header__col-left .wp-block-site-title,
  header.wp-block-template-part .wk-header__col-left .wp-block-site-title a{
    max-width: calc(100vw - 126px) !important;
    font-size: clamp(1.45rem, 7vw, 1.8rem) !important;
  }
}

/* Gemeinsames mobiles Layout; überschreibt auch die älteren Seitenregeln.
   Nur der Schalter ist absolut positioniert, damit das Menü als Dialog
   weiterhin den gesamten Viewport nutzen kann. */
@media (max-width: 768px){
  body .wp-site-blocks .wk-header__cols .wk-header__col-left.wp-block-column{
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 1040px !important;
    gap: 0 !important;
    overflow: visible !important;
  }

  body .wp-site-blocks .wk-header__cols .wk-header__col-left > .wp-block-group:first-child{
    width: auto !important;
    max-width: calc(100% - 52px) !important;
    min-width: 0 !important;
    margin: 0 0 0 52px !important;
    flex-wrap: nowrap !important;
    gap: clamp(6px, 2vw, 10px) !important;
    transform: none !important;
  }

  body .wp-site-blocks .wk-header__cols .wk-header__col-left .wp-block-site-logo{
    padding: 0 !important;
  }

  body .wp-site-blocks .wk-header__cols .wk-header__col-left .wp-block-site-logo img{
    width: 84px !important;
    max-width: none !important;
  }

  body .wp-site-blocks .wk-header__cols .wk-header__col-left .wp-block-site-title,
  body .wp-site-blocks .wk-header__cols .wk-header__col-left .wp-block-site-title a{
    min-width: 0 !important;
    max-width: 100% !important;
    font-size: clamp(1.45rem, 7vw, 1.8rem) !important;
  }

  body .wp-site-blocks .wk-header__cols .wk-header__col-left > .wp-block-group:nth-child(2),
  body .wp-site-blocks .wk-header__cols .wk-header__col-left .wp-block-navigation{
    position: static !important;
    width: 100% !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    transform: none !important;
  }

  body .wp-site-blocks .wk-header__cols .wk-header__col-left .wp-block-navigation__responsive-container-open{
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 10px !important;
    border: 0 !important;
    background: transparent !important;
    color: #060a28 !important;
    cursor: pointer !important;
    z-index: 100 !important;
  }

  body .wp-site-blocks .wk-header__cols .wk-header__col-left .wp-block-navigation__responsive-container:not(.is-menu-open){
    display: none !important;
  }
}
/* Navigation must sit above hero images and their glass overlays. */
.wp-site-blocks > .wk-header__cols,
.wp-site-blocks > header.wp-block-template-part {
  position: relative !important;
  z-index: 100 !important;
  overflow: visible !important;
}
/* Dropdown labels must not inherit the centered header branding alignment. */
.wk-header__cols .wp-block-navigation__submenu-container,
.wk-header__cols .wp-block-navigation__submenu-container .wp-block-navigation-item,
.wk-header__cols .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  text-align: left !important;
}

/* Der mobile Dialog darf weder die Desktop-Zeile noch Dropdown-Positionen erben. */
@media (max-width: 768px){
  body .wp-site-blocks .wk-header__cols .wp-block-navigation__responsive-container.is-menu-open{
    position: fixed !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100dvh !important;
    margin: 0 !important;
    padding: 22px !important;
    box-sizing: border-box !important;
    background: #fff !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    z-index: 999999 !important;
  }

  body .wp-site-blocks .wk-header__cols .is-menu-open :is(.wp-block-navigation__responsive-close, .wp-block-navigation__responsive-dialog){
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  body .wp-site-blocks .wk-header__cols .is-menu-open .wp-block-navigation__responsive-container-close{
    position: absolute !important;
    top: 4px !important;
    right: 0 !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    z-index: 3 !important;
  }

  body .wp-site-blocks .wk-header__cols .is-menu-open .wp-block-navigation__responsive-container-content{
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 145px 0 72px !important;
    box-sizing: border-box !important;
  }

  body .wp-site-blocks .wk-header__cols .is-menu-open :is(.wp-block-navigation__container, .wp-block-navigation__submenu-container){
    position: static !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    gap: 16px !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body .wp-site-blocks .wk-header__cols .is-menu-open .wp-block-navigation-item{
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    text-align: left !important;
  }

  body .wp-site-blocks .wk-header__cols .is-menu-open .wp-block-navigation-item__content{
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    text-align: left !important;
  }

  body .wp-site-blocks .wk-header__cols .is-menu-open .wp-block-navigation__submenu-container{
    padding: 12px 0 0 12px !important;
  }
}