/* Gedeelde header en menu voor iedere Winvolt-pagina. */
.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.1) !important;
  background: rgba(23,65,55,.97) !important;
  backdrop-filter: blur(16px);
  color: #fff !important;
  font-family: Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}
.site-header *, .site-header *::before, .site-header *::after { box-sizing: border-box; }
.site-header .nav {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: calc(100% - 1.5rem) !important;
  max-width: none !important;
  min-height: 76px !important;
  height: 76px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  gap: 1rem !important;
}
.site-header .brand {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  gap: .72rem !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  font: 850 1.2rem/1.6 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  text-decoration: none !important;
}
.site-header .brand img { display: block !important; width: 42px !important; height: 42px !important; object-fit: contain !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important; }
.site-header .brand > span { display: inline !important; color: inherit !important; font: inherit !important; }
.site-header .menu-toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 88px !important;
  width: auto !important;
  min-height: 44px !important;
  height: 44px !important;
  gap: .6rem !important;
  margin: 0 0 0 auto !important;
  padding: .55rem .75rem !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.08) !important;
  box-shadow: none !important;
  color: #fff !important;
  font: 400 13.3333px/normal Arial,sans-serif !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  cursor: pointer;
  transform: none !important;
}
.site-header .menu-toggle > span { margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; transform: none !important; }
.site-header .menu-toggle .menu-text { display: inline !important; width: auto !important; height: auto !important; font: 800 .88rem/normal Arial,sans-serif !important; letter-spacing: normal !important; }
.site-header .menu-toggle .menu-bars { display: grid !important; grid-template-rows: repeat(3,2px) !important; align-content: start !important; width: 20px !important; height: 14px !important; gap: 4px !important; line-height: 0 !important; }
.site-header .menu-toggle .menu-bars i { display: block !important; width: 20px !important; height: 2px !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 2px !important; background: currentColor !important; opacity: 1; transform: none; transform-origin: center; transition: transform .2s ease, opacity .2s ease; }
.site-header .menu-toggle[aria-expanded="true"] .menu-bars i:first-child { transform: translateY(6px) rotate(45deg); }
.site-header .menu-toggle[aria-expanded="true"] .menu-bars i:nth-child(2) { opacity: 0; }
.site-header .menu-toggle[aria-expanded="true"] .menu-bars i:last-child { transform: translateY(-6px) rotate(-45deg); }
.site-header .nav-links {
  position: absolute !important;
  left: auto !important;
  right: 0 !important;
  top: 76px !important;
  display: none !important;
  flex: 1 !important;
  align-items: stretch !important;
  justify-content: flex-end !important;
  width: max-content !important;
  min-width: 218px !important;
  max-width: calc(100vw - 1.5rem) !important;
  max-height: calc(100dvh - 76px);
  overflow-y: auto;
  margin: 0 !important;
  padding: .45rem !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-top: 0 !important;
  border-radius: 0 0 .9rem .9rem !important;
  background: #174137 !important;
  box-shadow: 0 18px 36px rgba(0,0,0,.2) !important;
  color: rgba(255,255,255,.8) !important;
  font: 750 .83rem/1.6 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  gap: .15rem !important;
}
.site-header .nav-links.open { display: grid !important; }
.site-header .nav-links > a {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  min-height: 44px !important;
  height: 44px !important;
  width: auto;
  margin: 0 !important;
  padding: .62rem .75rem !important;
  border: 0 !important;
  border-radius: .7rem !important;
  background: transparent;
  box-shadow: none !important;
  color: inherit !important;
  font: 700 .76rem/1.6 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  letter-spacing: .11em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  text-align: right !important;
  white-space: nowrap !important;
  transform: none !important;
}
.site-header .nav-links > a:hover,.site-header .nav-links > a[aria-current="page"] { color: #fff !important; background: rgba(255,255,255,.08) !important; }
.site-header .nav-links .nav-contact { width: 100% !important; min-width: 0 !important; margin: .25rem 0 0 !important; padding: 0 16px !important; border-radius: 999px !important; background: #6fc77a !important; color: #0d2b25 !important; font-size: 14px !important; font-weight: 850 !important; line-height: 1 !important; }
.site-header :focus-visible { outline: 3px solid #6fc77a; outline-offset: 4px; }
@media(max-width:520px) {
  .site-header { font-size: 16px !important; }
  .site-header .nav { min-height: 68px !important; height: 68px !important; }
  .site-header .nav-links { top: 68px !important; max-height: calc(100dvh - 68px); }
  .site-header .brand { font-size: 1.05rem !important; }
  .site-header .brand img { width: 36px !important; height: 36px !important; }
}
@media(prefers-reduced-motion:reduce) { .site-header .menu-bars i { transition: none !important; } }