@property --pos{syntax: "<percentage>"; inherits: true; initial-value: 50%;}.voorna{position:relative;width:100%;overflow:hidden;border-radius:var(--radius);background:var(--tegel);user-select:none;-webkit-user-select:none;touch-action:pan-y;cursor:ew-resize;isolation:isolate}.voorna img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}.voorna__voor{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--pos)) 0 0)}.voorna__lijn{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;margin-left:-1px;background:var(--wit);box-shadow:0 0 0 .5px #2c1d1640;pointer-events:none}.voorna__greep{position:absolute;top:50%;left:var(--pos);width:56px;height:56px;margin:-28px 0 0 -28px;display:grid;place-items:center;border-radius:50%;background:var(--wit);color:var(--walnut);box-shadow:0 2px 10px #2c1d1638;cursor:grab;touch-action:none;transition:transform var(--duur) var(--ease)}.voorna__greep svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.voorna__greep:hover,.voorna--sleept .voorna__greep{transform:scale(1.06)}.voorna--sleept,.voorna--sleept .voorna__greep{cursor:grabbing}.voorna__greep:focus-visible{box-shadow:0 2px 10px #2c1d1638,0 0 0 3px var(--wit),0 0 0 6px var(--actie);border-radius:50%}.voorna__label{position:absolute;bottom:var(--r-4);padding:var(--r-1) var(--r-3);font-size:var(--fs-15);font-weight:450;color:var(--walnut);background:#ffffffeb;border-radius:var(--radius);pointer-events:none;transition:opacity var(--duur) var(--ease)}.voorna__label--voor{left:var(--r-4)}.voorna__label--na{right:var(--r-4)}.voorna--links .voorna__label--voor,.voorna--rechts .voorna__label--na{opacity:0}@media(max-width:560px){.voorna__greep{width:48px;height:48px;margin:-24px 0 0 -24px}.voorna__label{bottom:var(--r-3);font-size:var(--fs-13)}.voorna__label--voor{left:var(--r-3)}.voorna__label--na{right:var(--r-3)}}.stappen__lijst{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--r-7);counter-reset:stap;margin:0;padding:0}.stap{position:relative;padding-top:var(--r-5);border-top:1.5px solid var(--walnut)}.stap:before,.stap:after{content:"";position:absolute;top:-9px;width:1.5px;height:16px;background:var(--walnut)}.stap:before{left:0}.stap:last-child:after{right:0}.stap__kop{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--r-5)}.stap__nr{font-family:var(--font-display);font-size:var(--fs-33);line-height:1;color:var(--walnut)}.stap__icoon{color:var(--dusty)}.stap__titel{font-size:var(--fs-21);font-weight:550;line-height:1.3;margin-bottom:var(--r-2)}.stap__tekst{color:var(--steen);max-width:34ch}.stappen__link{margin-top:var(--r-6)}.stappen{container-type:inline-size;min-width:0}@container (max-width: 700px){.stappen__lijst{grid-template-columns:minmax(0,1fr);gap:var(--r-6)}.stap:last-child:after{display:none}}
