*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --blue:#1430ed;
  --black:#080808;
  --white:#f5f4ef;
  --pure:#fafaf8;
  --gray:#7a7972;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'DM Sans',system-ui,sans-serif;
  --hand:'Caveat',cursive;
}

/* KRITISCH: nooit overflow:hidden op html of body — breekt sticky */
html{ overflow-x:clip; } /* clip ipv hidden — breekt NIET sticky */
body{ font-family:var(--sans); background:var(--white); color:var(--black); overflow-x:clip; cursor:none; }

/* ─── CURSOR ─── */
#cur{position:fixed;width:8px;height:8px;background:var(--blue);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);mix-blend-mode:multiply;transition:width .2s,height .2s,background .3s,mix-blend-mode .3s;}
#cur-r{position:fixed;width:38px;height:38px;border:1px solid var(--blue);border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);opacity:.3;transition:width .35s,height .35s,border-color .3s;}
body.on-dark #cur{background:white;mix-blend-mode:normal;}
body.on-dark #cur-r{border-color:rgba(255,255,255,.4);}
body.hov #cur{width:5px;height:5px;}
body.hov #cur-r{width:64px;height:64px;opacity:.5;}

/* ─── NAV ─── */
nav{
  position:fixed;top:0;left:0;right:0;z-index:900;
  display:grid;grid-template-columns:1fr auto 1fr;
  align-items:center;padding:0 48px;height:64px;
  transition:background .5s,border-color .5s;
  border-bottom:.5px solid transparent;
}
nav.lit{background:rgba(245,244,239,.95);backdrop-filter:blur(20px);border-color:rgba(8,8,8,.08);}
nav.drk{background:rgba(8,8,8,.92);backdrop-filter:blur(20px);border-color:rgba(255,255,255,.06);}
.nl,.nr{display:flex;gap:28px;align-items:center;}.nr{justify-content:flex-end;}
.na{font-family:var(--sans);font-size:13px;color:rgba(255,255,255,.6);text-decoration:none;transition:color .2s;}
.na:hover{color:white;}
nav.lit .na{color:var(--gray);}nav.lit .na:hover{color:var(--black);}
nav.drk .na{color:rgba(255,255,255,.5);}nav.drk .na:hover{color:white;}
.nlogo{font-family:var(--serif);font-size:21px;font-weight:400;color:white;text-decoration:none;white-space:nowrap;transition:color .3s;}
nav.lit .nlogo{color:var(--black);}
.ncta{display:flex;align-items:center;gap:9px;font-family:var(--sans);font-size:13px;color:rgba(255,255,255,.55);text-decoration:none;transition:color .2s;}
.ncta:hover{color:white;}nav.lit .ncta{color:var(--gray);}nav.lit .ncta:hover{color:var(--black);}
.lamp{width:24px;height:24px;animation:lspin 10s linear infinite;flex-shrink:0;}
@keyframes lspin{to{transform:rotate(360deg);}}
.ls{stroke:rgba(255,255,255,.55);transition:stroke .3s;}.lf{fill:rgba(255,255,255,.55);transition:fill .3s;}
nav.lit .ls{stroke:var(--blue);}nav.lit .lf{fill:var(--blue);}