:where(.hm,.hm-dlg,.hm-reken){--ink: #1d1d1f;--ink-vlak: #19252c;--grijs: #6e6e73;--licht: #86868b;--oranje: #e88a5d;--diep: #a75832;--lijn: rgba(29, 29, 31, .09);--r-kaart: var(--staal-r-kaart, 14px);--r-knop: var(--staal-r-knop, 10px);--r-klein: var(--staal-r-klein, 6px);--zacht: cubic-bezier(.22, 1, .36, 1);--veer: cubic-bezier(.25, 1.15, .35, 1);--f: Manrope, "Helvetica Neue", system-ui, -apple-system, sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace;--glas-rand: inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 0 0 1px rgba(255, 255, 255, .55), 0 0 0 1px rgba(29, 29, 31, .06);--pil: linear-gradient(180deg, #e88a5d, #e88a5d);--pil-schaduw: inset 0 1px 0 rgba(255, 255, 255, .45), inset 0 -1px 0 rgba(167, 88, 50, .15), 0 8px 18px -8px rgba(167, 88, 50, .75);--kaart-schaduw: 0 0 0 1px rgba(25, 37, 44, .05), 0 1px 2px rgba(25, 37, 44, .04), 0 22px 44px -30px rgba(16, 45, 51, .38)}.hm-reken,.hm-dlg{font-family:var(--f);color:var(--ink);-webkit-font-smoothing:antialiased}.hm-reken *,.hm-reken *:before,.hm-reken *:after,.hm-dlg *,.hm-dlg *:before,.hm-dlg *:after{box-sizing:border-box}.hm-reken :where(p,dl,dd,ul,fieldset,legend,h2){margin:0;padding:0}.hm-reken :where(ul){list-style:none}.hm-reken :where(fieldset){border:0;min-width:0}.hm-reken [hidden],.hm-dlg [hidden]{display:none!important}.hm-reken :focus-visible,.hm-dlg :focus-visible{outline:2px solid var(--oranje);outline-offset:3px}.hm-dlg .hm-oog{display:inline-flex;align-items:center;gap:9px;font:500 11px/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--grijs)}.hm-reken .hm-knop{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 20px;border:0;border-radius:var(--r-knop);font:500 14.5px/1 var(--f);letter-spacing:-.01em;white-space:nowrap;cursor:pointer;text-decoration:none;transition:translate .3s var(--veer),scale .2s var(--zacht),background-color .25s var(--zacht)}.hm-reken .hm-knop--vol{background:var(--pil);box-shadow:var(--pil-schaduw);color:#fff}.hm-reken .hm-knop--glas-donker{background:#ffffff1f;box-shadow:inset 0 1px #ffffff38,inset 0 0 0 1px #fff3;color:#fff}.hm-reken .hm-pijl{width:15px;height:15px;transition:transform .3s var(--veer)}@media(hover:hover)and (pointer:fine){.hm-reken .hm-knop:hover{translate:0 -2px}.hm-reken .hm-knop:hover .hm-pijl{transform:translate(2px,-2px)}.hm-reken .hm-knop--glas-donker:hover{background:#fff3}}.hm-reken .hm-knop:active{scale:.96}.hm-reken{container-type:inline-size}.hm-reken-binnen{display:grid;gap:14px}@container (min-width: 760px){.hm-reken-binnen{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:20px;align-items:start}.hm-reken-uitkomst{order:2;position:sticky;top:0}}.hm-reken-uitkomst{display:grid;gap:14px;padding:clamp(20px,2.2vw,28px);border-radius:var(--r-kaart);background:radial-gradient(120% 100% at 0% 0%,#22343d,#19252c 60%,#151f25);color:#fff;box-shadow:0 30px 60px -36px #102d33b3}.hm-reken-oog{font:500 10.5px/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#f5f5f7b8}.hm-reken-groot{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 2px;line-height:1}.hm-reken-euro{font:300 30px/1 var(--f);color:#e88a5d;margin-right:6px}.hm-reken-groot b{font:300 clamp(58px,12cqw,84px)/.9 var(--f);letter-spacing:-.06em;font-variant-numeric:tabular-nums}.hm-reken-cent{font:300 28px/1 var(--f);letter-spacing:-.03em;color:#f5f5f7b8;font-variant-numeric:tabular-nums}.hm-reken-groot small{flex-basis:100%;margin-top:10px;font:500 13.5px/1 var(--f);color:#f5f5f7b8}.hm-reken-zin{font-size:14.5px;line-height:1.5;color:#f5f5f7b8;min-height:3em;text-wrap:pretty}.hm-reken-balk{display:flex;height:10px;gap:3px}.hm-reken-balk i{display:block;height:100%;border-radius:3px;width:calc(var(--w, 0) * 100%);transition:width .6s var(--zacht);min-width:0}.hm-reken-balk .is-netto{background:var(--pil)}.hm-reken-balk .is-voordeel{background:#ffffff8c}.hm-reken-balk .is-wg{background:#fff3}.hm-reken-legenda{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:-4px;font-size:12px;color:#f5f5f7b8}.hm-reken-legenda li{display:inline-flex;align-items:center;gap:6px}.hm-reken-legenda li:before{content:"";width:8px;height:8px;border-radius:2px;background:#e88a5d}.hm-reken-legenda .is-voordeel:before{background:#ffffff8c}.hm-reken-legenda .is-wg:before{background:#fff3}.hm-reken-regels{display:grid;border-top:1px solid rgba(255,255,255,.1)}.hm-reken-regels>div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:14px}.hm-reken-regels dt{color:#f5f5f7b8}.hm-reken-regels dt small{display:block;font-size:11.5px;color:#f5f5f7b8}.hm-reken-regels dd{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}.hm-reken-regels .is-totaal dt{color:#fff}.hm-reken-regels .is-totaal{border-bottom:0}.hm-reken-acties{display:flex;flex-wrap:wrap;gap:8px}.hm-reken .hm-reken-acties .hm-knop{flex:1 1 auto}.hm-reken-invoer{display:grid;gap:12px}.hm-reken-groep{display:grid;gap:12px;padding:18px;border-radius:var(--r-kaart);background:#fff;box-shadow:var(--kaart-schaduw)}.hm-reken-groep legend,.hm-reken-label label{font:600 14.5px/1.2 var(--f);letter-spacing:-.01em;color:var(--ink)}.hm-reken-groep legend{float:left;width:100%}.hm-reken-groep legend+*{clear:both}.hm-reken-label{display:flex;align-items:center;justify-content:space-between;gap:12px}.hm-reken-label output{font:600 15px/1 var(--f);font-variant-numeric:tabular-nums}.hm-reken-hint{font-size:12.5px;line-height:1.45;color:var(--licht)}.hm-reken-fietsen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}@container (min-width: 520px){.hm-reken-fietsen{grid-template-columns:repeat(3,minmax(0,1fr))}}.hm-fietskeus{position:relative;cursor:pointer}.hm-fietskeus input{position:absolute;opacity:0;pointer-events:none}.hm-fietskeus span{display:grid;grid-template-columns:40px minmax(0,1fr);grid-template-rows:auto auto;column-gap:8px;align-items:center;min-height:56px;padding:8px 10px 8px 7px;border-radius:var(--r-knop);background:#f4f3f0;transition:background-color .25s var(--zacht),color .25s var(--zacht),box-shadow .25s var(--zacht),scale .2s var(--zacht)}.hm-fietskeus img{grid-row:span 2;width:40px;height:28px;object-fit:contain;mix-blend-mode:multiply}.hm-fietskeus b{font:600 13px/1.15 var(--f);letter-spacing:-.01em;text-wrap:balance}.hm-fietskeus small{font:500 11.5px/1.2 var(--f);color:var(--grijs)}.hm-fietskeus--eigen span{grid-template-columns:minmax(0,1fr);padding-left:12px}.hm-fietskeus input:checked+span{background:var(--pil);box-shadow:var(--pil-schaduw);color:#fff}.hm-fietskeus input:checked+span small{color:#f5f5f7b8}.hm-fietskeus input:checked+span img{mix-blend-mode:normal;filter:drop-shadow(0 2px 3px rgba(167,88,50,.3))}.hm-fietskeus input:focus-visible+span{outline:2px solid var(--oranje);outline-offset:2px}.hm-fietskeus:active span{scale:.97}@media(hover:hover)and (pointer:fine){.hm-fietskeus input:not(:checked)+span:hover{background:#ebe9e4}}.hm-reken-eigen{display:grid;gap:8px;margin-top:4px}.hm-reken-eigen label{font:500 13px var(--f);color:var(--grijs)}.hm-reken-bedrag{display:flex;align-items:center;gap:6px;height:48px;padding:0 14px;border-radius:var(--r-knop);background:#f4f3f0;box-shadow:inset 0 0 0 1px #19252c0f}.hm-reken-bedrag span{font:500 16px var(--f);color:var(--grijs)}.hm-reken-bedrag input{flex:1;min-width:0;height:100%;border:0;background:none;font:600 18px/1 var(--f);color:var(--ink);font-variant-numeric:tabular-nums;outline:0}.hm-reken-bedrag:focus-within{box-shadow:inset 0 0 0 2px var(--oranje)}.hm-reken-bedrag--klein{height:40px;width:118px;padding:0 10px}.hm-reken-bedrag--klein input{font-size:16px;text-align:right}.hm-schuif{--v: 50%;-webkit-appearance:none;appearance:none;width:100%;height:28px;margin:0;background:transparent;cursor:pointer}.hm-schuif::-webkit-slider-runnable-track{height:6px;border-radius:3px;background:linear-gradient(90deg,#e88a5d 0 var(--v),#e7e5e0 var(--v) 100%)}.hm-schuif::-moz-range-track{height:6px;border-radius:3px;background:linear-gradient(90deg,#e88a5d 0 var(--v),#e7e5e0 var(--v) 100%)}.hm-schuif::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-10px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #19252c14,0 4px 12px -2px #19252c4d;transition:scale .2s var(--veer)}.hm-schuif::-moz-range-thumb{width:26px;height:26px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #19252c14,0 4px 12px -2px #19252c4d}.hm-schuif:active::-webkit-slider-thumb{scale:1.12}.hm-schuif:focus-visible{outline:0}.hm-schuif:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px #e88a5d80,0 4px 12px -2px #19252c4d}.hm-seg{--i: 0;--n: 3;position:relative;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));padding:4px;border-radius:var(--r-knop);background:#f0efeb}.hm-seg--2{--n: 2}.hm-seg:before{content:"";position:absolute;top:4px;bottom:4px;left:4px;width:calc((100% - 8px) / var(--n));border-radius:calc(var(--r-knop) - 3px);background:var(--pil);box-shadow:var(--pil-schaduw);transform:translate(calc(var(--i) * 100%));transition:transform .42s var(--veer)}.hm-seg:has(label:nth-child(2) input:checked){--i: 1}.hm-seg:has(label:nth-child(3) input:checked){--i: 2}.hm-seg label{position:relative;z-index:1;cursor:pointer}.hm-seg input{position:absolute;opacity:0;pointer-events:none}.hm-seg span{display:grid;place-items:center;height:40px;border-radius:calc(var(--r-knop) - 3px);font:500 14px/1 var(--f);color:var(--grijs);transition:color .25s var(--zacht)}.hm-seg input:checked+span{color:#fff}.hm-seg input:focus-visible+span{outline:2px solid var(--oranje);outline-offset:1px}.hm-reken-deel{display:grid;gap:6px}.hm-reken-uitleg{padding:4px 4px 0}.hm-reken-uitleg summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;list-style:none;font:500 13.5px var(--f);color:var(--grijs)}.hm-reken-uitleg summary::-webkit-details-marker{display:none}.hm-reken-uitleg summary:after{content:"+";font-weight:400;transition:transform .3s var(--veer)}.hm-reken-uitleg[open] summary:after{transform:rotate(45deg)}.hm-reken-uitleg p{margin-top:10px;font-size:13px;line-height:1.55;color:var(--grijs)}.hm-dlg{width:min(1060px,calc(100% - 32px));max-width:none;max-height:min(900px,calc(100svh - 32px));margin:auto;padding:clamp(18px,2.2vw,28px);border:0;border-radius:var(--r-kaart);background:#f6f5f2;color:var(--ink);overflow:auto;overscroll-behavior:contain;box-shadow:0 50px 120px -30px #0810148c,0 0 0 1px #fff9}.hm-dlg::backdrop{background:#0e161b70;-webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2)}.hm-dlg[open]{animation:hm-dlg-in .6s var(--veer) both}.hm-dlg[open]::backdrop{animation:hm-vervaag .35s var(--zacht) both}.hm-dlg.is-dicht{animation:hm-dlg-uit .24s var(--zacht) both}.hm-dlg.is-dicht::backdrop{animation:hm-vervaag .24s var(--zacht) reverse both}@keyframes hm-dlg-in{0%{opacity:0;transform:translateY(28px) scale(.955)}}@keyframes hm-dlg-uit{to{opacity:0;transform:translateY(14px) scale(.98)}}@keyframes hm-vervaag{0%{opacity:0}}.hm-dlg-kop{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:18px}.hm-dlg-kop h2:focus{outline:0}.hm-dlg-kop h2{margin-top:10px;font:300 clamp(28px,3vw,42px)/1.02 var(--f);letter-spacing:-.05em}.hm-dlg-dicht{display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;border-radius:var(--r-knop);background:#fff;box-shadow:var(--kaart-schaduw);cursor:pointer;transition:scale .2s var(--zacht),rotate .4s var(--veer)}.hm-dlg-dicht svg{width:16px;height:16px;fill:none;stroke:var(--ink-vlak, var(--ink));stroke-width:1.8;stroke-linecap:round}.hm-dlg-dicht:active{scale:.92}@media(hover:hover)and (pointer:fine){.hm-dlg-dicht:hover{rotate:90deg}}html.hm-geen-scroll{overflow:hidden}@media(max-width:749px){.hm-dlg{width:100%;max-height:94svh;margin:auto 0 0;padding:16px 14px calc(16px + env(safe-area-inset-bottom,0px));border-radius:var(--r-kaart) var(--r-kaart) 0 0}.hm-dlg[open]{animation:hm-sheet-in .55s var(--zacht) both}.hm-dlg.is-dicht{animation:hm-sheet-uit .28s var(--zacht) both}.hm-dlg-kop h2{font-size:26px}}@keyframes hm-sheet-in{0%{transform:translateY(100%)}}@keyframes hm-sheet-uit{to{transform:translateY(100%)}}@media(prefers-reduced-motion:reduce){.hm-reken *,.hm-dlg,.hm-dlg *{animation-duration:.01ms!important;transition-duration:.01ms!important}}.hm-reken-label label small{margin-left:6px;font-size:11px;font-weight:400;color:var(--licht)}.hm-fietskeus span{transition:opacity .35s ease}.hm-fietskeus.is-boven span{opacity:.42}.hm-fietskeus.is-boven:after{content:"boven budget";position:absolute;right:8px;top:6px;font:500 9px/1 IBM Plex Mono,monospace;letter-spacing:.08em;text-transform:uppercase;color:#a75832;pointer-events:none}.hm-reken-budget{margin:8px 0 2px;padding:9px 12px;border-radius:10px;font-size:13px;line-height:1.4;background:#e88a5d1a;color:#a75832}.hm-reken-budget.is-past{background:#2f7a5a1a;color:#25684b}.hm-reken-budget.is-past:before{content:"\2713  ";font-weight:700}
/*# sourceMappingURL=/cdn/shop/t/49/assets/staal-reken.css.map */