/* W9 — één navigatie voor alle pagina's (NL + EN). Eigen klassen (dn-) zodat
   geen van de drie bestaande stijlbladen (website2, publication-v4, living-case)
   erop ingrijpt. Wordt door tools/navigatie.mjs op elke pagina geladen. */
.dn-header,.dn-footer{--dn-ink:#101716;--dn-paper:#faf9f6;--dn-line:#dce3dd;--dn-blue:#00a4df;--dn-blue-dark:#006f98;--dn-muted:#556b60;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.45;color:var(--dn-ink);box-sizing:border-box}
.dn-header *,.dn-footer *{box-sizing:inherit}
.dn-wrap{width:min(1240px,calc(100% - 96px));margin:auto}
@media(max-width:1000px){.dn-wrap{width:calc(100% - 48px)}}
@media(max-width:600px){.dn-wrap{width:calc(100% - 36px)}}

.dn-header{position:sticky;top:0;z-index:40;background:var(--dn-paper);border-bottom:1px solid var(--dn-line)}
.dn-bar{display:flex;align-items:center;gap:28px;min-height:74px}
.dn-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--dn-blue);font-size:1.45rem;letter-spacing:.025em;font-weight:400}
.dn-brand img{width:40px;height:40px;object-fit:contain;border-radius:2px}
.dn-links{display:flex;align-items:center;gap:24px;margin-left:auto;font-size:.9rem}
.dn-links a{color:var(--dn-ink);text-decoration:none;padding:6px 0;border-bottom:2px solid transparent}
.dn-links a:hover,.dn-links a:focus-visible{border-bottom-color:var(--dn-blue)}
.dn-links a[aria-current=page]{border-bottom-color:var(--dn-ink);font-weight:700}
.dn-cta{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;background:var(--dn-ink);color:#fff!important;border:1px solid var(--dn-ink);border-radius:0;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.dn-cta:hover,.dn-cta:focus-visible{background:var(--dn-blue-dark);border-color:var(--dn-blue-dark);border-bottom-color:var(--dn-blue-dark)!important}
.dn-lang{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:30px;border:1px solid #aeb3b4;border-radius:99px;color:#4f585c;text-decoration:none;font-size:.72rem;font-weight:700;letter-spacing:.08em}
.dn-lang:hover,.dn-lang:focus-visible{border-color:var(--dn-blue);color:var(--dn-blue-dark)}
.dn-menu{display:none;margin-left:auto;font:inherit;font-size:.9rem;padding:8px 12px;min-height:44px;background:none;border:1px solid var(--dn-line);color:var(--dn-ink);cursor:pointer}
@media(max-width:900px){
 .dn-bar{gap:12px;min-height:64px}
 .dn-menu{display:inline-flex}
 .dn-links{position:absolute;left:0;right:0;top:100%;display:none;flex-direction:column;align-items:stretch;gap:0;margin:0;background:var(--dn-paper);border-bottom:1px solid var(--dn-line);padding:8px 24px 16px}
 .dn-links.is-open{display:flex}
 .dn-links a{padding:12px 0;border-bottom:1px solid var(--dn-line)}
 .dn-links a[aria-current=page]{border-bottom-color:var(--dn-line)}
 .dn-links .dn-cta{margin-top:12px;justify-content:center;border-bottom:1px solid var(--dn-ink)}
 .dn-header{position:relative}
}

.dn-footer{margin-top:60px;border-top:1px solid var(--dn-line);background:var(--dn-paper);padding:40px 0 28px}
.dn-footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px}
.dn-footer-grid>div>strong{display:block;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dn-muted);margin-bottom:12px}
.dn-footer-grid>div>a{display:block;color:var(--dn-ink);text-decoration:none;font-size:.9rem;padding:4px 0}
.dn-footer-grid>div>a:hover,.dn-footer-grid>div>a:focus-visible{text-decoration:underline;text-underline-offset:4px}
.dn-footer-grid>div>a[aria-current=page]{font-weight:700}
.dn-tagline{margin:14px 0 6px;font-size:.95rem;color:var(--dn-muted)}
.dn-privacy{font:inherit;font-size:.875rem;border:0;background:none;padding:6px 0;color:var(--dn-ink);text-decoration:underline;text-underline-offset:4px;cursor:pointer;text-align:left}
.dn-meta{margin-top:32px;padding-top:16px;border-top:1px solid var(--dn-line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;font-size:.78rem;color:var(--dn-muted)}
.dn-meta a{color:inherit}
@media(max-width:900px){.dn-footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.dn-footer-grid{grid-template-columns:1fr}.dn-footer{margin-top:40px;padding-top:32px}}

/* NL-header met lockup (homepage v2): lockup op een donker vlak. */
.dn-brand.dn-lockup{background:#151719;padding:9px 18px;border-radius:8px;flex:none}
.dn-brand.dn-lockup img{display:block;height:32px;width:auto}
/* Footer (NL): hetzelfde logo op dezelfde donkere tegel als de header (ontwerp · Footer). */
.dn-footer-grid>div>a.dn-brand.dn-lockup{display:inline-flex;padding:9px 18px}
@media(max-width:600px){.dn-brand.dn-lockup{padding:7px 12px}.dn-brand.dn-lockup img{height:26px}}
@media(max-width:600px){.dn-footer-grid>div>a.dn-brand.dn-lockup{padding:7px 12px}}
