/* Schriftarten für Überschriften */
h1, h2, h3, h4, h5, h6 {
  font-family: "june-expt-variable", sans-serif;
  font-variation-settings: "STYL" 0;
}

/* Header & Navigation Struktur */
.site-header .container, 
.header-inner, 
.nav-container {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
}

.site-logo, .custom-logo-link {
  margin-bottom: 0 !important;
  margin-right: 10px !important;
  flex-shrink: 0 !important;
}

.menu-toggle, .mobile-menu-toggle {
  margin: 0 !important;
  padding: 0 !important;
  flex-shrink: 0 !important;
}

/* Header-Anpassungen für Mobilgeräte */
@media only screen and (max-width: 768px) {
  .nav-container, .main-navigation {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 10px 15px !important;
  }

  .site-logo img, .custom-logo {
    max-height: 70px !important;
    width: auto !important;
  }

  .menu-toggle, .mobile-menu-toggle {
    display: block !important;
    visibility: visible !important;
    background: transparent !important;
  }
}
@media (max-width: 781px) {
 /* =======================================================
   MOBILE & TABLET NAVIGATION (< 1024px)
   ======================================================= */
@media (max-width: 1023px) {

  /* 1. Rechtes Burger-Icon ausblenden (nur der Button wird entfernt) */
  header .wp-block-navigation:last-of-type > button.wp-block-navigation__responsive-container-open {
    display: none !important;
  }

  /* 2. Linkes Burger-Icon erzwingen und sauber darstellen */
  header .wp-block-navigation:first-of-type > button.wp-block-navigation__responsive-container-open {
    display: flex !important;
    cursor: pointer !important;
  }

  /* 3. Header-Reihenfolge & Aufteilung (Burger - Logo - Cart) */
  header .wp-block-group {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
  }

  /* 4. Ausklapp-Overlay über den ganzen Bildschirm spannen */
  .wp-block-navigation__responsive-container.is-menu-open {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background-color: #ffffff !important;
    padding: 70px 24px 30px !important;
    z-index: 999999 !important;
    box-sizing: border-box !important;
  }

  /* 5. Menüpunkte kompakt, linksbündig und ohne riesige Lücken formatieren */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
    margin-top: 10px !important;
    width: 100% !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open ul.wp-block-navigation__container {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
    font-size: 19px !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    text-align: left !important;
    width: 100% !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a {
    text-decoration: none !important;
    display: inline-block !important;
  }

  /* 6. Schließen-Icon (X) oben rechts fixieren */
  .wp-block-navigation__responsive-container-close {
    position: absolute !important;
    top: 20px !important;
    right: 20px !important;
    z-index: 1000000 !important;
  }

  /* 7. Logo-Größe für Tablets und Handys angleichen */
  header .wp-block-site-logo img {
    max-height: 44px !important;
    width: auto !important;
  }
/* Haupttitel auf der Beitrags-Detailseite */
body.category-fotografie h1.entry-title,
body.category-fotografie .entry-title,
body.category-fotografie .wp-block-post-title,
body.category-fotografie h1 {
  color: #008671 !important;
}
/* 1. Auf der statischen Seite "Fotografie" (erfasst über Slug & Body-Klassen) */
body[class*="fotografie"] h1,
body[class*="fotografie"] .entry-title,
body[class*="fotografie"] .page-title,
body[class*="fotografie"] .wp-block-post-title,
body[class*="fotografie"] header h1,

/* 2. Auf der Kategorie-Archivseite "Fotografie" */
body.category-fotografie h1,
body.category-fotografie .page-title,
body.category-fotografie .archive-title,

/* 3. In einzelnen Beiträgen der Kategorie "Fotografie" */
body.category-fotografie h1.entry-title,
body.category-fotografie .entry-title,
body.category-fotografie .wp-block-post-title,
article.category-fotografie h1,
article.category-fotografie .entry-title,

/* 4. Bei allen Überschriften, die auf Fotografie verlinken oder darin liegen */
.category-fotografie .entry-title a,
.category-fotografie h2 a,
.category-fotografie h3 a {
  color: #008671 !important;
}