/* PGBV-MEGAMENU-20261006 — hoofdmenu met uitklappanelen voor pgbvacature.nl (huisstijl blauw/teal).
   Zelfde opbouw en JS (pgb-megamenu.js) als pgbthuis.nl. Desktop ≥861px: paneel onder de knop.
   Mobiel: het menu staat als rij onder het logo (zoals voorheen); een paneel klapt over de volle breedte uit. */
header.top .nav{position:relative}
#hoofdmenu.mm{display:flex;align-items:center;gap:4px}
#hoofdmenu.mm .mm-item{position:relative}
#hoofdmenu.mm .mm-top{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:6px;cursor:pointer;font:inherit;font-weight:600;color:var(--ink,#15293a);padding:9px 10px;border-radius:10px;white-space:nowrap}
#hoofdmenu.mm .mm-top:hover{background:#eaf2f8}
#hoofdmenu.mm .mm-top svg{width:14px;height:14px;transition:transform .18s ease;flex:none}
#hoofdmenu.mm .mm-item.open>.mm-top svg{transform:rotate(180deg)}
#hoofdmenu.mm .mm-top:focus-visible,#hoofdmenu.mm a:focus-visible{outline:3px solid var(--teal,#2a9d8f);outline-offset:3px}
#hoofdmenu.mm .mm-item.actief>.mm-top{color:var(--blue,#15577d);text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
#hoofdmenu.mm .mm-login{padding:9px 10px;font-weight:600}
#hoofdmenu.mm .mm-paneel{display:none;position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);width:320px;z-index:80;filter:drop-shadow(0 22px 40px rgba(14,58,85,.2))}
#hoofdmenu.mm .mm-paneel::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
#hoofdmenu.mm .mm-item.open>.mm-paneel{display:block}
@media (hover:hover) and (min-width:861px){#hoofdmenu.mm .mm-item:hover>.mm-paneel{display:block}#hoofdmenu.mm .mm-item:hover>.mm-top svg{transform:rotate(180deg)}}
#hoofdmenu.mm .mm-kaart{background:linear-gradient(180deg,color-mix(in srgb,var(--mm-kleur) 7%,#fff),#fff 60%);border:1px solid var(--line,#e1eaf2);border-radius:18px;padding:20px 20px 12px}
#hoofdmenu.mm .mm-kop{display:flex;align-items:center;gap:12px;margin-bottom:6px}
#hoofdmenu.mm .mm-ic{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--mm-kleur)}
#hoofdmenu.mm .mm-ic svg{width:22px;height:22px}
#hoofdmenu.mm .mm-titel{font-weight:800;font-size:1.05rem;color:var(--ink,#15293a);margin:0}
#hoofdmenu.mm .mm-tekst{color:var(--muted,#5a6b80);font-size:.9rem;line-height:1.45;margin:0 0 10px}
#hoofdmenu.mm .mm-lijst{list-style:none;margin:0;padding:6px 0 0;border-top:1px solid var(--line,#e1eaf2)}
#hoofdmenu.mm .mm-lijst a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 2px;font-size:.95rem;font-weight:500;color:var(--ink,#15293a);text-decoration:none}
#hoofdmenu.mm .mm-lijst a::after{content:"›";font-size:1.15rem;line-height:1;color:var(--mm-kleur)}
#hoofdmenu.mm .mm-lijst a:hover,#hoofdmenu.mm .mm-lijst a[aria-current="page"]{color:var(--mm-kleur)}
#hoofdmenu.mm .mm-lijst a[aria-current="page"]{font-weight:700}
#hoofdmenu.mm .k-teal{--mm-kleur:#1f7a70} #hoofdmenu.mm .k-blauw{--mm-kleur:#15577d} #hoofdmenu.mm .k-groen{--mm-kleur:#3a7d44}
#hoofdmenu.mm .mm-item:last-of-type .mm-paneel{left:auto;right:0;transform:none}
@media (max-width:860px){
  /* header is hier position:static (pgbv.css), dan telt z-index niet en schuift de hero over het paneel */
  header.top{position:relative;z-index:60}
  .nav .mm-cta{padding:8px 14px!important;font-size:.9rem}
  #hoofdmenu.mm{order:3;flex-basis:100%;justify-content:center;flex-wrap:wrap;gap:2px;border-top:1px solid var(--line,#e1eaf2);padding-top:8px}
  #hoofdmenu.mm .mm-item{position:static}
  #hoofdmenu.mm .mm-top,#hoofdmenu.mm .mm-login{font-size:.92rem;padding:8px 8px}
  #hoofdmenu.mm .mm-paneel,#hoofdmenu.mm .mm-item:last-of-type .mm-paneel{left:0;right:0;width:auto;transform:none;top:100%}
}
@media (max-width:480px){ header.top .nav{flex-wrap:wrap;column-gap:10px} header.top .logo small{display:none} header.top .logo{min-width:0}
  .nav .mm-cta{padding:7px 12px!important;font-size:.85rem;white-space:nowrap;margin-left:auto} }
@media (max-width:420px){ #hoofdmenu.mm .mm-top,#hoofdmenu.mm .mm-login{font-size:.86rem;padding:8px 6px} }
@media (prefers-reduced-motion:reduce){#hoofdmenu.mm .mm-top svg{transition:none}}