
.before-after{margin:24px 0}.comparison-stage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.comparison-stage figure{margin:0;position:relative;min-width:0}.comparison-stage img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:5px}.comparison-stage .photo-before img{object-position:center 75%}.comparison-label{position:absolute;top:12px;padding:4px 10px;background:#fff;color:#070D33;border-radius:4px;font-size:14px;font-weight:600}.photo-before .comparison-label{left:12px}.photo-after .comparison-label{right:12px}.comparison-range,.comparison-handle{display:none}.before-after.is-ready .comparison-stage{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:5px;--split:50%}.is-ready .comparison-stage figure{position:absolute;inset:0}.is-ready .comparison-stage img{width:100%;height:100%;aspect-ratio:auto;border-radius:0}.is-ready .photo-after{z-index:1}.is-ready .photo-before{z-index:2;clip-path:inset(0 calc(100% - var(--split)) 0 0)}.is-ready .comparison-range{display:block;position:absolute;inset:0;width:100%;height:100%;padding:0;margin:0;border:0;opacity:0;z-index:4;cursor:ew-resize;touch-action:none}.is-ready .comparison-handle{display:block;position:absolute;top:0;bottom:0;left:var(--split);width:3px;background:white;transform:translateX(-50%);z-index:3;pointer-events:none;box-shadow:0 0 3px #070D3360}.comparison-handle span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:white;color:#070D33;border:1px solid #dbe3ee;font-size:24px}.comparison-stage:focus-within{outline:3px solid #009EE2;outline-offset:4px}.slider-help{font-size:13px;color:var(--muted);margin:10px 0 0}.project-block{max-width:1240px;margin:auto}.recent-project-inner{max-width:900px;margin:auto}.recent-project{padding-top:36px;padding-bottom:36px}.recent-project h2{font-size:29px}.recent-project .before-after{max-width:680px;margin:20px auto}.recent-project .comparison-stage{max-height:380px}.project-detail{margin-top:24px}

/* Staande voorfoto volledig tonen, zonder inzoomen of vervormen. */
.is-ready .photo-before{background:#edf7fc}.is-ready .photo-before img{object-fit:contain;object-position:left center}

/* Vergelijkbare schaal voor een staande voorfoto en liggende nafoto. */
.before-after.is-ready .comparison-stage{aspect-ratio:1;max-width:680px;margin-inline:auto}.is-ready .photo-before{background:transparent}.is-ready .photo-before img{object-fit:cover;object-position:center 72%}.is-ready .photo-after img{object-position:center center}.recent-project .before-after{max-width:380px}.recent-project .comparison-stage{max-height:none}

/* Liggend origineelformaat: de complete veranda blijft zichtbaar. */
.before-after.is-ready .comparison-stage{aspect-ratio:4/3;max-width:760px}.is-ready .photo-after img{object-fit:contain;object-position:center;background:#edf7fc}.is-ready .photo-before img{object-fit:cover;object-position:center 72%}.recent-project .before-after{max-width:560px}

/* Uitgelijnde sliderbeelden hebben beide hetzelfde liggende kader. */
.is-ready .photo-before img,.is-ready .photo-after img{object-fit:contain;object-position:center center;background:#edf7fc}

.kozijnen-project{padding-bottom:48px;margin-bottom:48px;border-bottom:1px solid #dbe3ee}.kozijnen-project .before-after.is-ready .comparison-stage{aspect-ratio:3/4;max-width:480px}.kozijnen-project .project-photos img{aspect-ratio:3/4;object-fit:contain}.kozijnen-project .comparison-stage img{object-position:center}

.schuifwanden-project{padding-bottom:48px;margin-bottom:48px;border-bottom:1px solid #dbe3ee}.schuifwanden-project .before-after.is-ready .comparison-stage{aspect-ratio:3/4;max-width:480px}.schuifwanden-project .project-photos{grid-template-columns:repeat(2,minmax(0,1fr))}.schuifwanden-project .project-photos img{aspect-ratio:3/4;object-fit:contain;object-position:center}@media(max-width:800px){.schuifwanden-project .project-photos{grid-template-columns:minmax(0,1fr)}}

.winterswijk-project{padding-bottom:48px;margin-bottom:48px;border-bottom:1px solid #dbe3ee}.winterswijk-project .project-photos{grid-template-columns:repeat(2,minmax(0,1fr))}.winterswijk-project .project-photos img{object-fit:contain;object-position:center;background:#edf7fc}@media(max-width:800px){.winterswijk-project .project-photos{grid-template-columns:minmax(0,1fr)}}

.neuss-project{padding-bottom:48px;margin-bottom:48px;border-bottom:1px solid #dbe3ee}

.bemmel-project{padding-bottom:48px;margin-bottom:48px;border-bottom:1px solid #dbe3ee}.bemmel-project .project-photos{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:800px){.bemmel-project .project-photos{grid-template-columns:minmax(0,1fr)}}

.amersfoort-tuin-project{padding-bottom:48px;margin-bottom:48px;border-bottom:1px solid #dbe3ee}.amersfoort-tuin-project .before-after.is-ready .comparison-stage{aspect-ratio:3/4;max-width:480px}.amersfoort-tuin-project .project-photos img{aspect-ratio:3/4;object-fit:contain;object-position:center;background:#edf7fc}

.amersfoort-tuin-project .before-after.is-ready .comparison-stage{aspect-ratio:1125/1312;max-width:560px}

.zevenaar-project{padding-bottom:48px;margin-bottom:48px;border-bottom:1px solid #dbe3ee}.zevenaar-project .project-photos img{object-fit:contain;object-position:center;background:#edf7fc}

.ulft-kozijnen-project{padding-bottom:48px;margin-bottom:48px;border-bottom:1px solid #dbe3ee}.ulft-kozijnen-project .before-after.is-ready .comparison-stage{aspect-ratio:3/4;max-width:480px}.ulft-kozijnen-project .project-photos img{aspect-ratio:3/4;object-fit:contain;object-position:center;background:#edf7fc}.ulft-kozijnen-project .project-photos{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:800px){.ulft-kozijnen-project .before-after.is-ready .comparison-stage{aspect-ratio:3/4;max-width:480px}.ulft-kozijnen-project .project-photos img{aspect-ratio:3/4;object-fit:contain;object-position:center;background:#edf7fc}.ulft-kozijnen-project .project-photos{grid-template-columns:minmax(0,1fr)}}
