/* === Mittelstrimmig – Header & Menü (bereinigt) =========================
   - Enthält NUR Header/Branding/Navigations-Styling
   - Alle globalen/sonstigen Styles sind in global.css
   ===================================================================== */

/* Grundlayout Header */
header.header{
  position: sticky; top: 0; z-index: 9999 !important;
  /* Wir arbeiten mit einer Overlay-Ebene für den Verlauf */
  background: transparent !important;
  padding: 18px 18px 12px !important;
  transition: padding .25s ease, box-shadow .25s ease, background .25s ease;
  isolation: isolate; /* eigener Stacking-Context */
}
header.header::before{
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(180deg, #6E6155 0%, #76695C 45%, #6E6155 100%);
  opacity: .98;
  box-shadow: 0 8px 28px rgba(0,0,0,.10);
}
header.header > *{ position: relative; z-index: 1; }

/* Innenaufbau Header */
header.header .container.header-inner{
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 18px; background: transparent !important; box-shadow: none !important;
  border-radius: 0 !important; padding: 0 !important;
}

/* Branding */
header.header .brand{ display: flex; align-items: center; gap: 10px; min-width: 0; }
header.header .brand > a{ display:block; line-height:0; }
header.header .brand img{
  display:block; height: clamp(64px, 9vw, 88px) !important; width: auto !important;
  border-radius: 12px; filter: drop-shadow(0 2px 8px rgba(0,0,0,.28));
  transition: height .25s ease, filter .25s ease;
}
header.header .brand .sitename,
header.header .brand .sitename a{
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Cantarell, "Noto Sans", "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(1.25rem, 1.6vw + 0.6rem, 2.1rem) !important;
  line-height: 1.05 !important; letter-spacing: .02em;
  color: #FFE9B3 !important; text-decoration: none !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
  transition: font-size .25s ease, color .25s ease, text-shadow .25s ease;
}
header.header .brand .sitename a:hover{ color:#FFEEBF !important; }

/* Menü-Wrapper (neutral) */
header.header .menu{ background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }

/* Top-Level Navigation */
header.header .gva-nav{ position: relative; }
header.header .gva-nav .gva-menu{
  list-style: none; margin: 0; padding: 0;
  display: flex; gap: 36px; align-items: flex-end;
}
header.header .gva-nav .gva-menu > li{ position: relative; }
header.header .gva-nav .gva-menu > li > a{
  display: inline-block; padding: 16px 0 14px; text-decoration: none;
  color: #F7F4EF !important; text-transform: uppercase; letter-spacing: .08em;
  font-weight: 700; font-size: 13px; line-height: 1; position: relative;
  background: transparent !important; border-radius: 0 !important;
}
header.header .gva-nav .gva-menu > li > a::after{
  content: ""; position: absolute; left: 0; right: 0; bottom: 0;
  height: 0; background: rgba(255,255,255,.22); border-radius: 2px; opacity: .9;
  transition: background .22s ease, height .22s ease, opacity .22s ease;
}
header.header .gva-nav .gva-menu > li:hover > a::after,
header.header .gva-nav .gva-menu > li > a:focus::after{
  background: #D4AF37; height: 3px; opacity: 1;
}
/* Active */
header.header .gva-nav .gva-menu > li > a.is-active{
  color: #FFE9B3 !important;
}
header.header .gva-nav .gva-menu > li > a.is-active::after{
  background: #D4AF37; height: 3px; opacity: 1;
}
/* Caret am Elternpunkt */
header.header .gva-nav .gva-menu > li.has-sub > a::before{
  content: ""; position: absolute; right: -14px; top: 50%;
  width: 6px; height: 6px;
  border-right: 2px solid rgba(255,255,255,.85);
  border-bottom: 2px solid rgba(255,255,255,.85);
  transform: translateY(-50%) rotate(135deg);
  transition: transform .2s ease, border-color .2s ease;
}
header.header .gva-nav .gva-menu > li.has-sub:hover > a::before,
header.header .gva-nav .gva-menu > li.has-sub:focus-within > a::before{
  transform: translateY(-50%) rotate(45deg); border-color: #D4AF37;
}

/* Dropdowns (2nd level) */
header.header .gva-nav .gva-submenu{
  list-style: none; margin: 0; padding: 12px 14px;
  position: absolute; left: 0; top: 100%;
  min-width: 240px; width: max-content; max-width: min(92vw, 22rem);
  background: #fff !important; border: 1px solid rgba(0,0,0,.08);
  border-radius: 0; box-shadow: 0 16px 40px rgba(0,0,0,.18);
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .22s ease, transform .22s ease, visibility .22s;
  overflow-wrap: anywhere; z-index: 40;
}
header.header .gva-nav .gva-menu > li:hover > .gva-submenu,
header.header .gva-nav .gva-menu > li:focus-within > .gva-submenu{
  opacity: 1; visibility: visible; transform: translateY(0);
}
/* Submenüzeilen vollflächig */
header.header .gva-nav .gva-submenu > li{
  display: block; width: 100%; padding: 10px 14px;
  border-radius: 6px; background: transparent; transition: background .18s ease;
}
header.header .gva-nav .gva-submenu > li:hover,
header.header .gva-nav .gva-submenu > li:focus-within{
  background: rgba(169,200,141,.48) !important;
}
header.header .gva-nav .gva-submenu > li > a{
  display: block; padding: 0 !important; background: transparent !important;
  color: #1B3D2F; font-weight: 600; text-decoration: none;
}
/* Am rechten Rand nach innen klappen */
@media (min-width: 1024px){
  header.header .gva-nav .gva-menu > li:nth-last-child(-n+2) > .gva-submenu{
    left: auto; right: 0;
  }
}

/* Mobile Menü */
@media (max-width: 900px){
  header.header .menu{
    position: absolute; right: 18px; top: calc(100% + 10px);
    width: min(92vw, 360px); background: #fff; border: 1px solid rgba(0,0,0,.08);
    border-radius: 0; box-shadow: 0 12px 30px rgba(0,0,0,.12); padding: 10px;
    display: none;
  }
  header.header .menu.open{ display: block; }
  header.header .gva-nav .gva-menu{
    position: static; margin: 0; padding: 0;
    display: flex; flex-direction: column; gap: 4px; align-items: stretch;
  }
  header.header .gva-nav .gva-menu > li > a{
    color: #1B3D2F !important; text-transform: none; letter-spacing: 0; padding: 2px 6px;
  }
  header.header .gva-nav .gva-menu > li > a::after{ display: none; }
  header.header .gva-nav .gva-submenu{
    position: static; margin: 4px 0 8px 10px; padding: 0;
    border: 0; box-shadow: none; opacity: 1; visibility: visible; transform: none;
  }
  header.header .gva-nav .gva-submenu::before{ display: none; }
}

/* Shrink-Zustand (Scroll) */
header.header{
  --hdr-pad-top: 18px; --hdr-pad-h: 18px; --hdr-pad-bottom: 12px;
  --logo-h: clamp(64px, 9vw, 88px);
  --title-size: clamp(1.25rem, 1.6vw + 0.6rem, 2.1rem);
  padding: var(--hdr-pad-top) var(--hdr-pad-h) var(--hdr-pad-bottom) var(--hdr-pad-h) !important;
}
header.header.is-shrunk{
  --hdr-pad-top: 8px; --hdr-pad-h: 16px; --hdr-pad-bottom: 6px;
  --logo-h: 48px; --title-size: 1.25rem;
  box-shadow: 0 6px 18px rgba(0,0,0,.16);
}
header.header .brand img{ height: var(--logo-h) !important; }
header.header .brand .sitename,
header.header .brand .sitename a{ font-size: var(--title-size) !important; }

/* weniger Bewegung bei System-Preference */
@media (prefers-reduced-motion: reduce){
  header.header,
  header.header .brand img,
  header.header .brand .sitename,
  header.header .brand .sitename a{
    transition: none !important;
  }
}

/* Kleines Utility: Links im Header nie unterstreichen */
header.header .gva-nav a{ text-decoration: none; }
