.erf{aspect-ratio:16/10;width:100%;position:relative}.erf .erf__huis{width:62%;height:auto;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.erf .erf__ding{object-fit:contain;height:auto;position:absolute}.erf .erf__ding--tuin-links{width:26%;bottom:4%;left:0}.erf .erf__ding--tuin-rechts{width:26%;bottom:4%;right:0}.erf .erf__ding--versiering{width:17%;bottom:6%;left:17%}.erf .erf__wolkje{width:30%;position:absolute;top:0;left:0}.erf .erf__wolkje .zorgteken{font-size:clamp(11px,3.4vw,18px);top:-12%;right:-18%}.erf .erf__wolkje[data-weg] .wolkje{opacity:0}.erf .erf__plank{border-bottom:5px solid #a8733f;border-radius:0 0 4px 4px;flex-wrap:wrap-reverse;justify-content:flex-end;align-items:flex-end;gap:1%;width:34%;padding:0 2% 1.2%;display:flex;position:absolute;top:2%;right:0}.erf .erf__plank img{width:22%;height:auto}.erf .erf__ding--dier{width:15%;bottom:2%;right:20%}.wolkje{aspect-ratio:1/.9;-webkit-tap-highlight-color:transparent;width:100%;position:relative;container-type:inline-size}.wolkje[role=button]{cursor:pointer}.wolkje:focus-visible{outline:3px solid var(--hemel);outline-offset:4px;border-radius:var(--radius-wolk)}.wolkje__zweef{animation:4s ease-in-out infinite wolkje-zweef;position:absolute;inset:0}.wolkje img{pointer-events:none;user-select:none;max-width:none;height:auto;position:absolute}.wolkje .wolkje__lijf{width:80%;top:36%;left:4%}.wolkje .wolkje__gezicht{width:34%;top:64%;left:44%;transform:translate(-50%,-50%)}.wolkje[data-lijf=lang] .wolkje__gezicht{top:65%}.wolkje[data-lijf=pluizig] .wolkje__gezicht{top:66%}.wolkje .wolkje__hoed{width:34%;bottom:56%;left:44%;transform:translate(-50%)rotate(-4deg)}.wolkje[data-lijf=lang] .wolkje__hoed{bottom:54%}.wolkje .wolkje__hoed--tovenaar,.wolkje .wolkje__hoed--feest,.wolkje .wolkje__hoed--muts{width:26%}.wolkje .wolkje__hoed--bloemen{width:36%;bottom:50%;transform:translate(-50%)scaleY(.55)}.wolkje .wolkje__ding{width:26%;top:18%;right:0;transform:rotate(8deg)}.wolkje .wolkje__ding--vlinder{width:20%;top:26%}.wolkje .wolkje__ding--paraplu{width:30%;top:10%}.wolkje.is-reactie .wolkje__zweef{animation:.6s ease-in-out 2 wolkje-wiebel}.wolkje[data-reactie=onweer] .wolkje__lijf{filter:brightness(.7);transition:filter .3s}.wolkje__effect{pointer-events:none;position:absolute;inset:0}.wolkje__drup{left:calc(16% + var(--i) * 7%);aspect-ratio:1/1.6;opacity:0;width:3%;animation:wolkje-val .9s ease-in calc(var(--i) * .11s) 2;background:#6aa8e0;border-radius:50%/60% 60% 40% 40%;position:absolute;top:82%}.wolkje__vlok{left:calc(14% + var(--i) * 8.5%);color:#9cc6ee;opacity:0;animation:wolkje-val 1.6s linear calc(var(--i) * .13s) 1;font-size:clamp(10px,5cqi,22px);position:absolute;top:78%}.wolkje__boog{opacity:0;width:84%;animation:2.2s ease-out forwards wolkje-boog;position:absolute;top:0;left:2%}.wolkje__zzz{font-family:var(--font-kop,inherit);color:var(--inkt-zacht);font-size:clamp(14px,8cqi,34px);font-weight:800;animation:2.2s ease-out forwards wolkje-zzz;position:absolute;top:18%;right:10%}.wolkje__zzz small{font-size:.7em}.wolkje__flits{font-size:clamp(16px,10cqi,40px);animation:.5s steps(2,end) 3 wolkje-flits;position:absolute;top:80%;left:34%}@keyframes wolkje-zweef{50%{transform:translateY(-3%)}}@keyframes wolkje-wiebel{25%{transform:rotate(-5deg)scale(1.04)}75%{transform:rotate(5deg)scale(1.04)}}@keyframes wolkje-val{10%{opacity:1}to{opacity:0;transform:translateY(240%)}}@keyframes wolkje-boog{20%,80%{opacity:.9}to{opacity:0}}@keyframes wolkje-zzz{0%{opacity:0;transform:translateY(20%)}30%{opacity:1}to{opacity:0;transform:translate(20%,-60%)}}@keyframes wolkje-flits{0%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:reduce){.wolkje__zweef,.wolkje.is-reactie .wolkje__zweef{animation:none}}.wolkje .wolkje__regenscherm{z-index:1;width:46%;top:-2%;left:22%;transform:rotate(-8deg)}.wolkje[data-weer=regen] .wolkje__regenscherm~.wolkje__hoed,.wolkje[data-weer=onweer] .wolkje__regenscherm~.wolkje__hoed{display:none}.wolkje[data-weer=sneeuw] .wolkje__zweef{animation:.25s linear infinite wolkje-ril}.wolkje[data-weer=wind] .wolkje__zweef{animation:1.6s ease-in-out infinite wolkje-waai}.wolkje[data-weer=zon]:not([data-nacht=true]) .wolkje__lijf{filter:drop-shadow(0 0 10px #ffd65acc)}.wolkje[data-weer=onweer] .wolkje__lijf{filter:brightness(.75)}.wolkje[data-weer=mist]{opacity:.7}@keyframes wolkje-ril{25%{transform:translate(-1.5%)}75%{transform:translate(1.5%)}}@keyframes wolkje-waai{50%{transform:translate(4%)rotate(4deg)}}@media (prefers-reduced-motion:reduce){.wolkje[data-weer] .wolkje__zweef{animation:none}}.zorgteken{z-index:2;aspect-ratio:1;border:2px solid var(--inkt);background:var(--oppervlak);pointer-events:none;border-radius:50% 50% 50% 8%;place-items:center;width:1.9em;line-height:1;animation:1.6s ease-in-out infinite zorgteken-wip;display:grid;position:absolute;box-shadow:0 2px #00000026}@keyframes zorgteken-wip{0%,to{translate:0}50%{translate:0 -12%}}@media (prefers-reduced-motion:reduce){.zorgteken{animation:none}}.voorbeeld__balk{justify-content:space-between;align-items:center;gap:var(--ruimte-2);padding:var(--ruimte-2) var(--ruimte-3);border:3px dashed var(--zon);border-radius:var(--radius-wolk);background:var(--oppervlak);flex-wrap:wrap;display:flex}.voorbeeld .hemel a{display:block}.voorbeeld__huis{align-items:start;gap:var(--ruimte-3);padding:var(--ruimte-3);border-radius:var(--radius-wolk);background:var(--oppervlak);scroll-margin-top:var(--ruimte-2);grid-template-columns:minmax(0,1fr) minmax(0,1fr);display:grid!important}.voorbeeld__huis[hidden]{display:none!important}.voorbeeld__info{gap:var(--ruimte-1);flex-direction:column;display:flex}.voorbeeld__info h2,.voorbeeld__info h3{margin:0}.voorbeeld__info h3{margin-top:var(--ruimte-1)}.voorbeeld__sterren,.voorbeeld__prestaties{margin:0;padding:0;list-style:none}.voorbeeld__sterren li{border-bottom:1px solid color-mix(in srgb, var(--inkt-zacht) 25%, transparent);justify-content:space-between;padding-block:4px;display:flex}.voorbeeld__sterren b{color:color-mix(in srgb, var(--zon) 70%, var(--inkt))}.voorbeeld__prestaties{flex-wrap:wrap;gap:6px;display:flex}.voorbeeld__prestaties li{border-radius:var(--radius-rond);background:color-mix(in srgb, var(--zon) 30%, var(--oppervlak));padding:4px 12px;font-size:14px;font-weight:600}.voorbeeld__uitleg{gap:var(--ruimte-2);flex-direction:column;padding:0;display:flex!important}.voorbeeld__uitleg ul{gap:var(--ruimte-1);flex-direction:column;margin:0;padding-left:1.2em;display:flex}@media (width<=720px){.voorbeeld__huis{padding:var(--ruimte-2);grid-template-columns:1fr}}