body.blsm #boxed-wrapper{overflow:clip}
@media only screen and (max-device-width:640px){body.blsm #wrapper{overflow-x:clip!important}}

/* De witte band onder de balk. Avada zet #main op padding-top:60px; onder de
   balk hoort daar niets te staan. Een pagina die met een donker kopblok
   begint (.bl3 of .bl4 als eerste blok in .post-content) loopt door tot tegen
   het submenu. Elke andere pagina houdt een rustige regel lucht van 22px,
   zodat de eerste inhoud - een kruimelpad, een kop, een foto - niet tegen de
   balk plakt. Kent een browser :has() niet, dan houden ook de donkere
   kopblokken die 22px: minder strak, maar nooit stuk.
   De lege alinea is er een van wpautop: die staat op sommige pagina-soorten
   tussen .post-content en het eerste blok en zet er 20px wit bij. */
body.blsm #main{padding-top:0}
body.blsm #main #content{padding-top:22px}
body.blsm #main #content:has(.post-content > .bl3),
body.blsm #main #content:has(.post-content > .bl4){padding-top:0}
/* Een pagina die met een kruimelpad begint brengt zijn eigen achttien pixels
   mee: .bl-kruimel staat op margin-top:18px. Daar hoeft niets bij, anders
   staat er alsnog een band van veertig pixels boven het kruimelpad. */
body.blsm #main #content:has(.post-content > .bl > .bl-kruimel){padding-top:0}
body.blsm #main .post-content > p:empty{display:none}

/* De balk, in de stijl van de oude wegwijzerbalk: bijna zwart, hoofdletters
   in een smalle letter met ruime letterafstand, licht zandkleurig, en een
   dunne zandkleurige streep onder de ingang waar de bezoeker staat. */
.blsm{position:sticky;top:0;z-index:200;width:100%;max-width:100%;
background:#0E1109;color:#E6E3D8;border-bottom:1px solid rgba(201,185,141,.22);
font-family:"Archivo Narrow","Archivo","Helvetica Neue",Arial,sans-serif}
@supports (backdrop-filter:blur(12px)){nav.blsm{background:rgba(14,17,9,.94);backdrop-filter:blur(12px)}}
.blsm *{box-sizing:border-box}
.blsm__in{display:flex;align-items:stretch;gap:10px;padding:0 12px;max-width:100%}
.blsm__rij{display:flex;flex:1 1 auto;min-width:0;align-items:stretch;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.blsm__rij::-webkit-scrollbar{display:none}
.blsm__ing{position:relative;flex:0 0 auto;display:flex;align-items:center;padding:20px 26px;color:#E6E3D8;text-decoration:none;font-size:.95rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;line-height:1.1;white-space:nowrap}
.blsm__ing::after{content:"";position:absolute;left:26px;right:calc(100% - 26px);bottom:0;height:1px;background:#C9B98D;transition:right .3s cubic-bezier(.2,.7,.3,1)}
.blsm__ing:hover,.blsm__ing:focus{color:#FFF}
.blsm__ing:hover::after,.blsm__ing:focus::after{right:26px}
.blsm__ing:focus-visible{outline:2px solid #C9B98D;outline-offset:-3px}
.blsm__ing[aria-current="page"]{color:#FFF}
.blsm__ing[aria-current="page"]::after{right:26px;height:2px}
.blsm__zoek{position:relative;flex:0 0 auto;align-self:center;width:210px;max-width:46vw}
.blsm__label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.blsm__veld{width:100%;padding:8px 10px;font-family:inherit;font-size:.86rem;line-height:1.3;color:#E6E3D8;background:rgba(255,255,255,.06);border:1px solid rgba(201,185,141,.35);border-radius:2px;-webkit-appearance:none;appearance:none}
.blsm__veld::placeholder{color:rgba(230,227,216,.55);text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;opacity:1}
.blsm__veld:focus{outline:2px solid #C9B98D;outline-offset:1px;background:rgba(255,255,255,.1)}
.blsm__uit{position:absolute;top:calc(100% + 6px);right:0;width:320px;max-width:86vw;background:#171C12;color:#E6E3D8;border:1px solid rgba(201,185,141,.3);border-radius:2px;box-shadow:0 10px 26px rgba(0,0,0,.45);max-height:60vh;overflow-y:auto;z-index:5}
.blsm__uit[hidden]{display:none}
.blsm__tr{display:block;padding:9px 12px;color:#E6E3D8;text-decoration:none;font-size:.86rem;line-height:1.35;border-bottom:1px solid rgba(201,185,141,.14)}
.blsm__tr:last-child{border-bottom:0}
.blsm__tr:hover,.blsm__tr.is-op{background:rgba(201,185,141,.14);color:#FFF}
.blsm__bij{color:#9E9B8C;font-size:.76rem;margin-left:6px}

/* Het submenu: dezelfde letter, een niveau rustiger. Een lichtere ondergrond
   dan de balk erboven, kleinere hoofdletters en een zachtere kleur, zodat de
   twee lagen uit elkaar te houden zijn. */
.blsm__sub{background:#171C12;border-top:1px solid rgba(201,185,141,.16);border-bottom:1px solid rgba(201,185,141,.16)}
.blsm__klap{display:none}
.blsm__subrij{display:flex;align-items:stretch;overflow-x:auto;overflow-y:hidden;padding:0 12px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.blsm__subrij::-webkit-scrollbar{display:none}
.blsm__s{position:relative;flex:0 0 auto;display:flex;align-items:center;padding:11px 16px;color:#B6B2A4;text-decoration:none;font-size:.74rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;line-height:1.1;white-space:nowrap}
.blsm__s::after{content:"";position:absolute;left:16px;right:calc(100% - 16px);bottom:0;height:1px;background:rgba(201,185,141,.75);transition:right .3s cubic-bezier(.2,.7,.3,1)}
.blsm__s:hover,.blsm__s:focus{color:#E6E3D8}
.blsm__s:hover::after,.blsm__s:focus::after{right:16px}
.blsm__s:focus-visible{outline:2px solid #C9B98D;outline-offset:-3px}
.blsm__s[aria-current="page"]{color:#E6E3D8}
.blsm__s[aria-current="page"]::after{right:16px;background:#C9B98D}
@media (max-width:700px){
.blsm__ing{padding:15px 17px;font-size:.84rem}
.blsm__ing::after{left:17px;right:calc(100% - 17px)}
.blsm__ing:hover::after,.blsm__ing:focus::after,.blsm__ing[aria-current="page"]::after{right:17px}
.blsm__s{padding:10px 13px;font-size:.7rem}
.blsm__s::after{left:13px;right:calc(100% - 13px)}
.blsm__s:hover::after,.blsm__s:focus::after,.blsm__s[aria-current="page"]::after{right:13px}
}
@media (max-width:640px){
.blsm__zoek{width:150px}
.blsm__klap{display:block;width:100%;text-align:left;padding:10px 12px;background:none;border:0;color:#C9B98D;font-family:inherit;font-size:.74rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;line-height:1.3;cursor:pointer}
.blsm__sub[data-open="0"] .blsm__subrij{display:none}
}

/* Het zoekpaneel in zijn nieuwe uitvoering. Alles staat onder .is-nieuw, en
   die klasse wordt alleen gezet zolang bl_zoek_aan op 1 staat. Gaat de
   schakelaar om, dan valt het veld terug op de smalle uitvoering hierboven
   en verandert er aan deze regels niets. */
.blsm__zoek.is-nieuw{width:320px;max-width:54vw}
.blsm__zoek.is-nieuw .blsm__veld{padding:9px 30px 9px 31px;font-size:.88rem;border-radius:3px;text-overflow:ellipsis}
.blsm__zoek.is-nieuw .blsm__veld::placeholder{text-transform:none;letter-spacing:.02em;font-size:.84rem}
.blsm__zoek.is-nieuw .blsm__veld::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.blsm__loep{position:absolute;left:10px;top:50%;margin-top:-7px;width:14px;height:14px;opacity:.7;pointer-events:none}
.blsm__loep svg{display:block;width:14px;height:14px}
.blsm__wis{position:absolute;right:5px;top:50%;margin-top:-11px;width:22px;height:22px;padding:0;border:0;border-radius:50%;background:rgba(201,185,141,.18);color:#E6E3D8;font-family:inherit;font-size:.82rem;line-height:22px;text-align:center;cursor:pointer}
.blsm__wis:hover,.blsm__wis:focus{background:rgba(201,185,141,.36);color:#FFF}
.blsm__wis[hidden]{display:none}

.blsm__uit.is-nieuw{width:394px;max-width:94vw;padding:2px 0 0;max-height:72vh;overscroll-behavior:contain}
.blsm__kop{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:10px 12px 3px;color:#C9B98D;font-size:.66rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase}
.blsm__kop span{flex:0 0 auto;color:#8E8B7D;font-weight:500;font-size:.68rem;letter-spacing:.04em;text-transform:none}
.blsm__uit.is-nieuw .blsm__tr{display:flex;align-items:center;gap:10px;padding:6px 12px;border-bottom:0}
.blsm__foto{flex:0 0 auto;width:32px;height:40px;object-fit:contain;background:#FFF;border-radius:2px}
.blsm__leegfoto{flex:0 0 auto;width:32px;height:40px;border-radius:2px;background:rgba(201,185,141,.12)}
.blsm__tekst{flex:1 1 auto;min-width:0}
.blsm__prijs{flex:0 0 auto;align-self:center;color:#B6B2A4;font-size:.8rem;line-height:1.2;white-space:nowrap;font-variant-numeric:tabular-nums}
.blsm__naam{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.blsm__naam mark{background:none;color:#F2D9A0;font-weight:600}
.blsm__uit.is-nieuw .blsm__bij{display:block;margin-left:0;font-size:.73rem;line-height:1.3;color:#9E9B8C;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.blsm__meer{display:block;padding:3px 12px 8px 54px;color:#C9B98D;font-size:.73rem;text-decoration:none}
.blsm__meer:hover,.blsm__meer.is-op{color:#FFF;text-decoration:underline}
.blsm__melding{padding:12px 12px 6px;color:#B6B2A4;font-size:.82rem;line-height:1.5}
.blsm__melding b{color:#E6E3D8;font-weight:600}
.blsm__alles{display:block;margin-top:2px;padding:10px 12px;border-top:1px solid rgba(201,185,141,.18);color:#C9B98D;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;text-decoration:none}
.blsm__alles:hover,.blsm__alles.is-op{background:rgba(201,185,141,.14);color:#FFF}
@media (max-width:640px){
.blsm__zoek.is-nieuw{width:168px;max-width:46vw}
body.blsm-zoekt .blsm__rij,body.blsm-zoekt .blsm__sub{display:none}
body.blsm-zoekt .blsm__zoek.is-nieuw{flex:1 1 100%;width:100%;max-width:none}
body.blsm-zoekt .blsm__uit.is-nieuw{left:0;right:0;width:auto;max-width:none;top:calc(100% + 4px);max-height:calc(100vh - var(--blsm-h,56px) - 16px);max-height:calc(100dvh - var(--blsm-h,56px) - 16px);border-radius:0}
.blsm__uit.is-nieuw .blsm__tr{padding:8px 12px}
}
@media (prefers-reduced-motion:reduce){.blsm__ing::after,.blsm__s::after{transition:none}}
/* --------------------------------------------------------- telefoon/tablet
   18-09-2026. Drie dingen die op een telefoon in de weg zaten.

   1. De achtergrondregel hierboven stond op .blsm en trof daarmee ook de
      body, want die draagt dezelfde klasse als haak voor de padding-regels
      bovenaan. Body kreeg daardoor backdrop-filter, en een element met
      backdrop-filter is het blok waar elke position:fixed eronder zich naar
      richt. Gevolg: het leeftijdsscherm van de slijterij (.poort) werd zo
      hoog als de hele pagina en zijn kaart kwam duizenden pixels naar
      beneden te staan, buiten beeld, terwijl body op overflow:hidden ging.
      De bezoeker zag een donker scherm zonder knoppen en kon niet rollen.
      De regel staat nu op nav.blsm, zodat alleen de balk hem krijgt.
   2. Het zoekveld stond op .88rem. Safari op iOS zoomt de pagina in zodra
      een invoerveld onder de 16px de aandacht krijgt, en komt daarna niet
      vanzelf terug. Op aanraakschermen gaat het veld naar 16px; de
      plaatshouder blijft klein, zodat de hele zin er nog in past.
   3. De ingangen, het submenu en de klapknop haalden 35 tot 45px hoog. Een
      vingertop vraagt er 44.

   Alles staat achter (hover:none) of een smal scherm. Op een muis en op
   1440px verandert er niets.
   TERUGWEG: dit blok weghalen en nav.blsm hierboven terugzetten op .blsm. */
@media (hover:none),(max-width:900px){
.blsm__ing{min-height:48px}
.blsm__s{min-height:44px}
.blsm__klap{min-height:44px;padding-top:12px;padding-bottom:12px}
.blsm__veld{min-height:44px;font-size:16px}
.blsm__zoek.is-nieuw .blsm__veld{font-size:16px}
.blsm__zoek.is-nieuw .blsm__veld::placeholder{font-size:.78rem}
}
@media print{.blsm{display:none}}