@font-face{font-family:Archivo;src:url(archivo.woff2) format('woff2');font-weight:100 900;font-stretch:62% 125%;font-display:swap}
:root{--rood:#C8102E;--rood-d:#A50D26;--ink:#141414;--grijs:#5F5F5F;--lijn:#E7E4DF;--vlak:#F6F4F1;--wit:#FFFFFF;--groen:#1B7F3B}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--wit);color:var(--ink);font-family:Archivo,system-ui,sans-serif;font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased}
a{color:inherit}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer}
img{display:block}
:focus-visible{outline:3px solid var(--rood);outline-offset:2px}
h1,h2,h3,p{margin:0}
.kop{font-weight:900;font-stretch:88%;letter-spacing:-.02em;line-height:1}

/* balk */
.bar{position:sticky;top:0;z-index:15;background:var(--wit);display:flex;align-items:center;gap:12px;height:60px;padding:0 16px;border-bottom:1px solid var(--lijn)}
.bar .logo img{height:26px}
.bar nav{display:none}
.stat{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:14px;font-weight:600;white-space:nowrap}
.stip{width:9px;height:9px;border-radius:50%;background:var(--groen)}
.stat.dicht .stip{background:#9A9A9A}
.belknop{display:none}

/* hero */
.hero{position:relative;height:44svh;min-height:280px;max-height:420px;overflow:hidden;background:#20201F}
.hero img{width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.72))}
.herotekst{position:absolute;z-index:1;left:16px;right:16px;bottom:38px;color:var(--wit)}
.herotekst h1{font-size:clamp(40px,12vw,56px)}
.herotekst p{margin-top:6px;font-size:16px;font-weight:500}

/* kiezen */
.kies{position:relative;z-index:2;margin:-24px 16px 0;background:var(--wit);border-radius:18px;padding:14px;box-shadow:0 8px 26px rgba(20,20,20,.14)}
.seg{display:grid;grid-template-columns:1fr 1fr;background:var(--vlak);border-radius:12px;padding:4px}
.seg button{min-height:46px;border:0;background:none;border-radius:9px;font-weight:700}
.seg button[aria-pressed=true]{background:var(--wit);box-shadow:0 1px 4px rgba(20,20,20,.16)}
.pc{display:flex;gap:8px;margin-top:10px}
.pc input{flex:1;min-width:0;height:52px;border:1px solid #CFCBC4;border-radius:12px;padding:0 14px;background:var(--wit);font-size:16px}
.knop{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 20px;border:0;border-radius:12px;background:var(--rood);color:var(--wit);font-weight:800;text-decoration:none;white-space:nowrap}
.knop:hover{background:var(--rood-d)}
.knop.vol{width:100%}
.melding{margin-top:10px;font-size:15px;font-weight:600}
.melding.fout{color:var(--rood-d)}
.melding:empty{display:none}
.wacht{display:flex;justify-content:space-between;gap:12px;margin:10px 2px;font-size:15px;color:var(--grijs)}
.wacht b{color:var(--ink)}

/* populair */
.sectie{padding:32px 0 0}
.sectie>h2{font-size:30px;padding:0 16px;margin-bottom:14px}
.schuif{display:flex;align-items:flex-start;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 16px 6px;scrollbar-width:none}
.schuif::-webkit-scrollbar{display:none}
.pop{position:relative;flex:0 0 62%;max-width:260px;scroll-snap-align:start;scroll-margin-left:16px;border:0;background:none;padding:0;text-align:left}
.pop em{position:absolute;right:8px;top:8px;width:40px;height:40px;border-radius:50%;background:var(--wit);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:24px;line-height:1;box-shadow:0 2px 8px rgba(20,20,20,.25)}
.pop img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:16px;background:var(--vlak)}
.pop b{display:block;margin-top:9px;font-size:18px;font-weight:800;line-height:1.2}
.pop span{color:var(--grijs)}
.pop b,.upsell b,.rij b,.regel b{color:var(--ink)}

/* categorieen */
#menu{scroll-margin-top:60px}
.tabs{position:sticky;top:60px;z-index:10;display:flex;gap:6px;overflow-x:auto;background:var(--wit);padding:10px 16px;margin-top:24px;border-bottom:1px solid var(--lijn);scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:none;min-height:42px;padding:0 15px;border:0;border-radius:21px;background:var(--vlak);font-weight:700;font-size:15px}
.tabs button[aria-current=true]{background:var(--ink);color:var(--wit)}

/* menu */
.lijst{padding:18px 16px 8px}
.catbeeld{width:100%;aspect-ratio:21/9;max-height:220px;object-fit:cover;border-radius:16px;margin-bottom:16px;background:var(--vlak)}
.lijst h2{font-size:32px}
.lijst .uitleg{margin-top:5px;color:var(--grijs)}
.zoek{width:100%;height:48px;border:1px solid #CFCBC4;border-radius:12px;padding:0 14px;margin-bottom:16px;background:var(--wit);font-size:16px}
.rij{display:grid;grid-template-columns:minmax(0,1fr) 48px;gap:2px 12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--lijn)}
.rij b{font-size:17px;font-weight:700;line-height:1.25}
.rij p{grid-column:1;font-size:15px;color:var(--grijs);line-height:1.35}
.rij .prijs{grid-column:1;font-weight:600;margin-top:2px}
.plus{grid-column:2;grid-row:1/span 3;width:46px;height:46px;border:0;border-radius:50%;background:var(--vlak);color:var(--ink);font-size:24px;font-weight:500;line-height:1;padding:0}
.plus:hover{background:var(--rood);color:var(--wit)}
.maten{grid-column:1/-1;display:flex;gap:7px;overflow-x:auto;margin:8px -16px 0;padding:0 16px;scrollbar-width:none}
.maten::-webkit-scrollbar{display:none}
.maten button{flex:none;min-height:44px;padding:0 13px;border:1px solid #CFCBC4;border-radius:10px;background:var(--wit);font-size:15px;font-weight:600}
.maten button:hover{border-color:var(--ink)}
.niets{padding:20px 0;font-weight:600}

/* info */
.info{margin-top:32px;background:var(--vlak);padding:32px 16px}
.info h2{font-size:30px;margin-bottom:14px}
.quotes{list-style:none;margin:0 -16px;padding:0 16px 6px;display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.quotes::-webkit-scrollbar{display:none}
.quotes li{flex:0 0 82%;max-width:340px;scroll-snap-align:center;background:var(--wit);border-radius:16px;padding:18px}
.quotes p{font-size:17px;line-height:1.35;font-weight:500}
.quotes cite{display:block;margin-top:10px;font-style:normal;color:var(--grijs);font-size:15px}
.gegevens{display:grid;gap:26px;margin-top:32px}
.gegevens h3{font-size:19px;font-weight:800;margin-bottom:6px}
.gegevens p{margin-bottom:4px}
.tijden{display:grid;grid-template-columns:1fr auto;gap:2px 16px;margin:0}
.tijden dd{margin:0}

.voet{background:var(--rood);color:var(--wit);padding:30px 16px 104px}
.voet img{height:28px}
.voet .klein{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:18px;font-size:15px}

/* onderbalk */
.onder{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:18;display:flex;align-items:center;justify-content:space-between;height:58px;padding:0 18px;border:0;border-radius:14px;background:var(--rood);color:var(--wit);font-weight:800;box-shadow:0 8px 22px rgba(20,20,20,.28)}
.onder i{font-style:normal;display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;margin-right:10px;border-radius:14px;background:rgba(255,255,255,.2)}

/* mandje */
.mand{display:none}
.mand.open{display:flex;position:fixed;inset:0;z-index:25;flex-direction:column;background:var(--wit)}
.mandkop{display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 8px 0 16px;border-bottom:1px solid var(--lijn);flex:none}
.mandkop h2{font-size:22px;font-weight:800}
.sluit{width:44px;height:44px;border:0;background:none;font-size:24px;line-height:1;padding:0;border-radius:50%}
.mandin{flex:1;overflow-y:auto;padding:12px 16px}
.mandvoet{flex:none;padding:12px 16px max(12px,env(safe-area-inset-bottom));border-top:1px solid var(--lijn)}
.regel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:12px 0;border-bottom:1px solid var(--lijn)}
.regel b{font-weight:700}
.regel .sub{grid-column:1/-1;font-size:15px;color:var(--grijs)}
.aantal{grid-column:1/-1;display:flex;align-items:center;gap:6px;margin-top:6px;font-weight:700}
.aantal button{width:44px;height:44px;border:1px solid #CFCBC4;background:var(--wit);border-radius:50%;font-size:19px;padding:0}
.aantal span{min-width:22px;text-align:center}
.som{display:flex;justify-content:space-between;gap:12px;padding:3px 0}
.som.tot{font-size:20px;font-weight:800;padding:4px 0 10px}
.meer{margin:20px 0 6px;font-size:17px;font-weight:800}
.upsell{display:grid;grid-template-columns:minmax(0,1fr) 46px;gap:12px;align-items:center;padding:8px 0}
.upsell img{width:56px;height:56px;border-radius:10px;object-fit:cover;background:var(--vlak)}
.upsell b{display:block;font-weight:700;line-height:1.2}
.upsell span{color:var(--grijs);font-size:15px}
.upsell .plus{grid-column:2;grid-row:1}
.twee{display:grid;grid-template-columns:2fr 1fr;gap:10px}
.twee .veld{min-width:0}
.fout{color:var(--rood-d);font-weight:600;margin-top:10px}
.gerust{margin-top:10px;font-size:14.5px;color:var(--grijs);text-align:center}
.leeg{padding:30px 0;text-align:center;color:var(--grijs)}
.veld{display:block;margin-top:14px;font-weight:700}
.veld input,.veld textarea{display:block;width:100%;height:52px;margin-top:5px;border:1px solid #CFCBC4;border-radius:12px;padding:0 14px;background:var(--wit);font-weight:400;font-size:16px}
.veld textarea{height:84px;padding:10px 14px}
.keuze{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.keuze button{min-height:46px;padding:0 14px;border:1px solid #CFCBC4;background:var(--wit);border-radius:12px;font-weight:600}
.keuze button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--wit)}
.terug{border:0;background:none;padding:12px 0;font-weight:700;text-decoration:underline}
.volg{list-style:none;margin:16px 0;padding:0}
.volg li{position:relative;padding:0 0 22px 34px;color:var(--grijs)}
.volg li::before{content:"";position:absolute;left:0;top:1px;width:20px;height:20px;border-radius:50%;background:var(--wit);border:2px solid #CFCBC4}
.volg li::after{content:"";position:absolute;left:9px;top:23px;bottom:-1px;width:2px;background:#CFCBC4}
.volg li:last-child::after{display:none}
.volg li.aan{color:var(--ink);font-weight:700}
.volg li.aan::before{background:var(--groen);border-color:var(--groen)}

/* gerecht */
.dek{position:fixed;inset:0;z-index:30;background:rgba(20,20,20,.55);display:flex;align-items:flex-end;justify-content:center}
.blad{width:100%;max-height:92svh;display:flex;flex-direction:column;background:var(--wit);border-radius:20px 20px 0 0;overflow:hidden}
.bladin{overflow-y:auto;flex:1;padding:0 16px 14px}
.bladbeeld{width:calc(100% + 32px);margin:0 -16px;height:150px;object-fit:cover;background:var(--vlak)}
.blad h2{font-size:28px;margin-top:14px;padding-right:0}
.blad h3{margin:18px 0 0;font-size:17px;font-weight:800}
.bladsluit{position:absolute;right:10px;top:10px;width:44px;height:44px;border:0;border-radius:50%;background:var(--wit);font-size:22px;line-height:1;padding:0;box-shadow:0 2px 8px rgba(20,20,20,.25)}
.bladvoet{flex:none;display:flex;gap:10px;align-items:center;padding:12px 16px max(12px,env(safe-area-inset-bottom));border-top:1px solid var(--lijn)}
.bladvoet .aantal{margin:0;grid-column:auto;flex:none}
.bladvoet .knop{flex:1;padding:0 10px}

@media (min-width:760px){
 .herotekst{left:32px;right:32px}
 .kies{margin:-24px auto 0;max-width:560px}
 .sectie>h2,.schuif{padding-inline:32px}
 .pop{flex:0 0 280px}
 .tabs{padding-inline:32px}
 .lijst{padding-inline:32px}
 .catbeeld{aspect-ratio:21/8}
 .info{padding-inline:32px}
 .quotes{margin-inline:-32px;padding-inline:32px}
 .gegevens{grid-template-columns:1fr 1fr}
 .voet{padding-inline:32px}
}
@media (min-width:1080px){
 body{font-size:17px}
 .bar{height:72px;padding:0 max(32px,calc((100vw - 1280px)/2))}
 .bar .logo img{height:30px}
 .bar nav{display:flex;gap:24px;margin-left:28px;font-weight:600}
 .bar nav a{text-decoration:none;padding:8px 0}
 .bar nav a:hover{text-decoration:underline;text-underline-offset:5px}
 .belknop{display:block;font-weight:700;text-decoration:none}
 .hero{height:min(64vh,560px);max-height:none}
 .hero img{object-position:50% 42%}
 .hero::after{inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.1) 62%)}
 #menu{scroll-margin-top:72px}
 .herotekst{left:max(32px,calc((100vw - 1280px)/2));right:auto;bottom:128px;max-width:680px}
 .herotekst h1{font-size:92px}
 .kies{position:absolute;margin:0;left:max(32px,calc((100vw - 1280px)/2));width:440px;transform:translateY(-104px)}
 .ondergrens{height:120px}
 .sectie{max-width:1280px;margin:0 auto}
 .sectie>h2,.schuif{padding-inline:0}
 .schuif{overflow:visible}
 .pop{flex:1 1 0;min-width:0;max-width:none}
 .winkel{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:48px;max-width:1280px;margin:24px auto 0;align-items:start}
 .tabs{top:72px;margin:0;padding:10px 0}
 .lijst{padding-inline:0}
 .rij{grid-template-columns:minmax(0,1fr) 48px}
 .mand,.mand.open{display:flex;position:sticky;inset:auto;top:88px;flex-direction:column;max-height:calc(100vh - 104px);border:1px solid var(--lijn);border-radius:18px;overflow:hidden;z-index:1}
 .mandkop .sluit{display:none}
 .onder{display:none}
 .info{padding-inline:max(32px,calc((100vw - 1280px)/2))}
 .quotes{margin-inline:0;padding-inline:0;overflow:visible}
 .quotes li{flex:1 1 0;max-width:none}
 .gegevens{grid-template-columns:repeat(3,1fr)}
 .voet{padding:30px max(32px,calc((100vw - 1280px)/2))}
 .dek{align-items:center}
 .blad{width:520px;border-radius:20px;position:relative}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* alleen in het thema */
.pop img,.catbeeld,.bladbeeld{height:auto}
.bladbeeld{height:150px}
.bar .logo img,.voet img{width:auto}
@media (min-width:1080px){
 .sectie{max-width:none;padding-inline:max(32px,calc((100vw - 1280px)/2))}
 .winkel{max-width:none;padding-inline:max(32px,calc((100vw - 1280px)/2))}
}
[hidden]{display:none!important}
.verborgen{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.volgpagina{max-width:560px;margin:0 auto;padding:28px 16px 60px}
.volgpagina h1{font-size:34px;margin-bottom:10px}
.terug{display:inline-block;color:var(--ink)}
.knop[disabled]{opacity:.6}
/* keukenscherm */
.page-template-default .keuken,.keuken{min-height:100vh;background:#1A1A1A;color:#fff;font-size:18px}
.kbar{position:sticky;top:0;display:flex;align-items:center;gap:20px;padding:12px 18px;background:#000;z-index:2}
.kbar b{font-size:24px}
#kNet{margin-left:auto;color:#9BE3AF}
#kNet.mis{color:#fff;background:var(--rood);padding:6px 12px;border-radius:8px;font-weight:800}
#kGeluid{min-height:48px;padding:0 16px;border:0;border-radius:10px;background:#fff;color:#141414;font-weight:800}
.kraster{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px;padding:14px;align-items:start}
.kleeg{grid-column:1/-1;text-align:center;padding:80px 0;color:#BBB;font-size:24px}
.kaart{background:#fff;color:#141414;border-radius:14px;padding:14px;border-top:10px solid #9A9A9A}
.kaart.st-processing{border-top-color:var(--rood);box-shadow:0 0 0 4px var(--rood)}
.kaart.st-tab-keuken{border-top-color:#F5A300}
.kaart.st-tab-onderweg,.kaart.st-tab-klaar{border-top-color:var(--groen)}
.kaart header{display:flex;align-items:center;gap:10px;font-size:17px}
.kaart header b{font-size:28px;font-weight:900}
.soort{padding:3px 10px;border-radius:8px;font-weight:800;color:#fff}
.soort.bez{background:var(--ink)}.soort.afh{background:var(--groen)}
.kaart header span:last-child{margin-left:auto}
.wanneer{font-weight:700;margin-top:4px}
.kaart ul{list-style:none;margin:10px 0;padding:0}
.kaart li{padding:8px 0;border-top:1px solid var(--lijn)}
.kaart li b{display:block;font-size:21px;line-height:1.2}
.kaart li span{display:block;font-size:17px;color:#444}
.kaart li span.let{color:var(--rood-d);font-weight:800}
.klant,.geld{font-size:16px;margin-top:6px}
.kknop{width:100%;min-height:70px;margin-top:12px;border:0;border-radius:12px;background:var(--rood);color:#fff;font-size:24px;font-weight:900}
.kaart:not(.st-processing) .kknop{background:var(--ink)}
.woocommerce-order-pay .volgpagina{max-width:640px}

/* acties, sparen en zoeken */
.admin-bar .bar{top:32px}
.admin-bar .tabs{top:92px}
.accknop{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:0 12px;border:0;border-radius:21px;background:var(--vlak);font-weight:700;font-size:14.5px;white-space:nowrap}
.stat{margin-left:auto}
.bar .stat span{display:none}
.vergroot{width:42px;padding:0!important;display:inline-flex;align-items:center;justify-content:center}
.vergroot[aria-pressed=true]{background:var(--ink);color:var(--wit)}
.zoek{height:42px;font-size:16px}
.catblok{padding-top:8px;margin-bottom:26px}
.acties{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:22px}
.actie{display:flex;flex-direction:column;gap:3px;min-height:112px;justify-content:flex-end;padding:14px;border:0;border-radius:16px;color:var(--wit);text-align:left}
.actie.rood{background:var(--rood)}
.actie.inkt{background:var(--ink)}
.actie b{font-size:21px;font-weight:900;font-stretch:88%;line-height:1.05;letter-spacing:-.01em}
.actie span{font-size:14.5px;line-height:1.25}
.beloning{margin:16px 0 4px;padding:14px;background:var(--vlak);border-radius:14px}
.beloning .punt{margin-top:12px}
.beloning .keuze button{min-height:44px;font-size:15px}
.balk{height:9px;margin-top:8px;border-radius:5px;background:#E2DED7;overflow:hidden}
.balk i{display:block;height:100%;background:var(--rood);border-radius:5px;transition:width .25s}
.balk.groot{height:12px;margin:12px 0 8px}
.accblad .bladin{padding-top:18px}
.melding{margin-top:8px}
@media (min-width:760px){.bar .stat span{display:inline}.acties{max-width:640px}}
@media (min-width:1080px){.admin-bar .tabs{top:104px}.accknop{margin-left:6px}.belknop{margin-left:10px}}
@media (max-width:782px){.admin-bar .bar{top:46px}.admin-bar .tabs{top:106px}}

.zoek{scroll-margin-top:150px}
.blad{position:relative}