/* Homepage. */
header#hdr{position:sticky;top:0;z-index:60;background:var(--vlak);border-bottom:1px solid transparent;transition:border-color .3s,background-color .4s}header#hdr.stuck{border-bottom-color:var(--lijn)}header#hdr .bar{display:flex;align-items:center;gap:24px;padding-block:12px;flex-wrap:nowrap}header#hdr .logo{display:flex;align-items:center;min-height:48px;text-decoration:none}header#hdr .logo svg{display:block;height:40px;width:auto}header#hdr .sp{margin-left:auto}header#hdr nav{display:flex;gap:24px}header#hdr nav a{position:relative;display:inline-flex;align-items:center;min-height:48px;white-space:nowrap;color:var(--tekst);font-size:16px;font-weight:500;text-decoration:none}header#hdr nav a::after{content:"";position:absolute;left:0;right:100%;bottom:10px;height:2px;border-radius:2px;background:var(--blauw);transition:right .34s var(--glij)}header#hdr nav a:focus-visible::after{right:0}header#hdr .ctrls{display:flex;align-items:center;gap:8px}header#hdr .langs{display:inline-flex;gap:4px;padding:3px;border-radius:24px 24px 24px 4px;border:1px solid var(--lijn)}header#hdr .langs button{font:inherit;font-size:14px;font-weight:700;letter-spacing:.02em;cursor:pointer;height:40px;min-width:44px;padding:0 12px;border:0;border-radius:20px 20px 20px 4px;background:transparent;color:var(--zacht);transition:background-color .24s var(--glij),color .24s var(--glij),border-radius .32s var(--veer)}header#hdr .langs button[aria-pressed="true"]{background:var(--tekst);color:var(--vlak)}header#hdr .themebtn{position:relative;display:grid;place-items:center;width:48px;height:48px;padding:0;cursor:pointer;background:transparent;color:var(--tekst);border:1px solid var(--lijn);border-radius:24px 24px 24px 4px;transition:border-radius .32s var(--veer),border-color .24s,transform .16s var(--glij)}header#hdr .themebtn:active{transform:scale(.92)}header#hdr .themebtn .ico{position:absolute;width:22px;height:22px;display:block;transition:opacity .28s,transform .48s var(--veer)}header#hdr .themebtn .sun{opacity:0;transform:rotate(-120deg) scale(.4)}header#hdr .themebtn .moon{opacity:1;transform:none}html[data-theme="dark"] header#hdr .themebtn .sun{opacity:1;transform:none}html[data-theme="dark"] header#hdr .themebtn .moon{opacity:0;transform:rotate(120deg) scale(.4)}@media (hover:hover){header#hdr nav a:hover::after{right:0}header#hdr .langs button:hover{border-radius:20px 20px 4px 20px}header#hdr .themebtn:hover{border-radius:24px 24px 4px 24px;border-color:var(--tekst)}}@media (max-width:719px){header#hdr .bar{flex-wrap:wrap;row-gap:0;padding-bottom:4px}header#hdr .sp{display:none}header#hdr .logo{order:1}header#hdr .ctrls{order:2;margin-left:auto}header#hdr nav{order:3;flex-basis:100%;gap:20px}}@font-face{font-family:"Satoshi";src:url("../fonts/satoshi-variable.woff2") format("woff2");font-weight:300 900;font-style:normal;font-display:swap}:root{--bot:#F5F8FA;--wit:#FFFFFF;--inkt:#012333;--grafiet:#3F5A67;--lucht:#86D2F9;--abrikoos:#FFCA7F;--blauw:#4895EA;--logo-1:#86D2F9;--logo-2:#FFCA7F;--logo-3:#4895EA;--vlak:#F5F8FA;--tekst:#012333;--zacht:#3F5A67;--lijn:#D2E1EA;--diep:#012333;--logo-word:#012333;--kantlijn:20px;--veer:cubic-bezier(.34,1.4,.64,1);--glij:cubic-bezier(.2,.8,.2,1);color-scheme:light}html[data-theme="dark"]{--vlak:#012333;--tekst:#EAF4FA;--zacht:#9FC0D2;--lijn:#0F4A66;--diep:#06344A;--logo-word:#EAF4FA;color-scheme:dark}@media (prefers-color-scheme:dark){html:not([data-theme]){--vlak:#012333;--tekst:#EAF4FA;--zacht:#9FC0D2;--lijn:#0F4A66;--diep:#06344A;--logo-word:#EAF4FA;color-scheme:dark}}@media (min-width:768px){:root{--kantlijn:48px}}*,*::before,*::after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;overflow-x:clip}body{margin:0;background:var(--vlak);color:var(--tekst);font-family:"Satoshi",system-ui,sans-serif;font-size:18px;line-height:28px;-webkit-font-smoothing:antialiased;overflow-x:clip;transition:background-color .4s,color .4s}img{display:block;max-width:100%;height:auto}h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}ul,ol{padding:0;list-style:none}button{font:inherit;color:inherit}::selection{background:var(--abrikoos);color:var(--inkt)}section[id],div[id],details[id]{scroll-margin-top:96px}@media (max-width:719px){section[id],div[id],details[id]{scroll-margin-top:128px}}.wrap{max-width:1216px;margin-inline:auto;padding-inline:var(--kantlijn)}a{color:inherit;text-decoration-line:underline;text-decoration-thickness:2px;text-underline-offset:4px}:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:4px}.naar-inhoud{position:absolute;left:var(--kantlijn);top:-64px;padding:8px 16px;z-index:70;background:var(--tekst);color:var(--vlak);border-radius:4px;text-decoration:none}.naar-inhoud:focus{top:16px}.held{display:grid;gap:32px;align-items:center;padding-block:32px 48px}.held h1{font-size:44px;line-height:48px;font-weight:800;letter-spacing:-.04em;max-width:13em;text-wrap:balance}.held .wie{margin-top:20px;font-size:18px;line-height:28px;font-weight:500;color:var(--zacht)}@media (min-width:960px){.held{grid-template-columns:minmax(0,7fr) minmax(0,5fr);padding-block:64px}.held h1{font-size:76px;line-height:80px}.held .wie{margin-top:32px;font-size:20px;line-height:32px}}.merk{--u:2.6px;position:relative;width:calc(68 * var(--u));height:calc(100 * var(--u));justify-self:center;cursor:default}@media (min-width:960px){.merk{--u:3.2px}}.merk i{position:absolute;display:block}.merk .v1{left:0;top:0;width:calc(32 * var(--u));height:calc(64 * var(--u));background:var(--lucht);border-radius:calc(16 * var(--u)) calc(4 * var(--u)) calc(4 * var(--u)) calc(4 * var(--u))}.merk .v2{left:0;top:calc(68 * var(--u));width:calc(32 * var(--u));height:calc(32 * var(--u));background:var(--abrikoos);border-radius:calc(4 * var(--u)) calc(4 * var(--u)) calc(4 * var(--u)) calc(16 * var(--u))}.merk .v3{left:calc(36 * var(--u));top:calc(68 * var(--u));width:calc(32 * var(--u));height:calc(32 * var(--u));background:var(--blauw);overflow:hidden;border-radius:calc(16 * var(--u)) calc(16 * var(--u)) calc(16 * var(--u)) calc(4 * var(--u))}.merk .v3 img{width:100%;height:100%;object-fit:cover;object-position:50% 12%}.js .merk:not(.staat) .v1{transform:translateY(calc(-12 * var(--u)));opacity:0}.js .merk:not(.staat) .v2{transform:translateX(calc(-12 * var(--u)));opacity:0}.js .merk:not(.staat) .v3{transform:scale(.4) rotate(-20deg);opacity:0}.merk .v1{transition:transform .56s var(--veer),opacity .32s}.merk .v2{transition:transform .56s var(--veer) .09s,opacity .32s .09s}.merk .v3{transition:transform .64s var(--veer) .18s,opacity .32s .18s}.merk.klaar i{transition-delay:0s}.tussen{padding-block:96px 48px;display:grid;gap:16px}.tussen h2{font-size:32px;line-height:36px;font-weight:800;letter-spacing:-.03em;text-wrap:balance}.tussen .zin{font-size:18px;line-height:28px;font-weight:500;color:var(--zacht);max-width:32em}@media (min-width:960px){.tussen{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:64px;align-items:end;padding-block:128px 64px}.tussen h2{font-size:48px;line-height:52px}.tussen .zin{font-size:20px;line-height:32px}}.over{padding-block:96px 32px;display:grid;gap:24px}.over h2{font-size:32px;line-height:36px;font-weight:800;letter-spacing:-.03em}.over .zin{font-size:20px;line-height:32px;font-weight:500;max-width:30em}.cv{margin-top:8px}.cv summary{list-style:none;cursor:pointer;margin-top:24px}.cv summary::-webkit-details-marker{display:none}.cv summary .dicht{display:none}.cv[open] summary .open{display:none}.cv[open] summary .dicht{display:inline}.cv summary .chevron{width:16px;height:16px;margin-right:-4px;transition:transform .4s var(--veer)}.cv[open] summary .chevron{transform:rotate(180deg)}.cv::details-content{block-size:0;overflow:clip;transition:block-size .48s var(--glij),content-visibility .48s allow-discrete}.cv[open]::details-content{block-size:auto}@supports (interpolate-size:allow-keywords){:root{interpolate-size:allow-keywords}}.cv h3{margin-top:32px;font-size:16px;line-height:24px;font-weight:700}.cv dl{display:grid;gap:12px;margin-top:12px}.cv dl div{display:grid}.cv dt{color:var(--zacht);font-size:16px;line-height:24px;font-variant-numeric:tabular-nums}@media (min-width:960px){.over{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:64px;padding-block:160px 48px}.over h2{font-size:48px;line-height:52px}.cv dl div{grid-template-columns:200px 1fr;column-gap:24px}}@media (hover:hover){.merk:hover .v1{transform:translate(calc(-2 * var(--u)),calc(-2 * var(--u)))}.merk:hover .v2{transform:translate(calc(-2 * var(--u)),calc(2 * var(--u)))}.merk:hover .v3{transform:translate(calc(2 * var(--u)),calc(2 * var(--u))) rotate(-4deg)}}@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;transition-delay:0s!important;animation:none!important;scroll-behavior:auto!important}html{scroll-behavior:auto}}/* Telefoon: de vormen naast de regel onder de kop, zodat het werk sneller in beeld komt. */
@media (max-width:959px){.held{grid-template-columns:minmax(0,1fr) auto;column-gap:16px;row-gap:16px}
  .held>div:first-child{display:contents}
  .held h1{grid-column:1/-1}
  .held .wie{grid-column:1;margin-top:0;align-self:end}
  .held .merk{--u:2px;grid-column:2;grid-row:2;justify-self:end}}

/* Het eerste project begint in het eerste scherm. */
#werk>.tussen:first-child{padding-top:48px}
@media (min-width:960px){#werk>.tussen:first-child{padding-block:64px 40px}}
