:root{--section-space:24px;--ink:#142a35;--paper:#f5f4ee;--lime:#d4ef85;--muted:#617078}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 Arial,Helvetica,sans-serif}a{color:inherit}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid #558618;outline-offset:5px}.wrap{max-width:1240px;margin:auto;padding:0 48px}header{position:sticky;top:0;background:#f5f4eef5;z-index:5;border-bottom:1px solid #142a3515}nav{height:90px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{text-decoration:none;font-weight:800;font-size:29px;letter-spacing:-1.7px}.logo span{color:#7b972f}.navlinks{display:flex;align-items:center;gap:32px;font-size:14px}.navlinks a{text-decoration:none}.navlinks a:hover{text-decoration:underline}.button{display:inline-flex;align-items:center;justify-content:center;gap:30px;background:var(--ink);color:white;text-decoration:none;padding:15px 23px;border-radius:5px;font-size:14px;font-weight:bold}.button.light{background:var(--lime);color:var(--ink)}.hero{padding:85px 0 80px;display:grid;grid-template-columns:1.15fr 1fr;gap:70px;align-items:center}.eyebrow{text-transform:uppercase;letter-spacing:2px;font-size:11px;font-weight:bold;display:flex;align-items:center;gap:10px}.dot{width:7px;height:7px;border-radius:50%;background:#8aa344}h1{font-size:clamp(48px,5.3vw,74px);line-height:1.04;letter-spacing:-3.8px;font-weight:600;margin:26px 0}h1 em{font-style:normal;color:#748f2c}p{margin:0 0 23px}.intro{font-size:18px;max-width:490px;color:var(--muted)}.actions{display:flex;align-items:center;gap:25px;margin-top:32px}.textlink{font-size:14px;text-underline-offset:5px}.visual{position:relative;background:var(--ink);border-radius:12px;height:430px;padding:30px;overflow:hidden;background-image:radial-gradient(#ffffff12 1px,transparent 1px);background-size:22px 22px}.vlabel{color:#c2d1d6;font:11px monospace;letter-spacing:1px}.window{margin-top:33px;border-radius:9px;background:#f8f9f4;box-shadow:0 28px 50px #0003;transform:rotate(-5deg);overflow:hidden}.windowbar{padding:13px;background:#e9ece5;display:flex;gap:5px}.windowbar i{width:6px;height:6px;border-radius:50%;background:#a8b0ac}.mock{padding:25px}.mocknav{display:flex;justify-content:space-between;font-size:10px;font-weight:bold}.mockcontent{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}.mocktitle{font-size:29px;line-height:1.1;letter-spacing:-1px;font-weight:bold}.mockline{height:5px;background:#c5cfc9;margin:12px 0;width:80%}.mockbtn{background:var(--ink);width:77px;height:21px;border-radius:3px}.shape{background:var(--lime);border-radius:6px;display:grid;place-items:center}.shape svg{width:100%;height:125px}.badge{position:absolute;right:17px;bottom:32px;background:var(--lime);padding:16px 23px;border-radius:6px;transform:rotate(4deg);font-size:13px;font-weight:bold;box-shadow:0 12px 30px #0003}.visual small{position:absolute;bottom:14px;left:25px;font-size:10px;color:#bccbd0}.strip{border-top:1px solid #142a3525;border-bottom:1px solid #142a3525;padding:24px 0;display:flex;justify-content:space-between;gap:20px;font-size:12px;color:var(--muted)}h2{font-size:clamp(34px,3.5vw,48px);line-height:1.15;letter-spacing:-2px;margin:18px 0 24px;font-weight:600}.sectiontop{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:end;margin-bottom:35px}.sectiontop p{max-width:440px;color:var(--muted)}.services{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.service{border-top:1px solid #142a3530;padding-top:25px}.number{font:12px monospace;color:#748f2c}h3{font-size:23px;letter-spacing:-.7px;line-height:1.3;margin:20px 0 14px}.service p{color:var(--muted);font-size:15px}.tags{display:flex;flex-wrap:wrap;gap:7px}.tags span{font-size:11px;border:1px solid #142a3528;border-radius:30px;padding:5px 10px}.projects{background:#e9ece4}.projectgrid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.project{background:var(--paper);border-radius:7px;padding:30px;display:flex;flex-direction:column}.project .top{display:flex;justify-content:space-between;align-items:center}.project h3{font-size:29px;margin:16px 0 12px}.project p{color:var(--muted);font-size:15px}.project a{align-self:flex-start;margin-top:auto;padding-top:22px;font-size:13px;text-underline-offset:5px}.category{font-size:10px;text-transform:uppercase;letter-spacing:1.4px}.projecticon{font-size:30px;font-weight:bold;color:#78943b}.about{display:grid;grid-template-columns:.85fr 1.15fr;gap:100px;align-items:center}.monogram{background:var(--lime);min-height:330px;border-radius:7px;padding:38px;display:flex;flex-direction:column;justify-content:space-between}.monogram strong{font-size:115px;line-height:1;letter-spacing:-10px}.monogram span{font-size:13px}.about p{color:var(--muted)}.contact{background:var(--ink);color:var(--paper)}.contactgrid{display:grid;grid-template-columns:1.2fr 1fr;gap:90px}.contact h2{font-size:52px}.contact p{color:#b6c5c9}.contactlinks{display:flex;flex-direction:column;gap:22px;justify-content:center}.contactlinks a{text-decoration:none;border-bottom:1px solid #ffffff30;padding-bottom:14px;display:flex;justify-content:space-between;font-size:22px}.contactlinks small{display:block;color:#b6c5c9;font-size:11px}.contactlinks a:hover{color:var(--lime)}footer{padding:27px 0;background:var(--ink);color:#b6c5c9;border-top:1px solid #ffffff20;font-size:11px}.foot{display:flex;justify-content:space-between;gap:25px}#menu{display:none} @media(max-width:850px){.wrap{padding:0 26px}.hero{gap:35px;grid-template-columns:1fr 1fr}h1{font-size:51px}.visual{height:370px;padding:20px}.mock{padding:19px}.mocktitle{font-size:21px}.navlinks{gap:19px}.about{gap:40px}.contactgrid{gap:40px}.contactlinks a{font-size:18px}}@media(max-width:650px){nav{height:73px}.logo{font-size:27px}#menu{display:block;border:1px solid #142a3528;border-radius:4px;background:transparent;padding:9px 13px;color:var(--ink)}.navlinks{display:none;position:absolute;top:73px;left:0;right:0;background:var(--paper);padding:22px 26px;flex-direction:column;align-items:stretch;border-bottom:1px solid #142a3520}.navlinks.open{display:flex}.hero{grid-template-columns:1fr;padding:53px 0;gap:40px}h1{font-size:55px;letter-spacing:-3px}.intro{font-size:17px}.visual{height:360px;max-width:470px;width:100%;margin:auto}.mocktitle{font-size:30px}.strip{flex-wrap:wrap;font-size:11px;gap:12px 23px}.sectiontop,.services,.about,.contactgrid{grid-template-columns:1fr;gap:24px}.sectiontop{margin-bottom:24px}.projectgrid{grid-template-columns:1fr}.service{padding:23px 0}.monogram{min-height:245px}.about{gap:37px}.contact h2{font-size:43px}.contactlinks{margin-top:15px}.foot{flex-direction:column;gap:8px}.actions{gap:18px}.button{padding:14px 18px;gap:18px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.hero{position:relative;isolation:isolate}.hero>.web-background{position:absolute;right:-38px;top:-40px;width:650px;height:620px;color:var(--ink);opacity:.12;z-index:-1;pointer-events:none}.hero>div{position:relative}@media(max-width:650px){.hero>.web-background{width:390px;height:380px;right:-20px;top:0;opacity:.10}}
.project .project-shot{display:block;align-self:stretch;padding:0;margin:0 0 26px;border:1px solid #142a3520;border-radius:6px;overflow:hidden;background:#e9ece5;text-decoration:none}.shot-bar{display:flex;align-items:center;gap:5px;padding:8px 12px;font-size:8px;color:#7c8985}.shot-bar span{margin-left:12px;font:10px monospace;color:#617078}.project-shot img{display:block;width:100%;height:auto;aspect-ratio:1.46;object-fit:cover;object-position:top;transition:filter .2s}.project-shot:hover img{filter:brightness(.94)}.project.featured{grid-column:1/-1;display:grid;grid-template-columns:1.15fr 1fr;gap:35px;align-items:center}.featured .project-shot{margin:0}.featured-copy>a{display:inline-block}.featured h3{font-size:36px}@media(max-width:650px){.project.featured{grid-template-columns:1fr;gap:24px}.featured h3{font-size:29px}.project{padding:22px}}.project .project-subtitle{font-weight:bold;color:#748f2c;margin-top:-6px}.project.secondary-featured{grid-column:1/-1;display:grid;grid-template-columns:1.15fr 1fr;gap:35px;align-items:center}.secondary-featured .project-shot{margin:0}@media(max-width:650px){.project.secondary-featured{grid-template-columns:1fr;gap:24px}}

/* Shared section spacing is controlled by --section-space. */

#diensten .service .tags{margin-bottom:0}

#over>div:last-child{padding:0}
#over>div:last-child>.textlink{display:inline-block;margin-bottom:0}

/* Apply shared vertical spacing after responsive container rules. */
main > section[id]{padding-top:var(--section-space);padding-bottom:var(--section-space)}

/* Named classes replace all inline presentation styles. */
.mockline-short{width:60%}
.monogram .monogram-dot{font-size:90px}
.accent-lime{color:var(--lime)}
.contact-address{margin-top:8px;font-size:14px}