@font-face { font-family: "Schibsted Grotesk"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/schibsted-grotesk-400.woff2") format("woff2"); }
@font-face { font-family: "Schibsted Grotesk"; font-weight: 400; font-style: italic; font-display: swap; src: url("../fonts/schibsted-grotesk-400i.woff2") format("woff2"); }
@font-face { font-family: "Schibsted Grotesk"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/schibsted-grotesk-500.woff2") format("woff2"); }
@font-face { font-family: "Schibsted Grotesk"; font-weight: 700; font-style: normal; font-display: swap; src: url("../fonts/schibsted-grotesk-700.woff2") format("woff2"); }
@font-face { font-family: "Schibsted Grotesk"; font-weight: 800; font-style: normal; font-display: swap; src: url("../fonts/schibsted-grotesk-800.woff2") format("woff2"); }

:root {

  --inkt: #001D3D;
  --gedempt: #4C7295;
  --lijn: #CCD6E0;
  --geel: #FFC300;

  --held: #062745;
  --op-held: rgba(255, 255, 255, 0.8);
  --staal: var(--held);

  --tekst: #1B314C;
  --vlak: #F0F3F7;
  --vlak-2: #E3E9EF;
  --wit: #FFFFFF;
  --op-inkt: rgba(255, 255, 255, 0.78);

  --breed: 1280px;
  --beeld: 1480px;
  --rand: clamp(20px, 5.56vw, 80px);
  --inzet: clamp(8px, 0.85vw, 12px);
  --goot: clamp(40px, 7vw, 120px);
  --zij: 384px;
  --sectie: clamp(88px, 9.5vw, 144px);

  --t-h1: clamp(2.5rem, 1.6rem + 3.6vw, 4.75rem);
  --t-h1-sub: clamp(2.25rem, 1.5rem + 2.9vw, 4rem);
  --t-h2: clamp(2rem, 1.45rem + 2vw, 3.125rem);
  --t-h3: clamp(1.5rem, 1.2rem + 1.1vw, 2.25rem);
  --t-h4: clamp(1.25rem, 1.15rem + 0.35vw, 1.4375rem);
  --t-lead: clamp(1.1875rem, 1.05rem + 0.6vw, 1.4375rem);
  --t-tekst: clamp(1.0625rem, 1rem + 0.15vw, 1.1875rem);
  --t-klein: 0.9375rem;

  --r-groot: 14px;
  --r: 10px;
  --r-knop: 8px;

  --kop-h: 104px;
  --kop-h-klein: 76px;
  --balk-h: 40px;
  --snel: 180ms cubic-bezier(.2, .7, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--kop-h-klein) + 24px); }
body {
  margin: 0; background: var(--wit); color: var(--tekst);
  font-family: "Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: var(--t-tekst); line-height: 1.6; font-weight: 400;
  font-feature-settings: "kern", "liga", "calt";
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  overflow-x: clip;
}
img, svg { display: block; max-width: 100%; height: auto; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
h1, h2, h3, h4 { color: var(--inkt); font-weight: 800; text-wrap: balance; }
p { text-wrap: pretty; }
a { color: inherit; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
strong, b { font-weight: 700; color: var(--inkt); }
em, i { font-style: italic; }
.getal { font-variant-numeric: tabular-nums lining-nums; }

:focus-visible { outline: 3px solid var(--inkt); outline-offset: 3px; border-radius: 3px; }
.op-inkt :focus-visible { outline-color: var(--geel); }

.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; }
.skiplink {
  position: absolute; left: var(--rand); top: -100px; z-index: 100;
  background: var(--geel); color: var(--inkt); font-weight: 700; padding: 12px 18px; border-radius: var(--r-knop); text-decoration: none;
}
.skiplink:focus { top: 12px; }

.wrap { width: 100%; max-width: calc(var(--breed) + 2 * var(--rand)); margin-inline: auto; padding-inline: var(--rand); }

.sleutel { display: inline-block; width: 0.62em; height: 0.62em; background: var(--geel); flex: none; }

.knop {
  display: inline-flex; align-items: center; gap: 14px; min-height: 54px; padding: 15px 24px;
  border-radius: var(--r-knop); font-size: 1.0625rem; font-weight: 700; line-height: 1.2; letter-spacing: -0.005em;
  text-decoration: none; transition: background-color var(--snel), color var(--snel), border-color var(--snel), transform 90ms ease;
}
.knop svg { width: 18px; height: 18px; flex: none; transition: transform 260ms cubic-bezier(.2, .7, .2, 1); }
.knop:hover svg { transform: translateX(4px); }
.knop:active { transform: translateY(1px); }
.knop--inkt { background: var(--inkt); color: var(--wit); }
.knop--inkt:hover { background: #08375E; }
.knop--geel { background: var(--geel); color: var(--inkt); }
.knop--geel:hover { background: #FFD23F; }
.knop--lijn { border: 1.5px solid var(--inkt); color: var(--inkt); padding: 13.5px 22.5px; }
.knop--lijn:hover { background: var(--inkt); color: var(--wit); }
.knop--vol { width: 100%; justify-content: space-between; }

.pijllink {
  display: inline-flex; align-items: center; gap: 10px; font-weight: 700; color: var(--inkt); text-decoration: none;
  padding: 0 2px 3px 0;
  background:
    linear-gradient(currentColor, currentColor) 0 100% / 100% 1.5px no-repeat,
    linear-gradient(var(--geel), var(--geel)) 0 100% / 0 0.62em no-repeat;
  transition: background-size 280ms cubic-bezier(.2, .7, .2, 1);
}
.pijllink svg { width: 16px; height: 16px; transition: transform 260ms cubic-bezier(.2, .7, .2, 1); }
.pijllink:hover { background-size: 100% 1.5px, 100% 0.62em; }
.pijllink:hover svg { transform: translateX(3px); }

.bovenbalk { background: var(--inkt); color: var(--op-inkt); font-size: 0.9375rem; line-height: 1; }
.bovenbalk .wrap { height: var(--balk-h); display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.bovenbalk__payoff { display: flex; align-items: center; gap: 10px; color: var(--wit); font-weight: 500; }
.bovenbalk__payoff .sleutel { width: 8px; height: 8px; }

.kop {
  position: sticky; top: 0; z-index: 50; background: var(--wit);
  border-bottom: 1px solid transparent; transition: border-color var(--snel), margin-bottom var(--snel);
}

.is-gescrold .kop { margin-bottom: calc(var(--kop-h) - var(--kop-h-klein)); }
.kop > .wrap { height: var(--kop-h); display: flex; align-items: center; gap: 48px; transition: height var(--snel); }
.is-gescrold .kop { border-bottom-color: var(--lijn); }
.is-gescrold .kop > .wrap { height: var(--kop-h-klein); }
.kop__logo { display: block; flex: none; }
.kop__logo img { height: 64px; width: auto; transition: height var(--snel); }
.is-gescrold .kop__logo img { height: 48px; }

.kop nav { margin-right: auto; }
.nav { display: flex; align-items: center; gap: 4px; }
.nav > li { position: static; }
.nav__item {
  position: relative; display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 0 14px;
  font-size: 1.125rem; font-weight: 500; color: var(--inkt); text-decoration: none; border-radius: var(--r-knop);
}
.nav__item::after {
  content: ""; position: absolute; left: 14px; right: 14px; bottom: 6px; height: 2px; background: var(--inkt);
  transform: scaleX(0); transform-origin: left; transition: transform var(--snel);
}
.nav__item:hover::after, .nav__item[aria-expanded="true"]::after { transform: scaleX(1); }
.nav__item[aria-current="page"]::after, .nav__item.is-actief::after { transform: scaleX(1); background: var(--geel); height: 3px; }
.nav__item svg { width: 12px; height: 12px; transition: transform var(--snel); }
.nav__item[aria-expanded="true"] svg { transform: rotate(180deg); }
.kop__rechts { display: flex; align-items: center; gap: 16px; }
.kop__knop { min-height: 50px; padding: 13px 22px; white-space: nowrap; }
.is-gescrold .kop__knop { min-height: 46px; padding-block: 11px; }

.mega {
  position: absolute; left: 0; right: 0; top: 100%; background: var(--wit);
  border-top: 1px solid var(--lijn); border-bottom: 1px solid var(--lijn);
  visibility: hidden; opacity: 0; transition: opacity 140ms ease, visibility 0s linear 140ms;
}
.mega.is-open { visibility: visible; opacity: 1; transition: opacity 140ms ease; }

.mega__in { display: grid; justify-items: start; row-gap: 22px; padding-block: 28px 30px; }
.mega__tegels { justify-self: stretch; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.mega__tegel {
  position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; isolation: isolate;
  border-radius: var(--r-groot); background: var(--vlak-2); color: var(--inkt); text-decoration: none;
}
.mega__tegel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
.mega__naam {
  position: absolute; left: 10px; right: 10px; bottom: 10px; width: fit-content; max-width: calc(100% - 20px);
  padding: 7px 11px 8px; border-radius: 8px; background: var(--wit);
  font-size: 1rem; font-weight: 800; line-height: 1.2; letter-spacing: -0.015em; text-wrap: balance;
  text-decoration-thickness: 3px; text-underline-offset: 4px;
}
.mega__tegel[aria-current="page"] .mega__naam { text-decoration-line: underline; text-decoration-color: var(--geel); }
.mega__tegel:focus-visible { outline-offset: 2px; border-radius: var(--r-groot); }
.dimmer {
  position: fixed; inset: 0; z-index: 40; background: rgba(0, 29, 61, 0.32);
  visibility: hidden; opacity: 0; transition: opacity 140ms ease, visibility 0s linear 140ms;
}
.dimmer.is-open { visibility: visible; opacity: 1; transition: opacity 140ms ease; }

.menuknop { display: none; align-items: center; gap: 10px; height: 44px; padding: 0 4px 0 10px; font-size: 1.0625rem; font-weight: 700; color: var(--inkt); }
.menuknop__streep { width: 20px; height: 12px; position: relative; }
.menuknop__streep::before, .menuknop__streep::after { content: ""; position: absolute; left: 0; right: 0; height: 2px; background: currentColor; transition: transform var(--snel), top var(--snel); }
.menuknop__streep::before { top: 1px; }
.menuknop__streep::after { top: 9px; }
.menuknop[aria-expanded="true"] .menuknop__streep::before { top: 5px; transform: rotate(45deg); }
.menuknop[aria-expanded="true"] .menuknop__streep::after { top: 5px; transform: rotate(-45deg); }
.mobielmenu {
  position: fixed; left: 0; right: 0; bottom: 0; top: var(--kop-h-klein); z-index: 49; background: var(--wit);
  overflow-y: auto; overscroll-behavior: contain; padding: 8px var(--rand) 40px; display: none;
}
.mobielmenu.is-open { display: block; }
.mobielmenu__lijst > li { border-bottom: 1px solid var(--lijn); }
.mobielmenu__lijst > li > a, .mobielmenu__lijst > li > button {
  display: flex; width: 100%; align-items: center; justify-content: space-between; min-height: 64px;
  font-size: 1.375rem; font-weight: 500; color: var(--inkt); text-decoration: none; text-align: left;
}
.mobielmenu__lijst svg { width: 14px; height: 14px; transition: transform var(--snel); }
.mobielmenu__lijst button[aria-expanded="true"] svg { transform: rotate(180deg); }
.mobielmenu__sub { padding: 0 0 18px; display: none; }
.mobielmenu__sub.is-open { display: block; }

.mobielmenu__tegels li + li { margin-top: 10px; }
.mobielmenu__tegel { display: grid; grid-template-columns: 88px minmax(0, 1fr); column-gap: 16px; align-items: center; text-decoration: none; color: var(--inkt); }
.mobielmenu__tegel img { width: 88px; aspect-ratio: 4 / 3; object-fit: cover; object-position: var(--pos, 50% 50%); border-radius: 8px; background: var(--vlak-2); }
.mobielmenu__tegel span { font-size: 1.125rem; font-weight: 700; line-height: 1.25; text-decoration-thickness: 3px; text-underline-offset: 4px; }
.mobielmenu__tegel[aria-current="page"] span { text-decoration-line: underline; text-decoration-color: var(--geel); }
.mobielmenu__alle { margin-top: 18px; }
.mobielmenu__voet { margin-top: 28px; display: grid; gap: 18px; }
.mobielmenu__voet p { color: var(--gedempt); font-size: 1rem; }
.mobielmenu__voet p a { color: var(--inkt); font-weight: 500; }

.held { padding-inline: var(--inzet); --op-inkt: var(--op-held); }
.held__vlak {
  position: relative; max-width: var(--beeld); margin-inline: auto; display: grid;
  grid-template-columns: minmax(0, 47fr) minmax(0, 53fr);
  min-height: clamp(560px, 46vw, 664px); border-radius: var(--r-groot); overflow: hidden; background: var(--held); color: var(--wit);
}
.held__tekst {
  display: flex; flex-direction: column; justify-content: center;
  padding: 64px clamp(32px, 4.4vw, 72px) 88px calc(var(--rand) - var(--inzet));
}
.held__label { display: flex; align-items: center; gap: 12px; font-size: 1rem; font-weight: 500; color: var(--op-inkt); margin-bottom: 28px; }
.held__label .sleutel { width: 10px; height: 10px; }
.held h1 { color: var(--wit); font-size: var(--t-h1); line-height: 0.98; letter-spacing: -0.035em; max-width: 9.5em; }
.held__lead { margin-top: 28px; font-size: var(--t-lead); line-height: 1.45; color: var(--op-inkt); max-width: 30em; }
.held__lead strong { color: var(--wit); font-weight: 500; }
.held__knoppen { margin-top: 40px; display: flex; flex-wrap: wrap; align-items: center; gap: 16px 32px; }
.held__link { color: var(--wit); font-weight: 700; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; border-bottom: 1.5px solid rgba(255,255,255,.45); padding-bottom: 2px; }
.held__link:hover { border-bottom-color: var(--geel); }
.held__link svg { transition: transform 260ms cubic-bezier(.2, .7, .2, 1); }
.held__link:hover svg { transform: translateY(2px); }
.held__link svg { width: 16px; height: 16px; }
.held__foto { position: relative; min-height: 100%; }
.held__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.held--sub .held__vlak { min-height: clamp(480px, 38vw, 560px); }
.held--sub h1 { font-size: var(--t-h1-sub); line-height: 1; letter-spacing: -0.03em; max-width: 8.5em; }
.held--sub .held__tekst { padding-bottom: 96px; }
.held__meta { margin-top: 32px; display: flex; align-items: center; gap: 12px; font-size: 1rem; font-weight: 500; color: var(--op-inkt); }
.held__meta .sleutel { width: 10px; height: 10px; }
.kruimel { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 1rem; color: var(--op-inkt); margin-bottom: 36px; }
.kruimel a { color: var(--wit); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.4); }
.kruimel a:hover { border-bottom-color: var(--wit); }
.kruimel svg { width: 10px; height: 10px; opacity: .6; }

.sectie { padding-top: var(--sectie); }

.sectie--direct { padding-top: clamp(48px, 5vw, 88px); }
.sectie--eind { padding-bottom: var(--sectie); }
.kolommen { display: grid; grid-template-columns: minmax(0, 1fr) var(--zij); column-gap: var(--goot); align-items: start; }
.kolommen__hoofd { max-width: 800px; }
.kolommen__zij { grid-column: 2; grid-row: 1; align-self: stretch; }
.kolommen__zij + .kolommen__hoofd { grid-column: 1; grid-row: 1; }
.label { display: flex; align-items: center; gap: 10px; font-size: 1rem; font-weight: 500; color: var(--gedempt); margin-bottom: 18px; }
.label .sleutel { width: 9px; height: 9px; }
.sectie h2, .h2 { font-size: var(--t-h2); line-height: 1.05; letter-spacing: -0.03em; }
.sectie h2 + p, .h2 + p, .sectie h2 + .tekst { margin-top: 24px; }
.tekst > p + p { margin-top: 1em; }
.intro { font-size: var(--t-lead); line-height: 1.5; color: var(--inkt); }
.intro + .intro { margin-top: 0.8em; }
.sectie__knop { margin-top: 36px; }

.zijblok { background: var(--vlak); border-radius: var(--r); padding: clamp(28px, 3.4vw, 48px); }
.zijblok--hoog { margin-top: clamp(-152px, -10vw, -96px); position: relative; z-index: 2; }
.zijblok__kop { font-size: 1.5rem; font-weight: 800; color: var(--inkt); letter-spacing: -0.02em; line-height: 1.2; margin-bottom: 14px; }
.direct li + li { border-top: 1px solid var(--lijn); }
.direct a {
  display: grid; grid-template-columns: 20px 1fr; column-gap: 10px; align-items: baseline; padding: 14px 0;
  font-size: 1.1875rem; font-weight: 500; color: var(--inkt); text-decoration: none; line-height: 1.35;
}
.direct a svg { width: 15px; height: 15px; color: var(--gedempt); transform: translateY(2px); transition: transform var(--snel), color var(--snel); }
.direct a:hover svg { transform: translate(3px, 2px); color: var(--inkt); }
.direct a:hover span { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1.5px; }
.direct a[aria-current="true"] { font-weight: 700; }
.direct a[aria-current="true"] svg { color: var(--inkt); }
.direct small { display: block; font-size: var(--t-klein); color: var(--gedempt); font-weight: 400; }

.intro-rij { padding-top: clamp(56px, 6vw, 88px); }

.verhouding__balk { display: flex; height: 10px; background: var(--vlak-2); }
.verhouding__balk span { margin-left: auto; width: calc(var(--zelf) * 1%); background: var(--geel); }
.verhouding__onder { display: flex; justify-content: space-between; gap: 16px; margin-top: 10px; font-size: 1rem; font-weight: 500; color: var(--inkt); font-variant-numeric: tabular-nums; }
.verhouding__onder span { display: inline-flex; align-items: center; gap: 8px; }
.verhouding__onder .sleutel { width: 10px; height: 10px; }
.bijschrift { margin-top: 12px; font-size: var(--t-klein); color: var(--gedempt); line-height: 1.45; }

.wij { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--goot); align-items: start; }
.wij__fotos { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.wij__fotos img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--r-groot); }
.wij__fotos figcaption { margin-top: 14px; }
.wij__fotos figcaption b { display: block; font-size: 1.1875rem; }
.wij__fotos figcaption a { font-size: 1rem; color: var(--gedempt); text-decoration: none; }
.wij__fotos figcaption a:hover { color: var(--inkt); text-decoration: underline; text-underline-offset: 3px; }

.gesprek { position: relative; z-index: 2; padding-inline: var(--inzet); margin-top: var(--sectie); }
.sectie--eind + .gesprek { margin-top: 0; }
.gesprek__vlak {
  position: relative; overflow: hidden;
  max-width: var(--beeld); margin-inline: auto; background: var(--inkt); color: var(--op-inkt); border-radius: var(--r-groot);
  padding-block: clamp(64px, 8vw, 128px);
}
.gesprek .wrap { position: relative; max-width: calc(var(--breed) + 2 * (var(--rand) - var(--inzet))); padding-inline: calc(var(--rand) - var(--inzet)); }
.gesprek__in { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--goot); align-items: end; }

.gesprek__in .mensen { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
.gesprek__in .mensen li { border-bottom: 1px solid rgba(255,255,255,.18); }
@media (max-width: 520px) {
  .gesprek__in .mensen { grid-template-columns: minmax(0, 1fr); }
  .gesprek__in .mensen li:not(:last-child) { border-bottom: 0; }
}
.gesprek .label { color: var(--op-inkt); }
.gesprek h2 { color: var(--wit); font-size: clamp(2.5rem, 1.45rem + 3.6vw, 4.5rem); line-height: 0.98; letter-spacing: -0.04em; }
.gesprek p.intro { color: var(--op-inkt); margin-top: 28px; max-width: 30em; }
.gesprek .knop { margin-top: 44px; }
.mensen li { padding: 20px 0 22px; border-top: 1px solid rgba(255,255,255,.18); }
.mensen li:last-child { border-bottom: 1px solid rgba(255,255,255,.18); }
.mensen b { display: block; color: var(--wit); font-size: 1.25rem; letter-spacing: -0.01em; margin-bottom: 4px; }
.mensen a { color: var(--op-inkt); text-decoration: none; font-size: 1.0625rem; }
.mensen a:hover { color: var(--wit); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.mensen span { color: rgba(255,255,255,.35); margin: 0 8px; }

:root {
  --bundel-w: 2200px;
  --bundel-h: 2200px;
  --bundel-x: clamp(150px, 39vw, 600px);
  --bundel-d: 880px;
}
.gesprek__vlak::before, .voet::before {
  content: ""; position: absolute; pointer-events: none;
  width: var(--bundel-w); height: var(--bundel-h);
  left: calc(50% + var(--bundel-x) - var(--bundel-w));
  background: url("../beeld/vorm-bundel.svg") no-repeat 0 0 / 100% 100%;
}
.gesprek__vlak::before { top: calc(100% - var(--bundel-d)); opacity: 0.085; }

.voet {
  --over: clamp(64px, 7vw, 112px);
  position: relative; overflow: clip; margin-top: calc(-1 * var(--over)); background: var(--vlak);
  padding-block: calc(var(--over) + clamp(72px, 7.5vw, 120px)) 28px;
}
.voet::before { top: calc(var(--over) - var(--bundel-d)); }
.voet > .wrap { position: relative; }
.voet__boven {
  display: grid; column-gap: clamp(28px, 3.3vw, 56px);
  grid-template-columns: minmax(0, 4.6fr) minmax(0, 3.3fr) minmax(0, 2fr) minmax(0, 3.1fr);
}
.voet__merk img { height: 56px; width: auto; }
.voet__logo { display: inline-block; border-radius: 4px; }
.voet__regel {
  margin-top: 36px; max-width: 7.4em; text-wrap: balance;
  font-size: clamp(2.125rem, 1.4rem + 2.3vw, 3.5rem); line-height: 1; font-weight: 800; letter-spacing: -0.04em; color: var(--inkt);
}
.voet h2 {
  padding-top: 18px; border-top: 1px solid var(--inkt); margin-bottom: 20px;
  font-size: 1rem; font-weight: 700; letter-spacing: 0; line-height: 1.3; color: var(--inkt);
}
.voet__kolom li + li { margin-top: 12px; }
.voet__kolom a, .voet__onder a {
  text-decoration: none; color: var(--inkt); padding-bottom: 2px;
  background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat;
  transition: background-size 240ms cubic-bezier(.2, .7, .2, 1);
}
.voet__kolom a { font-size: 1.125rem; line-height: 1.4; font-weight: 500; }
.voet__kolom a:hover, .voet__onder a:hover { background-size: 100% 1px; }
.voet__kolom a[aria-current="page"] { background: linear-gradient(var(--geel), var(--geel)) 0 100% / 100% 3px no-repeat; }
.voet__persoon + .voet__persoon { margin-top: 22px; }
.voet__persoon b { display: block; font-size: 1.125rem; margin-bottom: 4px; }
.voet__persoon li + li { margin-top: 2px; }
.voet__persoon a { font-size: 1.0625rem; font-weight: 400; color: var(--tekst); white-space: nowrap; }
@media (min-width: 1024px) and (max-width: 1279px) {

  .voet__boven { grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.8fr) minmax(0, 1fr); row-gap: 72px; }
  .voet__merk { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; column-gap: 48px; }
  .voet__merk > :first-child { grid-column: 1 / -1; justify-self: start; }
  .voet__merk .knop { margin-top: 0; }
  .voet__regel { max-width: none; }
}
.voet__onder {
  margin-top: clamp(80px, 9vw, 136px); padding-top: 22px; border-top: 1px solid var(--lijn);
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 28px; font-size: var(--t-klein); color: var(--gedempt);
}
.voet__onder:not(:has(.voet__klein)) { justify-content: flex-start; }
.voet__klein { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 28px; }
.voet__onder a { color: var(--inkt); }
.voet__boven-link { display: inline-flex; align-items: center; gap: 8px; }
.voet__boven-link svg { width: 14px; height: 14px; transform: rotate(180deg); }

.kort { display: grid; gap: 0; margin-top: 4px; }
.kort > div { display: grid; grid-template-columns: 112px minmax(0, 1fr); padding: 12px 0; border-top: 1px solid var(--lijn); }
.kort > div:first-child { border-top: 0; }
.kort dt { font-size: 1rem; color: var(--gedempt); font-weight: 500; }
.kort dd { font-size: 1.125rem; font-weight: 700; color: var(--inkt); overflow-wrap: break-word; hyphens: auto; }
@media (max-width: 359px) {
  .zijblok .kort > div { grid-template-columns: minmax(0, 1fr); row-gap: 2px; }
  .zijblok { padding: 24px 20px; }
  .zijblok .knop { padding-inline: 18px; gap: 10px; }
}
.zijblok__tekening { width: 72px; height: 72px; margin-bottom: 14px; }

@media (min-width: 1024px) and (max-height: 860px) { .plak .zijblok__tekening { display: none; } }
.zijblok .knop { margin-top: 24px; }
.zijblok__scheiding { margin-top: 36px; }
.plak { position: sticky; top: calc(var(--kop-h-klein) + 28px); }

.blok + .blok { margin-top: clamp(80px, 8vw, 120px); }
.blok > h2 { font-size: clamp(1.75rem, 1.4rem + 1.3vw, 2.5rem); line-height: 1.1; letter-spacing: -0.025em; }
.blok > h2 + * { margin-top: 22px; }

.leerdoelen { counter-reset: doel; margin-top: 8px; }
.leerdoelen li { counter-increment: doel; display: grid; grid-template-columns: 52px 1fr; padding: 18px 0; border-bottom: 1px solid var(--lijn); font-size: 1.25rem; line-height: 1.45; color: var(--inkt); }
.leerdoelen li:first-child { border-top: 1px solid var(--lijn); }
.leerdoelen li::before { content: counter(doel); font-weight: 800; color: var(--gedempt); font-variant-numeric: tabular-nums; }
.leerdoelen__intro { color: var(--tekst); }

.programma { margin-top: 36px; }
.programma__legenda { display: flex; justify-content: flex-end; gap: 22px; font-size: var(--t-klein); color: var(--gedempt); font-weight: 500; margin-bottom: 14px; }
.programma__legenda span { display: inline-flex; align-items: center; gap: 8px; }
.programma__legenda i { width: 10px; height: 10px; background: var(--vlak-2); display: inline-block; }
.programma__legenda i.geel { background: var(--geel); }
.programma__delen { display: flex; gap: 6px; }
.programma__deel { flex: var(--gewicht) 1 0; min-width: 0; }
.programma__deel .verhouding__balk { height: 14px; }
.programma__nr { font-size: 1rem; font-weight: 800; color: var(--inkt); margin-bottom: 10px; font-variant-numeric: tabular-nums; }
.programma__naam { margin-top: 14px; font-size: 1.125rem; font-weight: 700; color: var(--inkt); line-height: 1.3; }
.programma__meta { font-size: 1rem; color: var(--gedempt); font-variant-numeric: tabular-nums; }
.blok figure.foto { margin-top: 40px; }
.blok figure.foto img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; object-position: 50% 40%; border-radius: var(--r-groot); }

.deel { margin-top: 64px; }
.deel__kop { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.deel__kop h3 { font-size: var(--t-h4); font-size: clamp(1.375rem, 1.2rem + 0.7vw, 1.75rem); letter-spacing: -0.02em; line-height: 1.2; }
.deel__kop h3 .nr { color: var(--gedempt); margin-right: 10px; font-variant-numeric: tabular-nums; }
.deel__meta { font-size: 1rem; color: var(--gedempt); white-space: nowrap; font-variant-numeric: tabular-nums; }
.deel .verhouding__balk { margin-top: 14px; height: 8px; }
.deel__intro { margin-top: 22px; font-size: 1.25rem; line-height: 1.5; color: var(--inkt); }

.pijplijn-veeg { margin-top: 36px; }
.pijplijn { container-type: inline-size; }
.pijplijn-veeg__hint { display: none; }
.pijplijn__vakken { position: relative; height: 13.5cqi; min-height: 64px; }
.pijplijn__vak { position: absolute; top: 0; bottom: 0; border: 1.5px solid var(--inkt); padding: 1.2cqi 1.8cqi; display: flex; flex-direction: column; justify-content: space-between; background: var(--wit); }
.pijplijn__vak--prompt { left: 0.96%; width: 38%; }
.pijplijn__vak--output { left: 76.16%; width: 22.4%; }
.pijplijn__vak small { font-size: max(11px, 1.55cqi); font-weight: 700; color: var(--gedempt); line-height: 1; letter-spacing: 0.01em; }
.pijplijn__vak p { font-size: max(14px, 2.3cqi); line-height: 1.15; color: var(--inkt); white-space: nowrap; }
.pijplijn__vak mark { background: none; color: var(--inkt); font-weight: 700; box-shadow: inset 0 -0.28em 0 var(--geel); }
.pijplijn__beeld { position: relative; aspect-ratio: 1250 / 409; margin-top: 1.4cqi; }
.pijplijn__beeld img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 100%; }
.pijplijn__stap, .pijplijn__softmax, .pijplijn__kans, .pijplijn__nkeer { position: absolute; line-height: 1.15; white-space: nowrap; }
.pijplijn__stap { left: var(--x); top: 2%; display: flex; flex-direction: column; font-size: max(14px, 1.95cqi); color: var(--inkt); }
.pijplijn__stap b { font-weight: 700; }
.pijplijn__stap span { color: var(--gedempt); }
.pijplijn__softmax { left: 87.3%; top: 18%; transform: translateX(-50%); font-size: max(14px, 1.95cqi); font-weight: 700; color: var(--inkt); background: var(--wit); padding: 0 4px; }
.pijplijn__kans { right: 12.6%; top: var(--y); transform: translateY(-50%); font-size: max(14px, 1.8cqi); line-height: 1; color: var(--inkt); }
.pijplijn__kans--vet { font-weight: 700; }
.pijplijn__nkeer { left: 35.3%; top: 97%; transform: translate(-50%, -50%); font-size: max(14px, 1.8cqi); color: var(--gedempt); background: var(--wit); padding: 0 6px; }

.begrippen { margin-top: 40px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 40px; }
.begrip { border-top: 1px solid var(--lijn); padding-top: 24px; }
.begrip__beeld { height: 200px; display: flex; align-items: center; }
.begrip__beeld img { max-height: 200px; width: auto; }
.begrip__kop { margin-top: 18px; font-size: 1.0625rem; color: var(--gedempt); }
.begrip__kop b { font-size: 1.3125rem; color: var(--inkt); margin-right: 4px; }
.begrip__tekst { margin-top: 6px; font-size: 1.125rem; line-height: 1.5; }

.temperatuur { width: 100%; max-width: 340px; display: grid; grid-template-columns: max-content 1fr; column-gap: 14px; row-gap: 9px; align-items: center; font-size: 1rem; color: var(--inkt); }
.temperatuur__legenda { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; color: var(--gedempt); font-size: var(--t-klein); margin-bottom: 4px; }
.temperatuur__legenda i { width: 12px; height: 8px; background: var(--inkt); display: inline-block; }
.temperatuur__legenda i.hoog { background: var(--gedempt); margin-left: 10px; }
.temperatuur__balken { display: flex; flex-direction: column; gap: 3px; border-left: 1.5px solid var(--inkt); }
.temperatuur__balk { height: 8px; width: calc(var(--kans) * 1%); background: var(--inkt); }
.temperatuur__balk--hoog { background: var(--gedempt); }

.zelfdoen { margin-top: 36px; display: grid; grid-template-columns: auto 1fr; column-gap: 18px; align-items: baseline; padding: 20px 24px; background: var(--vlak); border-radius: var(--r); }
.zelfdoen__kop { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; color: var(--inkt); font-size: 1.0625rem; white-space: nowrap; }
.zelfdoen ul { display: grid; gap: 6px; font-size: 1.125rem; color: var(--inkt); line-height: 1.45; }

.uitleg { margin-top: 48px; border: 1px solid var(--lijn); border-radius: var(--r-groot); overflow: hidden; }
.uitleg__kop { padding: 22px 28px; border-bottom: 1px solid var(--lijn); display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.uitleg__kop h3 { font-size: 1.3125rem; letter-spacing: -0.015em; }
.uitleg__kop p { font-size: 1rem; color: var(--gedempt); }
.uitleg__lijf { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
.uitleg__ruimte { padding: 24px 20px 16px 16px; border-right: 1px solid var(--lijn); }
.uitleg__ruimte svg { width: 100%; height: auto; overflow: visible; }
.uitleg__stappen { padding: 22px 24px 24px; display: flex; flex-direction: column; }
.uitleg__vraag { font-size: 1.125rem; color: var(--inkt); padding-bottom: 6px; }
.uitleg__stappen ol { counter-reset: s; flex: 1; }
.uitleg__stap { counter-increment: s; }
.uitleg__stap + .uitleg__stap { border-top: 1px solid var(--lijn); }
.uitleg__stap button { display: grid; grid-template-columns: 30px 1fr; width: 100%; text-align: left; padding: 14px 0; color: var(--gedempt); transition: color var(--snel); }
.uitleg__stap button::before { content: counter(s); font-weight: 800; font-variant-numeric: tabular-nums; }
.uitleg__stap button:hover { color: var(--inkt); }
.uitleg__stap b { display: block; font-size: 1.0625rem; color: inherit; font-weight: 700; }
.uitleg__stap span { display: block; font-size: 1rem; line-height: 1.45; margin-top: 2px; }
.uitleg__stap.is-gedaan button { color: var(--inkt); }
.uitleg__stap.is-nu button { color: var(--inkt); }
.uitleg__stap button { position: relative; }
.uitleg__stap.is-nu button::after { content: ""; position: absolute; left: -24px; top: 12px; bottom: 12px; width: 3px; background: var(--geel); }
.uitleg__bediening { display: flex; gap: 12px; align-items: center; margin-top: 18px; }
.uitleg__bediening .knop { min-height: 46px; padding: 11px 18px; font-size: 1rem; }
.uitleg__uitkomst { padding: 18px 28px; border-top: 1px solid var(--lijn); background: var(--vlak); font-size: 1.125rem; color: var(--inkt); line-height: 1.5; }
.uitleg__uitkomst b { font-weight: 800; }

.vr-raster line { stroke: var(--lijn); stroke-width: 1; }
.vr-as { stroke: var(--inkt); stroke-width: 1.6; }
.vr-aslabel { font-size: 15px; fill: var(--gedempt); font-weight: 500; }
.vr-pijl { fill: none; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.vr-pijl--sinaas { stroke: var(--inkt); }
.vr-pijl--klein { stroke: #E0752D; }
.vr-pijl--som { stroke: var(--gedempt); }
.vr-kop--sinaas { fill: var(--inkt); }
.vr-kop--klein { fill: #E0752D; }
.vr-kop--som { fill: var(--gedempt); }
.vr-label { font-size: 16px; font-weight: 700; }
.vr-label--klein { fill: #B5531A; }
.vr-label--sinaas { fill: var(--inkt); }
.vr-ring { fill: none; stroke: var(--inkt); stroke-width: 2; }
.vr-laag { transition: opacity 160ms ease, transform 900ms cubic-bezier(.45, .05, .2, 1); }
.vr-teken { stroke-dasharray: 1; stroke-dashoffset: 0; transition: stroke-dashoffset 750ms cubic-bezier(.45, .05, .2, 1); }
.vr-kop { transition: opacity 180ms ease 560ms; }
.vr-laag.is-uit { opacity: 0; transition-delay: 0s; }
.vr-laag.is-uit .vr-teken { stroke-dashoffset: 1; transition: none; }
.vr-laag.is-uit .vr-kop { opacity: 0; transition: none; }
.vr-label { paint-order: stroke; stroke: var(--wit); stroke-width: 4px; stroke-linejoin: round; }

.fasen { margin-top: 28px; }
.fasen li { display: grid; grid-template-columns: 76px 1fr; column-gap: 20px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--lijn); }
.fasen li:first-child { border-top: 1px solid var(--lijn); }
.fasen__beeld { display: flex; gap: 2px; }
.fasen__beeld img { width: 48px; height: 48px; }
.fasen__beeld img + img { width: 36px; height: 36px; align-self: end; }
.fasen b { display: block; font-size: 1.1875rem; }
.fasen span { display: block; font-size: 1.0625rem; line-height: 1.5; margin-top: 2px; }

.punten { margin-top: 28px; }
.punten > div { display: grid; grid-template-columns: 176px 1fr; column-gap: 24px; padding: 16px 0; border-bottom: 1px solid var(--lijn); font-size: 1.125rem; line-height: 1.5; }
.punten > div:first-child { border-top: 1px solid var(--lijn); }
.punten dd { color: var(--tekst); }
.punten b { font-size: 1.125rem; }

.spoor { margin-top: 32px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.spoor li { position: relative; padding: 26px 18px 0 0; font-size: 1rem; line-height: 1.35; color: var(--gedempt); }
.spoor li::before { content: ""; position: absolute; left: 0; right: 0; top: 6px; height: 2px; background: var(--lijn); }
.spoor li::after { content: ""; position: absolute; left: 0; top: 0; width: 14px; height: 14px; border-radius: 50%; background: var(--wit); border: 2px solid var(--lijn); }
.spoor li.is-opdracht::after { border-radius: 0; }
.spoor li.is-hier { color: var(--inkt); font-weight: 700; }
.spoor li.is-hier::before { background: var(--inkt); }
.spoor li.is-hier::after { background: var(--inkt); border-color: var(--inkt); box-shadow: 0 0 0 4px var(--geel); }
.spoor small { display: block; font-size: var(--t-klein); font-weight: 400; color: var(--gedempt); }

@media (max-width: 1180px) {
  .nav__item { padding: 0 10px; font-size: 1.0625rem; }
  .kop > .wrap { gap: 28px; }
}

@media (max-width: 1023px) {
  :root { --zij: 340px; --kop-h: 76px; --kop-h-klein: 68px; }
  .bovenbalk { display: none; }
  .nav, .mega, .dimmer { display: none; }
  .kop__knop, .is-gescrold .kop__knop { min-height: 42px; padding: 9px 14px; font-size: 0.9375rem; }
  .menuknop { display: inline-flex; }
  .kop > .wrap { justify-content: space-between; }
  .kop__logo img { height: 46px; }
  .is-gescrold .kop__logo img { height: 40px; }
  .kop__rechts { margin-left: auto; gap: 12px; }

  .held__vlak, .held--sub .held__vlak { grid-template-columns: 1fr; min-height: 0; }
  .held__foto { order: -1; aspect-ratio: 16 / 10; }
  .held__tekst { padding: 40px var(--rand) 52px calc(var(--rand) - var(--inzet)); }
  .held--sub .held__tekst { padding-bottom: 48px; }

  .kolommen, .wij, .gesprek__in { grid-template-columns: minmax(0, 1fr); }
  .kolommen > aside, .kolommen__zij { margin-top: 48px; }
  .zijblok--hoog { margin-top: 48px; }
  .plak { position: static; }
  .kolommen__zij { grid-column: auto; grid-row: auto; margin-top: 0 !important; }
  .kolommen__zij + .kolommen__hoofd { grid-column: auto; grid-row: auto; margin-top: 72px; }
  .kolommen__zij .zijblok--hoog { margin-top: 0; }

  .wij__fotos { margin-top: 40px; }
  .gesprek__in .mensen { margin-top: 40px; }

  .voet__boven { grid-template-columns: 1fr 1fr; row-gap: 56px; }
  .voet__merk { grid-column: 1 / -1; }
  :root { --bundel-d: 1040px; }
}

@media (max-width: 479px) {
  .kop__knop { display: none; }
}

@media (max-width: 640px) {
  :root { --kop-h: 72px; --kop-h-klein: 64px; }
  body { line-height: 1.55; }
  .kop__logo img { height: 42px; }
  .is-gescrold .kop__logo img { height: 38px; }
  .held__foto { aspect-ratio: 4 / 3; }
  .held__label { margin-bottom: 18px; font-size: var(--t-klein); }
  .held__lead { margin-top: 20px; }
  .held__knoppen { margin-top: 30px; }
  .held__knoppen .knop { width: 100%; justify-content: space-between; }
  .kruimel { margin-bottom: 22px; font-size: var(--t-klein); }

  .pijplijn-veeg { overflow-x: auto; overscroll-behavior-x: contain; margin-inline: calc(-1 * var(--rand)); padding: 0 var(--rand) 12px; scrollbar-width: thin; }
  .pijplijn { width: 680px; }
  .pijplijn-veeg__hint { display: block; margin-top: 10px; font-size: var(--t-klein); color: var(--gedempt); }
  .begrippen { grid-template-columns: 1fr; gap: 32px; }
  .begrip__beeld { height: auto; }
  .begrip__beeld img { max-height: 190px; }
  .punten > div { grid-template-columns: 1fr; row-gap: 2px; }
  .zelfdoen { grid-template-columns: 1fr; row-gap: 8px; padding: 18px 20px; }
  .uitleg__lijf { grid-template-columns: 1fr; }
  .uitleg { margin-inline: calc(-1 * var(--rand)); border-radius: 0; border-inline: 0; }
  .vr-label { font-size: 19px; }
  .vr-aslabel { font-size: 17px; }
  .uitleg__ruimte { border-right: 0; border-bottom: 1px solid var(--lijn); padding: 14px 4px 6px 2px; }
  .uitleg__kop, .uitleg__stappen, .uitleg__uitkomst { padding-inline: 20px; }
  .programma__legenda { justify-content: flex-start; }
  .programma__delen { flex-direction: column; gap: 22px; }
  .programma__deel { flex: none; }
  .spoor { grid-template-columns: 1fr 1fr; row-gap: 24px; }
  .deel__kop { flex-direction: column; gap: 4px; }
  .fasen li { grid-template-columns: 56px 1fr; column-gap: 16px; }
  .fasen__beeld img { width: 40px; height: 40px; }
  .fasen__beeld img + img { width: 28px; height: 28px; }
  .leerdoelen li { grid-template-columns: 40px 1fr; font-size: 1.125rem; }

  .voet__boven { grid-template-columns: 1fr; row-gap: 44px; }
  .voet__regel { margin-top: 28px; }
  .voet__merk .knop { margin-top: 32px; }
  .voet__onder { flex-direction: column; }
  :root { --bundel-w: 700px; --bundel-h: 2400px; --bundel-d: 1000px; --bundel-x: 170px; }
  .wij__fotos { gap: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0s !important; animation-duration: 0s !important; scroll-behavior: auto !important; }
}
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

.overzicht { --tussen: clamp(32px, 4.4vw, 64px); margin-top: 56px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(64px, 6.5vw, 96px) var(--tussen); }
.training { position: relative; display: flex; flex-direction: column; }
.training__beeld { position: relative; margin-bottom: 48px; }
.training__foto { display: block; overflow: hidden; border-radius: var(--r-groot); background: var(--vlak-2); }
.training__foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.training__tekening {
  position: absolute; right: 28px; bottom: -32px; width: 112px; height: 112px; display: grid; place-items: center;
  background: var(--wit); border: 1px solid var(--lijn); border-radius: var(--r);
}
.training__tekening img { width: 84px; height: 84px; }
.training h3 { margin-top: 8px; font-size: var(--t-h3); line-height: 1.1; letter-spacing: -0.025em; }
.training h3 a { color: inherit; text-decoration: none; }
.training h3 a::after { content: ""; position: absolute; inset: -12px; border-radius: 18px; }
.training h3 a:focus-visible { outline: none; }
.training h3 a:focus-visible::after { outline: 3px solid var(--inkt); outline-offset: 0; }
.training__tekst { margin-top: 14px; font-size: 1.1875rem; line-height: 1.55; max-width: 32em; }
@media (max-width: 720px) {
  .overzicht { grid-template-columns: minmax(0, 1fr); margin-top: 40px; }
  .training__tekening { right: 16px; bottom: -28px; width: 96px; height: 96px; }
  .training__tekening img { width: 72px; height: 72px; }
}

.nb { white-space: nowrap; }
.tegel__pijl { display: inline-block; width: 0.62em; height: 0.62em; margin-left: 0.32em; vertical-align: 0.04em; transition: transform 260ms cubic-bezier(.2, .7, .2, 1); }
.mega__tegel img, .training__foto img { transition: transform 700ms cubic-bezier(.2, .7, .2, 1); }
.mega__tegel:hover img, .training:hover .training__foto img { transform: scale(1.02); }
.mega__tegel:hover .tegel__pijl, .mega__tegel:focus-visible .tegel__pijl,
.training:hover .tegel__pijl, .training:focus-within .tegel__pijl,
.mobielmenu__tegel:hover .tegel__pijl { transform: translateX(3px); }

.nav__groep { display: flex; align-items: center; }
.nav__item--groep { padding-right: 4px; }
.nav__item--groep::after { right: 4px; }
.nav__groep:has(.nav__open[aria-expanded="true"]) .nav__item--groep:not(.is-actief):not([aria-current])::after { transform: scaleX(1); }
.nav__open {
  display: inline-grid; place-items: center; width: 30px; height: 36px; margin-right: 10px; border-radius: 6px;
  color: var(--inkt); transition: background-color var(--snel);
}
.nav__open:hover, .nav__open[aria-expanded="true"] { background: var(--vlak); }
.nav__open svg { width: 12px; height: 12px; transition: transform var(--snel); }
.nav__open[aria-expanded="true"] svg { transform: rotate(180deg); }

.doelen { margin-top: 22px; border-bottom: 1px solid var(--lijn); }
.doelen li {
  display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; column-gap: 14px; align-items: start;
  padding: 11px 0; border-top: 1px solid var(--lijn);
  font-size: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem); line-height: 1.4; color: var(--inkt);
}
.doelen li b { font-weight: 800; }
.doelen__vink { width: 18px; height: 18px; margin-top: 0.18em; color: var(--inkt); }
.doelen__deel { padding-top: 0.15em; font-size: 0.9375rem; font-weight: 500; line-height: 1.3; color: var(--gedempt); text-decoration: none; white-space: nowrap; }
.doelen__deel:hover { color: var(--inkt); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 520px) {
  .doelen li { grid-template-columns: 18px minmax(0, 1fr); }
  .doelen__deel { display: none; }
}

.maatwerkblok { background: var(--vlak); border-radius: var(--r-groot); padding: clamp(24px, 3vw, 44px) clamp(24px, 4vw, 56px); }
.maatwerkblok h2 { font-size: var(--t-h3); }
#maatwerk.sectie { padding-top: clamp(48px, 5vw, 80px); }
.maatwerkblok__kop { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); column-gap: var(--goot); align-items: end; }
.maatwerkblok__tekst { font-size: var(--t-tekst); line-height: 1.5; color: var(--inkt); }
.maatwerkblok .sectie__knop { margin-top: 14px; }

.portret { background: var(--vlak-2); }
.wij__tekst { margin-top: 24px; }
.wij__fotos img.portret { aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 100%; }

.held__foto.duo { display: grid; grid-template-columns: 1fr 1fr; background: var(--vlak-2); }
.duo figure { position: relative; overflow: hidden; }
.held__foto.duo img { object-fit: contain; object-position: 50% 100%; }
.duo figcaption {
  position: absolute; left: clamp(12px, 1.6vw, 24px); top: clamp(12px, 1.6vw, 24px);
  padding: 6px 12px; border-radius: 6px; background: var(--wit); color: var(--inkt); font-size: 0.9375rem; font-weight: 700; line-height: 1.3;
}
.gesprek--contact .gesprek__in { align-items: start; }
.gesprek--contact h2 { font-size: clamp(2.25rem, 1.4rem + 2.7vw, 3.75rem); line-height: 1.02; letter-spacing: -0.035em; max-width: 10em; }
.gesprek__subkop { margin-top: 36px; font-size: 1rem; font-weight: 700; color: var(--wit); }
.gesprek__punten { margin-top: 12px; display: grid; gap: 8px; }
.gesprek__punten li { display: flex; gap: 12px; color: var(--op-inkt); font-size: 1.0625rem; line-height: 1.5; }
.gesprek__punten li::before { content: ""; flex: none; width: 8px; height: 8px; margin-top: 0.55em; background: var(--geel); }
.gesprek--contact .mensen { margin-top: 8px; }
.gegevens { margin-top: 36px; color: var(--op-inkt); font-size: 1.0625rem; line-height: 1.6; }
.gegevens p + p { margin-top: 12px; }
.doorverwijzing .intro { margin-top: 20px; max-width: 34em; }

@media (max-width: 1023px) {
  .maatwerkblok__kop { grid-template-columns: minmax(0, 1fr); row-gap: 20px; }

}
@media (max-width: 720px) {
  .personen { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {

  .duo figcaption { font-size: 0.875rem; padding: 4px 10px; }
}

.juridisch { max-width: 46rem; }
.juridisch h2 { font-size: var(--t-h4); line-height: 1.25; margin: 2.75rem 0 0.75rem; }
.juridisch h2:first-child, .juridisch .meta + h2 { margin-top: 0; }
.juridisch p { margin: 0 0 0.9rem; }
.juridisch ul { margin: 0.25rem 0 1rem; padding-left: 1.15rem; list-style: disc; }
.juridisch li { margin: 0.3rem 0; }
.juridisch li::marker { color: var(--gedempt); }
.juridisch .meta { color: var(--gedempt); font-size: var(--t-klein); margin-bottom: 2rem; }

html:not(.js) .mega { transition: opacity 140ms ease 260ms, visibility 0s linear 400ms; }
html:not(.js) .nav__groep:hover > .mega,
html:not(.js) .nav__groep:focus-within > .mega { visibility: visible; opacity: 1; transition: opacity 140ms ease; }