/* sd-menu5.css — gegenereerd 21/10/2026 */
.sd-m5-lijst{list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px 30px;}
.sd-m5-lijst a{display: flex; align-items: baseline; gap: 12px;
  padding: 11px 6px; color: var(--sd-ink); text-decoration: none;
  font-family: var(--sd-serif); font-size: 21px; line-height: 1.2;
  border-bottom: 1px solid rgba(52,41,42, .08);
  transition: color .25s ease, padding-left .3s cubic-bezier(.4,0,.2,1);}
.sd-m5-lijst a:hover{color: var(--sd-olijf); padding-left: 12px;}
.sd-m5-lijst a span{font-family: var(--sd-sans); font-size: 8.5px; letter-spacing: .18em;
  color: var(--sd-goud); flex: 0 0 auto;}
@media (max-width: 620px){.sd-m5-groep .sd-m5-lijst{gap: 0;}.sd-m5-lijst a{font-size: 15px;
    line-height: 1.15;
    padding: 6px 2px;
    gap: 6px;
    border-bottom-color: rgba(52,41,42, .06);}}
@media (max-width: 620px) and (max-height: 720px){.sd-m5-lijst a{font-size: 14px; padding: 5px 2px;}}
.sd-m5-groep{min-width: 0;}
.sd-m5-groep .sd-m5-lijst{grid-template-columns: 1fr;
  gap: 2px;}
.sd-m5-groep .sd-m5-lijst a span{display: none;}
.sd-paneel--compact .sd-m5-groep{min-width: 0;
  margin: 0;
  padding: 0 0 0 10px;
  border-left: 2px solid transparent;
  border-bottom: 1px solid rgba(52, 41, 42, 0.08);}
.sd-paneel--compact .sd-m5-groep:last-of-type{border-bottom: none;}
.sd-paneel--compact .sd-m5-groep[open]{border-left-color: var(--sd-olijf);
  padding-bottom: 6px;
  margin-bottom: 2px;}
.sd-paneel--compact .sd-m5-groep[open] > .sd-paneel-groep-titel{color: var(--sd-olijf);
  padding-bottom: 6px;}
.sd-paneel--compact .sd-m5-groep[open] > .sd-paneel-groep-titel::after{transform: rotate(225deg);
  opacity: 0.8;
  margin-top: 3px;}
.sd-paneel--compact .sd-m5-groep .sd-m5-lijst{display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0 0 4px;}
.sd-paneel--compact .sd-m5-groep--cols .sd-m5-lijst{grid-template-columns: 1fr 1fr;
  gap: 0 10px;}
.sd-paneel--compact .sd-m5-lijst a{display: block;
  padding: 5px 6px;
  margin: 0 -2px;
  border-radius: 6px;
  border-bottom: none;
  color: var(--sd-ink);
  text-decoration: none;
  font-family: var(--sd-sans);
  font-size: 14px;
  font-weight: 400; 
  line-height: 1.25;
  letter-spacing: 0.01em;
  transition: background 0.15s ease, color 0.15s ease;}
.sd-paneel--compact .sd-m5-lijst a:hover,.sd-paneel--compact .sd-m5-lijst a:focus-visible{color: var(--sd-olijf);
  background: rgba(12, 13, 10, 0.07);
  padding-left: 6px; 
  outline: none;}
.sd-paneel--compact .sd-m5-lijst a span{display: none;}
@media (max-width: 620px){.sd-paneel--compact .sd-m5-groep{padding-left: 8px;}.sd-paneel--compact .sd-m5-lijst a{font-size: 13.5px;
    padding: 4px 5px;}.sd-paneel--compact .sd-m5-groep--cols .sd-m5-lijst{gap: 0 8px;}}
@media (max-width: 340px){.sd-paneel--compact .sd-m5-groep--cols .sd-m5-lijst{grid-template-columns: 1fr;}}
@media (max-width: 620px) and (max-height: 720px){.sd-paneel--compact .sd-m5-lijst a{font-size: 13px; padding: 3.5px 4px;}}
.sd-paneel--compact .sd-m5-groep{border-left-color: transparent;
  border-bottom: 1px solid rgba(52, 41, 42, 0.08);
  padding-bottom: 0;
  margin-bottom: 0;}
.sd-paneel--compact .sd-m5-groep:last-of-type{border-bottom: none;}
.sd-paneel--compact .sd-m5-groep > .sd-m5-lijst{display: grid;}
.sd-paneel--compact .sd-m5-groep > .sd-m5-lijst,.sd-paneel--compact .sd-m5-groep[open] > .sd-m5-lijst{padding-bottom: 6px;}
.sd-paneel--compact .sd-m5-groep,.sd-paneel .sd-m5-groep{border-bottom-color: rgba(255, 255, 255, 0.14) !important;
  border-left-color: transparent !important;}
.sd-paneel--compact .sd-m5-lijst a:hover,.sd-paneel--compact .sd-m5-lijst a:focus-visible,.sd-paneel .sd-m5-lijst a:hover{color: #fff !important;
  background: rgba(255, 255, 255, 0.10) !important;}
/* ===== sd-menu5 (21/10/2026, Stefan D): menu in 5 groepen =====
   Paneel: <details class="sd-m5-groep"> (bewust NIET .sd-paneel-groep, zodat header.js ze niet platmaakt).
   Bovenstaande regels zijn een 1-op-1 kopie van header.css + sd-ui3.css met .sd-paneel-groep/.sd-paneel-lijst
   hernoemd naar .sd-m5-groep/.sd-m5-lijst; hieronder enkel het uitklapgedrag en de desktop-dropdowns. */
.sd-paneel--compact .sd-m5-groep > .sd-paneel-groep-titel{list-style:none}
.sd-paneel--compact .sd-m5-groep > .sd-paneel-groep-titel::-webkit-details-marker{display:none}
@media (max-width:740px){
  .sd-paneel--compact .sd-m5-groep > .sd-paneel-groep-titel{pointer-events:auto;cursor:pointer;padding-bottom:9px}
  .sd-paneel--compact .sd-m5-groep > .sd-paneel-groep-titel::after{display:block;content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);opacity:.55;transition:transform .22s ease;flex:0 0 auto;margin-right:4px}
  .sd-paneel--compact .sd-m5-groep[open] > .sd-paneel-groep-titel::after{transform:rotate(225deg);margin-top:3px;opacity:.8}
}
/* desktop: dropdowns in de kapselbalk */
.sd-nav .sd-m5-dd{position:relative;flex:0 0 auto}
.sd-nav .sd-m5-knop{font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;background:none;border:0;padding:5px 0;margin:0;cursor:pointer;opacity:.84;position:relative;white-space:nowrap;transition:opacity .25s ease}
.sd-nav .sd-m5-knop::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--sd-goud);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.65,.05,.35,1)}
.sd-nav .sd-m5-knop:hover,.sd-nav .sd-m5-knop:focus-visible,.sd-nav .sd-m5-knop[aria-expanded="true"],.sd-nav .sd-m5-dd.sd-m5-hier .sd-m5-knop{opacity:1}
.sd-nav .sd-m5-knop:hover::after,.sd-nav .sd-m5-knop:focus-visible::after,.sd-nav .sd-m5-knop[aria-expanded="true"]::after,.sd-nav .sd-m5-dd.sd-m5-hier .sd-m5-knop::after{transform:scaleX(1)}
.sd-nav .sd-m5-menu{position:absolute;top:calc(100% + 14px);left:-18px;min-width:210px;display:flex;flex-direction:column;padding:10px;border-radius:22px;background:rgba(18,16,14,.58);border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 28px 60px -24px rgba(0,0,0,.65);-webkit-backdrop-filter:blur(22px) saturate(1.45);backdrop-filter:blur(22px) saturate(1.45);color:#fff;z-index:5;text-transform:none;letter-spacing:.01em}
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)){.sd-nav .sd-m5-menu{background:rgba(18,16,14,.46)}}
.sd-nav .sd-m5-menu[hidden]{display:none}
.sd-nav .sd-m5-menu::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.sd-nav .sd-m5-menu a{display:block;padding:7px 10px;border-radius:8px;font-family:var(--sd-sans);font-size:14px;line-height:1.25;letter-spacing:.01em;text-transform:none;color:#fff;opacity:1;white-space:nowrap}
.sd-nav .sd-m5-menu a::after{display:none}
.sd-nav .sd-m5-menu a:hover,.sd-nav .sd-m5-menu a:focus-visible,.sd-nav .sd-m5-menu a[aria-current="page"]{background:rgba(255,255,255,.10);outline:none}
.sd-nav .sd-m5-dd:last-child .sd-m5-menu{left:auto;right:-18px}
/* gsm (21/10/2026): zelfde volgorde als de desktop-dropdowns: één kolom, van boven naar onder */
@media (max-width:740px){
  .sd-paneel--compact .sd-m5-groep--cols .sd-m5-lijst{grid-template-columns:1fr;gap:0}
}
