/* zelf gehost (2026-10-18): DM Sans + Playfair Display, latin + latin-ext, variabel; fallbacks met dezelfde maten tegen verspringen */
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/dmsans-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/dmsans-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:500 600;font-display:swap;src:url(/assets/fonts/playfair-italic-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:500 600;font-display:swap;src:url(/assets/fonts/playfair-italic-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:500 600;font-display:swap;src:url(/assets/fonts/playfair-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:500 600;font-display:swap;src:url(/assets/fonts/playfair-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'DM Sans Fallback';src:local('Arial');size-adjust:103.95%;ascent-override:95.43%;descent-override:29.82%;line-gap-override:0.00%}
@font-face{font-family:'Playfair Fallback';src:local('Georgia');size-adjust:102.14%;ascent-override:105.93%;descent-override:24.57%;line-gap-override:0.00%}
:root{--h:#a06800;--gold:#d99a24;--cream:#f5efe3;--ink:#17140f;--paper:#fffdf8}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans','DM Sans Fallback',sans-serif}.top{position:relative;height:32px;background:#8f5d00;color:#fff;display:flex;justify-content:center;gap:9vw;align-items:center;font-size:11px;letter-spacing:.08em;text-transform:uppercase}.nav{height:84px;display:flex;align-items:center;padding:0 4vw;position:absolute;top:32px;left:0;right:0;z-index:20;color:#fff}.nav:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,#ffffff40 0,#ffffff40 calc(4vw - 12px),transparent calc(4vw - 12px),transparent calc(4vw + 104px),#ffffff40 calc(4vw + 104px),#ffffff40 100%)}.nav .logoLink{position:absolute;left:4vw;bottom:-32px;display:block;line-height:0}.nav img{width:92px;filter:invert(1)}.nav .links{display:flex;align-items:center;gap:30px;margin-left:auto;margin-right:30px}.nav a{color:inherit;text-decoration:none;font-size:12px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;display:flex;align-items:center;line-height:1}.burger{display:none;background:none;border:0;padding:10px;margin-left:6px;cursor:pointer}.burger span{display:block;width:22px;height:2px;background:#fff;margin:4px 0;transition:transform .3s,opacity .3s}.burger[aria-expanded=true] span:nth-child(1){transform:translateY(6px) rotate(45deg)}.burger[aria-expanded=true] span:nth-child(2){opacity:0}.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}.mobielMenu{position:fixed;inset:0;z-index:19;background:#17130d;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;opacity:0;transition:opacity .3s}.mobielMenu[hidden]{display:none}.mobielMenu.open{opacity:1}.mobielMenu a{color:#fff;text-decoration:none;font-family:'Playfair Display','Playfair Fallback',serif;font-size:30px;padding:14px 20px}.nav .shop{background:var(--gold);border:1px solid var(--gold);color:var(--ink);padding:12px 18px;border-radius:30px;transition:background .25s,border-color .25s}.nav .shop:hover{background:#e8b849;border-color:#e8b849}.hero{height:100svh;min-height:680px;position:relative;overflow:hidden;background:#111}.hero video{width:100%;height:100%;object-fit:cover;filter:brightness(.62) saturate(.92)}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0009 0%,#0002 58%,#0004)}.heroCopy{position:absolute;z-index:3;left:7vw;bottom:13vh;color:#fff;max-width:850px}.eyebrow{font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:700}.hero h1{font-family:'Playfair Display','Playfair Fallback',serif;font-size:clamp(52px,7.5vw,118px);line-height:.87;margin:18px 0 28px;font-weight:500;letter-spacing:-.04em}.hero h1 em{color:#efb743;font-weight:500}.hero p{font-size:clamp(17px,1.5vw,23px);max-width:570px;line-height:1.5}.scroll{position:absolute;right:4vw;bottom:clamp(150px,21vh,260px);color:#fff;z-index:4;writing-mode:vertical-rl;font-size:10px;letter-spacing:.25em}.world{background:#16130e;color:#fff;padding:130px 6vw 150px;position:relative;overflow:hidden}.world:before{content:"";position:absolute;width:800px;height:800px;border:1px solid #d99a2425;border-radius:50%;right:-200px;top:-350px;box-shadow:0 0 0 90px #d99a2408,0 0 0 180px #d99a2405}.intro{display:grid;grid-template-columns:.7fr 1.3fr;gap:8vw;align-items:start;position:relative;z-index:2}.intro h2{font-family:'Playfair Display','Playfair Fallback',serif;font-size:clamp(48px,6vw,92px);font-weight:500;line-height:.95;margin:0}.intro p{font-size:20px;line-height:1.65;color:#d7d0c3;max-width:720px}.journey{margin-top:120px;display:grid;grid-template-columns:repeat(4,1fr);position:relative}.journey:before{content:"";position:absolute;top:31px;left:8%;right:8%;height:1px;background:linear-gradient(90deg,#d99a24,#ffffff22,#d99a24)}.step{padding:0 25px;position:relative}.num{width:62px;height:62px;border:1px solid #d99a24;border-radius:50%;display:grid;place-items:center;background:#16130e;color:#e8b849;font-family:'Playfair Display','Playfair Fallback',serif;font-size:20px;position:relative;z-index:2}.step h3{font-family:'Playfair Display','Playfair Fallback',serif;font-size:30px;margin:30px 0 10px}.step p{color:#aaa295;line-height:1.6;font-size:14px}.categories{padding:120px 4vw}.sectionHead{display:flex;justify-content:space-between;align-items:end;margin:0 2vw 55px}.sectionHead h2{font-family:'Playfair Display','Playfair Fallback',serif;font-size:clamp(48px,5vw,78px);line-height:1;margin:0;font-weight:500}.sectionHead p{max-width:420px;color:#716b61;line-height:1.6}.catGrid{display:grid;grid-template-columns:1.25fr .75fr .75fr;grid-template-rows:330px 330px;gap:14px}.cat{position:relative;overflow:hidden;background:#eee}.cat:first-child{grid-row:1/3}.cat img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}.cat:hover img{transform:scale(1.045)}.cat:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#000a,transparent 55%)}.cat span{position:absolute;z-index:2;bottom:24px;left:26px;color:#fff;font-family:'Playfair Display','Playfair Fallback',serif;font-size:30px}.cat small{display:block;font-family:'DM Sans','DM Sans Fallback',sans-serif;font-size:10px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:6px}.story{display:grid;grid-template-columns:1.1fr .9fr;min-height:760px;background:var(--cream)}.storyImg{position:relative;overflow:hidden}.storyImg img{width:100%;height:100%;object-fit:cover}.storyText{padding:9vw 8vw;display:flex;flex-direction:column;justify-content:center}.storyText h2{font-family:'Playfair Display','Playfair Fallback',serif;font-size:clamp(50px,5vw,80px);line-height:.98;margin:18px 0 30px;font-weight:500}.storyText p{line-height:1.8;color:#625d54;font-size:16px}.link{display:inline-flex;margin-top:25px;color:#8f5d00;text-decoration:none;font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase}.guide{padding:130px 6vw;background:#d79619;position:relative;overflow:hidden}.guide .beeWord{position:absolute;font-family:'Playfair Display','Playfair Fallback',serif;font-size:22vw;color:#fff1;right:-2vw;top:-5vw;line-height:1}.guideBox{position:relative;z-index:2;background:#fffdf8;border-radius:22px;padding:70px;max-width:1100px;margin:auto;display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}.guideBox h2{font-family:'Playfair Display','Playfair Fallback',serif;font-size:58px;line-height:1;margin:10px 0 20px}.options{display:grid;gap:10px;align-content:center}.opt{border:1px solid #d8d0c3;padding:18px 20px;display:flex;justify-content:space-between;transition:.2s}.opt:hover{background:#17140f;color:#fff;border-color:#17140f;transform:translateX(7px)}.visit{height:80vh;min-height:600px;position:relative;background:url('/assets/bijenkiosk.jpg') center/cover}.visit:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0006,#000b)}.visitText{position:absolute;z-index:2;inset:0;display:grid;place-content:center;text-align:center;color:#fff;padding:30px}.visit h2{font-family:'Playfair Display','Playfair Fallback',serif;font-size:clamp(60px,8vw,120px);font-weight:500;line-height:.9;margin:15px}.visit p{font-size:19px}.footer{background:#15120d;color:#ddd;padding:80px 6vw 35px}.footerGrid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:50px}.footer img{width:110px;filter:invert(1)}.footer h4{font-size:11px;text-transform:uppercase;letter-spacing:.16em;color:#d99a24}.footer p,.footer a{font-size:13px;color:#aaa;text-decoration:none;line-height:2}.copy{border-top:1px solid #ffffff18;margin-top:60px;padding-top:25px;font-size:11px;color:#777}@media(max-width:850px){.top{display:none}.nav{top:0;height:72px}.links a:not(.shop){display:none}.burger{display:block}.nav .links{margin-right:0;gap:0}.heroCopy{left:7vw;right:7vw}.intro,.story,.guideBox{grid-template-columns:1fr}.journey{grid-template-columns:1fr 1fr;gap:45px}.journey:before{display:none}.catGrid{grid-template-columns:1fr 1fr;grid-template-rows:420px 260px 260px}.cat:first-child{grid-column:1/3;grid-row:auto}.guideBox{padding:40px;gap:30px}.footerGrid{grid-template-columns:1fr 1fr}}@media(max-width:550px){.journey,.catGrid,.footerGrid{grid-template-columns:1fr}.catGrid{display:block}.cat{display:block;height:300px;margin-bottom:10px}.cat:first-child{height:430px}.world,.categories{padding-left:6vw;padding-right:6vw}.sectionHead{display:block}.sectionHead p{margin-top:20px}}

/* ===== winkel + zwevend mandje (2026-08-24) ===== */
/* Volgt de bestaande vormgeving: rechte hoeken, 1px randen zoals .opt,
   Playfair voor namen, DM Sans voor de rest. Geen nieuwe kleuren. */
.shopTools{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:72px 2vw 24px}
.chip{font:700 11px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.13em;text-transform:uppercase;color:var(--ink);background:none;border:1px solid #d8d0c3;padding:13px 19px;transition:.2s}
.chip[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.telling{margin-left:auto;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#8d867b}
.prodGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0 2vw}
.prod{min-width:0;display:flex;flex-direction:column;background:#fff;border:1px solid #e6dfd2;text-align:left;transition:border-color .25s,transform .5s cubic-bezier(.2,.8,.2,1)}
.prod:hover{border-color:#c9bfab;transform:translateY(-4px)}
.prodBeeld{border:0;padding:0;display:block;width:100%;position:relative;aspect-ratio:1/1;overflow:hidden;background:#fff}
.prodBeeld img{width:100%;height:100%;object-fit:contain;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.prod:hover .prodBeeld img{transform:scale(1.06)}
.prodTag{position:absolute;top:0;left:0;font:700 9px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.18em;text-transform:uppercase;background:var(--cream);color:var(--h);padding:8px 11px}
.prodBody{padding:20px 21px 21px;display:flex;flex-direction:column;flex:1}
.prodBody h3{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:22px;line-height:1.15;margin:0 0 7px}
.prodKort{font-size:13px;line-height:1.55;color:#716b61;margin:0 0 17px}
.prodVoet{margin-top:auto;display:flex;align-items:center;gap:11px}
.prijs{font-weight:700;font-size:16px;letter-spacing:-.01em}
.knopIn{margin-left:auto;font:700 10px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.15em;text-transform:uppercase;background:none;color:var(--ink);border:1px solid #d8d0c3;padding:12px 15px;transition:.2s}
.knopIn:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.knopIn.gelukt{background:var(--h);border-color:var(--h);color:#fff}
.leeg{grid-column:1/-1;padding:70px 0;text-align:center;color:#8d867b}

/* zwevend mandje */
.mandjeKnop{position:fixed;right:26px;bottom:26px;z-index:30;display:flex;align-items:center;gap:11px;background:var(--ink);color:#fff;border:0;border-radius:34px;padding:15px 22px;font:700 11px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.14em;text-transform:uppercase;box-shadow:0 10px 30px #17140f38;transform:translateY(90px);opacity:0;transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .35s,background .25s}
.mandjeKnop.tonen{transform:none;opacity:1}
.mandjeKnop:hover{background:#2a2418}
.mandjeKnop svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7}
.mandjeTelling{min-width:21px;height:21px;border-radius:11px;background:var(--gold);color:var(--ink);display:grid;place-content:center;font-size:11px;font-weight:700;letter-spacing:0;padding:0 6px}
body.menuOpen .mandjeKnop{opacity:0;pointer-events:none;transform:translateY(90px)}
.mandjeKnop.stuiter{animation:stuiter .45s cubic-bezier(.2,.8,.2,1)}
@keyframes stuiter{0%,100%{transform:none}35%{transform:translateY(-9px) scale(1.05)}}

/* laden (mandje + productdetail) */
.scrim{position:fixed;inset:0;z-index:40;background:#17140fa8;opacity:0;transition:opacity .35s}
.scrim[hidden]{display:none}
.scrim.open{opacity:1}
.lade{position:fixed;top:0;right:0;bottom:0;z-index:41;width:min(430px,100%);background:var(--paper);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .42s cubic-bezier(.2,.8,.2,1);box-shadow:-14px 0 44px #17140f22}
.lade[hidden]{display:none}
.lade.open{transform:none}
.ladeKop{display:flex;align-items:center;gap:14px;padding:26px 26px 20px;border-bottom:1px solid #e6dfd2}
.ladeKop h2{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:27px;margin:0}
.ladeSluit{margin-left:auto;background:none;border:0;padding:8px;line-height:0;color:var(--ink)}
.ladeSluit svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.6}
.ladeBody{flex:1;overflow-y:auto;padding:8px 26px}
.ladeVoet{border-top:1px solid #e6dfd2;padding:22px 26px calc(22px + env(safe-area-inset-bottom))}

/* regels in het mandje */
.regel{display:grid;grid-template-columns:76px 1fr;gap:15px;padding:20px 0;border-bottom:1px solid #ece6da}
.regel:last-child{border-bottom:0}
.regel img{width:76px;height:76px;object-fit:contain;background:#fff;border:1px solid #e6dfd2}
.regel h4{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:17px;margin:0 0 3px}
.regelPrijs{font-size:12px;color:#8d867b;margin:0 0 11px}
.stapper{display:flex;align-items:center;gap:0;border:1px solid #d8d0c3;width:max-content}
.stapper button{width:31px;height:31px;background:none;border:0;font-size:15px;line-height:1;color:var(--ink);transition:.2s}
.stapper button:hover{background:var(--ink);color:#fff}
.stapper span{min-width:31px;text-align:center;font-size:13px;font-weight:600}
.regelWeg{background:none;border:0;padding:0;margin-left:14px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#8d867b;text-decoration:underline;text-underline-offset:3px}
.regelWeg:hover{color:var(--ink)}
.regelRij{display:flex;align-items:center}
.regelTotaal{margin-left:auto;font-weight:700;font-size:14px}
.mandjeLeeg{text-align:center;padding:70px 10px;color:#8d867b}
.mandjeLeeg p{line-height:1.7;font-size:14px}
.totaalRij{display:flex;align-items:baseline;margin-bottom:6px}
.totaalRij .lbl{font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:#8d867b}
.totaalRij .bedrag{margin-left:auto;font-family:'Playfair Display','Playfair Fallback',serif;font-size:29px}
.voetNoot{font-size:11.5px;line-height:1.6;color:#8d867b;margin:0 0 16px}
.knopAf{display:block;width:100%;text-align:center;background:var(--ink);color:#fff;border:1px solid var(--ink);padding:17px;font:700 11px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.15em;text-transform:uppercase;text-decoration:none;transition:.2s}
.knopAf:hover{background:var(--h);border-color:var(--h)}
.knopVerder{display:block;width:100%;background:none;border:0;padding:14px 0 0;font:600 11px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.13em;text-transform:uppercase;color:#8d867b}
.knopVerder:hover{color:var(--ink)}

/* productdetail */
.detBeeld{background:#fff;border:1px solid #e6dfd2;aspect-ratio:1/1;margin:20px 0 22px}
.detBeeld img{display:block;width:100%;height:100%;object-fit:contain}
.detCat{font:700 10px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--h)}
.detTitel{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:33px;line-height:1.05;margin:12px 0 10px}
.detPrijs{font-size:19px;font-weight:700;margin:0 0 20px}
.detTekst{font-size:14px;line-height:1.75;color:#5d584f;margin:0 0 22px}
.detBlok{border-top:1px solid #e6dfd2;padding:17px 0}
.detBlok h5{font:700 10px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#8d867b;margin:0 0 11px}
.detBlok dl{display:grid;grid-template-columns:auto 1fr;gap:7px 18px;margin:0;font-size:13.5px}
.detBlok dt{color:#8d867b}
.detBlok dd{margin:0;color:var(--ink)}
.detBlok p{margin:0;font-size:13.5px;line-height:1.65;color:#5d584f}

@media(max-width:1100px){.prodGrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:850px){
  .prodGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .shopTools{margin-top:54px}
  .telling{width:100%;margin:6px 0 0;order:3}
  .mandjeKnop{right:16px;bottom:16px;padding:14px 19px}
  .lade{width:100%}
}
@media(max-width:550px){
  .prodBody{padding:16px 15px 17px}
  .prodBody h3{font-size:19px}
  .prodKort{font-size:12.5px;margin-bottom:14px}
  .prodVoet{flex-wrap:wrap;gap:9px}
  .knopIn{margin-left:0;width:100%;text-align:center}
  .chip{padding:11px 14px;font-size:10px;letter-spacing:.1em}
}

.titelKnop{background:none;border:0;padding:0;font:inherit;color:inherit;text-align:left;max-width:100%;overflow-wrap:break-word}
.chip,.knopIn,.knopAf,.knopVerder,.regelWeg,.stapper button,.ladeSluit,.mandjeKnop,.prodBeeld,.titelKnop{font-family:'DM Sans','DM Sans Fallback',sans-serif}
.titelKnop{font-family:'Playfair Display','Playfair Fallback',serif}

/* ===== workshops (2026-08-24) ===== */
.workshops{padding:130px 6vw;background:var(--paper)}
.wsGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin:0 2vw}
.ws{display:flex;flex-direction:column}
.wsBeeld{aspect-ratio:4/3;overflow:hidden;background:var(--cream)}
.wsBeeld img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.ws:hover .wsBeeld img{transform:scale(1.045)}
.ws h3{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:29px;line-height:1.1;margin:24px 0 10px;min-height:2.2em}
.ws p{font-size:14.5px;line-height:1.7;color:#625d54;margin:0}
.wsVoet{margin:32px 2vw 0;padding-top:26px;border-top:1px solid #e6dfd2;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.wsVoet .adres{font-size:14px;color:#625d54}
.wsVoet .adres strong{color:var(--ink);font-weight:600}
.wsVoet .link{margin:0 0 0 auto}
@media(max-width:850px){
  .workshops{padding:90px 6vw}
  .wsGrid{grid-template-columns:1fr;gap:44px}
  .ws h3{font-size:26px;margin-top:20px;min-height:0}
  .wsVoet{display:block}
  .wsVoet .link{margin:14px 0 0}
}

/* ---- ronde 2026-08-24 ---- */
/* De cijfers 01-04 zijn iconen geworden; de cirkel blijft ongewijzigd. */
.num svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.3;
         stroke-linecap:round;stroke-linejoin:round}

/* De ring uit de wereld-sectie loopt door over de video. Dezelfde maat en kleur;
   de hero snijdt hem onderaan af, precies waar de sectie eronder hem oppakt. */
.heroRing{position:absolute;z-index:2;width:800px;height:800px;border:1px solid #d99a2438;
          border-radius:50%;right:-200px;bottom:-450px;pointer-events:none;
          box-shadow:0 0 0 90px #d99a2410,0 0 0 180px #d99a240a}

/* ---- honingwijzer ---- */
/* De wijzer op bee-station.nl bestond niet (de iframe daar wijst naar een 404),
   dus hij is hier gebouwd op de productcatalogus: drie vragen, een score per
   honing, en de winnaar kan direct in het mandje. */
.wijzerKop{display:flex;align-items:baseline;gap:12px;margin-bottom:14px}
.wijzerVraag{font-weight:700;font-size:15px}
.wijzerTeller{margin-left:auto;white-space:nowrap;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#8d867b}
.wijzerBalk{height:2px;background:#e6dfd2;margin-bottom:20px;border-radius:2px;overflow:hidden}
.wijzerBalk i{display:block;height:100%;background:var(--h);transition:width .35s cubic-bezier(.2,.8,.2,1)}
.opt{border:1px solid #d8d0c3;border-radius:10px;padding:18px 20px;display:flex;justify-content:space-between;
     align-items:center;gap:12px;transition:.2s;background:none;width:100%;text-align:left;
     font:inherit;color:inherit}
.opt:hover{background:#17140f;color:#fff;border-color:#17140f;transform:translateX(7px)}
.wijzerTerug{background:none;border:0;padding:12px 0 0;font:700 11px/1 'DM Sans','DM Sans Fallback',sans-serif;
             letter-spacing:.14em;text-transform:uppercase;color:#8d867b;text-align:left}
.wijzerTerug:hover{color:var(--ink)}
.wijzerUit{display:grid;grid-template-columns:132px 1fr;gap:22px;align-items:center}
.wijzerUit img{width:132px;height:132px;object-fit:contain;background:#fff;border:1px solid #e6dfd2;border-radius:12px}
.wijzerUit .lbl{font:700 10px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--h)}
.wijzerUit h3{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:28px;line-height:1.1;margin:9px 0 6px}
.wijzerUit p{font-size:13.5px;line-height:1.6;color:#716b61;margin:0 0 14px}
.wijzerKnoppen{display:flex;flex-wrap:wrap;gap:9px}
/* 2026-10-04: zes vragen + twee matches (aanlevering klant), zie site.js */
.wijzerHint{font-size:13.5px;line-height:1.6;color:#716b61;margin:-6px 0 16px}
.opt.gekozen{border-color:var(--h);box-shadow:inset 3px 0 0 var(--h)}
.opt.optGeen{color:#716b61}
.opt.optGeen:hover{color:#fff}
.wijzerUit+.wijzerUit{margin-top:22px;padding-top:22px;border-top:1px solid #e6dfd2}
.wijzerUit{align-items:start}
.wijzerFeiten{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;align-items:baseline;margin:2px 0 14px;font-size:13.5px;line-height:1.5}
.wijzerFeiten dt{font:700 10px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8d867b}
.wijzerFeiten dd{margin:0;color:#4d473e}
.wijzerAlle{margin-top:26px;border-top:1px solid #e6dfd2;padding-top:14px}
.wijzerAlle summary{cursor:pointer;font:700 11px/1.4 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--h);padding:6px 0}
.wijzerAlle ol{margin:12px 0 0;padding:0 0 0 22px;display:grid;gap:10px;font-size:14px}
.wijzerAlle li{display:grid;grid-template-columns:1fr auto;column-gap:12px;align-items:baseline}
.wijzerAlle li::marker{color:#8d867b;font-size:12px}
.wijzerAlle li button{background:none;border:0;padding:0;font:600 14px/1.35 'DM Sans','DM Sans Fallback',sans-serif;color:var(--ink);text-align:left;cursor:pointer;text-decoration:underline;text-decoration-color:#d8d0c3;text-underline-offset:3px}
.wijzerAlle li button:hover{text-decoration-color:var(--h)}
.wijzerAlle small{grid-column:1/-1;color:#8d867b;font-size:12.5px;line-height:1.45}
.wijzerScore{font-size:11px;letter-spacing:.08em;color:#8d867b;white-space:nowrap}
.wijzerNoot{margin:14px 0 0;font-size:11.5px;color:#8d867b}
@media(max-width:550px){
  .wijzerUit{grid-template-columns:1fr;gap:16px}
  .wijzerUit img{width:100%;height:190px}
  .wijzerFeiten{grid-template-columns:1fr;gap:2px}
  .wijzerFeiten dd{margin-bottom:6px}
}

/* De bezoekknop in dezelfde honingkleur als Shop honey in de header. */
.knopHoning{display:inline-flex;align-items:center;background:var(--gold);border:1px solid var(--gold);color:var(--ink);
  text-decoration:none;padding:14px 22px;border-radius:30px;width:max-content;margin:20px auto;
  font-weight:700;transition:background .25s,border-color .25s}
.knopHoning:hover{background:#e8b849;border-color:#e8b849}

/* ---- contactpagina ---- */
.mapHero{position:relative;height:62svh;min-height:470px;background:var(--cream)}
.mapHero iframe{width:100%;height:100%;border:0;display:block;filter:saturate(.9)}
/* De navigatie staat met witte tekst over de kaart; deze band houdt hem leesbaar
   en laat de kaart eronder gewoon bedienbaar (pointer-events:none). */
.mapHero:before{content:"";position:absolute;left:0;right:0;top:0;height:215px;z-index:2;
  pointer-events:none;background:linear-gradient(180deg,#17130eee 0,#17130ea6 48%,#17130e00 100%)}
.mapKaart{position:absolute;z-index:3;left:7vw;bottom:42px;background:var(--paper);
  border-radius:18px;padding:34px 38px;max-width:400px;box-shadow:0 22px 60px #17140f2e}
.mapKaart h1{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:40px;line-height:1.05;margin:12px 0 14px}
.mapKaart address{font-style:normal;font-size:15px;line-height:1.75;color:#5d584f}
.mapKaart .knopHoning{margin:20px 0 0}
.contactBlok{padding:110px 6vw}
.contactGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;margin:0 2vw}
.contactGrid h3{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:26px;margin:0 0 10px}
.contactGrid p{font-size:14.5px;line-height:1.75;color:#625d54;margin:0}
.contactGrid a{color:var(--h);text-decoration:none;font-weight:600}
.contactGrid a:hover{text-decoration:underline}
@media(max-width:850px){
  .mapHero{height:56svh;min-height:400px}
  .mapKaart{left:6vw;right:6vw;max-width:none;bottom:26px;padding:26px 24px}
  .mapKaart h1{font-size:32px}
  .contactBlok{padding:70px 6vw}
  .contactGrid{grid-template-columns:1fr;gap:34px}
}

/* ---- winkelpagina (2026-08-25) ---- */
.alleKnopRij{display:flex;justify-content:center;margin:46px 2vw 0}
.knopAlle{display:inline-flex;align-items:center;background:var(--ink);color:#fff;border:1px solid var(--ink);
  text-decoration:none;padding:17px 30px;font:700 11px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.15em;
  text-transform:uppercase;transition:background .25s,border-color .25s}
.knopAlle:hover{background:var(--h);border-color:var(--h)}
.winkelKop{padding:150px 6vw 120px}
.winkelBar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;margin:56px 2vw 26px}
.wZoek{position:relative;flex:1 1 240px;min-width:200px}
.wZoek svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;
  fill:none;stroke:#8d867b;stroke-width:1.6;stroke-linecap:round}
.wZoek input{width:100%;border:1px solid #d8d0c3;background:#fff;padding:14px 16px 14px 40px;
  font:500 14px/1 'DM Sans','DM Sans Fallback',sans-serif;color:var(--ink)}
.wZoek input:focus{outline:none;border-color:var(--h)}
.wVeld{display:flex;flex-direction:column;gap:6px}
.wVeld span{font:700 10px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8d867b}
.wVeld select{border:1px solid #d8d0c3;background:#fff;padding:13px 34px 13px 14px;
  font:700 13px/1 'DM Sans','DM Sans Fallback',sans-serif;color:var(--ink);appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%2317140f' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;background-size:11px}
.wVeld select:focus{outline:none;border-color:var(--h)}
.wWis{border:0;background:none;padding:14px 8px;font:700 11px/1 'DM Sans','DM Sans Fallback',sans-serif;
  letter-spacing:.13em;text-transform:uppercase;color:#8d867b;align-self:flex-end}
.wWis:hover{color:var(--ink)}
.wWis[hidden]{display:none}
.wTelling{width:100%;margin:4px 0 0;font:600 12px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.12em;
  text-transform:uppercase;color:#8d867b}
#winkelGrid{margin:0 2vw}

/* variantkeuze in de productlade */
.varRij{display:flex;flex-wrap:wrap;gap:8px}
.varKnop{border:1px solid #d8d0c3;background:none;padding:11px 15px;font:700 12px/1 'DM Sans','DM Sans Fallback',sans-serif;
  color:var(--ink);transition:.2s}
.varKnop:hover{border-color:var(--ink)}
.varKnop.aan{background:var(--ink);color:#fff;border-color:var(--ink)}

@media(max-width:850px){
  .winkelKop{padding:120px 6vw 90px}
  .winkelBar{gap:10px}
  .wVeld{flex:1 1 calc(50% - 5px)}
  .wVeld select{width:100%}
}

/* ---- receptenslider (2026-08-25) ---- */
.recepten{padding:130px 6vw;background:var(--paper)}
.recSlider{position:relative;margin:0 2vw}
.recSpoor{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;scrollbar-width:none;padding:4px 0 6px}
.recKaart{flex:0 0 calc(25% - 16.5px)}
.recSpoor::-webkit-scrollbar{display:none}
.recKaart{scroll-snap-align:start;background:var(--paper);border:1px solid #e6dfd2;
  display:flex;flex-direction:column;transition:border-color .25s,transform .5s cubic-bezier(.2,.8,.2,1)}
.recKaart:hover{border-color:#c9bfab;transform:translateY(-4px)}
.recBeeld{border:0;padding:0;display:block;width:100%;background:none;line-height:0;overflow:hidden}
.recArt{width:100%;height:auto;display:block;aspect-ratio:4/3;object-fit:cover;
  background:#efe9dd;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.recKaart:hover .recArt{transform:scale(1.04)}
@media(prefers-reduced-motion:reduce){.recArt{transition:none}
  .recKaart:hover .recArt{transform:none}}
.recKaart .recBody{padding:20px 21px 21px;display:flex;flex-direction:column;flex:1}
.recMeta{font:700 10px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--h)}
.recKaart h3{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:21px;line-height:1.15;margin:10px 0 7px}
.recKaart p{font-size:13px;line-height:1.55;color:#716b61;margin:0 0 16px}
.recLink{margin-top:auto;align-self:flex-start;background:none;border:0;padding:0;
  font:700 11px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--h)}
.recLink:hover{color:var(--ink)}
.recNav{position:absolute;top:34%;z-index:3;width:46px;height:46px;border:1px solid #d8d0c3;
  background:var(--paper);display:grid;place-items:center;transition:.22s}
.recNav svg{width:18px;height:18px;fill:none;stroke:var(--ink);stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.recNav:hover{background:var(--ink);border-color:var(--ink)}
.recNav:hover svg{stroke:#fff}
.recNav:disabled{opacity:.3;pointer-events:none}
.recVorige{left:-23px}.recVolgende{right:-23px}
.recBollen{display:flex;justify-content:center;gap:8px;margin-top:26px}
.recBol{width:7px;height:7px;border-radius:50%;border:0;background:#d8d0c3;padding:0;transition:.25s}
.recBol.aan{background:var(--h);transform:scale(1.35)}
.recLadeBeeld{border:1px solid #e6dfd2;margin:20px 0 22px;line-height:0}
.recBron{margin:22px 2vw 0;text-align:center;font-size:11px;line-height:1.6;color:#8e877c}
.recBron a{color:#8e877c;text-decoration:underline;text-underline-offset:2px}
.recBron a:hover{color:var(--ink)}
.recLijst,.recStappen{margin:0;padding-left:18px;font-size:13.5px;line-height:1.7;color:#5d584f}
.recLijst li,.recStappen li{margin-bottom:5px}
.recStappen li{padding-left:4px}
@media(max-width:1100px){.recKaart{flex-basis:calc(33.333% - 14.7px)}}
@media(max-width:850px){
  .recepten{padding:90px 6vw}
  .recKaart{flex-basis:calc(50% - 11px)}
  .recVorige{left:-8px}.recVolgende{right:-8px}
}
@media(max-width:550px){
  .recKaart{flex-basis:86%}
  .recNav{display:none}
}
/* ---- ijs en taart: twee blokken rand tot rand (2026-08-25) ----
   Zelfde opbouw als .story hierboven: halve foto, halve tekst, geen marge.
   `.omgekeerd` zet de foto rechts; op mobiel staat de foto altijd bovenaan. */
/* Witruimte tot het imkerblok. Het laatste blok (.omgekeerd) is paper, dus .vers zelf
   ook paper — anders krijg je een cream streep onder een paper blok. */
.vers{background:var(--paper);padding-bottom:clamp(80px,9vw,130px)}
/* De hele #vers is één doorlopend paper-vlak, net als de productensectie erboven;
   de afgeronde binnenhoeken snijden daar een bocht uit in plaats van een kleurstap
   te maken. (.story eronder is wél cream, dat is de bewuste overgang.)

   De blokken zelf hebben BEWUST geen eigen achtergrond meer. Ze zijn
   position:relative voor de ringen, en een gevuld positioned blok schildert over
   alles wat eerder in de DOM staat: het medovikblok kapte de ring van het ijsblok
   dan af op de blokgrens. Die grens is nu onzichtbaar, dus dat oogde als een bug.
   Transparant laten en .vers het vlak laten leveren lost dat op zonder z-index-
   geknutsel. */
.versBlok{display:grid;grid-template-columns:1.1fr .9fr;min-height:760px}
.versBlok.omgekeerd{grid-template-columns:.9fr 1.1fr}
.versBlok.omgekeerd .versFoto{order:2}

/* --- Alleen het medovikblok: zachte onderhoek plus een ring (2026-08-25) ---
   De linkeronderhoek van de medovikfoto is afgerond, zodat de harde rechthoek
   niet pal op het imkerblok eronder botst.

   De ring is dezelfde vorm als .heroRing maar kleiner en vager, en staat
   BEWUST concentrisch met die hoek: middelpunt op (45% + straal, straal boven
   de onderrand), dus precies het middelpunt van de hoekbocht. Daardoor volgt
   hij de bocht in plaats van er los naast te zweven. 45% is de kolomgrens van
   de .9fr/1.1fr-verdeling.

   Hij hoeft niet weggeknipt te worden waar de foto zit: .versFoto is zelf
   position:relative en staat later in de DOM, dus die dekt de ring af. Onder
   het blok loopt de ring door in de paper-band en verdwijnt daar achter het
   imkerblok, want .story krijgt z-index 1. */
.versBlok{--hoek:clamp(90px,13vw,210px);position:relative}
/* Alleen de BINNENLIJN buigt. De buitenkant van elke foto loopt tegen de
   paginarand aan en blijft recht; de kant die naar de tekst kijkt krijgt beide
   hoeken. Bij het ijs is dat rechts (foto links), bij de medovik links (foto
   rechts) - gespiegeld, dus de twee blokken buigen naar elkaar toe. */
.versBlok:not(.omgekeerd) .versFoto{
  border-top-right-radius:var(--hoek);border-bottom-right-radius:var(--hoek)}
.versBlok.omgekeerd .versFoto{
  border-top-left-radius:var(--hoek);border-bottom-left-radius:var(--hoek)}
/* Elk blok heeft er een, gecentreerd op de onderste binnenhoek van zijn eigen
   foto. Bij het ijs is die hoek rechtsonder (foto links, binnenlijn op 55%),
   bij de medovik linksonder (foto rechts, binnenlijn op 45%). Gespiegeld dus. */
.versRing{position:absolute;pointer-events:none;border-radius:50%;
  bottom:var(--hoek);transform:translate(-50%,50%);
  width:calc((var(--hoek) + 34px) * 2);aspect-ratio:1;
  border:1px solid #d99a2430;
  box-shadow:0 0 0 clamp(20px,2.6vw,38px) #d99a240c,
             0 0 0 clamp(40px,5.2vw,76px) #d99a2406}
.versBlok:not(.omgekeerd) .versRing{left:calc(55% - var(--hoek))}
.versBlok.omgekeerd  .versRing{left:calc(45% + var(--hoek))}
.story{position:relative;z-index:1}
.versFoto{position:relative;overflow:hidden;background:#efe9dd}
.versFoto img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.versBlok:hover .versFoto img{transform:scale(1.035)}
.versTekst{padding:9vw 8vw;display:flex;flex-direction:column;justify-content:center}
.versTekst h2{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;
  font-size:clamp(50px,5vw,80px);line-height:.98;margin:18px 0 28px}
.versTekst p{line-height:1.8;color:#625d54;font-size:16px;margin:0 0 34px;max-width:34em}
.versVoet{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.versVoet .prijs{font-size:22px}
.versVoet .prijs em{font-style:normal;font-size:12px;font-weight:500;color:#8d867b;letter-spacing:.04em}
.versVoet .knopIn{margin-left:0;width:auto;background:var(--ink);color:#fff;border-color:var(--ink);
  padding:17px 30px;font-size:11px}
.versVoet .knopIn:hover{background:#8f5d00;border-color:#8f5d00}
@media(prefers-reduced-motion:reduce){
  .versFoto img{transition:none}.versBlok:hover .versFoto img{transform:none}}
@media(max-width:850px){
  .vers{padding-bottom:clamp(56px,11vw,90px)}
  .versBlok,.versBlok.omgekeerd{grid-template-columns:1fr;min-height:0}
  .versBlok.omgekeerd .versFoto{order:0}
  /* Gestapeld staat de foto BOVEN de tekst, dus die onderhoek grenst hier
     helemaal niet aan het imkerblok en 45% is geen kolomgrens meer maar het
     midden van de knop. Hoek en ring dus alleen op desktop. */
  /* Even specifiek als de desktopregels hierboven (0,3,0): `.versBlok .versFoto`
     is (0,2,0) en verliest het, ook al staat het later. */
  .versBlok:not(.omgekeerd) .versFoto,
  .versBlok.omgekeerd .versFoto{border-radius:0}
  .versRing{display:none}
  .versFoto{height:62vw;min-height:300px;max-height:460px}
  .versTekst{padding:60px 6vw 66px}
  .versTekst h2{font-size:clamp(38px,10vw,52px);margin:14px 0 20px}
  .versVoet .knopIn{width:100%;text-align:center}
}

/* ---- muiscursor (2026-08-25) ----
   De eigen honingdruppel-cursor is eruit; body{cursor:none} dus ook. Een <button>
   toont van zichzelf géén handje, en de site zit vol knoppen die als link werken,
   dus dat hier terugzetten. */
button,[role="button"],summary,label{cursor:pointer}
button:disabled,[role="button"][aria-disabled="true"]{cursor:default}

/* ---- taalschakelaar NL | EN (2026-08-26) ----
   In de bovenbalk op desktop; die balk is onder 850px verborgen, dus daar
   staat dezelfde schakelaar onderaan het mobiele menu. */
.taal{position:absolute;right:4vw;top:0;height:32px;display:flex;align-items:center;gap:7px;
  font-size:11px;letter-spacing:.08em}
.taal a,.taal .aan{color:#fff;text-decoration:none;padding:2px 4px;border-radius:3px}
.taal a{opacity:.6;transition:opacity .2s}
.taal a:hover{opacity:1;text-decoration:underline}
.taal .aan{font-weight:700;background:rgba(255,255,255,.16)}
.taal .aan+a::before,.taal a+.aan::before{content:"|";opacity:.45;margin-right:7px;font-weight:400}
.taalMobiel{display:none;gap:10px;margin-top:26px;font-size:18px;letter-spacing:.1em}
.taalMobiel a,.taalMobiel .aan{color:#fff;text-decoration:none;padding:6px 12px;border-radius:6px}
.taalMobiel a{opacity:.55}
.taalMobiel .aan{font-weight:700;background:rgba(255,255,255,.14)}
@media(max-width:850px){.taalMobiel{display:flex}}

/* De hero-hint staat in writing-mode:vertical-rl, waardoor het ↓-teken 90°
   meedraait en naar LINKS wijst. Los element plus een tegendraai zet hem
   weer naar beneden. */
.scroll .scrollPijl{display:inline-block;transform:rotate(-90deg);margin-top:.9em}

/* ---- navigatie op een lichte pagina (2026-08-26) ----
   .nav staat wit en absoluut over de donkere hero-video van de homepage.
   De winkelpagina heeft geen hero, dus daar viel het hele menu weg in het
   crème (logo én links onzichtbaar; alleen de gouden knop bleef over).
   Deze variant zet de tekst op de inktkleur, haalt de invert van het logo
   en maakt de scheidingslijn en de hamburger donker. */
.nav--licht{color:var(--ink)}
.nav--licht img{filter:none}
.nav--licht:after{background:linear-gradient(90deg,#17140f24 0,#17140f24 calc(4vw - 12px),
  transparent calc(4vw - 12px),transparent calc(4vw + 104px),#17140f24 calc(4vw + 104px),#17140f24 100%)}
.nav--licht .burger span{background:var(--ink)}

/* De winkeltitel moet op één regel. De <br> is eruit, maar de ondergrens van
   48px in .sectionHead h2 maakt hem op de smalste telefoons net te breed
   (360px: 27px te veel). Alleen daar iets kleiner; vanaf 400px verandert er
   niets. Scoped op .winkelKop zodat de andere sectiekoppen ongemoeid blijven. */
/* .sectionHead is flex; de kop staat op `flex:0 1 auto` en werd door de
   paragraaf ernaast samengedrukt (op 900px 356px nodig, 336px gekregen).
   Niet laten krimpen, dan houdt hij zijn regel. */
.winkelKop .sectionHead h2{flex-shrink:0}
/* Op de smalste telefoons past 48px net niet — de Engelse titel is breder dan
   de Nederlandse, dus de ondergrens is op de Engelse tekst gezet. */
@media (max-width:400px){
  .winkelKop .sectionHead h2{font-size:clamp(36px,11vw,48px)}
}

/* ===== pakketten, cadeauverpakking en samenstellen (2026-09-30) ===== */
.prodLint{position:absolute;right:0;bottom:0;font:700 9px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.16em;text-transform:uppercase;background:var(--ink);color:#fff;padding:8px 11px}
.samenstel .samenUitleg{margin:0 0 12px}
.samenUitleg a{color:var(--h);font-weight:600;text-decoration:none}
.samenUitleg a:hover{text-decoration:underline}
.honingKeuze{display:flex;flex-direction:column;gap:6px;margin:0 0 10px}
.honingKeuze span{font-size:12px;color:#8d867b}
.honingKeuze select,.honingKeuze textarea{width:100%;border:1px solid #d8d0c3;background:#fff;padding:12px 34px 12px 13px;font:600 13.5px/1.3 'DM Sans','DM Sans Fallback',sans-serif;color:var(--ink);appearance:none;border-radius:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2317140f' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;background-size:11px}
.honingKeuze textarea{background-image:none;padding-right:13px;font-weight:500;resize:vertical}
.honingKeuze select:focus,.honingKeuze textarea:focus{outline:none;border-color:var(--h)}
.detBlok p a{color:var(--h);font-weight:600;text-decoration:none}
.regelDetail{list-style:none;margin:0 0 6px;padding:0;font-size:12px;line-height:1.5;color:#625d54}
.regelDetail li:before{content:"— ";color:#c9bfae}
.regelKorting{color:var(--h);font-weight:700}
.kortingRij{font-size:13px;color:var(--h)}
.kortingRij span:last-child{margin-left:auto;font-weight:700}
.knopZakelijk{text-decoration:none;text-align:center;color:var(--h)}

/* home: cadeaublok */
.cadeau{background:var(--cream);padding:120px 6vw 110px;position:relative;overflow:hidden}
.cadeauGrid{display:grid;grid-template-columns:.95fr 1.05fr;gap:70px;align-items:center;margin:0 2vw}
.cadeau h2{font-family:'Playfair Display','Playfair Fallback',serif;font-size:clamp(46px,5vw,76px);line-height:1;margin:14px 0 22px;font-weight:500}
.cadeau h2 em{color:var(--h);font-weight:500}
.cadeauIntro{color:#625d54;line-height:1.7;max-width:520px;margin:0 0 34px}
.stappen{list-style:none;margin:0 0 38px;padding:0;counter-reset:stap;display:grid;gap:18px}
.stappen li{counter-increment:stap;display:grid;grid-template-columns:46px 1fr;gap:16px;align-items:baseline}
.stappen li:before{content:counter(stap);width:46px;height:46px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;font-family:'Playfair Display','Playfair Fallback',serif;font-size:19px;color:var(--h);align-self:start}
.stappen strong{display:block;font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:22px;margin:0 0 3px}
.stappen span{font-size:14px;line-height:1.6;color:#625d54}
.cadeauKnoppen{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.knopLicht{display:inline-flex;align-items:center;border:1px solid var(--ink);color:var(--ink);text-decoration:none;padding:17px 26px;font:700 11px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.15em;text-transform:uppercase;transition:.2s}
.knopLicht:hover{background:var(--ink);color:#fff}
.cadeauBeeld{position:relative;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at 50% 45%,#fff 0,#fffdf8 55%,#f5efe300 72%)}
.cadeauBeeld img{position:absolute;width:44%;mix-blend-mode:multiply;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.cadeauBeeld img:nth-child(1){left:28%;top:18%;width:48%;z-index:2}
.cadeauBeeld img:nth-child(2){left:0;top:38%;width:38%}
.cadeauBeeld img:nth-child(3){right:0;top:34%;width:40%}
.cadeauBeeld img:nth-child(4){left:14%;top:-2%;width:30%}
.cadeauBeeld img:nth-child(5){right:10%;top:-4%;width:30%}
.cadeauBeeld:hover img:nth-child(2){transform:translate(-8px,6px) rotate(-3deg)}
.cadeauBeeld:hover img:nth-child(3){transform:translate(8px,6px) rotate(3deg)}
.cadeauBeeld:hover img:nth-child(1){transform:translateY(-8px)}
.cadeauBand{margin:80px -6vw 0;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.cadeauBand .spoor{display:flex;gap:26px;width:max-content;animation:band 60s linear infinite}
.cadeauBand:hover .spoor{animation-play-state:paused}
.cadeauBand a{flex:0 0 150px;display:block;text-align:center;text-decoration:none;color:var(--ink)}
.cadeauBand img{width:150px;height:150px;object-fit:contain;mix-blend-mode:multiply;transition:transform .5s}
.cadeauBand a:hover img{transform:translateY(-6px)}
.cadeauBand small{display:block;font-size:11px;letter-spacing:.08em;color:#8d867b;margin-top:4px}
@keyframes band{to{transform:translateX(-50%)}}

/* winkel: categoriechips */
.wChips{display:flex;flex-wrap:wrap;gap:8px;margin:0 2vw 26px}
.wChip{font:700 10.5px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);background:none;border:1px solid #d8d0c3;padding:11px 15px;transition:.2s}
.wChip:hover{border-color:var(--ink)}
.wChip[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}

/* pakketpagina */
.pakKop{padding:150px 6vw 40px}
.pakStappen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin:10px 2vw 0}
.pakStap{background:#fff;border:1px solid #ece6da;padding:0 0 26px;position:relative}
.pakStap .beeld{aspect-ratio:4/3;display:grid;place-items:center;background:#fff;border-bottom:1px solid #ece6da;overflow:hidden}
.pakStap .beeld img{width:62%;height:auto;mix-blend-mode:multiply}
.pakStap .nr{position:absolute;top:16px;left:16px;width:42px;height:42px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-family:'Playfair Display','Playfair Fallback',serif;font-size:18px}
.pakStap h3{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:26px;margin:22px 24px 8px}
.pakStap p{margin:0 24px;font-size:14px;line-height:1.65;color:#625d54}
.pakSectie{padding:90px 6vw 20px}
.pakSectie .sectionHead{margin-bottom:34px}
.pakSectie .sectionHead h2{font-size:clamp(38px,4vw,58px)}
.pakBanner{margin:60px 8vw 0;display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:center;background:var(--cream);padding:50px}
.pakBanner img{width:100%;mix-blend-mode:multiply}
.pakBanner h3{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:clamp(32px,3.4vw,48px);line-height:1.05;margin:10px 0 14px}
.pakBanner p{color:#625d54;line-height:1.7;margin:0 0 24px}
.offerte{background:#16130e;color:#fff;padding:120px 6vw;margin-top:100px;position:relative;overflow:hidden}
.offerte:before{content:"";position:absolute;width:760px;height:760px;border:1px solid #d99a2425;border-radius:50%;left:-260px;bottom:-420px;box-shadow:0 0 0 90px #d99a2408,0 0 0 180px #d99a2405}
.offerteGrid{position:relative;display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;margin:0 2vw}
.offerte h2{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:clamp(44px,5vw,72px);line-height:1;margin:14px 0 20px}
.offerte p{color:#aaa295;line-height:1.7}
.staffel{width:100%;border-collapse:collapse;margin:30px 0 0;font-size:14px}
.staffel th,.staffel td{text-align:left;padding:13px 0;border-bottom:1px solid #ffffff1c}
.staffel th{font:700 10px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#8d867b}
.staffel td:last-child{color:#e8b849;font-weight:700;text-align:right}
.offerteForm{display:grid;grid-template-columns:1fr 1fr;gap:14px;background:#fffdf8;color:var(--ink);padding:40px;border-radius:18px}
.offerteForm label{display:flex;flex-direction:column;gap:6px;font:700 10px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#8d867b}
.offerteForm .breed{grid-column:1/-1}
.offerteForm input,.offerteForm textarea{border:1px solid #d8d0c3;background:#fff;padding:13px 14px;font:500 14px/1.4 'DM Sans','DM Sans Fallback',sans-serif;color:var(--ink);letter-spacing:0;text-transform:none;border-radius:0}
.offerteForm input:focus,.offerteForm textarea:focus{outline:none;border-color:var(--h)}
.offerteForm button{grid-column:1/-1;margin-top:6px}
.offerteForm .noot{grid-column:1/-1;font-size:12px;color:#8d867b;margin:0;line-height:1.6}
.offerteOk{grid-column:1/-1;background:var(--cream);padding:14px 16px;font-size:13.5px;line-height:1.6;margin:0}

@media(max-width:1100px){
  .cadeauGrid{grid-template-columns:1fr;gap:40px}
  .cadeauBeeld{max-width:520px;margin:0 auto;width:100%}
  .offerteGrid{grid-template-columns:1fr;gap:50px}
}
@media(max-width:850px){
  .cadeau{padding:80px 6vw}
  .pakStappen{grid-template-columns:1fr;gap:18px}
  .pakBanner{grid-template-columns:1fr;margin:40px 6vw 0;padding:32px;gap:24px}
  .pakBanner img{max-width:320px;margin:0 auto}
  .pakKop{padding:120px 6vw 30px}
  .pakSectie{padding:60px 6vw 10px}
  .offerte{padding:80px 6vw;margin-top:70px}
}
@media(max-width:550px){
  .cadeauGrid,.pakStappen,.offerteGrid{margin:0}
  .cadeauKnoppen a{width:100%;justify-content:center}
  .offerteForm{grid-template-columns:1fr;padding:26px 20px}
  .cadeauBand{margin-top:50px}
  .cadeauBand a{flex-basis:118px}.cadeauBand img{width:118px;height:118px}
  .wChips{margin:0 0 20px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
  .wChips::-webkit-scrollbar{display:none}
  .wChip{flex:0 0 auto}
}
@media(prefers-reduced-motion:reduce){.cadeauBand .spoor{animation:none}}
@media(max-width:550px){.pakKop .sectionHead h2,.pakSectie .sectionHead h2{font-size:clamp(29px,8.4vw,44px);flex-shrink:1}}
.cadeauBand a{background:#fff;border-radius:16px;padding:14px 12px 12px;box-shadow:0 1px 0 #e9e1d3}
.cadeauBand img{mix-blend-mode:normal}

/* ===== Perronbezorging Hilversum Centraal (2026-10-05) — sectie #perron, #perronLade, mandje, pop-up ===== */
.perron{background:#16130e;color:#fff;padding:130px 6vw 0;position:relative;overflow:hidden}
.perronRing{position:absolute;width:760px;height:760px;border:1px solid #d99a2425;border-radius:50%;left:-260px;bottom:-420px;box-shadow:0 0 0 90px #d99a2408,0 0 0 180px #d99a2405;pointer-events:none}
.perronGrid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,6vw,96px);align-items:start;margin:0 2vw;position:relative;z-index:1}
.perron .eyebrow{color:#e8b849}
.perron h2{font-family:'Playfair Display','Playfair Fallback',serif;font-size:clamp(46px,5vw,78px);line-height:1;margin:16px 0 24px;font-weight:500}
.perron h2 em{color:#efb743;font-weight:500}
.perronIntro{color:#d7d0c3;line-height:1.7;font-size:17px;max-width:540px;margin:0 0 34px}
.perronStappen strong{color:#fff}
.perronStappen span{color:#aaa295}
.perronStappen li:before{color:#e8b849;background:#16130e}
.perronPrijs{display:flex;align-items:center;gap:18px;border-top:1px solid #ffffff1c;border-bottom:1px solid #ffffff1c;padding:18px 0;margin:0 0 30px;max-width:540px}
.perronPrijs small{font-size:12.5px;line-height:1.55;color:#aaa295}
.pPrijs{white-space:nowrap;display:inline-flex;align-items:baseline;gap:8px}
.pPrijs b{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:30px;color:#efb743}
.pPrijs s{font-size:14px;color:#8d867b}
.perronKnoppen{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.knopPerron{display:inline-flex;align-items:center;gap:8px;background:var(--gold);border:1px solid var(--gold);color:var(--ink);padding:17px 26px;font:700 11px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.15em;text-transform:uppercase;border-radius:30px;transition:background .25s,border-color .25s}
.knopPerron:hover{background:#e8b849;border-color:#e8b849}
.knopLichtDonker{display:inline-flex;align-items:center;border:1px solid #ffffff55;color:#fff;text-decoration:none;padding:17px 26px;font:700 11px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.15em;text-transform:uppercase;border-radius:30px;transition:.2s}
.knopLichtDonker:hover{background:#fff;color:var(--ink)}
.perronBeeld{position:relative;padding-bottom:20px}
.perronVideo{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:0 0 0 clamp(90px,13vw,210px);background:#000}
.perronVideo video{width:100%;height:100%;object-fit:cover;display:block}
.perronBord{position:relative;margin:-90px 0 0 clamp(24px,6vw,90px);background:#0d0b08;border:1px solid #d99a2440;border-radius:14px;padding:18px 18px 12px;box-shadow:0 24px 60px #0008}
.bordKop{display:flex;align-items:center;gap:10px;padding:0 4px 12px;border-bottom:1px solid #ffffff14;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.bordKop strong{font-weight:700;color:#fff}
.bordStation{margin-left:auto;color:#8d867b}
.bordLamp{width:8px;height:8px;border-radius:50%;background:#e8b849;box-shadow:0 0 0 4px #e8b84922;animation:bordLamp 2.4s ease-in-out infinite}
@keyframes bordLamp{50%{opacity:.35}}
.bordRijen{display:grid}
.bordRij{display:grid;grid-template-columns:70px 62px minmax(0,1fr) 74px 96px;align-items:center;gap:10px;text-align:left;background:none;border:0;border-bottom:1px solid #ffffff10;color:#d7d0c3;padding:12px 4px;font:500 13px/1.3 'DM Sans','DM Sans Fallback',sans-serif;transition:background .2s;animation:bordIn .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*90ms)}
.bordRij:last-child{border-bottom:0}
.bordRij:hover{background:#ffffff08}
@keyframes bordIn{from{opacity:0;transform:translateY(-6px)}}
.bDag{color:#8d867b;font-size:12px}
.bTijd{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:19px;color:#efb743;letter-spacing:.02em}
.bTrein{color:#fff;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bTrein small{font-weight:400;color:#8d867b;margin-left:4px}
.bPos{font-size:10px;letter-spacing:.14em;font-weight:700;border:1px solid #d99a2466;color:#e8b849;border-radius:20px;padding:5px 0;text-align:center}
.bVrij{font-size:12px;color:#9fc79a}
.bKies{display:none;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:#fff;opacity:.55;text-align:right;transition:opacity .2s}
.bordRij:hover .bKies{opacity:1}
.bordNoot,.bordLeeg{font-size:11px;color:#6f685d;margin:10px 4px 0}
.perronFeiten{list-style:none;margin:90px 0 0;padding:34px 2vw 40px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;border-top:1px solid #ffffff14;position:relative;z-index:1}
.perronFeiten li{display:grid;gap:5px;font-size:13px;color:#aaa295;line-height:1.5}
.perronFeiten b{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:19px;color:#fff}

/* lade: kies je trein */
.perronLade .ladeBody{padding-top:0}
.pKop{margin:0 -26px;padding:18px 26px;background:var(--cream);border-bottom:1px solid #e6dfd2}
.pKopRij{display:flex;align-items:center;gap:12px}
.pKopRij strong{display:block;font-size:14px}
.pKopRij small{display:block;font-size:11.5px;color:#8d867b;margin-top:2px}
.pKopRij .pPrijs{margin-left:auto}
.pKopRij .pPrijs b,.levOptie .pPrijs b,.popPrijs .pPrijs b{color:var(--h);font-size:22px}
.pTrein{width:38px;height:38px;flex:0 0 38px;border-radius:50%;background:var(--ink);color:#e8b849;display:grid;place-items:center}
.pTrein svg{width:19px;height:19px}
.pMin{margin:12px 0 0;font-size:12.5px;line-height:1.5;color:#8f3b1b;background:#fff4ee;border-left:3px solid #c8642f;padding:9px 12px}
.pStap{padding:24px 0 6px}
.pStap h5{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:20px}
.pStap h5 span{width:28px;height:28px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;font-size:13px;color:var(--h)}
.pDagen{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.pDag{flex:0 0 62px;display:grid;justify-items:center;gap:1px;background:#fff;border:1px solid #e6dfd2;padding:9px 0;font-family:'DM Sans','DM Sans Fallback',sans-serif;color:var(--ink);transition:.2s}
.pDag small{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#8d867b}
.pDag b{font-family:'Playfair Display','Playfair Fallback',serif;font-size:22px;font-weight:500;line-height:1.1}
.pDag:hover{border-color:var(--gold)}
.pDag.aan{background:var(--ink);border-color:var(--ink);color:#fff}
.pDag.aan small{color:#e8b849}
.pSelect{display:block;position:relative}
.pSelect:after{content:"";position:absolute;right:16px;top:50%;width:7px;height:7px;border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.pSelect select{width:100%;appearance:none;-webkit-appearance:none;background:#fff;border:1px solid #e6dfd2;border-radius:0;padding:14px 40px 14px 14px;font:500 15px 'DM Sans','DM Sans Fallback',sans-serif;color:var(--ink)}
.pGroep{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--h);margin:14px 0 8px}
.pGroep span{color:#8d867b;font-weight:500;letter-spacing:.06em;margin-left:6px}
.pRit{width:100%;display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:12px;background:#fff;border:1px solid #e6dfd2;margin-bottom:6px;padding:11px 12px;text-align:left;font-family:'DM Sans','DM Sans Fallback',sans-serif;color:var(--ink);transition:.2s}
.pRit:hover:not(:disabled){border-color:var(--gold)}
.pRit.aan{border:1px solid var(--ink);box-shadow:inset 0 0 0 1px var(--ink);background:#fffaf0}
.pRit:disabled{opacity:.5;background:#faf8f3}
.pTijd{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:18px;color:var(--h)}
.pWat b{display:block;font-size:14px}
.pWat small{font-size:11.5px;color:#8d867b}
.pStatus{font-size:11.5px;color:#3d7a35;text-align:right;max-width:130px;line-height:1.3}
.pStatus.nee{color:#8f3b1b}
.pGeen{font-size:13.5px;line-height:1.6;color:#625d54;background:#fff;border:1px dashed #d8d0c3;padding:14px}
.pDemo{font-size:11px;color:#8d867b;margin:10px 0 0}
.pKaart{background:#fff;border:1px solid #e6dfd2;padding:18px}
.pRitInfo{margin:0 0 14px;font-size:13.5px;line-height:1.6}
.pVenster{display:flex;align-items:baseline;justify-content:space-between;background:var(--cream);padding:12px 14px;margin-bottom:14px}
.pVenster span{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#8d867b}
.pVenster b{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:22px}
.pPositie{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start}
.pPosLabel{background:var(--ink);color:#e8b849;font-size:11px;font-weight:700;letter-spacing:.16em;padding:9px 12px}
.pPositie p{margin:0;font-size:13px;line-height:1.55;color:#625d54}
.pPositie p b{color:var(--ink)}
.pDiagram{display:block;width:100%;height:auto;margin:16px 0 6px}
.pDiagram .dWagen{fill:#efe9dd;stroke:#cfc6b6}
.pDiagram .dAan{fill:var(--gold);stroke:#a06800}
.pDiagram .dRaam{fill:#fff;opacity:.85}
.pDiagram .dPerron{stroke:#17140f;stroke-width:2}
.pDiagram .dPin{fill:var(--ink);stroke:var(--gold);stroke-width:2}
.pDiagram .dPijl{stroke:var(--h);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.pDiagram .dTekst{font:600 10px 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.08em;fill:#8d867b;text-transform:uppercase}
.pDiagram .dHier{fill:var(--ink)}
.pNoot{font-size:12.5px;line-height:1.55;color:#625d54;border-left:3px solid var(--gold);background:#fffaf0;padding:9px 12px;margin:10px 0 0}
.pKlaar{text-align:center;padding:40px 6px 10px}
.pVink{width:58px;height:58px;border-radius:50%;background:var(--gold);color:var(--ink);display:inline-grid;place-items:center;font-size:24px}
.pKlaar h3{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:30px;margin:16px 0 10px}
.pKlaar p{font-size:14px;line-height:1.7;color:#625d54}
.pKlaar p b{color:var(--ink)}
.pUitleg{font-size:12.5px!important;background:var(--cream);padding:12px 14px;text-align:left}
.perronLade .ladeVoet .knopAf{cursor:pointer}

/* mandje: leveringskeuze */
.levering{margin:22px 0 4px;padding-top:20px;border-top:1px solid #e6dfd2}
.levering h5{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:19px;margin:0 0 12px}
.levOptie{display:flex;align-items:center;gap:12px;border:1px solid #e6dfd2;background:#fff;padding:12px 14px;margin-bottom:6px;transition:.2s}
.levOptie:hover:not(.uit){border-color:var(--gold)}
.levOptie.aan{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.levOptie.uit{opacity:.6;cursor:not-allowed}
.levOptie input{accent-color:var(--ink);width:17px;height:17px;margin:0;flex:0 0 17px}
.levTekst{flex:1;min-width:0}
.levTekst b{display:block;font-size:13.5px;font-weight:600}
.levTekst small{display:block;font-size:11.5px;color:#8d867b;margin-top:2px;line-height:1.4}
.levOptie .pPrijs{flex-direction:column;align-items:flex-end;gap:0}
.levOptie .pPrijs b{font-size:19px}
.levOptie .pPrijs s{font-size:11.5px}
.levNieuw{display:inline-block;vertical-align:2px;background:var(--gold);color:var(--ink);font-size:9px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;padding:3px 6px;margin-left:4px}
.levTrein{display:flex;align-items:flex-start;gap:12px;background:var(--cream);padding:12px 14px;margin:2px 0 6px}
.levTrein > div{flex:1;min-width:0}
.levTrein b{display:block;font-size:14px}
.levTrein small{display:block;font-size:11.5px;color:#625d54;line-height:1.45;margin-top:2px}
.levTrein .levPos{color:var(--h);font-weight:600}
.levWijzig{background:none;border:0;padding:4px 0;font:700 10.5px 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.13em;text-transform:uppercase;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.levKies{display:block;width:100%;background:var(--ink);color:#fff;border:0;padding:14px;font:700 11px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.15em;text-transform:uppercase;margin:2px 0 6px}
.levKies:hover{background:var(--h)}
.perronRij span:last-child{margin-left:auto;font-size:14px}

/* pop-up (alleen home) */
.perronPop{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:24px;overflow-y:auto}
.perronPop[hidden]{display:none}
.popScrim{position:fixed;inset:0;background:#17140fb8;opacity:0;transition:opacity .38s}
.popKaart{position:relative;width:min(880px,100%);max-height:calc(100svh - 48px);overflow:auto;background:var(--paper);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);opacity:0;transform:translateY(24px) scale(.98);transition:opacity .38s,transform .5s cubic-bezier(.2,.8,.2,1);box-shadow:0 30px 80px #0006}
.perronPop.open .popScrim{opacity:1}
.perronPop.open .popKaart{opacity:1;transform:none}
.popBeeld{position:relative;min-height:100%;overflow:hidden;border-radius:0 0 clamp(70px,9vw,130px) 0}
.popBeeld img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.popTekst{padding:52px 46px 36px;display:flex;flex-direction:column;align-items:flex-start}
.popTekst .eyebrow{color:#9b6500}
.popTekst h2{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:clamp(38px,4vw,54px);line-height:1;margin:14px 0 18px}
.popTekst h2 em{color:var(--h);font-weight:500}
.popTekst p{color:#625d54;line-height:1.7;margin:0 0 22px;font-size:15.5px}
.popPrijs{display:flex;align-items:center;gap:16px;border-top:1px solid #e6dfd2;border-bottom:1px solid #e6dfd2;padding:14px 0;margin-bottom:24px;width:100%}
.popPrijs small{font-size:12px;line-height:1.5;color:#8d867b}
.popKnoppen{display:flex;flex-wrap:wrap;align-items:center;gap:18px}
.popLees{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);text-underline-offset:4px}
.popNiet{margin-top:22px;background:none;border:0;padding:0;font:600 11px 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.13em;text-transform:uppercase;color:#8d867b}
.popNiet:hover{color:var(--ink)}
.popKaart:focus{outline:none}
.perronRij ~ .voetNoot{display:none}
.popSluit{position:absolute;top:12px;right:12px;z-index:2;width:42px;height:42px;border-radius:50%;background:#fffdf8e6;border:0;display:grid;place-items:center;color:var(--ink)}
.popSluit svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.6}
body.popOpen{overflow:hidden}

@media(max-width:1100px){.bordRij{grid-template-columns:66px 56px minmax(0,1fr) 70px}.bVrij{display:none}}
@media(max-width:850px){
  .perron{padding:96px 6vw 0}
  .perronGrid{grid-template-columns:1fr;margin:0}
  .perronBeeld{order:-1}
  .perronVideo{border-radius:0 0 0 clamp(70px,16vw,120px)}
  .perronBord{margin:-60px 0 0 16px}
  .perronFeiten{grid-template-columns:1fr 1fr;margin-top:70px;padding:30px 0 36px}
  .popKaart{display:block;width:min(520px,100%)}
  .popBeeld{min-height:auto;flex-shrink:0;aspect-ratio:16/10;border-radius:0 0 0 clamp(60px,18vw,100px)}
  .popTekst{padding:30px 26px 26px}
}
@media(max-width:550px){
  .perronBord{margin:-40px 0 0 0;padding:14px 10px 10px}
  .bordKop .bordStation{display:none}
  .bordRij{grid-template-columns:52px minmax(0,1fr) 62px;grid-template-areas:"tijd trein pos" "tijd dag pos";row-gap:2px;column-gap:10px;padding:10px 4px}
  .bTijd{grid-area:tijd;font-size:17px}.bTrein{grid-area:trein}.bDag{grid-area:dag}.bPos{grid-area:pos}
  .bKies{display:none}
  .bTrein small{display:none}
  .perronFeiten{grid-template-columns:1fr}
  .perronPrijs{flex-wrap:wrap;gap:6px 16px}
  .perronPop{padding:12px;align-items:end}
  .popKaart{max-height:calc(100svh - 24px)}
  .popTekst h2{font-size:38px}
  .pRit{grid-template-columns:52px minmax(0,1fr)}
  .pStatus{grid-column:2;text-align:left;max-width:none}
}
@media(prefers-reduced-motion:reduce){.bordRij{animation:none}.bordLamp{animation:none}.popKaart,.popScrim{transition:none}}

/* ===== webshopstructuur v1.1 (2026-10-11): subcategorieën, zakelijk-CTA, productinfo ===== */
.wSubs{display:flex;flex-wrap:wrap;gap:4px 6px;margin:-8px 2vw 28px}
.wSubs[hidden]{display:none}
.wSub{font:600 13px/1 'DM Sans','DM Sans Fallback',sans-serif;color:#716b61;background:none;border:0;border-bottom:2px solid transparent;padding:10px 12px;transition:color .2s,border-color .2s}
.wSub:hover{color:var(--ink)}
.wSub[aria-pressed=true]{color:var(--ink);border-color:var(--gold)}
.zakCta{display:flex;align-items:center;justify-content:space-between;gap:34px;background:#16130e;color:#fff;padding:34px 40px;margin:0 2vw 36px}
.zakCta[hidden]{display:none}
.zakCta .eyebrow{color:#e8b849}
.zakCta h3{font-family:'Playfair Display','Playfair Fallback',serif;font-weight:500;font-size:clamp(24px,2.3vw,32px);line-height:1.15;margin:10px 0 8px}
.zakCta p{margin:0;font-size:14px;line-height:1.6;color:#cfc8bb;max-width:640px}
.zakCta .knopHoning{flex:0 0 auto;margin:0}
.pakKop .zakCta{margin:40px 2vw 0}
.pakNav{display:flex;flex-wrap:wrap;gap:8px;margin:0 2vw}
.pakNav a{display:inline-flex;font:700 10.5px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);text-decoration:none;border:1px solid #d8d0c3;padding:11px 15px;transition:.2s}
.pakNav a:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.pakSectie{scroll-margin-top:20px}
.pakStap p a{color:var(--h);font-weight:600;text-decoration:none}
.prodLint.prodActie{background:var(--gold);color:var(--ink)}
.detActie{display:inline-block;margin:-8px 0 20px;padding:8px 12px;background:var(--cream);color:var(--h);font:700 12px/1.4 'DM Sans','DM Sans Fallback',sans-serif}
.detTekst,.varTekst,.detBlok p{white-space:pre-line}
.varTekst{margin-top:14px!important}
.detBlok p.detKlein{font-size:12.5px;line-height:1.6;overflow-wrap:anywhere}
.varKnop small{font-weight:500;opacity:.65;margin-left:5px}
.detBlok>.honingKeuze:last-child{margin-bottom:0}
@media(max-width:850px){
  .wSubs{margin:-6px 0 22px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .wSubs::-webkit-scrollbar{display:none}
  .wSub{flex:0 0 auto}
  .zakCta{flex-direction:column;align-items:flex-start;gap:20px;padding:28px 24px;margin:0 0 28px}
  .pakKop .zakCta{margin:30px 0 0}
  .pakNav{margin:0}
}
/* lade: fotogalerij, inhoud en vrij samenstellen (cadeaus & pakketten v1.2, 2026-10-18) */
.detFotos{display:flex;gap:8px;margin:-12px 0 22px}
.detFoto{width:64px;height:64px;padding:0;border:1px solid #e6dfd2;background:#fff}
.detFoto img{width:100%;height:100%;object-fit:contain;display:block}
.detFoto.aan{border-color:var(--ink)}
.detLijst{margin:0;padding:0;list-style:none;font-size:13.5px;line-height:1.65;color:#5d584f}
.detLijst li:before{content:"— ";color:#c9bfae}
.itemRij{display:flex;align-items:flex-end;gap:8px}
.itemRij .honingKeuze{flex:1;min-width:0}
.itemWeg{flex:0 0 44px;height:44px;margin-bottom:10px;border:1px solid #d8d0c3;background:#fff;font:400 20px/1 'DM Sans','DM Sans Fallback',sans-serif;color:#8d867b}
.itemWeg:hover{border-color:var(--ink);color:var(--ink)}
.itemPlus{display:inline-flex;align-items:center;margin-top:4px;padding:11px 15px;border:1px dashed #c9bfae;background:none;font:700 12px/1 'DM Sans','DM Sans Fallback',sans-serif;color:var(--h)}
.itemPlus:hover{border-color:var(--h)}
/* footer: Powered by TDG Digital (livegang bee-station.nl, 2026-10-18) */
.copy a{color:#a59d90;text-decoration:none;display:inline-block;padding:13px 0;margin:-13px 0}
.copy a:hover{color:var(--gold)}
/* ===== afrekenen (2026-10-18) ===== */
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.afrPagina{background:var(--paper)}
.afrKop{padding-bottom:40px}
.afrTest{margin:0 6vw 28px;padding:12px 16px;background:#fff4dc;border-left:3px solid var(--gold);color:#7a5000;font-size:14px;line-height:1.55}
.afrGrid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);padding:0 6vw 120px;align-items:start}
.afrForm fieldset{border:0;border-top:1px solid #e6dfd2;margin:0;padding:26px 0 18px}
.afrForm legend{display:flex;align-items:center;gap:12px;padding:0 0 16px;font:500 24px/1.2 'Playfair Display','Playfair Fallback',serif;color:var(--ink)}
.afrForm legend span{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--ink);color:#fff;font:700 13px/1 'DM Sans','DM Sans Fallback',sans-serif}
.afrRij{margin-bottom:12px}
.afrTwee{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.afrVeld{display:flex;flex-direction:column;gap:6px}
.afrVeld span{font-size:12px;color:#8d867b}
.afrVeld input,.afrVeld select,.afrVeld textarea{width:100%;min-height:48px;border:1px solid #d8d0c3;background:#fff;padding:12px 13px;font:500 15px/1.3 'DM Sans','DM Sans Fallback',sans-serif;color:var(--ink);border-radius:0;appearance:none}
.afrVeld textarea{resize:vertical}
.afrVeld input:focus,.afrVeld select:focus,.afrVeld textarea:focus{outline:none;border-color:var(--h)}
.afrVeld.mis input{border-color:#b3261e;background:#fff7f6}
.afrLev{margin-bottom:14px}
.afrLev .levOptie{min-height:56px;cursor:pointer}
.afrLev .levOptie.uit{opacity:.5;cursor:not-allowed}
.afrTrein{margin:4px 0 8px}
.afrFout{margin:4px 0 14px;padding:12px 14px;background:#fff7f6;border-left:3px solid #b3261e;color:#8c1d16;font-size:14px}
.afrBetaal{margin-top:10px;font-size:12px;padding:20px}
.afrBetaal:disabled{opacity:.45;cursor:not-allowed}
.afrPriv{font-size:12.5px;color:#8d867b;margin:12px 0 0}
.afrOverzicht{background:#fff;border:1px solid #e6dfd2;padding:26px clamp(18px,2.4vw,30px);position:sticky;top:24px}
.afrOverzicht h3{font:500 24px/1.2 'Playfair Display','Playfair Fallback',serif;margin:0 0 6px}
.afrRegel{display:grid;grid-template-columns:62px minmax(0,1fr) auto;gap:14px;padding:16px 0;border-bottom:1px solid #ece6da;font-size:14px}
.afrRegel img{width:62px;height:62px;object-fit:contain;background:#fff;border:1px solid #f0ebe1}
.afrRegel b{font-weight:600;overflow-wrap:anywhere}
.afrRegel>span{white-space:nowrap;font-weight:600}
.afrOverzicht .totaalRij{justify-content:space-between;margin:12px 0 0;font-size:14px}
.afrOverzicht .afrEind{border-top:1px solid #e6dfd2;padding-top:14px;margin-top:14px}
.afrOverzicht .afrEind .bedrag{font:500 26px/1 'Playfair Display','Playfair Fallback',serif}
.afrOverzicht .voetNoot{font-size:12px;color:#8d867b;margin:10px 0 0}
.afrTerug{display:inline-flex;align-items:center;min-height:44px;margin-top:10px;font-size:13px;color:var(--h);text-decoration:none;font-weight:600}
.afrLaden,.afrLeeg{color:#8d867b;margin:14px 0}
.afrStap{padding:clamp(110px,14vw,170px) 6vw 120px;min-height:70vh}
.betaal{max-width:460px;margin:0 auto;background:#fff;border:1px solid #e6dfd2;padding:30px clamp(20px,4vw,34px);box-shadow:0 20px 50px #17140f14}
.betaalKop{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:#8d867b}
.betaalKop b{color:var(--ink);font-size:15px}
.betaalKop span:last-child{margin-left:auto}
.betaalTest{background:#ff8a00;color:#fff;font:700 10px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.14em;padding:6px 8px}
.betaalBedrag{font:500 44px/1 'Playfair Display','Playfair Fallback',serif;margin:22px 0 10px}
.betaalUitleg{font-size:14px;color:#5d584f;margin:0 0 18px}
.betaalMethodes{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.betaalMethodes span{border:1px solid #e6dfd2;padding:7px 10px;font-size:12px;font-weight:600;color:#5d584f}
.betaalStatus{border:0;margin:0 0 18px;padding:0}
.betaalStatus legend{font-size:12px;color:#8d867b;margin-bottom:8px}
.betaalStatus label{display:flex;align-items:center;gap:12px;min-height:48px;border:1px solid #e6dfd2;padding:0 14px;margin-bottom:6px;cursor:pointer}
.betaalStatus label:has(input:checked){border-color:var(--ink);background:#fbf8f2}
.afrKlaar{max-width:720px;margin:0 auto}
.afrKlaar h2{font:500 clamp(40px,6vw,72px)/1 'Playfair Display','Playfair Fallback',serif;margin:14px 0 18px;letter-spacing:-.02em}
.afrKlaar>p{font-size:16px;color:#5d584f;margin:0 0 16px}
.afrKlaar .afrTest{margin:0 0 22px}
.afrKlaarLijst{position:static;margin:26px 0 30px}
.afrKnoppen{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.afrKnoppen .knopAf{width:auto;padding:17px 26px}
@media(max-width:850px){
  .afrGrid{grid-template-columns:minmax(0,1fr)}
  .afrOverzicht{position:static;order:-1}
}
@media(max-width:550px){
  .afrTwee{grid-template-columns:minmax(0,1fr)}
  .afrTest{margin:0 5vw 22px}
}
/* zakelijk: plaatshouders voor de inhoud van Jochem (2026-10-18) — weghalen zodra de teksten er zijn */
.jochem{padding:20px 6vw 100px}
.jochemKop{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.jochemKop p{margin:0;color:#8d867b;font-size:14px}
.jochemLabel{display:inline-block;background:#fff4dc;color:#9b6500;border:1px dashed #d99a24;font:700 10px/1 'DM Sans','DM Sans Fallback',sans-serif;letter-spacing:.2em;text-transform:uppercase;padding:7px 10px}
.jochemGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:16px}
.jochemBlok{border:1.5px dashed #d8c9a8;background:#fffdf8;padding:22px 22px 26px;min-height:190px}
.jochemBlok h3{font:500 24px/1.2 'Playfair Display','Playfair Fallback',serif;margin:16px 0 8px}
.jochemBlok p{margin:0;color:#5d584f;font-size:14px;line-height:1.6}
.offerteMail{background:#fff4dc!important;color:#7a5000!important}
.afrPagina .mandjeKnop{display:none}   /* op de afrekenpagina staat het overzicht al in beeld */