/* Koelkastwijzer 3.8.2 — contextnavigatie met niet-klikbare huidige locatie en rustigere actieve typografie. */
.wg-header{position:relative;z-index:1001;width:100%;background:#fff;border-bottom:1px solid var(--kw-border)}
.kw-ios-top-tint-guard{display:none}
.wg-header__main{background:#fff}
.wg-header__container{width:min(var(--wg-container-width),calc(100% - (2 * var(--wg-page-gutter))));margin-inline:auto;display:flex;align-items:center;justify-content:space-between;min-height:70px}
.wg-header__brand{display:inline-flex;align-items:center;gap:10px;color:var(--kw-navy);text-decoration:none;flex:0 0 auto}
.wg-header__brand:hover{color:var(--kw-navy)}
.wg-header__brand-mark{display:grid;place-items:center;width:34px;height:34px;color:var(--kw-blue)}
.wg-header__brand-mark svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.wg-header__brand-mark circle{fill:var(--kw-cyan);stroke:none}
.wg-header__brand-name{font-size:20px;font-weight:800;line-height:1;letter-spacing:-.038em;white-space:nowrap}
.wg-header__brand-name span{color:var(--kw-blue)}

.wg-header__navigation{display:flex;align-items:center;gap:30px;margin-left:38px}
.wg-header__navigation>a{position:relative;display:inline-flex;align-items:center;min-height:44px;color:var(--kw-ink);font-size:14.5px;font-weight:700;line-height:1.2;text-decoration:none;white-space:nowrap}
.wg-header__navigation>a:not(.wg-header__button)::after{content:"";position:absolute;right:0;bottom:3px;left:0;height:2px;background:var(--kw-blue);transform:scaleX(0);transform-origin:center;transition:transform var(--wg-transition)}
.wg-header__navigation>a:hover,.wg-header__navigation>a:focus-visible{color:var(--kw-blue)}
.wg-header__navigation>a:hover::after,.wg-header__navigation>a:focus-visible::after{transform:scaleX(1)}
.wg-header__navigation .wg-header__button{min-height:42px;padding:0 18px;color:#fff;background:var(--kw-blue);border:1px solid var(--kw-blue);border-radius:6px;font-size:14.5px;font-weight:750}
.wg-header__navigation .wg-header__button:hover,.wg-header__navigation .wg-header__button:focus-visible{color:#fff;background:var(--kw-blue-hover);border-color:var(--kw-blue-hover)}

.wg-header__subnav{position:sticky;top:0;z-index:1000;background:var(--kw-navy);color:#fff;box-shadow:0 2px 8px rgba(8,43,76,.12)}
.admin-bar .wg-header__subnav{top:32px}
.wg-header__subnav-inner{display:flex;align-items:stretch;width:min(var(--wg-container-width),calc(100% - (2 * var(--wg-page-gutter))));min-height:48px;margin-inline:auto;overflow-x:auto;scrollbar-width:none}
.wg-header__subnav-inner::-webkit-scrollbar{display:none}
.wg-header__subnav-topic{position:relative;display:flex;align-items:center;gap:9px;flex:0 0 auto;min-height:48px;padding:0 22px 0 0;margin-right:8px;color:#fff;border-right:1px solid rgba(255,255,255,.22);font-size:15.5px;font-weight:600;line-height:1.2;text-decoration:none;white-space:nowrap}
a.wg-header__subnav-topic:hover,a.wg-header__subnav-topic:focus-visible{color:#fff;background:rgba(255,255,255,.045)}
.wg-header__subnav-topic::after{content:"";position:absolute;right:22px;bottom:0;left:0;height:3px;background:#35c5cf;transform:scaleX(0);transform-origin:left}
.wg-header__subnav-topic.is-active::after{transform:scaleX(1)}
.wg-header__subnav-topic-icon{display:grid;place-items:center;width:21px;height:21px;color:#fff}
.wg-header__subnav-topic-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.wg-header__subnav-links{display:flex;align-items:stretch;flex:0 0 auto}
.wg-header__subnav-links a,.wg-header__subnav-current{position:relative;display:flex;align-items:center;min-height:48px;padding:0 15px;color:#fff;font-size:15px;font-weight:600;line-height:1.2;text-decoration:none;white-space:nowrap}
.wg-header__subnav-links a:hover,.wg-header__subnav-links a:focus-visible{color:#fff;background:rgba(255,255,255,.075)}
.wg-header__subnav-links a::after,.wg-header__subnav-current::after{content:"";position:absolute;right:15px;bottom:0;left:15px;height:3px;background:#35c5cf;transform:scaleX(0);transform-origin:center;transition:transform var(--wg-transition)}
.wg-header__subnav-current.is-active{font-weight:600;background:rgba(255,255,255,.055);cursor:default}
.wg-header__subnav-current.is-active::after{transform:scaleX(1)}
.wg-header__subnav-topic.is-active{font-weight:600;cursor:default}

/* De pagina zelf blijft licht; de iOS-guard hieronder bepaalt de viewportkleur tijdens scrollen. */
html,body{background:#fff}

.wg-header__mobile-actions{display:none;align-items:center;margin-left:auto}
.wg-header__mobile-choice-help{display:none}
.wg-header__toggle{display:none;width:44px;height:44px;padding:10px;border:0;background:transparent}
.wg-header__toggle span{display:block;width:23px;height:2px;margin:5px auto;background:var(--kw-navy);border-radius:2px;transition:transform var(--wg-transition),opacity var(--wg-transition)}

@media(max-width:1120px){
 .wg-header__navigation{gap:21px;margin-left:26px}
 .wg-header__navigation>a{font-size:14px}
 .wg-header__subnav-links a,.wg-header__subnav-current{padding-inline:12px;font-size:13.5px}
 .wg-header__subnav-links a::after,.wg-header__subnav-current::after{right:12px;left:12px}
}

@media(max-width:900px){
 .wg-header__container{width:calc(100% - (2 * var(--wg-page-gutter-mobile)));min-height:62px}
 .wg-header__brand-mark{width:31px;height:31px}.wg-header__brand-mark svg{width:30px;height:30px}.wg-header__brand-name{font-size:18px}
 .wg-header__mobile-actions{display:flex;gap:4px}.wg-header__mobile-choice-help{display:inline-flex;align-items:center;min-height:40px;padding:0 8px;color:var(--kw-blue);font-size:13.5px;font-weight:750;text-decoration:none}
 .wg-header__toggle{display:block}
 .wg-header__navigation{position:absolute;top:62px;right:0;left:0;display:none;flex-direction:column;align-items:stretch;gap:0;margin:0;padding:10px var(--wg-page-gutter-mobile) 18px;background:#fff;border-top:1px solid var(--kw-border);box-shadow:0 18px 28px rgba(7,31,75,.12)}
 .wg-header__navigation.is-open{display:flex}.wg-header__navigation>a{min-height:0;padding:14px 4px;font-size:15px}.wg-header__navigation>a::after{display:none}.wg-header__navigation .wg-header__button{margin-top:7px;min-height:44px}
 .wg-header__toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}.wg-header__toggle.is-open span:nth-child(2){opacity:0}.wg-header__toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
 /* De lokale navigatie blijft mobiel beschikbaar als horizontale, niet te hoge strip. */
 .wg-header__subnav-inner{width:100%;min-height:44px;padding-left:var(--wg-page-gutter-mobile)}
 .wg-header__subnav-topic{min-height:44px;padding-right:15px;margin-right:4px;font-size:13px}.wg-header__subnav-topic::after{right:15px}
 .wg-header__subnav-topic-icon{display:none}
 .wg-header__subnav-links a,.wg-header__subnav-current{min-height:44px;padding-inline:12px;font-size:13px}
}

@media(max-width:420px){
 .wg-header__brand-mark{display:none}.wg-header__brand-name{font-size:17px}.wg-header__mobile-choice-help{font-size:13px}
}
@media(max-width:782px){.admin-bar .wg-header__subnav{top:46px}}

/*
 * iOS Safari kan bij een sticky element dat de viewport-rand raakt de bovenste
 * browserzone dezelfde kleur geven. Daarom staat op iPhone een witte scheidingszone aan de viewport-rand; de blauwe contextbalk raakt
 * daardoor tijdens sticky scrollen niet meer direct de bovenste viewport-pixel.
 * De extra safe-area blijft eveneens wit wanneer een standalone/cover-layout
 * daadwerkelijk een inset rapporteert.
 */
@supports(-webkit-touch-callout:none){
 @media(max-width:900px){
  .kw-ios-top-tint-guard{display:block;position:fixed;top:0;right:0;left:0;z-index:2147483000;height:calc(env(safe-area-inset-top,0px) + 12px);background:#fff;pointer-events:none;transform:translateZ(0)}
  .wg-header__main{padding-top:env(safe-area-inset-top,0px);background:#fff}
  .wg-header__subnav{top:calc(env(safe-area-inset-top,0px) + 12px);box-shadow:0 2px 8px rgba(8,43,76,.10)}
  .admin-bar .wg-header__subnav{top:calc(46px + env(safe-area-inset-top,0px) + 12px)}
 }
}
