/* Gegenereerd door kennisbank/_build/build.py uit _gedeeld/mobielmenu.css
   plus de kennisbank-eigen grensregels in build.py. Niet met de hand bewerken. */
.nvmenu{
    position:fixed; inset:0; z-index:200;
    visibility:hidden; pointer-events:none;
    transition:visibility 0s linear 260ms;
    --d:1200px; --tx0:150px; --ty0:-350px; --tx1:-16px; --ty1:-84px;
    --sc0:0.04; --naad-w:0.022;
    --nvink:#0E1426; --nvpaper:#F5F3EF; --nvgrijs:#AEB4C2; --nvgrijsdiep:#8A93A6;
    --nvlijn:#232B40; --nvlijnop:#3A4560; --nvaccent:#FF5A1F; --nvaccentlicht:#FF8C5A;
    font-family:'Hanken Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  }
  .nvmenu.open{ visibility:visible; pointer-events:auto; transition-delay:0s; }
  .nvscrim{
    position:absolute; inset:0; background:rgba(9,13,27,0.88);
    opacity:0; transition:opacity 190ms linear;
  }
  .nvmenu.open .nvscrim{ opacity:1; transition-duration:210ms; }
  .nvveld{
    position:absolute; left:50%; top:50%;
    width:var(--d); height:var(--d);
    margin-left:calc(var(--d) / -2); margin-top:calc(var(--d) / -2);
    border-radius:50%;
    background:radial-gradient(circle at 50% 44%, #18203A 0%, #101731 72%, #0D142A 100%);
    transform:translate(var(--tx0), var(--ty0)) rotate(-150deg) scale(var(--sc0));
    transform-origin:50% 50%;
    opacity:0;
    transition:transform 250ms cubic-bezier(.66,0,.86,.34), opacity 80ms linear 170ms;
  }
  .nvmenu.open .nvveld{
    transform:translate(var(--tx1), var(--ty1)) rotate(-14deg) scale(1);
    opacity:1;
    transition:transform 320ms cubic-bezier(.34,.03,.25,1) 60ms, opacity 1ms linear;
  }
  .nvveld svg{
    position:absolute; inset:0; width:100%; height:100%;
    color:#F5F3EF;
    stroke-width:var(--naad-w);
    opacity:0; transition:opacity 160ms linear;
  }
  .nvmenu.open .nvveld svg{ opacity:.13; transition:opacity 300ms ease-out 180ms; }
  .nvgloed{
    position:absolute; inset:0;
    background:radial-gradient(120% 78% at 100% -8%, rgba(255,90,31,0.20) 0%, rgba(255,90,31,0.05) 42%, transparent 68%);
    opacity:0; transition:opacity 160ms linear;
  }
  .nvmenu.open .nvgloed{ opacity:1; transition:opacity 290ms ease-out 160ms; }
  .nvbal{
    position:absolute; left:50%; top:50%;
    width:46px; height:46px; margin:-23px 0 0 -23px;
    color:#FF5A1F;
    transform:translate(var(--tx0), var(--ty0)) rotate(-150deg) scale(.72);
    transform-origin:50% 50%;
    opacity:0;
    transition:transform 180ms cubic-bezier(.5,0,.75,.4), opacity 110ms linear;
  }
  .nvmenu.open .nvbal{
    transform:translate(var(--tx0), var(--ty0)) rotate(-46deg) scale(1.34);
    transition:transform 300ms cubic-bezier(.35,.08,.25,1);
    opacity:0;
    animation:nvbal-overgave 210ms linear forwards;
  }
  @keyframes nvbal-overgave{ 0%{opacity:1} 40%{opacity:1} 100%{opacity:0} }
  .nvbal svg{ display:block; width:100%; height:100%; }
  .nvmenu.open .nvveld, .nvmenu.open .nvbal{ will-change:transform; }
  .nvmenu.meten .nvveld, .nvmenu.meten .nvbal{ transition:none; }
  .nvinhoud{
    position:absolute; inset:0;
    display:flex; flex-direction:column;
    overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch;
  }
  .nvkop{
    flex-shrink:0; height:72px;
    display:flex; align-items:center; justify-content:space-between;
    padding:0 24px;
  }
  .nvmerk{ display:flex; align-items:center; gap:10px; }
  .nvmerk img{ width:30px; height:30px; display:block; }
  .nvmerk span{
    font-family:'Archivo',sans-serif; font-weight:700; font-size:21px;
    letter-spacing:-0.04em; color:#F5F3EF;
  }
  .nvsluit{
    width:44px; height:44px; flex-shrink:0;
    background:transparent; border:1px solid var(--nvlijnop); border-radius:12px;
    display:flex; align-items:center; justify-content:center;
    color:#F5F3EF; cursor:pointer; padding:0;
    opacity:0; transform:scale(.86);
    transition:opacity 90ms linear, transform 90ms ease-in, border-color 160ms, background-color 160ms;
  }
  .nvmenu.open .nvsluit{
    opacity:1; transform:none;
    transition:opacity 180ms ease-out 200ms, transform 180ms cubic-bezier(.2,.8,.3,1) 200ms,
               border-color 160ms, background-color 160ms;
  }
  .nvsluit:hover{ border-color:#F5F3EF; background:rgba(255,255,255,0.05); }
  .nvmenu.toets .nvsluit{ opacity:1; transform:none; transition:none; }
  .nvsluit:focus-visible{ outline:2px solid var(--nvaccentlicht); outline-offset:3px; }
  .nvsluit svg{ display:block; width:19px; height:19px; }
  .nvbody{
    flex:1 0 auto; display:flex; flex-direction:column;
    width:100%; max-width:620px;
    padding:0 24px calc(clamp(18px, 3.1vh, 28px) + env(safe-area-inset-bottom, 0px));
    padding:0 24px calc(clamp(18px, 3.1svh, 28px) + env(safe-area-inset-bottom, 0px));
  }
  .nvoog{
    font-family:'JetBrains Mono', ui-monospace, monospace;
    font-size:10.5px; font-weight:500; letter-spacing:0.2em; text-transform:uppercase;
    color:var(--nvgrijsdiep); margin:0;
    display:flex; align-items:center; gap:12px;
  }
  .nvoog::after{ content:''; flex:1; height:1px; background:var(--nvlijnop); opacity:.6; }
  .nvtalen{
    padding:clamp(8px, 1.6vh, 18px) 0 clamp(14px, 2.4vh, 24px);
    padding:clamp(8px, 1.6svh, 18px) 0 clamp(14px, 2.4svh, 24px);
    opacity:0; transform:translateY(10px);
    transition:opacity 90ms linear, transform 90ms ease-in;
  }
  .nvmenu.open .nvtalen{
    opacity:1; transform:none;
    transition:opacity 190ms ease-out 170ms, transform 190ms cubic-bezier(.2,.8,.3,1) 170ms;
  }
  .nvpillen{ display:flex; gap:6px; margin-top:12px; }
  .nvpillen a{
    flex:1 1 0; min-width:0;
    display:flex; align-items:center; justify-content:center;
    height:44px; border-radius:11px;
    border:1px solid var(--nvlijnop);
    color:var(--nvgrijs); text-decoration:none;
    font-family:'JetBrains Mono', ui-monospace, monospace;
    font-size:11.5px; font-weight:500; letter-spacing:0.1em; text-transform:uppercase;
    transition:color 150ms, border-color 150ms, background-color 150ms;
  }
  .nvpillen a:hover{ color:#F5F3EF; border-color:#F5F3EF; }
  .nvpillen a[aria-current]{
    border-color:var(--nvaccent); color:var(--nvaccentlicht);
    font-weight:600; background:rgba(255,90,31,0.10);
  }
  .nvpillen a[aria-current]:hover{
    border-color:var(--nvaccentlicht); color:var(--nvaccentlicht);
    background:rgba(255,90,31,0.16);
  }
  .nvnav{
    display:flex; flex-direction:column;
    padding-top:clamp(6px, 1.4vh, 14px);
    padding-top:clamp(6px, 1.4svh, 14px);
    border-top:1px solid rgba(58,69,96,0.45);
  }
  .nvnav a{
    display:block; text-decoration:none; color:#F5F3EF;
    font-family:'Archivo', sans-serif; font-weight:800;
    font-size:clamp(24px, calc(4.9vh - 5.4px), 36px);
    font-size:clamp(24px, calc(4.9svh - 5.4px), 36px);
    line-height:1.06; letter-spacing:-0.038em;
    padding:clamp(4px, calc(2.1vh - 8.4px), 11px) 0;
    padding:clamp(4px, calc(2.1svh - 8.4px), 11px) 0;
    min-height:44px; display:flex; align-items:center;
    opacity:0; transform:translateY(20px);
    transition:opacity 90ms linear, transform 90ms ease-in, color 160ms;
  }
  .nvmenu.open .nvnav a{
    opacity:1; transform:none;
    transition:opacity 175ms ease-out calc(205ms + var(--i) * 34ms),
               transform 175ms cubic-bezier(.2,.85,.3,1) calc(205ms + var(--i) * 34ms),
               color 160ms;
  }
  .nvnav a:hover{ color:var(--nvaccentlicht); }
  .nvnav a:focus-visible{ outline:none; }
  .nvnav a:focus-visible span{
    outline:2px solid var(--nvaccentlicht); outline-offset:5px; border-radius:4px;
  }
  .nvnav a[aria-current]::after{
    content:''; display:inline-block;
    width:8px; height:8px; border-radius:50%;
    background:var(--nvaccent); margin-left:13px; vertical-align:middle;
    transform:translateY(-2px);
  }
  .nvrek{ flex:1 1 0%; min-height:0; max-height:120px; }
  .nvonder{
    padding-top:clamp(18px, 3vh, 30px);
    padding-top:clamp(18px, 3svh, 30px);
    border-top:1px solid rgba(58,69,96,0.5);
    display:flex; flex-direction:column; gap:14px;
    opacity:0; transform:translateY(16px);
    transition:opacity 90ms linear, transform 90ms ease-in;
  }
  .nvmenu.open .nvonder{
    opacity:1; transform:none;
    transition:opacity 175ms ease-out 360ms, transform 175ms cubic-bezier(.2,.85,.3,1) 360ms;
  }
  .nvinloggen{
    align-self:flex-start; text-decoration:none; color:var(--nvgrijs);
    font-size:15.5px; font-weight:600; padding:6px 0;
    display:inline-flex; align-items:center; gap:9px; min-height:44px;
  }
  .nvinloggen:hover{ color:#F5F3EF; }
  .nvinloggen svg{ width:14px; height:14px; opacity:.7; }
  .nvcta{
    display:flex; align-items:center; justify-content:center;
    min-height:clamp(50px, 6.6vh, 56px); border-radius:15px;
    min-height:clamp(50px, 6.6svh, 56px); border-radius:15px;
    background:var(--nvaccent); color:var(--nvink); text-decoration:none;
    font-family:'Archivo', sans-serif; font-weight:700; font-size:16.5px; letter-spacing:-0.015em;
    box-shadow:0 10px 30px -14px rgba(255,90,31,0.9);
  }
  .nvcta:hover{ background:var(--nvaccentlicht); }
  @media (max-width:374px){
    .nvbody, .nvkop{ padding-left:18px; padding-right:18px; }
    .nvpillen{ gap:5px; }
    .nvpillen a{ font-size:11px; letter-spacing:0.06em; }
  }
  @media (min-width:412px){
    .nvnav a{ font-size:clamp(26px, calc(5.2vh - 5.6px), 39px); }
    .nvnav a{ font-size:clamp(26px, calc(5.2svh - 5.6px), 39px); }
  }
  @media (orientation:landscape) and (max-height:560px){
    .nvbody{
      max-width:none; display:grid;
      grid-template-columns:1fr minmax(240px, 300px);
      grid-template-rows:auto 1fr;
      grid-template-areas:'nav taal' 'nav onder';
      column-gap:clamp(24px, 5vw, 56px);
      align-content:start; padding-top:4px;
      padding-left:max(24px, env(safe-area-inset-left));
      padding-right:max(24px, env(safe-area-inset-right));
    }
    .nvtalen{ grid-area:taal; align-self:start; padding-top:0; }
    .nvnav{ grid-area:nav; border-top:0; padding-top:0; justify-content:center; }
    .nvnav a{ font-size:clamp(21px, calc(8.6vh - 5.4px), 32px); padding:clamp(2px, 1.1vh, 8px) 0; }
    .nvnav a{ font-size:clamp(21px, calc(8.6svh - 5.4px), 32px); padding:clamp(2px, 1.1svh, 8px) 0; }
    .nvrek{ display:none; }
    .nvonder{
      grid-area:onder; align-self:end; border-top:0;
      padding-top:clamp(12px, 3vh, 20px); margin-top:clamp(14px, 4vh, 26px);
      padding-top:clamp(12px, 3svh, 20px); margin-top:clamp(14px, 4svh, 26px);
    }
    .nvpillen a{ height:38px; }
    .nvcta{ min-height:46px; font-size:15.5px; }
  }
  @media (prefers-reduced-motion: reduce){
    .nvveld, .nvmenu.open .nvveld{
      transform:translate(var(--tx1), var(--ty1)) rotate(-14deg) scale(1);
      opacity:1; transition:none;
    }
    .nvveld svg{ opacity:.13; transition:none; }
    .nvbal, .nvmenu.open .nvbal{ display:none; animation:none; }
    .nvgloed, .nvscrim, .nvmenu.open .nvscrim{ opacity:1; transition:none; }
    .nvsluit, .nvtalen, .nvnav a, .nvonder,
    .nvmenu.open .nvsluit, .nvmenu.open .nvtalen, .nvmenu.open .nvnav a, .nvmenu.open .nvonder{
      opacity:1; transform:none; transition:none;
    }
  }
.nvhamburger{
    display:none;
    background:transparent; border:1px solid #232B40; border-radius:10px;
    width:44px; height:44px; flex-direction:column; align-items:center;
    justify-content:center; gap:5px; cursor:pointer; padding:0; flex-shrink:0;
  }
  .nvhamburger:hover{ border-color:#3A4560; }
  .nvhamburger:focus-visible{ outline:2px solid #FF8C5A; outline-offset:3px; }
  .nvhamburger span{ display:block; width:18px; height:2px; background:#F5F3EF; border-radius:1px; }
  @media (max-width: 1060px){
    .nvhamburger{ display:flex }
    .kb-nav .kb-cta, .kb-nav .kb-langsw, .kb-nav .kb-login, .kb-nav .kb-links{ display:none }
  }
  @media (min-width: 1061px){
    .nvmenu, .nvmenu.open{ visibility:hidden !important; pointer-events:none !important; }
  }