/* GEGENEREERD door tools/sync_layout.py uit tools/ds_layout.py — niet handmatig wijzigen */
:root{
  --bg:#f3f0e8;--bg-2:#e9e4d6;--surface:#fff;--surface-2:#f1eee5;
  --ink:#111;--muted:#4a4a4a;--line:#111;
  --lime:#c6f432;--violet:#a78bfa;--coral:#ffb4a2;--sky:#9fd8ff;
  --pos:#0f8a3c;--neg:#d92d20;--link:#5b21b6;
  --font-head:'Space Grotesk',system-ui,sans-serif;--font-body:'Space Grotesk',system-ui,sans-serif;--font-mono:'Space Mono',ui-monospace,monospace;
  --shadow:6px 6px 0 var(--ink);--shadow-sm:4px 4px 0 var(--ink);
  --header-h:72px;--maxw:1200px;--ease:cubic-bezier(.22,1,.36,1);
}
html.nav-open{overflow:hidden}
.skip-link{position:absolute;left:-999px;top:8px;z-index:3000;padding:.5rem 1rem;background:var(--lime);color:var(--ink);border:3px solid var(--ink);font:700 .9rem var(--font-body)}
.skip-link:focus{left:8px}
.main-anchor{display:block;height:0;outline:0}
.site-header{position:sticky;top:0;z-index:1000;height:var(--header-h);background:var(--bg);border-bottom:3px solid var(--ink);font-family:var(--font-body);color:var(--ink);transition:box-shadow .25s}
.site-header.scrolled{box-shadow:0 6px 0 rgba(17,17,17,.12)}
.site-header *,.mnav *,.site-footer *{box-sizing:border-box}
.hdr-inner{position:relative;height:100%;width:min(var(--maxw),100% - 2rem);margin-inline:auto;display:flex;align-items:center;gap:1.25rem}
.brand{display:inline-flex;align-items:center;gap:.6rem;font:700 1.35rem/1 var(--font-head);letter-spacing:-.04em;text-transform:uppercase;color:var(--ink);text-decoration:none;flex-shrink:0}
.brand-mark{width:22px;height:22px;background:var(--ink);box-shadow:3px 3px 0 var(--violet);flex-shrink:0}
.desk-nav{margin-left:auto}
.desk-list{display:flex;align-items:center;gap:.15rem;list-style:none;margin:0;padding:0}
.desk-item{position:static}
.desk-link,.desk-trigger{display:inline-flex;align-items:center;gap:.35rem;padding:.55rem .8rem;font:700 .84rem/1 var(--font-body);text-transform:uppercase;letter-spacing:.01em;color:var(--ink);background:none;border:2px solid transparent;cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s}
.desk-link:hover,.desk-trigger:hover,.desk-item.open>.desk-trigger{background:var(--lime);border-color:var(--ink)}
.desk-link.active,.desk-item.active>.desk-trigger{border-color:var(--ink);background:var(--surface)}
.desk-trigger svg{width:14px;height:14px;transition:transform .2s var(--ease)}
.desk-item.open>.desk-trigger svg{transform:rotate(180deg)}
.mega{position:absolute;top:calc(100% + 6px);left:50%;width:min(940px,calc(100vw - 2rem));transform:translate(-50%,8px);background:var(--surface);border:3px solid var(--ink);box-shadow:8px 8px 0 var(--ink);padding:1.4rem;display:grid;gap:1.5rem;grid-template-columns:repeat(3,minmax(0,1fr));opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s,transform .2s var(--ease),visibility .15s}
.mega.cols-2{grid-template-columns:1fr 1.4fr}
.mega.cols-3{grid-template-columns:1fr 1fr 1.6fr}
.mega.narrow{width:min(560px,calc(100vw - 2rem));grid-template-columns:1fr 1fr}
.desk-item.open>.mega{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.mega-col h5{font:700 .72rem/1.2 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);background:var(--violet);display:inline-block;padding:.2rem .5rem;margin:0 0 .7rem}
.mega-col a{display:flex;align-items:center;gap:.6rem;padding:.45rem .6rem;margin-inline:-.6rem;font:500 .93rem/1.3 var(--font-body);color:var(--ink);text-decoration:none;border:2px solid transparent}
.mega-col a:hover,.mega-col a:focus-visible{background:var(--lime);border-color:var(--ink)}
.mega-col a[aria-current]{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:4px}
.mega-col .tag,.acc-inner .tag{margin-left:auto;font:700 .62rem/1 var(--font-mono);letter-spacing:.04em;padding:.22rem .4rem;background:var(--ink);color:var(--lime)}
.mega-col.two-col .links{display:grid;grid-template-columns:1fr 1fr;column-gap:1.2rem}
.hdr-actions{display:flex;align-items:center;gap:.8rem;flex-shrink:0}
.lang{display:inline-flex;align-items:center;gap:.3rem;font:700 .82rem/1 var(--font-mono)}
.lang a{color:var(--muted);text-decoration:none;padding:.25rem .3rem;border:2px solid transparent}
.lang a:hover{color:var(--ink);border-color:var(--ink)}
.lang a.on{color:var(--ink);background:var(--lime);border-color:var(--ink)}
.lang .sep{opacity:.4}
.hdr-cta,.ft-cta{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.6rem 1rem;font:700 .82rem/1 var(--font-body);text-transform:uppercase;color:var(--ink);background:var(--lime);border:3px solid var(--ink);box-shadow:var(--shadow-sm);text-decoration:none;white-space:nowrap;transition:transform .15s,box-shadow .15s}
.hdr-cta:hover,.ft-cta:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.hdr-cta:active,.ft-cta:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}
.menu-btn{display:none;position:relative;width:46px;height:46px;border:3px solid var(--ink);background:var(--lime);box-shadow:3px 3px 0 var(--ink);cursor:pointer;padding:0}
.menu-btn span{position:absolute;left:10px;right:10px;height:3px;background:var(--ink);transition:transform .25s var(--ease),opacity .2s}
.menu-btn span:nth-child(1){top:12px}.menu-btn span:nth-child(2){top:19px}.menu-btn span:nth-child(3){top:26px}
html.nav-open .menu-btn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
html.nav-open .menu-btn span:nth-child(2){opacity:0}
html.nav-open .menu-btn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
/* Mobiel overlay-menu: altijd binnen 100dvh, scrollt intern */
.mnav{position:fixed;inset:0;z-index:1500;height:100vh;height:100dvh;display:flex;flex-direction:column;background:var(--lime);color:var(--ink);font-family:var(--font-body);visibility:hidden;opacity:0;transform:scale(1.02);transition:opacity .25s,transform .3s var(--ease),visibility .3s}
html.nav-open .mnav{visibility:visible;opacity:1;transform:none}
.mnav-head{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1.1rem;border-bottom:3px solid var(--ink);flex-shrink:0}
.mnav-close{width:46px;height:46px;display:grid;place-items:center;border:3px solid var(--ink);background:var(--surface);box-shadow:3px 3px 0 var(--ink);cursor:pointer;color:var(--ink);padding:0}
.mnav-close svg{width:20px;height:20px}
.mnav-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:.5rem 1.1rem 1.25rem}
.mnav-foot{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1.1rem calc(.9rem + env(safe-area-inset-bottom));border-top:3px solid var(--ink)}
.mnav .lang a{color:var(--ink)}
.mnav .lang a.on{background:var(--surface)}
.mnav .hdr-cta{background:var(--surface)}
.m-link,.acc-btn{width:100%;display:flex;align-items:center;justify-content:space-between;padding:.85rem .2rem;font:700 clamp(1.45rem,7vw,2rem)/1.05 var(--font-head);letter-spacing:-.04em;text-transform:uppercase;text-align:left;color:var(--ink);background:none;border:0;border-bottom:3px solid var(--ink);cursor:pointer;text-decoration:none}
.m-link.active,.acc.active>.acc-btn{text-decoration:underline;text-decoration-thickness:4px;text-underline-offset:6px}
.acc-btn svg{width:22px;height:22px;flex-shrink:0;transition:transform .25s var(--ease)}
.acc.open>.acc-btn svg{transform:rotate(180deg)}
.acc-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s var(--ease)}
.acc.open>.acc-panel{grid-template-rows:1fr}
.acc-inner{overflow:hidden}
.acc-inner .grp{font:700 .72rem/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;padding:1rem .2rem .45rem}
.acc-inner a{display:flex;align-items:center;gap:.5rem;padding:.55rem .6rem;font:600 1rem/1.3 var(--font-body);color:var(--ink);text-decoration:none;border:2px solid transparent}
.acc-inner a:hover,.acc-inner a:active{background:var(--surface);border-color:var(--ink)}
.acc-inner a[aria-current]{text-decoration:underline;text-decoration-thickness:3px}
.acc-inner .grid2{display:grid;grid-template-columns:1fr 1fr}
.acc-inner .grid2 a{font-size:.9rem}
.acc-inner>.list:last-child,.acc-inner>.grid2:last-child{padding-bottom:.9rem}
@media (max-width:1099px){
  .desk-nav,.hdr-actions .hdr-cta,.hdr-actions .lang{display:none}
  .hdr-actions{margin-left:auto}
  .menu-btn{display:block}
  :root{--header-h:64px}
}
@media (min-width:1100px){.mnav{display:none}}
@media (max-width:380px){.acc-inner .grid2{grid-template-columns:1fr}}
/* Footer */
.site-footer{background:var(--violet);border-top:3px solid var(--ink);color:var(--ink);font-family:var(--font-body);padding:3.5rem 0 2rem;margin-top:0}
.ft-wrap{width:min(var(--maxw),100% - 2.5rem);margin-inline:auto}
.ft-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:2rem}
.ft-brand p{margin:.9rem 0 1.2rem;max-width:340px;font-size:.95rem;line-height:1.55}
.site-footer h5{font:700 .75rem/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;margin:0 0 1rem;padding-bottom:.5rem;border-bottom:3px solid var(--ink)}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem;font-size:.93rem}
.site-footer ul a{color:var(--ink);text-decoration:none;font-weight:500}
.site-footer ul a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.ft-bottom{margin-top:2.5rem;padding-top:1.25rem;border-top:3px solid var(--ink);display:grid;gap:.6rem;font-size:.8rem;line-height:1.5}
@media (max-width:900px){.ft-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ft-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.site-header *,.mnav,.mnav *,.mega{transition:none!important}}