/* =======================================================
   STARKELEITUNG – BASELINE CSS (Steps 1–3, Desktop only)
   Theme: Hever
   ======================================================= */

/* 1) Seitentitel ausblenden */
.page .entry-title,
.single .entry-title,
h1.entry-title,
.page .page-title,
header.entry-header .entry-title,
.wp-block-post-title,
.page-header {
  display: none !important;
}
.page header.entry-header,
.page .page-header {
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
}

/* 2) Vollflächiges Hintergrundbild mit Overlay */
:root {
  --hero-bg: url("https://starkeleitung.de/wp-content/uploads/2025/09/img-20250918-wa0012-1-1.jpg");
  --overlay: rgba(0, 0, 0, 0.25);
  --accent: #ff7a00; /* Orange für aktiv/hover */
}

html, body {
  height: 100%;
  margin: 0; padding: 0;
}

body {
  background-image: var(--hero-bg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  color: #fff;
  position: relative;
}

/* Overlay für Lesbarkeit */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background: var(--overlay);
  pointer-events: none;
  z-index: 0;
}

/* Inhaltsebene über Overlay */
.site,
.site-content,
.wp-site-blocks,
main,
header,
footer {
  position: relative;
  z-index: 1;
  background: transparent !important;
  box-shadow: none !important;
}

/* Textfarben Standard */
body, p, h1, h2, h3, h4, h5, h6 {
  color: #fff !important;
}

/* =======================================================
   3) HEADER & FOOTER STYLES – NUR DESKTOP / TABLET
   ======================================================= */
@media (min-width: 901px) {

  /* Header Navigation */
  .site-header,
  .main-navigation {
    background: transparent !important;
    box-shadow: none !important;
  }

  .site-header a,
  .main-navigation a {
    color: #fff !important;                /* nicht-aktive weiß */
    text-decoration: none;
    transition: color .25s ease;
  }

  .site-header a:hover,
  .main-navigation a:hover {
    color: var(--accent) !important;       /* hover orange */
  }

  .main-navigation .current-menu-item > a,
  .main-navigation .current_page_item > a {
    color: var(--accent) !important;       /* aktiv orange */
    font-weight: 600;
  }

  /* Footer */
  .site-footer,
  footer,
  .wp-block-site-footer {
    color: #fff !important;
    background: transparent !important;
  }

  .site-footer a,
  footer a,
  .wp-block-site-footer a {
    color: #fff !important;                /* nicht-aktive weiß */
    text-decoration: none;
  }

  .site-footer a:hover,
  footer a:hover,
  .wp-block-site-footer a:hover {
    color: var(--accent) !important;       /* hover orange */
  }

  .site-footer .current-menu-item > a,
  footer .current-menu-item > a,
  .wp-block-site-footer .current-menu-item > a {
    color: var(--accent) !important;       /* aktiv orange */
    font-weight: 600;
  }
}

/* =======================================================
   4) MOBILE-FIX – Hintergrund & Menü sichtbar halten
   ======================================================= */
@media (max-width: 900px) {
  body {
    background-attachment: scroll !important;
  }
  body::before {
    position: absolute !important;
  }
  .site-header,
  .main-navigation {
    position: relative;
    z-index: 10000;
  }
  .main-navigation.toggled {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 10001;
    overflow-y: auto;
  }
}
/* Remove the large header image on single posts */
.single-post .custom-header,
.single-post .has-header-image .custom-header {
  display: none;
}

/* Ensure clean white background for post content */
.single-post .site-content {
  background-color: #ffffff;
}

/* Optional: limit text width for readability */
.single-post .entry-content {
  max-width: 800px;
  margin: 0 auto;
}