/* ════════════════════════════════════════════════════════════════════
   arcturus-advisory.nl · site.css
   Gegraveerde sterrenatlas × redactioneel raster. Perkament en inkt,
   met de nacht als omkering. Alle CSS staat hier (CSP: style-src 'self').
   ════════════════════════════════════════════════════════════════════ */

/* ── 1. Lettertypen · zelf gehost · SIL Open Font License 1.1 ─────────── */
/* Fraunces italic — latin-ext · SIL Open Font License 1.1 · self-hosted */
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/fonts/fraunces-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Fraunces italic — latin · SIL Open Font License 1.1 · self-hosted */
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/fonts/fraunces-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Fraunces normal — latin-ext · SIL Open Font License 1.1 · self-hosted */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/fonts/fraunces-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Fraunces normal — latin · SIL Open Font License 1.1 · self-hosted */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/fonts/fraunces-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Instrument Sans normal — latin-ext · SIL Open Font License 1.1 · self-hosted */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/instrument-sans-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Instrument Sans normal — latin · SIL Open Font License 1.1 · self-hosted */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/instrument-sans-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Martian Mono normal — latin-ext · SIL Open Font License 1.1 · self-hosted */
@font-face {
  font-family: 'Martian Mono';
  font-style: normal;
  font-weight: 300 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/martian-mono-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Martian Mono normal — latin · SIL Open Font License 1.1 · self-hosted */
@font-face {
  font-family: 'Martian Mono';
  font-style: normal;
  font-weight: 300 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/martian-mono-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── 2. Tokens ───────────────────────────────────────────────────────── */
:root{
  /* palet (merkplaat v2) */
  --perkament:#EFE9DE;
  --perkament-diep:#E4DACA;
  --inkt:#17130F;
  --inkt-zacht:#3A332B;
  --grafiet:#6E6455;      /* 4,8:1 op perkament: kleine tekst ok */
  --amber:#C0561C;        /* 3,8:1 op perkament: alleen ≥ 24px of beeld */
  --amber-diep:#A84A14;   /* 4,8:1 op perkament: kleine amber tekst, links */
  --ember:#E08A3C;        /* 6,8:1 op nacht */
  --nacht:#101620;
  --nacht-2:#1A2331;
  --patina:#4A6B5E;       /* 4,9:1 op perkament */
  --ijs:#EFE9DE;
  --ijs-dim:rgba(239,233,222,.74);   /* 8,5:1 op nacht */
  --ijs-zwak:rgba(239,233,222,.62);  /* 6,4:1 op nacht: labels */

  --lijn:rgba(23,19,15,.16);
  --lijn-zacht:rgba(23,19,15,.045);
  --lijn-nacht:rgba(239,233,222,.16);

  /* typografie */
  --f-disp:'Fraunces',Georgia,'Times New Roman',serif;
  --f-body:'Instrument Sans','Helvetica Neue',Arial,sans-serif;
  --f-mono:'Martian Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;

  /* maat */
  --gutter:clamp(16px,5vw,64px);
  --max:1280px;
  --rail:10.5rem;
  --sectie:clamp(64px,9vw,128px);

  color-scheme:light;
}

/* ── 3. Basis ────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--f-body);
  font-size:16px;
  line-height:1.62;
  color:var(--inkt);
  background-color:var(--perkament);
  /* plotpapier: nauwelijks zichtbaar, maar het vlak leeft */
  background-image:
    linear-gradient(var(--lijn-zacht) 1px,transparent 1px),
    linear-gradient(90deg,var(--lijn-zacht) 1px,transparent 1px);
  background-size:32px 32px;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-kerning:normal;
}
@media (min-width:900px){ body{font-size:17px;} }

h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0;}
ul,ol{padding:0;}
img,svg{display:block;max-width:100%;}
a{color:inherit;}
::selection{background:var(--amber-diep);color:var(--perkament);}

h1,h2,h3{
  font-family:var(--f-disp);
  font-weight:400;
  hyphens:auto;
  -webkit-hyphens:auto;
  overflow-wrap:break-word;
  text-wrap:balance;
}
h2,h3{hyphens:manual;-webkit-hyphens:manual;}
h2{
  font-variation-settings:'opsz' 110,'SOFT' 0,'WONK' 1;
  font-size:clamp(30px,4.4vw,52px);
  line-height:1.06;
  letter-spacing:-.018em;
  margin-bottom:.5em;
}
h3{
  font-variation-settings:'opsz' 40,'SOFT' 0,'WONK' 0;
  font-weight:500;
  font-size:21px;
  line-height:1.25;
  letter-spacing:-.005em;
}
p{max-width:64ch;text-wrap:pretty;}
strong,b{font-weight:600;}
em{font-style:italic;}

/* tekstlinks: inkt met amber onderstreping */
.tekst a,.dek a,.link{
  text-decoration:underline;
  text-decoration-color:var(--amber);
  text-decoration-thickness:1px;
  text-underline-offset:.22em;
  transition:color .15s ease,text-decoration-color .15s ease;
}
.tekst a:hover,.dek a:hover,.link:hover{color:var(--amber-diep);text-decoration-thickness:2px;}

:focus-visible{outline:2px solid var(--amber-diep);outline-offset:3px;border-radius:1px;}
.nacht :focus-visible{outline-color:var(--ember);}

.sr-only{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

.skip{
  position:absolute;left:var(--gutter);top:-200px;z-index:100;
  background:var(--inkt);color:var(--perkament);
  font-weight:600;padding:12px 16px;text-decoration:none;
}
.skip:focus{top:12px;}

/* ── 4. Typografische primitieven ───────────────────────────────────── */
.label{
  font-family:var(--f-mono);
  font-size:10.5px;
  font-weight:400;
  letter-spacing:.2em;
  line-height:1.8;
  text-transform:uppercase;
  color:var(--grafiet);
}
.nacht .label{color:var(--ijs-zwak);}
.dek{
  font-size:clamp(18px,1.55vw,21px);
  line-height:1.55;
  color:var(--inkt-zacht);
  max-width:56ch;
}
.klein{font-size:14.5px;color:var(--grafiet);line-height:1.6;}
.mono{font-family:var(--f-mono);}

.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);}

.ico{width:16px;height:16px;flex:0 0 auto;}

/* ── 5. Beeldmerk ────────────────────────────────────────────────────── */
.merk{width:34px;height:34px;color:currentColor;flex:0 0 auto;}
.merk__ster{fill:var(--merk-ster,var(--amber));}
.nacht{--merk-ster:var(--ember);}

/* ── 6. Kop en navigatie ─────────────────────────────────────────────── */
.kop{position:relative;z-index:5;}
.kop::after{
  /* meetlat: instrument, geen decoratie */
  content:'';position:absolute;left:0;right:0;bottom:0;height:7px;
  background:repeating-linear-gradient(90deg,var(--lijn) 0 1px,transparent 1px 34px);
  border-bottom:1px solid var(--lijn);
}
.kop__in{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:14px 28px;
  padding-block:20px 22px;
}
.merklink{
  display:inline-flex;align-items:center;gap:12px;
  text-decoration:none;color:inherit;
}
.merklink__tekst{display:flex;flex-direction:column;gap:6px;}
.merklink__wm{
  font-family:var(--f-disp);
  font-variation-settings:'opsz' 96,'SOFT' 12,'WONK' 1;
  font-weight:400;font-size:21px;line-height:1;
  letter-spacing:.16em;
}
.merklink__sub{
  font-family:var(--f-mono);font-size:8.5px;line-height:1;
  letter-spacing:.46em;text-transform:uppercase;color:var(--grafiet);
}
.hoofdnav ul{display:flex;flex-wrap:wrap;gap:4px 24px;list-style:none;}
.hoofdnav a{
  display:inline-block;position:relative;
  font-size:15px;font-weight:500;text-decoration:none;
  padding:6px 0;
}
.hoofdnav a::after{
  content:'';position:absolute;left:0;right:0;bottom:1px;height:1px;
  background:currentColor;transform:scaleX(0);transform-origin:left;
  transition:transform .2s ease;
}
.hoofdnav a:hover::after{transform:scaleX(1);}
.hoofdnav a[aria-current="page"]{color:var(--amber-diep);}
.hoofdnav a[aria-current="page"]::after{transform:scaleX(1);height:2px;background:var(--amber);}
.hoofdnav .taalwissel{font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;padding:5px 9px;border:1px solid var(--lijn);border-radius:3px;}
.hoofdnav .taalwissel::after{display:none;}
.hoofdnav .taalwissel:hover{border-color:currentColor;}
.top-nacht .hoofdnav .taalwissel{border-color:var(--lijn-nacht);}

/* donkere kop (home, 404): de nacht begint bovenaan */
.top-nacht .kop{background:var(--nacht);color:var(--ijs);--merk-ster:var(--ember);}
.top-nacht .kop::after{
  background:repeating-linear-gradient(90deg,var(--lijn-nacht) 0 1px,transparent 1px 34px);
  border-bottom-color:var(--lijn-nacht);
}
.top-nacht .merklink__sub{color:var(--ember);}
.top-nacht .hoofdnav a[aria-current="page"]{color:var(--ember);}
.top-nacht .hoofdnav a[aria-current="page"]::after{background:var(--ember);}
.top-nacht .kop :focus-visible{outline-color:var(--ember);}

/* ── 7. Knoppen en pijllinks ─────────────────────────────────────────── */
.knop{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--f-body);font-size:15.5px;font-weight:600;line-height:1.2;
  padding:15px 20px;border:1px solid currentColor;
  text-decoration:none;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease;
}
.knop--vol{background:var(--inkt);border-color:var(--inkt);color:var(--perkament);}
.knop--vol:hover{background:var(--amber-diep);border-color:var(--amber-diep);}
.knop--lijn{background:transparent;}
.knop--lijn:hover{background:var(--inkt);color:var(--perkament);border-color:var(--inkt);}
.nacht .knop--vol{background:var(--ember);border-color:var(--ember);color:var(--nacht);}
.nacht .knop--vol:hover{background:var(--ijs);border-color:var(--ijs);}
.nacht .knop--lijn{color:var(--ijs);border-color:var(--lijn-nacht);}
.nacht .knop--lijn:hover{background:var(--ijs);color:var(--nacht);border-color:var(--ijs);}

.pijllink{
  display:inline-flex;align-items:center;gap:10px;
  font-weight:600;text-decoration:none;
  border-bottom:1px solid var(--amber);padding-bottom:3px;
  transition:color .15s ease,gap .2s ease;
}
.pijllink:hover{color:var(--amber-diep);gap:14px;}
.nacht .pijllink{border-bottom-color:var(--ember);}
.nacht .pijllink:hover{color:var(--ember);}

/* vierpuntige ster als glyph */
.ster{
  display:inline-block;width:10px;height:10px;flex:0 0 auto;
  background:var(--amber);
  clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);
}
.nacht .ster{background:var(--ember);}

/* ── 8. Nachtplaten ──────────────────────────────────────────────────── */
.nacht{background-color:var(--nacht);color:var(--ijs);}
/* gegraveerde hoekmarkeringen */
.hoeken{
  --hk:rgba(239,233,222,.34);
  background-image:
    linear-gradient(var(--hk),var(--hk)),linear-gradient(var(--hk),var(--hk)),
    linear-gradient(var(--hk),var(--hk)),linear-gradient(var(--hk),var(--hk)),
    linear-gradient(var(--hk),var(--hk)),linear-gradient(var(--hk),var(--hk)),
    linear-gradient(var(--hk),var(--hk)),linear-gradient(var(--hk),var(--hk));
  background-size:16px 1px,1px 16px,16px 1px,1px 16px,16px 1px,1px 16px,16px 1px,1px 16px;
  background-position:
    left 14px top 14px,left 14px top 14px,
    right 14px top 14px,right 14px top 14px,
    left 14px bottom 14px,left 14px bottom 14px,
    right 14px bottom 14px,right 14px bottom 14px;
  background-repeat:no-repeat;
}

/* ── 9. Held (home) ──────────────────────────────────────────────────── */
.held{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:min(88vh,800px);
  display:flex;flex-direction:column;justify-content:flex-end;
}
.held__hemel{
  position:absolute;inset:0 0 0 auto;width:min(100%,1500px);height:100%;max-width:none;z-index:-2;
}
.held::before{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(16,22,32,.94) 0%,rgba(16,22,32,.78) 34%,rgba(16,22,32,0) 66%),
    linear-gradient(0deg,var(--nacht) 0%,rgba(16,22,32,0) 42%);
}
.held__in{padding-block:clamp(96px,16vh,180px) clamp(28px,4vw,44px);}
.held__label{margin-bottom:clamp(14px,2vw,22px);}
.held__titel{
  font-variation-settings:'opsz' 144,'SOFT' 12,'WONK' 1;
  font-size:clamp(60px,11.5vw,156px);
  line-height:.9;
  letter-spacing:-.03em;
  margin-left:-.04em;
}
.held__missie{
  font-family:var(--f-disp);
  font-variation-settings:'opsz' 72,'SOFT' 8,'WONK' 1;
  font-size:clamp(23px,2.7vw,36px);
  line-height:1.14;letter-spacing:-.012em;
  max-width:24ch;
  margin-top:clamp(14px,2vw,24px);
}
.held__missie em{color:var(--ember);}
.held__dek{
  color:var(--ijs-dim);
  font-size:clamp(16.5px,1.3vw,18.5px);
  line-height:1.6;max-width:54ch;
  margin-top:clamp(18px,2.4vw,28px);
}
.held__acties{display:flex;flex-wrap:wrap;gap:12px 16px;margin-top:clamp(24px,3vw,36px);}
.held__voet{
  list-style:none;
  display:flex;flex-wrap:wrap;gap:6px 0;
  margin-top:clamp(40px,6vw,72px);
  padding-top:16px;border-top:1px solid var(--lijn-nacht);
  font-family:var(--f-mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ijs-zwak);
}
.held__voet li{display:flex;align-items:center;}
.held__voet li + li::before{
  content:'';width:7px;height:7px;margin-inline:16px;background:var(--ember);opacity:.8;
  clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);
}

/* de hemel */
.hemel-raster{fill:none;stroke:rgba(239,233,222,.075);stroke-width:1;}
.hemel-ster{fill:var(--ijs);}
.hemel-ster.a{opacity:.55;} .hemel-ster.b{opacity:.36;} .hemel-ster.c{opacity:.22;}
.hemel-lijnen{stroke:rgba(239,233,222,.3);stroke-width:1.1;fill:none;}
.hemel-benoemd{fill:var(--ijs);}
.hemel-boog{fill:none;stroke:var(--ember);stroke-width:1.7;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;}
.hemel-vervolg{fill:none;stroke:rgba(224,138,60,.45);stroke-width:1.4;stroke-linecap:round;stroke-dasharray:3 7;}
.hemel-arcturus-ster{fill:#F2A85E;}
.hemel-arcturus-kern{fill:#FFD9A8;}
.held__hemel text,.dwaal__hemel text{font-family:var(--f-mono);letter-spacing:.22em;text-transform:uppercase;}
.hemel-label{fill:rgba(239,233,222,.5);font-size:12px;}
.hemel-label--ster{fill:var(--ember);font-size:13.5px;}
.hemel-label--klein{fill:rgba(239,233,222,.4);font-size:10px;letter-spacing:.14em;}
.hemel-boogwoord{fill:var(--ember);font-size:12px;opacity:.7;}

/* intro: alleen de hemel beweegt, kort. De eindtoestand is de basistoestand,
   dus zonder animatie (of met reduced motion) staat alles er gewoon. */
@keyframes trek{from{stroke-dashoffset:1;}}
@keyframes op{from{opacity:0;}}
@keyframes gloei{from{opacity:0;transform:scale(.55);}}
.held__hemel .hemel-lijnen{animation:op .9s ease .15s both;}
.held__hemel .hemel-boog{animation:trek 1.5s cubic-bezier(.4,0,.15,1) .35s both;}
.held__hemel .hemel-arcturus{transform-box:fill-box;transform-origin:center;animation:gloei 1s cubic-bezier(.2,.7,.3,1) 1.25s both;}
.held__hemel .hemel-vervolg{animation:op .8s ease 1.5s both;}
.held__hemel .hemel-tekst{animation:op .8s ease 1.6s both;}

/* Hemel als band boven de tekst: tot 1100px en op lage landschapsschermen
   (voorkomt dat sterlabels over de introtekst vallen). */
@media (max-width:1100px), (orientation:landscape) and (max-height:560px){
  .held{min-height:0;}
  .held__hemel{inset:0 0 auto 0;width:100%;height:max(400px,52vw);}
  .hemel-label--klein,.hemel-label--rand{display:none;}
  .held::before{
    background:linear-gradient(0deg,var(--nacht) 0%,var(--nacht) 46%,rgba(16,22,32,.35) 72%,rgba(16,22,32,.15) 100%);
  }
  .held__in{padding-top:calc(max(400px,52vw) - 90px);}
}
@media (max-width:860px){
  .held__voet{flex-direction:column;gap:6px;}
  .held__voet li + li::before{display:none;}
}
/* Korte telefoons: kleinere hemelband, zodat de kop eerder in beeld komt. */
@media (max-width:720px) and (max-height:700px){
  .held__hemel{height:300px;}
  .held__in{padding-top:236px;}
}

/* ── 10. Loopbaanband ────────────────────────────────────────────────── */
.loopbaan{border-bottom:1px solid var(--lijn);background:rgba(228,218,202,.45);}
.loopbaan__in{
  display:grid;grid-template-columns:var(--rail) minmax(0,1fr);
  gap:10px clamp(20px,4vw,56px);align-items:baseline;
  padding-block:22px 24px;
}
.loopbaan ul{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px;}
.loopbaan li{
  display:flex;align-items:center;
  font-family:var(--f-disp);font-variation-settings:'opsz' 36,'WONK' 0;
  font-size:clamp(17px,1.7vw,21px);line-height:1.3;color:var(--inkt);
}
.loopbaan li::before{
  content:'';width:8px;height:8px;margin-right:10px;background:var(--amber);
  clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);
}

/* ── 11. Platen (secties met kantlijn) ───────────────────────────────── */
.plaat{border-top:1px solid var(--lijn);padding-block:var(--sectie);}
.plaat--eerste{border-top:0;}
.plaat__grid{
  display:grid;grid-template-columns:var(--rail) minmax(0,1fr);
  gap:18px clamp(20px,4vw,56px);
}
.rail{
  position:sticky;top:28px;align-self:start;
  font-family:var(--f-mono);font-size:10.5px;letter-spacing:.22em;line-height:1.9;
  text-transform:uppercase;color:var(--grafiet);
}
.rail__nr{display:block;color:var(--amber-diep);}
.rail__streep{display:block;width:28px;height:1px;background:var(--amber);margin:12px 0;}
.plaat__kop{margin-bottom:clamp(28px,4vw,44px);}
.plaat__kop .dek{margin-top:4px;}
.plaat__slot{margin-top:clamp(28px,4vw,40px);}

/* ── 12. Paginakop (subpagina's) ─────────────────────────────────────── */
.paginakop{padding-block:clamp(56px,9vw,120px) clamp(40px,6vw,72px);border-bottom:1px solid var(--lijn);}
.paginakop__grid{
  display:grid;grid-template-columns:var(--rail) minmax(0,1fr);
  gap:18px clamp(20px,4vw,56px);
}
.paginakop h1{
  font-variation-settings:'opsz' 144,'SOFT' 8,'WONK' 1;
  font-size:clamp(40px,6.6vw,88px);
  line-height:1;letter-spacing:-.025em;
  max-width:18ch;
}
.paginakop .dek{margin-top:clamp(18px,2.4vw,28px);}
.paginakop__status{
  display:inline-flex;align-items:center;gap:10px;margin-top:22px;
  font-family:var(--f-mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--amber-diep);border:1px solid var(--amber);padding:7px 12px;
}

/* ── 13. Vakgebieden ─────────────────────────────────────────────────── */
.gebieden{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:2px solid var(--inkt);
}
.gebied{padding:24px 26px 30px 0;}
.gebied + .gebied{border-left:1px solid var(--lijn);padding-left:26px;}
.gebied__nr{
  font-family:var(--f-disp);font-variation-settings:'opsz' 144,'WONK' 1;
  font-size:44px;line-height:1;color:var(--amber);margin-bottom:16px;
}
.gebied h3{font-size:clamp(21px,1.9vw,24px);margin-bottom:14px;}
.gebied h3 a{text-decoration:none;}
.gebied h3 a:hover{color:var(--amber-diep);}
.gebied ul{list-style:none;display:grid;gap:9px;}
.gebied li{
  display:grid;grid-template-columns:12px minmax(0,1fr);gap:10px;
  font-size:15px;line-height:1.45;color:var(--inkt-zacht);
}
.gebied li::before{
  content:'';width:5px;height:5px;margin-top:8px;background:var(--amber);transform:rotate(45deg);
}

/* ── 14. Bevinding versus richting ───────────────────────────────────── */
.paar{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  border:1px solid var(--lijn);margin-top:clamp(30px,4vw,44px);
}
.paar__cel{padding:clamp(22px,3vw,32px);}
.paar__cel--niet{background:var(--perkament-diep);}
.paar__cel--wel{border-left:2px solid var(--amber);background:var(--perkament);}
.paar__tag{
  font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--inkt-zacht);margin-bottom:14px;
}
.paar__cel--wel .paar__tag{color:var(--amber-diep);}
.paar__zin{font-size:17px;line-height:1.5;color:var(--inkt-zacht);}
.paar__cel--wel .paar__zin{
  font-family:var(--f-disp);font-variation-settings:'opsz' 48,'WONK' 0;
  font-size:clamp(20px,2vw,25px);line-height:1.3;color:var(--inkt);letter-spacing:-.01em;
}

/* ── 15. Twee benen ──────────────────────────────────────────────────── */
.benen{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  border-top:2px solid var(--inkt);
}
.been{padding:26px 28px 30px 0;}
.been + .been{border-left:1px solid var(--lijn);padding-left:28px;padding-right:0;}
.been__tag{
  display:block;margin-bottom:12px;
  font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--amber-diep);
}
.been--bouwen .been__tag{color:var(--patina);}
.been h3{font-size:clamp(23px,2.2vw,28px);margin-bottom:8px;}
.been > p{color:var(--grafiet);font-size:15.5px;max-width:42ch;margin-bottom:22px;}
.feiten{list-style:none;display:grid;gap:12px;}
.feiten li{
  display:grid;grid-template-columns:13px minmax(0,1fr);gap:10px;
  font-size:15px;line-height:1.5;color:var(--inkt-zacht);
}
.feiten li::before{content:'';width:5px;height:5px;margin-top:8px;background:var(--amber);transform:rotate(45deg);}
.been--bouwen .feiten li::before{background:var(--patina);}
.feiten b{color:var(--inkt);}

.stelling{margin-top:clamp(32px,4vw,48px);border-left:2px solid var(--amber);padding:4px 0 4px 22px;}
.stelling p{
  font-family:var(--f-disp);font-variation-settings:'opsz' 96,'SOFT' 8,'WONK' 1;
  font-size:clamp(22px,3vw,34px);line-height:1.14;letter-spacing:-.018em;max-width:26ch;
}

/* ── 16. Specialisme ─────────────────────────────────────────────────── */
.spec{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  gap:clamp(24px,4vw,56px);align-items:start;
}
.kaartjes{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;}
.kaartjes li{
  font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid var(--lijn);background:var(--perkament);padding:7px 11px;color:var(--inkt);
}
.register{list-style:none;border-top:1px solid var(--inkt);}
.register li{
  display:grid;grid-template-columns:minmax(0,13rem) minmax(0,1fr);gap:6px 20px;
  padding:16px 0;border-bottom:1px solid var(--lijn);
}
.register__wie{
  min-width:0;hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;
  font-family:var(--f-disp);font-variation-settings:'opsz' 36,'WONK' 0;font-weight:500;
  font-size:18px;line-height:1.3;
}
.register__wat{min-width:0;overflow-wrap:break-word;font-size:15.5px;line-height:1.5;color:var(--inkt-zacht);}
.register__wat a{text-decoration-color:var(--amber);text-underline-offset:.2em;}

/* ── 17. Koers (werkwijze in het kort, home) ─────────────────────────── */
.koers{position:relative;margin-top:clamp(36px,5vw,56px);}
.koers__lijn{position:absolute;left:0;top:0;width:100%;height:72px;overflow:visible;}
.koers__lijn path{fill:none;vector-effect:non-scaling-stroke;}
.koers__boog{stroke:var(--amber);stroke-width:1.6;}
.koers__basis{stroke:var(--lijn);stroke-width:1;stroke-dasharray:3 5;}
.koers ol{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));}
.koers li{position:relative;padding:100px 12px 0;text-align:center;}
.koers__punt{position:absolute;left:50%;width:14px;height:14px;transform:translateX(-50%);}
/* punten op de boog (viewBox 0 0 100 72, x = 10/30/50/70/90) */
.koers li:nth-child(1) .koers__punt{top:55px;border:2px solid var(--inkt);border-radius:50%;background:radial-gradient(circle,var(--inkt) 0 2px,var(--perkament) 2.5px);}
.koers li:nth-child(2) .koers__punt{top:23px;}
.koers li:nth-child(3) .koers__punt{top:10px;}
.koers li:nth-child(4) .koers__punt{top:3.5px;}
.koers li:nth-child(2) .koers__punt,
.koers li:nth-child(3) .koers__punt,
.koers li:nth-child(4) .koers__punt{width:9px;height:9px;margin-top:2.5px;background:var(--perkament);border:1.5px solid var(--amber);transform:translateX(-50%) rotate(45deg);}
.koers li:nth-child(5) .koers__punt{
  top:-5px;width:26px;height:26px;background:var(--amber);
  clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);
}
.koers__nr{display:block;font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;color:var(--amber-diep);margin-bottom:4px;}
.koers h3{font-size:19px;margin-bottom:6px;}
.koers p{font-size:14.5px;line-height:1.5;color:var(--grafiet);margin-inline:auto;max-width:22ch;}

/* ── 18. Vragen, fasen, waarden, toon (werkwijze) ────────────────────── */
.vragen{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;background:var(--lijn);border:1px solid var(--lijn);
}
.vraag{background:var(--perkament);padding:clamp(22px,3vw,34px);}
.vraag__nr{
  display:block;font-family:var(--f-disp);font-variation-settings:'opsz' 144,'WONK' 1;
  font-size:40px;line-height:1;color:var(--amber);margin-bottom:14px;
}
.vraag h3{font-size:clamp(22px,2.2vw,27px);margin-bottom:10px;}
.vraag p{color:var(--inkt-zacht);font-size:16px;max-width:44ch;}

.fasen{list-style:none;}
.fase{
  position:relative;
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr) minmax(0,1.3fr);
  gap:10px clamp(20px,3vw,40px);
  padding:0 0 clamp(34px,4vw,48px) 52px;
}
.fase + .fase{padding-top:clamp(26px,3vw,36px);border-top:1px solid var(--lijn);}
/* koerslijn: per stap een segment van dit punt naar het volgende */
.fase::before{
  content:'';position:absolute;left:11px;width:1px;background:var(--amber);
  top:12px;bottom:calc(-1 * clamp(26px,3vw,36px) - 6px);
}
.fase + .fase::before{top:calc(clamp(26px,3vw,36px) + 12px);}
.fase:last-child::before{display:none;}
.fase__punt{z-index:1;}
.fase__punt{position:absolute;left:5px;top:6px;width:13px;height:13px;background:var(--perkament);border:1.5px solid var(--amber);transform:rotate(45deg);}
.fase + .fase .fase__punt{top:calc(clamp(26px,3vw,36px) + 6px);}
.fase:first-child .fase__punt{left:2px;top:3px;width:19px;height:19px;transform:none;border:2px solid var(--inkt);border-radius:50%;background:radial-gradient(circle,var(--inkt) 0 2.5px,var(--perkament) 3px);}
.fase:last-child .fase__punt{left:-1px;width:25px;height:25px;border:0;background:var(--amber);transform:none;margin-top:-4px;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);}
.fase__nr{font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--amber-diep);margin-bottom:6px;}
.fase h3{font-size:clamp(23px,2.3vw,30px);}
.fase__label{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--grafiet);margin-bottom:6px;}
.fase__deel p:not(.fase__label){font-size:15.5px;line-height:1.55;color:var(--inkt-zacht);}

.waarden{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;background:var(--lijn);border:1px solid var(--lijn);
}
.waarde{background:var(--perkament);padding:24px 22px 28px;}
.waarde__nr{display:block;font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;color:var(--amber-diep);margin-bottom:14px;}
.waarde h3{font-size:19px;margin-bottom:8px;}
.waarde p{font-size:15px;line-height:1.55;color:var(--inkt-zacht);}

.toon{border:1px solid var(--lijn);}
.toon__rij{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}
.toon__rij + .toon__rij{border-top:1px solid var(--lijn);}
.toon__cel{padding:22px clamp(18px,2.4vw,28px);}
.toon__cel--niet{background:var(--perkament-diep);}
.toon__cel--wel{border-left:1px solid var(--lijn);}
.toon__tag{display:block;font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:10px;color:var(--inkt-zacht);}
.toon__cel--wel .toon__tag{color:var(--amber-diep);}
.toon__cel--niet p{font-size:15.5px;color:var(--inkt-zacht);}
.toon__cel--wel p{font-family:var(--f-disp);font-variation-settings:'opsz' 36,'WONK' 0;font-size:18px;line-height:1.42;}

/* ── 19. Over: catalogusvermelding (in plaats van een foto) ──────────── */
.over__intro{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:start;}
.over__lead{
  margin-top:clamp(14px,2vw,22px);
  font-family:var(--f-disp);font-variation-settings:'opsz' 96,'SOFT' 8,'WONK' 1;
  font-size:clamp(23px,2.6vw,33px);line-height:1.2;letter-spacing:-.015em;max-width:26ch;
}
.over__intro .tekst{margin-top:22px;}
.catalogus{padding:clamp(26px,3.4vw,40px);position:relative;}
.catalogus__kop{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:18px;border-bottom:1px solid var(--lijn-nacht);}
.catalogus .merk{width:56px;height:56px;color:var(--ijs);}
.catalogus dl{display:grid;gap:0;}
.catalogus dl > div{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:4px 16px;padding:13px 0;border-bottom:1px solid var(--lijn-nacht);}
.catalogus dl > div:last-child{border-bottom:0;padding-bottom:0;}
.catalogus dt{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ember);padding-top:4px;}
.catalogus dd{font-size:15px;line-height:1.5;color:var(--ijs);}

.groep + .groep{margin-top:clamp(36px,5vw,56px);}
.groep h3{margin-bottom:14px;}
.groep__noot{margin-top:18px;font-size:15px;color:var(--grafiet);max-width:62ch;}

/* ── 20. Tekstpagina's, gegevens ─────────────────────────────────────── */
.tekst p + p,.tekst p + ul,.tekst ul + p{margin-top:1em;}
.tekst ul{list-style:none;display:grid;gap:8px;}
.tekst ul li{display:grid;grid-template-columns:13px minmax(0,1fr);gap:10px;max-width:62ch;}
.tekst ul li::before{content:'';width:5px;height:5px;margin-top:.62em;background:var(--amber);transform:rotate(45deg);}
.tekst h2{font-size:clamp(26px,3vw,36px);}
.tekst--smal{max-width:66ch;}

.gegevens{border-top:1px solid var(--inkt);max-width:52rem;}
.gegevens > div{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:4px 24px;padding:15px 0;border-bottom:1px solid var(--lijn);}
.gegevens dt{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--grafiet);padding-top:4px;}
.gegevens dd{font-size:16px;line-height:1.55;}
.hoofdletter::first-letter{text-transform:uppercase;}
.gegevens a{text-decoration-color:var(--amber);text-underline-offset:.2em;}
.gegevens a:hover{color:var(--amber-diep);}

.bijgewerkt{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--grafiet);margin-top:20px;}
.paginakop .alleen-en{margin-top:14px;max-width:62ch;}

/* ── 21. Contact ─────────────────────────────────────────────────────── */
.mailgroot{
  display:inline-block;
  font-family:var(--f-disp);font-variation-settings:'opsz' 96,'SOFT' 8,'WONK' 1;
  font-size:clamp(21px,4.6vw,58px);line-height:1.1;letter-spacing:-.015em;
  text-decoration:underline;text-decoration-color:var(--amber);
  text-decoration-thickness:2px;text-underline-offset:.16em;
  overflow-wrap:anywhere;
  transition:color .15s ease;
}
.mailgroot:hover{color:var(--amber-diep);}
.nacht .mailgroot{color:var(--ijs);text-decoration-color:var(--ember);}
.nacht .mailgroot:hover{color:var(--ember);}

/* ── 22. Oproep (contactband onderaan) ───────────────────────────────── */
.oproep{padding-block:clamp(64px,9vw,120px);border-bottom:1px solid var(--lijn-nacht);}
.oproep__in{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);gap:18px clamp(20px,4vw,56px);}
.oproep h2{
  font-variation-settings:'opsz' 144,'SOFT' 10,'WONK' 1;
  font-size:clamp(36px,5.6vw,72px);line-height:1;letter-spacing:-.022em;margin-bottom:18px;
}
.oproep p:not(.label){color:var(--ijs-dim);font-size:clamp(16.5px,1.3vw,18.5px);max-width:52ch;margin-bottom:26px;}

/* ── 23. Diensten ────────────────────────────────────────────────────── */
.dienst{border-top:1px solid var(--lijn);padding-block:clamp(40px,6vw,72px);scroll-margin-top:24px;}
.dienst:first-of-type{border-top:2px solid var(--inkt);}
.dienst__nr{display:block;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.2em;color:var(--amber-diep);margin-bottom:8px;}
.dienst h2{margin-bottom:0;}
.dienst__voor{
  margin-top:clamp(14px,1.8vw,20px);max-width:58ch;
  font-size:clamp(17px,1.4vw,19.5px);line-height:1.55;color:var(--inkt-zacht);
}
.aanbod{
  display:grid;grid-template-columns:minmax(0,1fr);
  gap:1px;background:var(--lijn);border:1px solid var(--lijn);
  margin-top:clamp(26px,3.4vw,40px);
}
.aanbod__item{background:var(--perkament);padding:clamp(20px,2.4vw,28px) clamp(18px,2.2vw,26px) clamp(22px,2.6vw,30px);}
.aanbod__item h3{font-size:clamp(19px,1.7vw,22px);line-height:1.2;margin-bottom:10px;}
.aanbod__item p{font-size:15.5px;line-height:1.55;color:var(--inkt-zacht);max-width:46ch;}
@media (min-width:600px){
  .aanbod{grid-template-columns:repeat(2,minmax(0,1fr));}
  .aanbod__item:last-child:nth-child(odd){grid-column:1 / -1;}
}
@media (min-width:1150px){
  .aanbod--drie{grid-template-columns:repeat(3,minmax(0,1fr));}
  .aanbod--drie > .aanbod__item:last-child:nth-child(odd){grid-column:auto;}
}
.ervaring{margin-top:clamp(26px,3.2vw,38px);}
.ervaring .label{margin-bottom:12px;}

/* ── 24. 404 ─────────────────────────────────────────────────────────── */
.dwaal{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(72px,12vw,160px) clamp(64px,9vw,112px);}
.dwaal__hemel{position:absolute;inset:0;width:100%;height:100%;max-width:none;z-index:-1;}
.dwaal__boog{fill:none;stroke:var(--ember);stroke-width:1.5;stroke-dasharray:6 7;opacity:.7;}
.dwaal h1{
  font-variation-settings:'opsz' 144,'SOFT' 10,'WONK' 1;
  font-size:clamp(42px,7vw,96px);line-height:1;letter-spacing:-.025em;max-width:16ch;margin-top:16px;
}
.dwaal p:not(.label){color:var(--ijs-dim);max-width:46ch;margin-top:20px;font-size:clamp(16.5px,1.3vw,18.5px);}
.dwaal ul{list-style:none;display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:34px;}

/* ── 25. Voet ────────────────────────────────────────────────────────── */
.voet{position:relative;color:var(--ijs-dim);padding-block:clamp(56px,8vw,96px) 28px;}
.voet::before{
  content:'';position:absolute;left:0;right:0;top:0;height:7px;
  background:repeating-linear-gradient(90deg,var(--lijn-nacht) 0 1px,transparent 1px 34px);
}
.voet__grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr);gap:36px clamp(24px,4vw,56px);}
.voet .merk{width:44px;height:44px;color:var(--ijs);margin-bottom:18px;}
.voet__payoff{
  font-family:var(--f-disp);font-variation-settings:'opsz' 144,'SOFT' 10,'WONK' 1;
  font-size:clamp(40px,5.6vw,76px);line-height:.95;letter-spacing:-.022em;color:var(--ijs);
}
.voet__missie{margin-top:14px;font-family:var(--f-disp);font-variation-settings:'opsz' 36,'WONK' 0;font-size:17px;color:var(--ijs-dim);}
.voet h2{font-family:var(--f-mono);font-size:10px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:var(--ember);margin-bottom:14px;}
.voet ul{list-style:none;display:grid;gap:8px;}
.voet a{text-decoration:none;color:var(--ijs);overflow-wrap:anywhere;}
.voet a:hover{color:var(--ember);text-decoration:underline;text-underline-offset:.2em;}
.voet__wet{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 24px;
  margin-top:clamp(40px,6vw,64px);padding-top:18px;border-top:1px solid var(--lijn-nacht);
  font-family:var(--f-mono);font-size:10.5px;letter-spacing:.06em;line-height:1.8;color:var(--ijs-zwak);
}

.voet__wet p{max-width:none;}
.nb{white-space:nowrap;}
/* alleen afbreken op de zachte afbreekstreepjes in de tekst (Waren-autoriteit, niet Warenautori-teit) */
.hm{hyphens:manual;-webkit-hyphens:manual;}
.catalogus__lijst{list-style:none;display:grid;gap:6px;}

/* ── 26. Responsief ──────────────────────────────────────────────────── */
@media (max-width:1180px){
  .hemel-label--klein{display:none;}
  .spec .register li{grid-template-columns:minmax(0,1fr);gap:2px;}
  .catalogus dl > div{grid-template-columns:minmax(0,1fr);gap:2px;}
  .waarden{grid-template-columns:repeat(2,minmax(0,1fr));}
  .fase{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .fase__kop{grid-column:1 / -1;}
}
@media (max-width:980px){
  .gebieden{grid-template-columns:minmax(0,1fr);}
  .gebied,.gebied + .gebied{padding:22px 0 26px;border-left:0;}
  .gebied + .gebied{border-top:1px solid var(--lijn);}
  .gebied__nr{font-size:36px;}
  .spec{grid-template-columns:minmax(0,1fr);}
  .over__intro{grid-template-columns:minmax(0,1fr);}
  .voet__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .voet__merk{grid-column:1 / -1;}
}
@media (max-width:1100px){
  .koers__lijn{display:none;}
  .koers ol{grid-template-columns:minmax(0,1fr);border-left:0;margin-left:12px;}
  .koers li{padding:0 0 26px 30px;text-align:left;border-left:1px solid var(--amber);}
  .koers li:first-child{border-image:linear-gradient(transparent 12px,var(--amber) 12px) 1;}
  .koers li:last-child{padding-bottom:0;border-left-color:transparent;}
  .koers li .koers__punt{top:5px!important;left:0;}
  .koers li:nth-child(5) .koers__punt{top:-2px!important;}
  .koers p{margin-inline:0;max-width:52ch;}
}
@media (max-width:860px){
  .plaat__grid,.paginakop__grid,.oproep__in,.loopbaan__in{grid-template-columns:minmax(0,1fr);}
  .rail{position:static;display:flex;align-items:center;gap:12px;}
  .rail__streep{margin:0;width:22px;}
  .benen{grid-template-columns:minmax(0,1fr);}
  .been,.been + .been{padding:24px 0 28px;border-left:0;}
  .been + .been{border-top:1px solid var(--lijn);}
  .paar,.toon__rij{grid-template-columns:minmax(0,1fr);}
  .paar__cel--wel{border-left:0;border-top:2px solid var(--amber);}
  .toon__cel--wel{border-left:0;border-top:1px solid var(--lijn);}
  .vragen{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:720px){
  .dwaal{padding-top:236px;}
  .dwaal__hemel{inset:0 0 auto 0;height:220px;}
}
@media (max-width:640px){
  .register li,.gegevens > div,.catalogus dl > div{grid-template-columns:minmax(0,1fr);}
  .waarden{grid-template-columns:minmax(0,1fr);}
  .fase{grid-template-columns:minmax(0,1fr);padding-left:44px;}
  .voet__grid{grid-template-columns:minmax(0,1fr);}
  .hoofdnav ul{gap:2px 20px;}
  /* taalwissel op smalle schermen rechts naast het merk, niet op een eigen regel onder het menu */
  .kop__in{position:relative;}
  .hoofdnav .taal{position:absolute;top:20px;right:var(--gutter);height:36px;display:flex;align-items:center;}
  .hoofdnav .taalwissel{padding:7px 10px;}
}

/* ── 27. Minder beweging ─────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none!important;transition:none!important;}
}

/* ── 28. Print ───────────────────────────────────────────────────────── */
@media print{
  body{background:#fff;font-size:11pt;}
  .skip,.hoofdnav,.held__hemel,.dwaal__hemel,.oproep,.held__acties,.koers__lijn{display:none!important;}
  .nacht,.top-nacht .kop{background:#fff!important;color:#000!important;}
  .held::before{display:none;}
  .held__dek,.voet,.voet a,.voet__payoff,.catalogus dd{color:#000!important;}
  .rail{position:static;}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;}
}