:root{--bg:#fffaf0;--kaart:#fffdf7;--ink:#4b3524;--zacht:#756453;--roze:#d52f72;--roze-diep:#ae2459;--roze-licht:#fff0f6;--groen:#7b8651;--groen-licht:#dedccf;--lijn:#d8d1c1;--goed:#36804a;--goed-licht:#e7f4e7;--fout:#a72b2b;--rond-groot:24px;--rond:18px;--rond-klein:14px}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;margin:0;overflow:hidden}body{color:var(--ink);touch-action:manipulation;-webkit-text-size-adjust:100%;background:radial-gradient(circle at 4% 12%, #d52f7214, transparent 16%), radial-gradient(circle at 96% 88%, #7b86511a, transparent 18%), var(--bg);font-family:system-ui,-apple-system,Segoe UI,sans-serif}button,input{font:inherit;color:inherit}h1,h2,h3{margin:0;font-family:Georgia,Times New Roman,serif}.schil{grid-template-rows:auto auto minmax(0,1fr);gap:clamp(10px,1.6vh,18px);width:min(1100px,100%);height:100dvh;margin:auto;padding:clamp(12px,2.5vh,24px) clamp(16px,3vw,34px);display:grid;position:relative}.schil:before,.schil:after{content:"✿";color:var(--roze);opacity:.16;pointer-events:none;z-index:-1;font-size:clamp(3rem,8vw,7rem);position:absolute}.schil:before{bottom:.05em;left:-.1em;transform:rotate(-12deg)}.schil:after{color:var(--groen);top:16%;right:.05em;transform:rotate(18deg)}.bovenbalk{justify-content:space-between;align-items:center;gap:16px;display:flex}.merk{align-items:center;gap:14px;min-width:0;display:flex}.merk img{object-fit:contain;width:clamp(56px,7vw,84px);height:clamp(56px,7vw,84px)}.merk .kop{text-transform:uppercase;letter-spacing:.14em;color:var(--groen);margin:0 0 2px;font-size:.72rem;font-weight:800}.merk h1{color:var(--roze);font-size:clamp(1.4rem,3.2vh,2.1rem);font-style:italic;line-height:1}.voortgang{gap:9px;display:flex}.voortgang span{background:var(--groen-licht);border-radius:99px;flex:1;height:7px}.voortgang span.aan{background:var(--groen)}.scherm{flex-direction:column;min-height:0;animation:.18s opkomen;display:flex}@keyframes opkomen{0%{opacity:.35;transform:translateY(4px)}to{opacity:1;transform:none}}.scherm h2{margin-bottom:clamp(6px,1vh,12px);font-size:clamp(1.6rem,4vh,2.6rem);line-height:1.08}.inleiding{color:var(--zacht);margin:0 0 clamp(12px,2vh,22px);font-size:clamp(.95rem,2vh,1.12rem)}.opschrift{text-transform:uppercase;letter-spacing:.12em;color:var(--groen);margin:0 0 4px;font-size:.74rem;font-weight:800}.vulling{flex:1;min-height:0}.vulling.beperkt{max-height:clamp(14px,4vh,44px)}.knop{cursor:pointer;border-radius:var(--rond);background:var(--roze);color:#fff;min-height:clamp(54px,7.5vh,70px);box-shadow:0 4px 0 var(--roze-diep);border:0;padding:0 26px;font-size:clamp(1rem,2.2vh,1.15rem);font-weight:800;transition:transform 60ms}.knop:active:not(:disabled){box-shadow:0 1px 0 var(--roze-diep);transform:translateY(3px)}.knop:disabled{opacity:.42;cursor:not-allowed;box-shadow:none}.knop.breed{width:100%;margin-top:auto}.knop.klein{min-height:46px;box-shadow:0 3px 0 var(--roze-diep);padding:0 18px;font-size:.94rem}.keuzes{grid-template-columns:1fr 1fr;gap:clamp(12px,2vw,20px);display:grid}.vraag-bij-knoppen{margin-bottom:clamp(8px,1.4vh,14px)}.keuze{cursor:pointer;text-align:left;background:var(--kaart);border:2px solid var(--lijn);border-radius:var(--rond-groot);color:var(--ink);flex-direction:row;justify-content:center;align-items:center;gap:clamp(10px,2vw,20px);min-height:clamp(110px,17vh,165px);padding:clamp(18px,3vh,26px);transition:border-color .12s,background .12s;display:flex}.keuze .woorden{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.keuze .pijl{width:clamp(26px,3.4vh,34px);height:clamp(26px,3.4vh,34px);color:var(--roze);flex:none}.keuze:disabled .pijl{color:var(--zacht)}.keuze strong{color:var(--roze);font-family:Georgia,Times New Roman,serif;font-size:clamp(1.4rem,3.6vh,2rem);display:block}.keuze small{color:var(--zacht);font-size:clamp(.85rem,1.8vh,1rem)}.keuze:hover,.keuze:focus-visible{border-color:var(--roze);background:#fff8fb;outline:none}.telgroep{display:contents}.telkaart{background:var(--kaart);border:1px solid var(--lijn);border-radius:var(--rond-groot);grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(12px,2vw,20px);padding:clamp(14px,2.4vh,22px);display:grid}.rond{border:1px solid var(--lijn);width:clamp(62px,8.5vh,84px);height:clamp(62px,8.5vh,84px);color:var(--roze);cursor:pointer;background:#fff;border-radius:20px;font-size:2.2rem;font-weight:800}.rond:active{background:var(--roze-licht)}.telkaart .midden{text-align:center;min-width:0}.telkaart label{color:var(--zacht);margin-bottom:2px;font-size:.88rem;display:block}.telkaart input{text-align:center;-moz-appearance:textfield;background:0 0;border:0;outline:none;width:100%;max-width:260px;font-size:clamp(2.6rem,8vh,4rem);font-weight:800}.telkaart input::-webkit-inner-spin-button{appearance:none;margin:0}.telkaart input::-webkit-outer-spin-button{appearance:none;margin:0}.regel-bedrag{border-bottom:1px solid var(--lijn);justify-content:space-between;align-items:center;margin:clamp(8px,1.5vh,16px) 0;padding:clamp(10px,1.8vh,18px) 4px;display:flex}.regel-bedrag span{color:var(--zacht)}.regel-bedrag strong{color:var(--roze);font-size:clamp(1.5rem,3.6vh,2rem)}.artikelen{grid-template-columns:1fr 1fr;align-content:start;gap:clamp(8px,1.4vh,14px);min-height:0;display:grid;overflow-y:auto}.artikel{background:var(--kaart);border:1px solid var(--lijn);border-radius:var(--rond);grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:clamp(10px,1.6vh,16px);display:grid}.artikel .naam{font-size:clamp(.88rem,1.9vh,1.05rem);font-weight:700;line-height:1.2;display:block}.artikel .prijs{color:var(--zacht);margin-top:3px;font-size:.86rem;display:block}.teller{align-items:center;gap:8px;display:flex}.teller button{border-radius:var(--rond-klein);border:1px solid var(--lijn);width:clamp(44px,6vh,56px);height:clamp(44px,6vh,56px);color:var(--roze);cursor:pointer;background:#fff;font-size:1.6rem;font-weight:800}.teller button:active{background:var(--roze-licht)}.teller .aantal{text-align:center;min-width:30px;font-size:1.2rem;font-weight:800}.bonkeuzes{gap:14px;display:grid}.bonkeuze{text-align:left;border:2px solid var(--lijn);border-radius:var(--rond);background:var(--kaart);cursor:pointer;align-items:flex-start;gap:16px;width:100%;padding:clamp(16px,2.6vh,22px);display:flex}.bonkeuze[aria-pressed=true]{border-color:var(--roze);background:#fff7fa}.bonkeuze .bolletje{border:2px solid var(--lijn);border-radius:50%;flex:none;place-items:center;width:28px;height:28px;margin-top:2px;display:grid}.bonkeuze[aria-pressed=true] .bolletje{border-color:var(--roze)}.bonkeuze[aria-pressed=true] .bolletje:after{content:"";background:var(--roze);border-radius:50%;width:14px;height:14px}.bonkeuze .tekst{gap:8px;font-size:clamp(.95rem,2vh,1.1rem);line-height:1.4;display:grid}.bonkeuze .tekst strong{font-weight:700}.bonkeuze .tekst small{color:var(--zacht);font-size:.92rem}.overzicht{background:var(--kaart);border:1px solid var(--lijn);border-radius:var(--rond-groot);padding:clamp(8px,1.4vh,16px) clamp(16px,2.4vw,24px)}.overzicht .regel{border-bottom:1px solid var(--lijn);justify-content:space-between;align-items:baseline;gap:20px;padding:clamp(8px,1.3vh,13px) 0;font-size:clamp(1.05rem,2.3vh,1.4rem);display:flex}.overzicht .regel:last-child{border-bottom:0}.overzicht .regel strong{white-space:nowrap}.overzicht .korting,.overzicht .korting strong{color:var(--groen)}.overzicht .totaal{border-top:2px solid var(--lijn);border-bottom:0;padding-top:clamp(10px,1.6vh,16px);font-size:clamp(1.3rem,3vh,1.8rem);font-weight:800}.overzicht .totaal strong{color:var(--roze)}.donatie{border:2px solid var(--lijn);border-radius:var(--rond);background:var(--kaart);margin-top:clamp(12px,2vh,18px);padding:clamp(14px,2.2vh,20px)}.donatiekop{align-items:center;gap:10px;margin-bottom:12px;display:flex}.donatiekop strong{font-size:1.06rem}.donatie .info{border:2px solid var(--lijn);width:40px;height:40px;color:var(--zacht);cursor:pointer;background:#fff;border-radius:50%;flex:none;place-items:center;font-family:Georgia,Times New Roman,serif;font-size:1.15rem;font-style:italic;font-weight:700;line-height:1;display:grid}.donatie .info[aria-expanded=true]{border-color:var(--roze);background:var(--roze-licht);color:var(--roze-diep)}[x-cloak]{display:none!important}.donatiekeuzes{grid-template-columns:repeat(4,1fr);gap:9px;display:grid}.donatiekeuzes button{border:2px solid var(--lijn);border-radius:var(--rond-klein);cursor:pointer;background:#fff;padding:14px 8px;font-weight:800}.donatiekeuzes button[aria-pressed=true]{border-color:var(--roze);background:var(--roze-licht);color:var(--roze-diep)}.donatie .toelichting{color:var(--zacht);margin:14px 0 0;font-size:.94rem;line-height:1.5}.bedrag-groot{color:var(--roze);margin:0 0 clamp(8px,1.4vh,14px);font-family:Georgia,Times New Roman,serif;font-size:clamp(2.6rem,8vh,4.6rem);font-weight:900}.kluis{border:1px solid var(--lijn);border-radius:var(--rond-groot);background:var(--kaart);grid-template-columns:auto 1fr;align-items:center;gap:clamp(20px,3.6vw,42px);padding:clamp(20px,3.4vh,36px);display:grid}.kluis .icoon{background:#f0ece2;border-radius:50%;place-items:center;width:clamp(92px,13vw,140px);height:clamp(92px,13vw,140px);font-size:clamp(2.8rem,6.5vw,4.8rem);display:grid}.kluis h3{margin-bottom:10px;font-size:clamp(1.3rem,3vh,1.9rem)}.kluis p{margin:0 0 8px;font-size:clamp(.98rem,2vh,1.16rem);line-height:1.5}.kluis .let-op{color:var(--zacht);font-size:.94rem}.betaalvlak{border:1px solid var(--lijn);border-radius:var(--rond-groot);background:#f7f2e5;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:clamp(20px,3.5vw,40px);padding:clamp(16px,2.6vh,26px);display:grid}.betaalvlak .qr{border-radius:var(--rond);background:#fff;padding:10px;line-height:0}.betaalvlak .qr svg{width:clamp(180px,34vh,300px);height:auto;display:block}.betaaltekst h3{margin-bottom:8px;font-size:clamp(1.25rem,3vh,1.8rem)}.betaaltekst p{margin:8px 0;font-size:clamp(.95rem,2vh,1.12rem);line-height:1.45}.betaaltekst .let-op{color:var(--zacht);font-size:.92rem}.melding{border-radius:var(--rond-klein);margin:14px 0 0;padding:12px 16px;font-weight:700}.melding.fout{color:var(--fout);background:#fdf0f0;border:1px solid #e2bcbc}.melding.wacht{background:var(--roze-licht);color:var(--roze-diep);border:1px solid #eec3d6}.melding.smal{align-self:start;margin:0 0 clamp(10px,1.8vh,18px);font-size:1rem}.melding.let-op-groot{color:#7a5a12;background:#fff8e6;border:1px solid #e6cf98;margin-top:0;font-size:1.06rem}.melding.dringend{background:var(--roze);border:3px solid var(--roze-diep);color:#fff;border-radius:var(--rond);box-shadow:0 4px 0 var(--roze-diep);margin-top:0;padding:clamp(14px,2vh,20px) clamp(16px,2.4vw,22px);font-size:clamp(1.05rem,2.4vh,1.35rem);line-height:1.35}.melding.dringend strong{text-underline-offset:3px;text-decoration:underline}.midden-scherm{text-align:center;flex:1;place-items:center;min-height:0;display:grid}.midden-scherm .binnen{width:min(820px,100%)}.vinkje{background:var(--goed-licht);width:clamp(74px,11vh,96px);height:clamp(74px,11vh,96px);color:var(--goed);border-radius:50%;place-items:center;margin:0 auto 14px;font-size:3.2rem;font-weight:900;display:grid}.review-qr{border-radius:var(--rond);border:1px solid var(--lijn);background:#fff;width:min(300px,60vh);height:auto;margin:clamp(14px,2.4vh,24px) auto;padding:12px;display:block}.start{text-align:center;background:radial-gradient(circle at 12% 14%, #d52f721a, transparent 24%), radial-gradient(circle at 88% 82%, #7b86511f, transparent 28%), var(--bg);place-items:center;height:100dvh;padding:clamp(18px,4vh,44px) clamp(18px,5vw,56px);display:grid;position:relative;overflow:hidden}.start .versiering{pointer-events:none;opacity:.13;color:var(--roze);font-size:clamp(6rem,17vw,13rem);position:absolute}.start .versiering.links{bottom:-3vh;left:-2vw;transform:rotate(-15deg)}.start .versiering.rechts{color:var(--groen);top:1vh;right:-1vw;transform:rotate(18deg)}.start .tandwiel{z-index:2;border:1px solid var(--lijn);background:var(--kaart);width:52px;height:52px;color:var(--zacht);opacity:.6;border-radius:50%;place-items:center;font-size:1.4rem;line-height:1;text-decoration:none;display:grid;position:absolute;top:clamp(10px,2vh,22px);left:clamp(10px,2vw,22px)}.start .tandwiel:active{opacity:1;background:var(--roze-licht);color:var(--roze-diep)}.start .binnen{flex-direction:column;align-items:center;width:min(780px,94vw);display:flex}.start img.logo{object-fit:contain;width:clamp(130px,22vh,230px);height:clamp(130px,22vh,230px);margin-bottom:clamp(6px,1.2vh,14px)}.start .kop{color:var(--groen);text-transform:uppercase;letter-spacing:.16em;margin:0;font-size:clamp(.95rem,2.1vh,1.3rem);font-weight:900}.start h1{color:var(--roze);letter-spacing:.03em;margin:clamp(2px,.5vh,6px) 0 0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:clamp(3.4rem,10vh,7rem);font-weight:900;line-height:.95}.start .onder{margin:clamp(8px,1.4vh,14px) 0 clamp(14px,2.4vh,24px);font-size:clamp(1rem,2.3vh,1.4rem);font-weight:600}.start .vraag{margin:0 0 14px;font-size:clamp(1rem,2.1vh,1.25rem);font-weight:800}.start .betaalkeuzes{grid-template-columns:1fr 1fr;gap:clamp(12px,2vw,20px);width:min(700px,90vw);display:grid}.start .betaalkeuze{border:2px solid var(--roze);background:var(--kaart);min-height:clamp(88px,12vh,118px);color:var(--ink);cursor:pointer;border-radius:26px;justify-content:center;align-items:center;gap:14px;padding:16px 20px;font-size:clamp(1.35rem,3.4vh,2.1rem);font-weight:900;transition:transform 60ms;display:flex;box-shadow:0 6px #d52f7229}.start .betaalkeuze:active{transform:translateY(3px);box-shadow:0 3px #d52f7229}.start .betaalkeuze .teken{font-size:1.5em;line-height:1}.start .ontgrendel-titel{letter-spacing:0;margin-bottom:6px;font-family:Georgia,Times New Roman,serif;font-size:clamp(2.4rem,7vh,4.4rem)}.ontgrendelkaart{background:var(--kaart);border:1px solid var(--lijn);border-radius:28px;width:min(560px,92vw);padding:clamp(22px,3.4vh,32px);box-shadow:0 8px 30px #4b352414}.ontgrendelkaart label{margin-bottom:12px;font-size:1.06rem;font-weight:800;display:block}.pincode{text-align:center;letter-spacing:.35em;border:2px solid var(--lijn);border-radius:var(--rond);background:#fff;width:min(330px,100%);margin-bottom:6px;padding:14px 14px 14px 26px;font-size:2rem}.pincode:focus{border-color:var(--groen);outline:4px solid #7b865140}.ontgrendelkaart .hint{margin-top:16px;font-size:.95rem;font-weight:400;line-height:1.45}.start .hint{color:var(--zacht);margin:clamp(10px,1.6vh,16px) 0 0;font-size:clamp(.92rem,2vh,1.15rem);font-weight:700}@media (orientation:portrait),(width<=820px){.artikelen{grid-template-columns:1fr}.kluis,.betaalvlak{text-align:center;grid-template-columns:1fr}.betaalvlak .qr{justify-self:center}.kluis .icoon{margin:0 auto}.start .betaalkeuzes{grid-template-columns:1fr}.keuze{min-height:clamp(84px,11vh,120px);padding:clamp(14px,2.2vh,20px)}.keuze strong{font-size:clamp(1.2rem,2.9vh,1.6rem)}}@media (height<=700px){.merk img{width:52px;height:52px}.scherm h2{font-size:clamp(1.35rem,3.4vh,1.9rem)}.inleiding{margin-bottom:10px}}@media (width<=600px){.keuzes{grid-template-columns:1fr}.donatiekeuzes{grid-template-columns:1fr 1fr}}