/* HVACity — gedeelde nav.css
 * Eén consistente top-balk voor alle pagina's behalve homepage en /flowair-slim-luchtgordijn-actie/.
 * Volledig scoped onder #hvc-shared-nav om geen conflicten met bestaande pagina-CSS te geven. */

#hvc-shared-nav {
  --hvc-navy: #0E2E63;
  --hvc-navy-2: #123E8A;
  --hvc-blue: #1D5BD1;
  --hvc-orange: #E95B1F;
  --hvc-orange-2: #CC4E1A;
  --hvc-green: #22A55A;
  --hvc-ink: #0B1B33;
  --hvc-ink-2: #18325C;
  --hvc-ink-3: #48607F;
  --hvc-line: #D4E0ED;
  --hvc-paper: #E8EFF8;
  --hvc-yellow: #E95B1F;
  --hvc-lime: #B8E24A;
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  color: var(--hvc-ink);
  display: block;
}
#hvc-shared-nav *, #hvc-shared-nav *::before, #hvc-shared-nav *::after { box-sizing: border-box; }

/* Announce-bar */
#hvc-shared-nav .hvc-ann { background: var(--hvc-navy); color: #fff; padding: 8px 0; font-size: 12px; text-align: center; font-weight: 500; position: relative; }
#hvc-shared-nav .hvc-ann::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: linear-gradient(90deg, var(--hvc-navy) 0%, var(--hvc-blue) 50%, var(--hvc-orange) 100%); }
#hvc-shared-nav .hvc-ann-wrap { max-width: 1440px; margin: 0 auto; padding: 0 24px; display: flex; justify-content: center; align-items: center; gap: 24px; flex-wrap: wrap; }
#hvc-shared-nav .hvc-ann b { color: var(--hvc-yellow); font-weight: 600; }
#hvc-shared-nav .hvc-ann-dot { width: 6px; height: 6px; border-radius: 999px; background: var(--hvc-lime); display: inline-block; animation: hvcPulse 1.6s infinite; vertical-align: middle; margin-right: 6px; }
@keyframes hvcPulse { 0%,100% {opacity:1} 50% {opacity:.4} }
@media (max-width: 640px) { #hvc-shared-nav .hvc-ann { padding: 6px 0; font-size: 11px; } #hvc-shared-nav .hvc-ann-wrap { gap: 10px; } #hvc-shared-nav .hvc-ann-sep { display: none; } }

/* Sticky top bar */
#hvc-shared-nav .hvc-top {
  position: sticky; top: 0; z-index: 50;
  background: rgba(243,247,252,.92);
  -webkit-backdrop-filter: blur(12px) saturate(160%);
  backdrop-filter: blur(12px) saturate(160%);
  border-bottom: 1px solid rgba(212,224,237,.55);
  box-shadow: 0 1px 0 rgba(255,255,255,.6) inset, 0 8px 24px -12px rgba(14,46,99,.08);
}
@supports not (backdrop-filter: blur(1px)) { #hvc-shared-nav .hvc-top { background: rgba(243,247,252,.96); } }
#hvc-shared-nav .hvc-top-inner { max-width: 1440px; margin: 0 auto; padding: 12px 24px; display: flex; align-items: center; gap: 18px; }

/* Logo */
#hvc-shared-nav .hvc-logo { display: inline-flex; align-items: center; gap: 10px; color: var(--hvc-ink); text-decoration: none; flex-shrink: 0; }
#hvc-shared-nav .hvc-logo-mark { width: 36px; height: 36px; flex-shrink: 0; display: block; }
#hvc-shared-nav .hvc-logo-word { font-family: 'Manrope', system-ui, sans-serif; font-weight: 900; font-size: 21px; letter-spacing: -.02em; color: var(--hvc-ink); line-height: 1; }
#hvc-shared-nav .hvc-logo-word em { font-style: normal; color: var(--hvc-blue); font-weight: 900; }

/* Menu */
#hvc-shared-nav .hvc-menu { display: flex; gap: 4px; flex: 1; list-style: none; margin: 0; padding: 0; }
#hvc-shared-nav .hvc-menu a { display: inline-flex; align-items: center; padding: 8px 12px; color: var(--hvc-ink-2); text-decoration: none; font-size: 13px; font-weight: 600; border-radius: 999px; transition: all .14s; }
#hvc-shared-nav .hvc-menu a:hover { background: rgba(29,91,209,.08); color: var(--hvc-blue); }
#hvc-shared-nav .hvc-menu a.installateurs { background: var(--hvc-green); color: #fff; font-weight: 700; }
#hvc-shared-nav .hvc-menu a.installateurs:hover { background: #1d8a4a; color: #fff; }
#hvc-shared-nav .hvc-menu a.is-active { background: var(--hvc-paper); color: var(--hvc-navy); }

/* Right-side CTAs */
#hvc-shared-nav .hvc-ctas { display: flex; gap: 8px; align-items: center; flex-shrink: 0; }
#hvc-shared-nav .hvc-icon-btn { width: 38px; height: 38px; border-radius: 999px; display: inline-grid; place-items: center; background: #fff; border: 1px solid var(--hvc-line); color: var(--hvc-ink); text-decoration: none; transition: all .14s; }
#hvc-shared-nav .hvc-icon-btn:hover { border-color: var(--hvc-blue); color: var(--hvc-blue); }
#hvc-shared-nav .hvc-cta-quote { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; background: linear-gradient(135deg, var(--hvc-orange), var(--hvc-orange-2)); color: #fff !important; text-decoration: none; border-radius: 999px; font-size: 13px; font-weight: 700; box-shadow: 0 4px 10px rgba(233,91,31,.28); white-space: nowrap; }
#hvc-shared-nav .hvc-cta-quote:hover { transform: translateY(-1px); }

/* Hamburger */
#hvc-shared-nav .hvc-hamburger { display: none; width: 40px; height: 40px; border-radius: 999px; background: #fff; border: 1px solid var(--hvc-line); color: var(--hvc-ink); cursor: pointer; padding: 0; place-items: center; }
#hvc-shared-nav .hvc-hamburger svg { width: 20px; height: 20px; }

/* Mobile drawer */
#hvc-shared-nav .hvc-drawer { position: fixed; inset: 0; z-index: 9998; visibility: hidden; pointer-events: none; background: rgba(11,27,51,.55); opacity: 0; transition: opacity .22s ease, visibility 0s linear .22s; }
#hvc-shared-nav .hvc-drawer.open { visibility: visible; pointer-events: auto; opacity: 1; transition: opacity .22s ease; }
#hvc-shared-nav .hvc-drawer-panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(86vw, 340px); background: #fff; display: flex; flex-direction: column; box-shadow: -12px 0 40px rgba(0,0,0,.18); transform: translateX(100%); transition: transform .26s cubic-bezier(.2,.7,.2,1); padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); }
#hvc-shared-nav .hvc-drawer.open .hvc-drawer-panel { transform: translateX(0); }
#hvc-shared-nav .hvc-drawer-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--hvc-line); }
#hvc-shared-nav .hvc-drawer-title { font-family: 'Manrope', sans-serif; font-weight: 700; font-size: 15px; color: var(--hvc-ink); margin: 0; }
#hvc-shared-nav .hvc-drawer-close { width: 40px; height: 40px; background: transparent; border: 0; color: var(--hvc-ink); border-radius: 999px; cursor: pointer; font-size: 22px; display: grid; place-items: center; }
#hvc-shared-nav .hvc-drawer-close:hover { background: rgba(0,0,0,.05); }
#hvc-shared-nav .hvc-drawer ul { list-style: none; padding: 8px 0; margin: 0; overflow-y: auto; flex: 1; }
#hvc-shared-nav .hvc-drawer li { margin: 0; }
#hvc-shared-nav .hvc-drawer a { display: flex; align-items: center; gap: 12px; padding: 14px 22px; font-weight: 600; font-size: 15px; color: var(--hvc-ink); text-decoration: none; border-bottom: 1px solid rgba(0,0,0,.04); }
#hvc-shared-nav .hvc-drawer a:hover { background: rgba(29,91,209,.06); color: var(--hvc-blue); }
#hvc-shared-nav .hvc-drawer a.installateurs { color: var(--hvc-green); font-weight: 700; }
#hvc-shared-nav .hvc-drawer-cta { margin: 14px 18px; padding: 14px; border-radius: 14px; background: linear-gradient(135deg, var(--hvc-orange), var(--hvc-orange-2)); color: #fff !important; text-align: center; text-decoration: none; font-weight: 700; font-size: 15px; display: block; }

/* Responsive */
@media (max-width: 1100px) { #hvc-shared-nav .hvc-menu { display: none; } #hvc-shared-nav .hvc-hamburger { display: inline-grid; } #hvc-shared-nav .hvc-cta-quote span { display: none; } #hvc-shared-nav .hvc-cta-quote { padding: 9px 12px; } }
@media (max-width: 640px) { #hvc-shared-nav .hvc-top-inner { padding: 10px 16px; gap: 10px; } #hvc-shared-nav .hvc-logo-word { font-size: 18px; } #hvc-shared-nav .hvc-logo-mark { width: 30px; height: 30px; } #hvc-shared-nav .hvc-icon-btn { width: 36px; height: 36px; } }