/* De Java Kamer – componenten uit het beheerplugin (kast, museumlabel, maatlat, socials, knoppen).
   De kleur- en lettertokens komen uit de Breakdance-stylesheet; hier staan fallbacks. */

.djk-mono { font-family: var(--mono, 'IBM Plex Mono', ui-monospace, monospace); font-size: 0.6875rem; font-variant-numeric: tabular-nums; letter-spacing: 0.03em; color: var(--fg-2, #4a4237); }

/* ---------- knoppen ---------- */
.djk-btn { display: inline-flex; align-items: center; gap: 0.6em; font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.75rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; padding: 1.05em 1.9em; border: 1px solid var(--rule, #d6cbb4); text-decoration: none; color: var(--fg, #17140f); background: transparent; position: relative; overflow: hidden; isolation: isolate; cursor: pointer; transition: color 0.45s cubic-bezier(0.22, 0.75, 0.25, 1), border-color 0.45s cubic-bezier(0.22, 0.75, 0.25, 1); }
.djk-btn::after { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--fg, #17140f); transform: translateY(101%); transition: transform 0.5s cubic-bezier(0.22, 0.75, 0.25, 1); }
.djk-btn:hover { color: var(--bg, #f3efe3); border-color: var(--fg, #17140f); }
.djk-btn:hover::after { transform: translateY(0); }
.djk-btn--solid { background: var(--accent, #a1522f); border-color: var(--accent, #a1522f); color: #fff; }
.djk-btn--solid::after { background: var(--fg, #17140f); }
.djk-btn--solid:hover { color: var(--bg, #f3efe3); border-color: var(--fg, #17140f); }
.djk-btn .djk-icon { flex: none; }
@media (prefers-reduced-motion: reduce) { .djk-btn::after { transition: none; } }

/* ---------- de kast ---------- */
/* Eén doorlopend raster van vakken, als een letterkast aan de muur. Elk vak neemt de vorm
   van wat erin staat: breed, hoog of vierkant. Werkt in elke WooCommerce-loop (kast, uitgelicht, gerelateerd). */
.djk-kast ul.products { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: auto; gap: 0 !important; border: 1px solid var(--rule, #d6cbb4); background: var(--bg, #f3efe3); margin: 0; padding: 0; list-style: none; }
.djk-kast ul.products::before, .djk-kast ul.products::after { display: none; }
@media (max-width: 1080px) { .djk-kast ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 720px) { .djk-kast ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.djk-kast ul.products li.product.djk-vak { position: relative; display: block; width: auto !important; float: none !important; margin: 0 !important; padding: 0; border-right: 1px solid var(--rule, #d6cbb4); border-bottom: 1px solid var(--rule, #d6cbb4); min-width: 0; overflow: hidden; background: transparent; aspect-ratio: 1 / 1.18; transition: background-color 0.5s cubic-bezier(0.22, 0.75, 0.25, 1); }
.djk-kast ul.products li.product.djk-vak:hover { background: var(--hover, #e7e0d0); }
.djk-kast ul.products li.product.djk-vak--breed, .djk-kast ul.products li.product.djk-vak--hoog { grid-column: auto; grid-row: auto; }

/* het hele vak is één link: de vier delen (hout, foto, titel, prijs) staan in een grid */
.djk-kast ul.products li.product.djk-vak a.woocommerce-LoopProduct-link { display: grid !important; grid-template-rows: auto minmax(0, 1fr) auto; gap: 0.6rem; height: 100%; padding: clamp(0.9rem, 1.6vw, 1.5rem); text-decoration: none; color: inherit; }
.djk-kast ul.products li.product.djk-vak .djk-vak__hout { font-family: var(--mono, 'IBM Plex Mono', monospace); font-size: 0.625rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fg-3, #7d7362); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color 0.35s; }
.djk-kast ul.products li.product.djk-vak:hover .djk-vak__hout { color: var(--accent, #a1522f); }

.djk-kast ul.products li.product.djk-vak .bde-woo-product-image, .djk-kast ul.products li.product.djk-vak .woocommerce-product-gallery__image { position: relative; display: block; min-height: 0; height: 100%; margin: 0; background: transparent; border-radius: 0; overflow: visible; }
.djk-kast ul.products li.product.djk-vak img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: 100%; max-height: none; object-fit: contain; aspect-ratio: auto; margin: 0; display: block; filter: contrast(1.07) saturate(1.08) drop-shadow(0 0.25rem 0.4rem var(--shadow-soft, rgba(58,44,28,0.1))) drop-shadow(0 1.1rem 1.4rem var(--shadow, rgba(58,44,28,0.17))); transform-origin: 50% 100%; transition: transform 0.8s cubic-bezier(0.22, 0.75, 0.25, 1); }
.djk-kast ul.products li.product.djk-vak:hover img { transform: translateY(-0.3rem) scale(1.02); }
/* de vaste afbeeldingshoogte: het beeld vult het middelste vak, nooit meer */
.djk-kast ul.products li.product.djk-vak a.woocommerce-LoopProduct-link > img { position: static; height: 100%; min-height: 0; }

.djk-kast ul.products li.product.djk-vak .djk-vak__meta { display: grid; gap: 0.15rem; align-content: end; min-width: 0; }
.djk-kast ul.products li.product.djk-vak h2.woocommerce-loop-product__title { font-family: var(--serif, 'Newsreader', Georgia, serif); font-weight: 400; font-size: clamp(0.8rem, 0.78rem + 0.1vw, 0.875rem); line-height: 1.28; margin: 0; padding: 0; color: var(--fg, #17140f); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color 0.35s; }
.djk-kast ul.products li.product.djk-vak:hover h2.woocommerce-loop-product__title { color: var(--accent, #a1522f); }
.djk-kast ul.products li.product.djk-vak .price { display: block; font-family: var(--mono, 'IBM Plex Mono', monospace); font-size: 0.6875rem; font-weight: 400; color: var(--fg-3, #7d7362); font-variant-numeric: tabular-nums; margin: 0; }
.djk-kast ul.products li.product.djk-vak .price del { color: var(--fg-3, #7d7362); opacity: 0.7; margin-right: 0.4em; }
.djk-kast ul.products li.product.djk-vak .price ins { text-decoration: none; color: var(--fg-2, #4a4237); }
.djk-kast ul.products li.product.djk-vak .price .djk-sold, .djk-sold { font-family: var(--mono, 'IBM Plex Mono', monospace); text-transform: lowercase; letter-spacing: 0.04em; }
.djk-kast ul.products li.product.djk-vak.is-sold h2.woocommerce-loop-product__title { text-decoration: line-through; text-decoration-thickness: 1px; color: var(--fg-3, #7d7362); }
.djk-kast ul.products li.product.djk-vak.is-sold img { opacity: 0.72; }
.djk-kast ul.products li.product.djk-vak span.onsale, .djk-kast ul.products li.product.djk-vak .bde-woo-product-footer, .djk-kast ul.products li.product.djk-vak .bde-woo-categories-list, .djk-kast ul.products li.product.djk-vak .bde-woo-ratings, .djk-kast ul.products li.product.djk-vak .star-rating { display: none !important; }
.djk-kast .woocommerce-result-count, .djk-kast .woocommerce-ordering, .djk-kast .woocommerce-notices-wrapper:empty { display: none; }
.djk-kast .woocommerce-pagination { grid-column: 1 / -1; margin-top: 1.5rem; }
.djk-kast .woocommerce-pagination ul.page-numbers { display: flex; gap: 0.4rem; justify-content: center; list-style: none; margin: 0; padding: 0; border: 0; }
.djk-kast .woocommerce-pagination ul.page-numbers li { border: 0; }
.djk-kast .woocommerce-pagination .page-numbers li a, .djk-kast .woocommerce-pagination .page-numbers li span { display: inline-flex; min-width: 2.5rem; height: 2.5rem; align-items: center; justify-content: center; border: 1px solid var(--rule, #d6cbb4); font-family: var(--mono, monospace); font-size: 0.75rem; text-decoration: none; color: var(--fg, #17140f); }
.djk-kast .woocommerce-pagination .page-numbers li span.current { background: var(--fg, #17140f); color: var(--bg, #f3efe3); border-color: var(--fg, #17140f); }
.djk-kast .woocommerce-info { padding: 2.5rem 1rem; text-align: center; color: var(--fg-2, #4a4237); font-family: var(--serif, serif); }

@media (max-width: 720px) {
  .djk-kast ul.products li.product.djk-vak a.woocommerce-LoopProduct-link { padding: 0.8rem; gap: 0.5rem; grid-template-rows: minmax(0, 1fr) auto; }
  .djk-kast ul.products li.product.djk-vak .djk-vak__hout { display: none; }
  .djk-kast ul.products li.product.djk-vak h2.woocommerce-loop-product__title { font-size: 0.8rem; line-height: 1.25; }
  .djk-kast ul.products li.product.djk-vak .price { font-size: 0.625rem; margin-top: 0.15rem; }
  .djk-kast ul.products li.product.djk-vak img { filter: contrast(1.07) saturate(1.08) drop-shadow(0 0.5rem 0.7rem var(--shadow, rgba(58,44,28,0.17))); }
}
@media (prefers-reduced-motion: reduce) { .djk-kast ul.products li.product.djk-vak img { transition: none; } .djk-kast ul.products li.product.djk-vak:hover img { transform: none; } }

/* ---------- soortfilter ---------- */
.djk-filter { display: flex; flex-wrap: wrap; gap: 0.4rem 1.4rem; margin: 0; }
.djk-filter a { font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.72rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none; color: var(--fg-2, #4a4237); padding-block: 0.4rem; border-bottom: 1px solid transparent; transition: color 0.3s, border-color 0.3s; }
.djk-filter a .djk-mono { margin-left: 0.3em; color: var(--fg-3, #7d7362); letter-spacing: 0; }
.djk-filter a:hover, .djk-filter a[aria-current] { color: var(--fg, #17140f); border-bottom-color: var(--fg, #17140f); }

/* ---------- museumlabel ---------- */
.djk-specs { display: grid; gap: 0.9rem; margin: 0; }
.djk-specs > div { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: 1rem; padding-top: 0.9rem; border-top: 1px solid var(--rule, #d6cbb4); }
.djk-specs dt { font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.6875rem; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase; color: var(--fg-3, #7d7362); padding-top: 0.15rem; }
.djk-specs dd { margin: 0; font-size: 0.95rem; line-height: 1.5; color: var(--fg-2, #4a4237); }
.djk-specs dd a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--rule, #d6cbb4); }
.djk-specs dd a:hover { color: var(--accent, #a1522f); border-color: currentColor; }
.djk-specs__java { display: block; width: 8rem; margin-top: 0.5rem; color: var(--accent, #a1522f); }
.djk-java { width: 100%; height: auto; display: block; overflow: visible; }
.djk-java .java__isle { stroke-dasharray: 1; stroke-dashoffset: 1px; animation: djk-java-draw 2.2s cubic-bezier(0.6, 0.05, 0.3, 1) forwards; }
.djk-java .java__isle--2 { animation-duration: 0.8s; animation-delay: 1.5s; }
@keyframes djk-java-draw { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) { .djk-java .java__isle { animation: none; stroke-dashoffset: 0; } }

/* ---------- maatlat ---------- */
.djk-scale { align-self: stretch; display: grid; grid-template-rows: 1fr auto; gap: 0.5rem; padding-block: clamp(1rem, 4vw, 3rem); font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.625rem; letter-spacing: 0.14em; color: var(--fg-3, #7d7362); min-height: 18rem; }
.djk-scale__rule { position: relative; width: 1px; justify-self: center; background: var(--rule, #d6cbb4); }
.djk-scale__tick { position: absolute; left: -3px; width: 7px; height: 1px; background: var(--rule, #d6cbb4); }
.djk-scale__fill { position: absolute; left: 0; bottom: 0; width: 1px; background: var(--accent, #a1522f); transform-origin: bottom; transform: scaleY(0); animation: djk-scale-rise 1.1s cubic-bezier(0.22, 0.75, 0.25, 1) 0.3s forwards; }
.djk-scale__mark { position: absolute; left: 0.7rem; transform: translateY(50%); white-space: nowrap; color: var(--accent, #a1522f); opacity: 0; animation: djk-scale-show 0.6s cubic-bezier(0.22, 0.75, 0.25, 1) 1.1s forwards; }
.djk-scale__mark b { font-weight: 600; font-size: 0.75rem; }
.djk-scale__foot { justify-self: center; }
@keyframes djk-scale-rise { to { transform: scaleY(1); } }
@keyframes djk-scale-show { to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .djk-scale__fill, .djk-scale__mark { animation: none; transform: none; opacity: 1; } }

/* ---------- koopblok, opmerking ---------- */
.djk-buynote { display: grid; gap: 1rem; justify-items: start; }
.djk-buynote p { margin: 0; font-size: 0.875rem; line-height: 1.7; color: var(--fg-3, #7d7362); max-width: 38ch; }
.djk-buynote--sold p { color: var(--fg-2, #4a4237); }
.djk-flag { font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.72rem; letter-spacing: 0.06em; color: var(--accent, #a1522f); border-left: 1px solid var(--accent, #a1522f); padding-left: 0.8rem; margin: 0; }

/* ---------- video ---------- */
.djk-video { margin: 0; display: grid; gap: 0.8rem; }
.djk-video video { width: 100%; height: auto; display: block; background: var(--night, #17120c); }
.djk-video__frame { position: relative; aspect-ratio: 16 / 9; background: var(--night, #17120c); }
.djk-video__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.djk-video figcaption { color: var(--fg-3, #7d7362); }

/* ---------- socials ---------- */
.djk-socials { display: flex; flex-wrap: wrap; gap: 0.5rem; list-style: none; margin: 0; padding: 0; }
.djk-socials li { margin: 0; }
.djk-socials a { display: inline-flex; align-items: center; justify-content: center; gap: 0.55em; width: 2.6rem; height: 2.6rem; border: 1px solid var(--rule, #d6cbb4); color: var(--fg, #17140f); text-decoration: none; transition: border-color 0.3s, background-color 0.3s, color 0.3s; }
.djk-socials a:hover { border-color: var(--fg, #17140f); background: var(--hover, #e7e0d0); color: var(--accent, #a1522f); }
.djk-socials a span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.djk-socials--labels a { width: auto; padding: 0 1em 0 0.8em; font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.7rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; }
.djk-socials--labels a span { position: static; width: auto; height: auto; clip-path: none; }
.djk-icon { display: block; flex: none; }

/* ---------- winkelgegevens ---------- */
.djk-hours { border-collapse: collapse; width: 100%; font-family: var(--mono, 'IBM Plex Mono', monospace); font-size: 0.8rem; font-variant-numeric: tabular-nums; color: var(--fg-2, #4a4237); }
.djk-hours th, .djk-hours td { padding: 0.45rem 0; border-bottom: 1px solid var(--rule-soft, #e4dbc8); text-align: left; font-weight: 400; vertical-align: top; }
.djk-hours td { text-align: right; }
.djk-hours tr.is-closed th, .djk-hours tr.is-closed td { color: var(--fg-3, #7d7362); border-bottom: 0; }
.djk-hours-compact { line-height: 1.7; display: grid; }
.djk-address, .djk-contact { margin: 0; line-height: 1.8; }
.djk-contact a { color: inherit; text-decoration: none; }
.djk-contact a:hover { text-decoration: underline; text-underline-offset: 0.22em; }
.djk-map { border: 1px solid var(--rule, #d6cbb4); aspect-ratio: 21 / 9; background: var(--paper-2, #e7e0d0); filter: grayscale(1) sepia(0.25) contrast(0.95); }
.djk-map iframe { width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 720px) { .djk-map { aspect-ratio: 4 / 3; } }
.djk-crumb { display: flex; gap: 0.6rem; font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--fg-3, #7d7362); }
.djk-crumb a { color: inherit; text-decoration: none; }
.djk-crumb a:hover { color: var(--accent, #a1522f); }

/* ---------- WooCommerce-meldingen: geen rand van WooCommerce zelf ---------- */
.djk-nt .woocommerce-message, .djk-nt .woocommerce-info, .djk-nt .woocommerce-error { border: 0 !important; outline: 0 !important; box-shadow: none !important; }
.djk-pdp > .woocommerce-notices-wrapper { width: 100%; max-width: var(--wrap, 108rem); margin: 0 auto; padding-left: var(--gutter, 1.25rem); padding-right: var(--gutter, 1.25rem); box-sizing: border-box; }

/* ---------- afrekenen: formulier links, overzicht rechts ---------- */
.djk-chk form.woocommerce-checkout { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--sp-4, 3rem) var(--sp-4, 3rem); align-items: start; }
.djk-chk form.woocommerce-checkout > #customer_details { grid-column: 1; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-3, 2rem); width: auto; }
.djk-chk form.woocommerce-checkout > #customer_details .col-1 { order: 1; width: auto; float: none; }
.djk-chk form.woocommerce-checkout > #customer_details .col-2 { order: 2; width: auto; float: none; }
.djk-chk form.woocommerce-checkout > .bde-order-review-column, .djk-chk form.woocommerce-checkout > #order_review { grid-column: 2; position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + 6rem); }
.djk-chk form.woocommerce-checkout > #order_review_heading { grid-column: 2; }
.djk-chk .woocommerce-checkout #payment div.payment_box { background: transparent !important; margin: 0.7rem 0 0 !important; padding: 0 !important; }
.djk-chk .woocommerce-checkout #payment div.payment_box::before { display: none !important; }
.djk-chk .woocommerce-checkout #payment ul.payment_methods li { background: var(--paper, #f3efe3) !important; }
.djk-chk .woocommerce-checkout #payment ul.payment_methods { border: 0 !important; padding: 0 !important; }
.djk-chk .woocommerce-checkout #payment .place-order { padding: 0 !important; }
@media (max-width: 1023px) {
  .djk-chk form.woocommerce-checkout { grid-template-columns: minmax(0, 1fr); }
  .djk-chk form.woocommerce-checkout > #customer_details, .djk-chk form.woocommerce-checkout > .bde-order-review-column, .djk-chk form.woocommerce-checkout > #order_review, .djk-chk form.woocommerce-checkout > #order_review_heading { grid-column: 1; position: static; }
}

/* ---------- mini-winkelwagen in de header ---------- */
html, body { overflow-x: clip; }
.djk-hdr__cart { position: relative; }
.djk-hdr__cart .bde-mini-cart-offcanvas-body { left: auto !important; right: 0 !important; width: min(24rem, calc(100vw - 2.5rem)) !important; max-width: none; margin-top: 0.6rem; padding: 1.2rem 1.3rem 1.3rem; background: var(--paper, #f3efe3); border: 1px solid var(--rule, #d6cbb4); box-shadow: 0 1.2rem 2.4rem var(--shadow, rgba(58,44,28,0.17)); box-sizing: border-box; font-family: var(--serif, Georgia, serif); color: var(--fg, #17140f); }
.djk-hdr__cart .bde-mini-cart-offcanvas-topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 0 0.9rem; padding-bottom: 0.7rem; border-bottom: 1px solid var(--rule, #d6cbb4); }
.djk-hdr__cart .bde-mini-cart-offcanvas-title { font-family: var(--display, Georgia, serif); font-weight: 400; font-size: 1.35rem; line-height: 1; margin: 0; color: var(--fg, #17140f); }
.djk-hdr__cart .bde-mini-cart-offcanvas__close-button { width: 2rem; height: 2rem; border: 1px solid var(--rule, #d6cbb4); background: transparent; color: var(--fg-2, #4a4237); font-size: 1.2rem; line-height: 1; cursor: pointer; padding: 0; }
.djk-hdr__cart .woocommerce-mini-cart { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.8rem; }
.djk-hdr__cart .bde-mini-cart-item { position: relative; display: grid; grid-template-columns: 3.6rem minmax(0, 1fr); grid-template-areas: "img title" "img qty"; gap: 0.15rem 0.9rem; align-items: center; margin: 0; padding: 0 1.8rem 0 0; font-size: 0.9rem; }
.djk-hdr__cart .bde-mini-cart-item-thumbnail { grid-area: img; display: block; }
.djk-hdr__cart .bde-mini-cart-item-thumbnail img { width: 3.6rem; height: 3.6rem; object-fit: contain; display: block; }
.djk-hdr__cart .bde-mini-cart-item-title { grid-area: title; color: var(--fg, #17140f); text-decoration: none; line-height: 1.3; }
.djk-hdr__cart .bde-mini-cart-quantity { grid-area: qty; font-family: var(--mono, monospace); font-size: 0.72rem; color: var(--fg-3, #7d7362); }
.djk-hdr__cart .bde-mini-cart-item a.remove { position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1.6rem; height: 1.6rem; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--rule, #d6cbb4); color: var(--fg-3, #7d7362); text-decoration: none; font-size: 1rem; line-height: 1; }
.djk-hdr__cart .bde-mini-cart-item a.remove:hover { color: var(--accent, #a1522f); border-color: var(--accent, #a1522f); }
.djk-hdr__cart .woocommerce-mini-cart__total { display: flex; justify-content: space-between; gap: 1rem; margin: 1rem 0 0.9rem; padding-top: 0.9rem; border-top: 1px solid var(--rule, #d6cbb4); font-family: var(--mono, monospace); font-size: 0.85rem; }
.djk-hdr__cart .woocommerce-mini-cart__buttons { display: grid; gap: 0.5rem; margin: 0; }
.djk-hdr__cart .woocommerce-mini-cart__buttons a.button { display: inline-flex; align-items: center; justify-content: center; min-height: 2.9rem; padding: 0 1.4em; border: 1px solid var(--fg, #17140f); background: var(--fg, #17140f); color: var(--bg, #f3efe3); font-family: var(--sans, sans-serif); font-size: 0.72rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none; }
.djk-hdr__cart .woocommerce-mini-cart__buttons a.button:not(.checkout) { background: transparent; color: var(--fg, #17140f); border-color: var(--rule, #d6cbb4); }
.djk-hdr__cart .woocommerce-mini-cart__buttons a.button:hover { background: var(--accent, #a1522f); border-color: var(--accent, #a1522f); color: #fff; }
.djk-hdr__cart .woocommerce-mini-cart__empty-message { margin: 0; font-size: 0.95rem; color: var(--fg-2, #4a4237); }
.djk-hdr__cart .bde-mini-cart-continue-shopping, .djk-hdr__cart .bde-mini-cart-offcanvas-body a.bde-mini-cart-continue { display: inline-block; margin-top: 0.8rem; font-family: var(--sans, sans-serif); font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--fg-2, #4a4237); }
/* telefoon: Breakdance maakt het paneel position:fixed van boven tot onder, maar de backdrop-filter op de header
   maakt de header het containing block -> paneel werd een strookje van headerhoogte. Hier als dropdown onder de header. */
@media (max-width: 767px) {
  .djk-hdr .djk-hdr__cart.bde-mini-cart { position: static; }
  .djk-hdr .djk-hdr__cart .bde-mini-cart-toggle { position: relative; }
  .djk-hdr__cart .bde-mini-cart-offcanvas-body { position: absolute !important; top: 100% !important; bottom: auto !important; left: var(--gutter, 1.25rem) !important; right: var(--gutter, 1.25rem) !important; width: auto !important; max-width: none !important; height: auto !important; margin-top: 0.4rem; max-height: calc(100dvh - var(--djk-hdr-h, 4.3rem) - var(--wp-admin--admin-bar--height, 0px) - 1.5rem); overflow-y: auto !important; overscroll-behavior: contain; }
}

/* ---------- iconen: vaste maat, nooit uitgerekt ---------- */
.djk-btn .djk-icon { width: 1em; height: 1em; font-size: 1.15em; flex: none; }
.djk-socials a .djk-icon { width: 1.1rem; height: 1.1rem; }
.djk-socials--labels a .djk-icon { width: 1rem; height: 1rem; }

/* ---------- lege shortcode-slots nemen geen ruimte in ---------- */
[data-sc]:has(> .bde-shortcode:empty) { display: none !important; }
.bde-shortcode:empty { display: none; }

/* ---------- gewone tekstpagina's ---------- */
.djk-plain { max-width: 56rem; margin: 0 auto; padding: var(--sp-4, 3rem) 0 var(--sp-5, 5rem); }
.djk-plain__head { display: grid; gap: var(--sp-2, 1.2rem); margin-bottom: var(--sp-3, 2rem); padding-bottom: var(--sp-2, 1.2rem); border-bottom: 1px solid var(--rule, #d6cbb4); }
.djk-plain__title { font-family: var(--display, Georgia, serif); font-weight: 400; font-size: clamp(2.1rem, 1.6rem + 2.4vw, 3.6rem); line-height: 1.04; letter-spacing: -0.012em; color: var(--fg, #17140f); margin: 0; }
.djk-plain__body { display: grid; gap: 0.9rem; font-family: var(--serif, Georgia, serif); font-size: clamp(1.02rem, 0.98rem + 0.2vw, 1.15rem); line-height: 1.62; color: var(--fg-2, #4a4237); }
.djk-plain__body h2 { font-family: var(--display, Georgia, serif); font-weight: 400; font-size: clamp(1.55rem, 1.3rem + 1.2vw, 2.35rem); line-height: 1.08; color: var(--fg, #17140f); margin: var(--sp-2, 1.2rem) 0 0; }
.djk-plain__body p { margin: 0; max-width: 62ch; }
.djk-plain__body a { color: var(--fg, #17140f); }
.djk-plain__body ul, .djk-plain__body ol { margin: 0; padding-left: 1.2rem; }

/* ---------- v3: de kast ademt (2026-10-07) ---------- */
.djk-kast ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: clamp(2.2rem, 4vw, 4rem) clamp(1.4rem, 3vw, 3rem) !important; border: 0 !important; background: transparent !important; }
.djk-kast ul.products li.product.djk-vak { border: 0; aspect-ratio: 1 / 1.22; background: transparent; }
.djk-kast ul.products li.product.djk-vak:hover { background: transparent; }
.djk-kast ul.products li.product.djk-vak a.woocommerce-LoopProduct-link { padding: 0; gap: 0; grid-template-rows: auto minmax(0, 1fr) auto; }
.djk-kast ul.products li.product.djk-vak .djk-vak__hout { padding: 0 0 0.8rem; }
.djk-kast ul.products li.product.djk-vak .bde-woo-product-image { padding: clamp(0.8rem, 2vw, 1.6rem); background: var(--paper-2, #e7e0d0); transition: background-color 0.5s cubic-bezier(0.22, 0.75, 0.25, 1); }
.djk-kast ul.products li.product.djk-vak:hover .bde-woo-product-image { background: #e2d9c6; }
.djk-kast ul.products li.product.djk-vak .bde-woo-product-image img { inset: clamp(0.8rem, 2vw, 1.6rem); width: auto; height: auto; max-width: calc(100% - 2 * clamp(0.8rem, 2vw, 1.6rem)); max-height: calc(100% - 2 * clamp(0.8rem, 2vw, 1.6rem)); margin: auto; }
.djk-kast ul.products li.product.djk-vak .djk-vak__meta { padding-top: 0.9rem; margin-top: 0.9rem; border-top: 1px solid var(--rule, #d6cbb4); gap: 0.3rem; }
.djk-kast ul.products li.product.djk-vak h2.woocommerce-loop-product__title { font-size: clamp(0.95rem, 0.9rem + 0.2vw, 1.05rem); }
.djk-kast ul.products li.product.djk-vak .price { font-size: 0.75rem; }
/* tussenvak met een zin */
.djk-kast ul.products li.djk-vak--note { display: block; aspect-ratio: 1 / 1.22; margin: 0; padding: clamp(1rem, 2.4vw, 2rem) 0 0; border-top: 1px solid var(--rule, #d6cbb4); list-style: none; min-width: 0; }
.djk-kast ul.products li.djk-vak--note .djk-vak__note { display: grid; align-content: space-between; gap: 1.4rem; height: 100%; }
.djk-kast ul.products li.djk-vak--note .djk-vak__notetext { font-family: var(--display, Georgia, serif); font-size: clamp(1.45rem, 1.1rem + 1.2vw, 2.1rem); line-height: 1.12; letter-spacing: -0.01em; color: var(--fg, #17140f); margin: 0; max-width: 16ch; }
.djk-kast ul.products li.djk-vak--note .djk-vak__notejava { display: block; width: min(60%, 11rem); color: var(--accent, #a1522f); }
.djk-kast ul.products li.djk-vak--note .djk-vak__notejava .djk-java .java__isle { animation: none; stroke-dashoffset: 0; }
@media (max-width: 1080px) { .djk-kast ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 720px) {
  .djk-kast ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 1.8rem 1rem !important; }
  .djk-kast ul.products li.product.djk-vak a.woocommerce-LoopProduct-link { grid-template-rows: minmax(0, 1fr) auto; }
  .djk-kast ul.products li.product.djk-vak .bde-woo-product-image { padding: 0.7rem; }
  .djk-kast ul.products li.product.djk-vak .bde-woo-product-image img { inset: 0.7rem; max-width: calc(100% - 1.4rem); max-height: calc(100% - 1.4rem); }
  .djk-kast ul.products li.djk-vak--note { grid-column: 1 / -1; aspect-ratio: auto; padding: 1.2rem 0 0.4rem; }
  .djk-kast ul.products li.djk-vak--note .djk-vak__note { gap: 1rem; }
  .djk-kast ul.products li.djk-vak--note .djk-vak__notejava { width: 7rem; }
}

/* ---------- voettekst op tablet/telefoon: kolommen onder elkaar (Breakdance bewaart grid-row-end) ---------- */
@media (max-width: 1023px) {
  .djk-ftr__mark { grid-column: 1 / 5 !important; grid-row: auto / auto !important; }
  .djk-ftr__claim { grid-column: 1 / 7 !important; grid-row: auto / auto !important; }
  .djk-ftr__col--a, .djk-ftr__col--b, .djk-ftr__col--c { grid-column: span 2 !important; grid-row: auto / auto !important; }
  .djk-ftr__base { grid-column: 1 / 7 !important; grid-row: auto / auto !important; }
}
@media (max-width: 767px) {
  .djk-ftr__col--a, .djk-ftr__col--b, .djk-ftr__col--c { grid-column: 1 / 7 !important; }
}

/* ---------- tekstvakken als kaartjes (2026-10-07) ---------- */
.djk-kast ul.products li.djk-vak--note { position: relative; border: 0; padding: clamp(1.4rem, 2.6vw, 2.2rem); background: var(--night, #17120c); color: var(--bone, #eee6d6); box-shadow: 0 1.2rem 2rem var(--shadow, rgba(58,44,28,0.17)); }
.djk-kast ul.products li.djk-vak--note::before { content: ''; position: absolute; inset: 0.7rem; border: 1px solid rgba(238, 230, 214, 0.18); pointer-events: none; }
.djk-kast ul.products li.djk-vak--note .djk-vak__note { position: relative; }
.djk-kast ul.products li.djk-vak--note .djk-label { color: var(--bone-3, #857662); }
.djk-kast ul.products li.djk-vak--note .djk-vak__notetext { color: var(--bone, #eee6d6); }
.djk-kast ul.products li.djk-vak--note .djk-vak__notejava { color: var(--clay, #c06a41); }
@media (max-width: 720px) {
  .djk-kast ul.products li.djk-vak--note { padding: 1.4rem 1.3rem 1.3rem; }
  .djk-kast ul.products li.djk-vak--note::before { inset: 0.5rem; }
}

/* ---------- knop naar de collectie ---------- */
.djk-btn--collection { padding: 1.15em 2.1em; font-size: 0.8rem; gap: 0.9em; }
.djk-btn__count { font-family: var(--mono, monospace); font-size: 0.72rem; letter-spacing: 0.04em; text-transform: none; opacity: 0.75; padding-left: 0.9em; border-left: 1px solid rgba(255,255,255,0.35); }
.djk-btn--collection:hover .djk-btn__count { opacity: 0.9; }

/* ---------- label Nieuw in de kast ---------- */
.djk-kast ul.products li.product.djk-vak { position: relative; }
.djk-kast ul.products li.product.djk-vak .djk-vak__new { position: absolute; top: 2.3rem; right: 0.9rem; z-index: 2; font-family: var(--sans, sans-serif); font-size: 0.6rem; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: #fff; background: var(--accent, #a1522f); padding: 0.4em 0.7em; }
@media (max-width: 720px) { .djk-kast ul.products li.product.djk-vak .djk-vak__new { top: 0.6rem; right: 0.6rem; } }

/* ---------- maten op het museumlabel ---------- */
.djk-sizes { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; }
.djk-sizes li { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr) auto; gap: 0.8rem; align-items: baseline; font-size: 0.9rem; }
.djk-sizes li b { font-weight: 500; color: var(--fg, #17140f); }
.djk-sizes li span { color: var(--fg-2, #4a4237); }
.djk-sizes li em { font-style: normal; font-family: var(--mono, monospace); font-size: 0.72rem; color: var(--fg-3, #7d7362); font-variant-numeric: tabular-nums; }
@media (max-width: 479px) { .djk-sizes li { grid-template-columns: 5rem minmax(0, 1fr); } .djk-sizes li em { grid-column: 2; } }

/* ---------- maatkeuze op de productpagina ---------- */
.djk-pdp__cta table.variations { width: 100%; border-collapse: collapse; margin: 0 0 0.9rem; }
.djk-pdp__cta table.variations th.label, .djk-pdp__cta table.variations td.value { padding: 0.3rem 0; border: 0; text-align: left; vertical-align: middle; background: transparent; }
.djk-pdp__cta table.variations th.label { width: 6.5rem; font-family: var(--sans, sans-serif); font-size: 0.68rem; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; color: var(--fg-2, #4a4237); }
.djk-pdp__cta table.variations th.label label { margin: 0; font: inherit; }
.djk-pdp__cta .bde-woo-select { position: relative; display: block; max-width: 18rem; }
.djk-pdp__cta table.variations select { width: 100%; min-height: 3.1rem; padding: 0.75rem 2.4rem 0.75rem 0.9rem; border: 1px solid var(--rule, #d6cbb4); border-radius: 0; background: #fbf9f3; color: var(--fg, #17140f); font-family: var(--serif, Georgia, serif); font-size: 1rem; appearance: none; -webkit-appearance: none; }
.djk-pdp__cta .bde-woo-select__arrow { position: absolute; right: 0.9rem; top: 50%; width: 0.6rem; height: 0.6rem; margin-top: -0.45rem; border-right: 1px solid var(--fg, #17140f); border-bottom: 1px solid var(--fg, #17140f); transform: rotate(45deg); pointer-events: none; }
.djk-pdp__cta a.reset_variations { display: inline-block; margin-top: 0.5rem; padding: 0; border: 0; border-radius: 0; background: none; width: auto; color: var(--fg-3, #7d7362); font-family: var(--sans, sans-serif); font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; text-decoration: none; }
.djk-pdp__cta a.reset_variations:hover { background: none; color: var(--accent, #a1522f); }
.djk-pdp__cta .single_variation_wrap { display: grid; gap: 0.8rem; }
.djk-pdp__cta .woocommerce-variation-price .price { font-family: var(--mono, monospace); font-size: 1.05rem; color: var(--fg, #17140f); }
.djk-pdp__cta .woocommerce-variation-price .price del { color: var(--fg-3, #7d7362); margin-right: 0.5em; }
.djk-pdp__cta .woocommerce-variation-price .price ins { text-decoration: none; }
.djk-pdp__cta .woocommerce-variation-availability p.stock { display: block; margin: 0; font-family: var(--mono, monospace); font-size: 0.72rem; color: var(--fg-3, #7d7362); }
.djk-pdp__cta .woocommerce-variation-add-to-cart-disabled { opacity: 0.45; }
.djk-pdp__cta .woocommerce-variation-add-to-cart-disabled button { pointer-events: none; }

/* ---------- hero: nieuwste stuk voor de jaarringen ---------- */
.djk-heronew { position: relative; display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 1rem; text-decoration: none; color: inherit; width: 100%; aspect-ratio: 1 / 1.24; }
.djk-heronew__rings { position: absolute; left: 50%; top: 42%; width: 112%; max-width: none; height: auto; transform: translate(-50%, -50%); opacity: 0.32; pointer-events: none; }
.djk-heronew__stage { position: relative; display: block; min-height: 0; }
.djk-heronew__img { position: absolute; inset: 3% 6%; width: 88%; height: 94%; object-fit: contain; filter: contrast(1.07) saturate(1.08) drop-shadow(0 0.4rem 0.6rem var(--shadow-soft, rgba(58,44,28,0.1))) drop-shadow(0 2rem 2.6rem var(--shadow, rgba(58,44,28,0.17))); transform-origin: 50% 100%; transition: transform 0.9s cubic-bezier(0.22, 0.75, 0.25, 1); }
.djk-heronew:hover .djk-heronew__img { transform: translateY(-0.5rem) scale(1.02); }
.djk-heronew__card { position: relative; display: grid; gap: 0.35rem; justify-items: start; padding: 1.1rem 1.3rem 1.2rem; background: var(--night, #17120c); color: var(--bone, #eee6d6); box-shadow: 0 1rem 2rem var(--shadow, rgba(58,44,28,0.17)); max-width: 22rem; justify-self: end; }
.djk-heronew__card .djk-label { color: var(--clay, #c06a41); }
.djk-heronew__t { font-family: var(--display, Georgia, serif); font-size: clamp(1.3rem, 1.1rem + 0.8vw, 1.7rem); line-height: 1.1; color: var(--bone, #eee6d6); }
.djk-heronew__p { color: var(--bone-2, #b0a189); }
.djk-heronew__more { color: var(--bone-3, #857662); }
.djk-heronew__link { display: inline-flex; align-items: center; gap: 0.5em; margin-top: 0.5rem; font-family: var(--sans, sans-serif); font-size: 0.68rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--bone, #eee6d6); border-bottom: 1px solid var(--bone-3, #857662); padding-bottom: 0.2rem; transition: border-color 0.3s; }
.djk-heronew:hover .djk-heronew__link { border-color: var(--bone, #eee6d6); }
@media (max-width: 1023px) { .djk-heronew { aspect-ratio: 1 / 1.1; } .djk-heronew__card { justify-self: start; max-width: none; } }

/* ---------- galerij: vaste breedtes, zodat Swiper nooit een cyclische (oneindige) breedte meet ---------- */
.djk-pdp__media { min-width: 0; max-width: 34rem; width: 100%; overflow: hidden; }
.djk-pdp__gallery, .djk-pdp__thumbs { width: 100%; min-width: 0; overflow: hidden; }
.djk-pdp__gallery .swiper, .djk-pdp__thumbs .swiper { width: 100% !important; max-width: 100%; overflow: hidden; }
.djk-pdp__gallery .swiper-wrapper, .djk-pdp__thumbs .swiper-wrapper { width: 100%; }
.djk-pdp__gallery .swiper-slide { width: 100% !important; flex: 0 0 100% !important; max-width: 100%; }
.djk-pdp__thumbs .swiper-slide { width: calc(25% - 6px) !important; flex: 0 0 calc(25% - 6px) !important; max-width: calc(25% - 6px); }
.djk-pdp__gallery .bde-swiper__slide { position: absolute; inset: 0; width: 100%; height: 100%; }
.djk-pdp__gallery .swiper-slide { position: relative; height: 100%; }

/* ---------- hero-kaartje: beter leesbaar ---------- */
.djk-heronew__card { gap: 0.5rem; padding: 1.3rem 1.5rem 1.4rem; max-width: 24rem; min-width: min(100%, 19rem); }
.djk-heronew__card .djk-label { color: #d98a62; font-size: 0.72rem; letter-spacing: 0.2em; }
.djk-heronew__t { font-size: clamp(1.45rem, 1.2rem + 0.9vw, 1.9rem); line-height: 1.08; color: #f5f0e6; }
.djk-heronew__p { color: #f5f0e6; font-size: 0.9rem; letter-spacing: 0.02em; }
.djk-heronew__more { color: #c9bca4; font-size: 0.78rem; letter-spacing: 0.02em; }
.djk-heronew__link { color: #f5f0e6; font-size: 0.72rem; border-bottom-color: #a39474; margin-top: 0.7rem; }

/* de globale .djk-mono-klasse (Breakdance, later geladen) wint anders van de kaartjeskleuren */
.djk-heronew .djk-heronew__p.djk-mono { color: #f5f0e6; font-size: 0.9rem; letter-spacing: 0.02em; }
.djk-heronew .djk-heronew__more.djk-mono { color: #c9bca4; font-size: 0.78rem; letter-spacing: 0.02em; }
.djk-heronew .djk-heronew__card .djk-label { color: #d98a62; font-size: 0.72rem; }

/* ---------- hero: meerdere nieuwe stukken, wisselend ---------- */
.djk-heronew { display: block; }
.djk-heronew__slide { position: absolute; inset: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 1rem; text-decoration: none; color: inherit; opacity: 0; transition: opacity 0.9s cubic-bezier(0.22, 0.75, 0.25, 1); pointer-events: none; }
.djk-heronew__slide.is-active { opacity: 1; pointer-events: auto; }
.djk-heronew__slide .djk-heronew__img { transition: transform 0.9s cubic-bezier(0.22, 0.75, 0.25, 1); }
.djk-heronew__slide:hover .djk-heronew__img { transform: translateY(-0.5rem) scale(1.02); }
.djk-heronew__slide:hover .djk-heronew__link { border-color: #f5f0e6; }
.djk-heronew__dots { position: absolute; left: 0; bottom: 0.5rem; display: flex; gap: 0.45rem; z-index: 3; }
.djk-heronew__dots i { display: block; width: 0.45rem; height: 0.45rem; border-radius: 50%; border: 1px solid var(--fg-3, #7d7362); background: transparent; transition: background-color 0.4s, border-color 0.4s; }
.djk-heronew__dots i.is-active { background: var(--accent, #a1522f); border-color: var(--accent, #a1522f); }
@media (max-width: 1023px) { .djk-heronew__dots { left: 0; bottom: auto; top: 0.2rem; } }

/* ---------- telefoon (≤767px) ---------- */
@media (max-width: 767px) {
	/* hero: nieuw stuk compact naast het kaartje (de globale stylesheet verbergt de figuur, daarom !important) */
	.djk-hero .djk-hero__fig { display: block !important; width: 100% !important; max-width: none !important; margin-top: 0.5rem !important; }
	.djk-heronew { aspect-ratio: auto !important; height: 17rem; }
	.djk-heronew__slide { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-rows: none; gap: 0.75rem; align-items: center; }
	.djk-heronew__stage { height: 100%; }
	.djk-heronew__img { inset: 2% 4%; width: 92%; height: 96%; }
	.djk-heronew__rings { left: 21%; top: 50%; width: 62%; opacity: 0.28; }
	.djk-heronew__card { max-width: none; min-width: 0; padding: 1rem 1.1rem 1.1rem; justify-self: stretch; gap: 0.4rem; }
	.djk-heronew__t { font-size: 1.3rem; }
	.djk-heronew .djk-heronew__p.djk-mono { font-size: 0.85rem; }
	.djk-heronew__link { margin-top: 0.45rem; }
	.djk-heronew__dots { top: auto; bottom: 0.2rem; left: 0; }

	/* label: maten onder elkaar, volle breedte */
	.djk-specs > div:has(.djk-sizes) { grid-template-columns: 1fr; gap: 0.6rem; }
	.djk-sizes { gap: 0; }
	.djk-sizes li { grid-template-columns: minmax(0, 1fr) auto; gap: 0.1rem 0.8rem; padding: 0.5rem 0; border-top: 1px dashed var(--rule, #d6cbb4); }
	.djk-sizes li:first-child { border-top: 0; padding-top: 0; }
	.djk-sizes li b { grid-column: 1; grid-row: 1; }
	.djk-sizes li em { grid-column: 2; grid-row: 1; font-size: 0.8rem; }
	.djk-sizes li span { grid-column: 1 / -1; grid-row: 2; font-size: 0.85rem; }

	/* koopknop volle breedte */
	.djk-pdp__cta .single_add_to_cart_button { width: 100%; }

	/* label Nieuw iets groter */
	.djk-kast ul.products li.product.djk-vak .djk-vak__new { font-size: 0.66rem; }
}
/* woocommerce.css kleurt .price groen; altijd inkt */
.djk-pdp__cta .woocommerce-variation-price .price, .djk-pdp__cta .woocommerce-variation-price .price .amount, .djk-pdp__cta .woocommerce-variation-price .price bdi { color: var(--fg, #17140f) !important; }
/* koopknop: de variatie-wrapper krimpt tot knopbreedte; op telefoon alles vol-breed */
@media (max-width: 767px) {
	.djk-pdp__cta .single_variation_wrap, .djk-pdp__cta .woocommerce-variation-add-to-cart, .djk-pdp__cta form.cart .single_add_to_cart_button { width: 100%; }
	.djk-pdp__cta .woocommerce-variation-add-to-cart { display: grid; }
}
/* afrekenen: besteloverzicht nooit breder dan het scherm */
.woocommerce-checkout-review-order table.shop_table { width: 100%; max-width: 100%; table-layout: fixed; }
.woocommerce-checkout-review-order table.shop_table th, .woocommerce-checkout-review-order table.shop_table td { white-space: normal !important; overflow-wrap: anywhere; }
.woocommerce-checkout-review-order table.shop_table th.product-name, .woocommerce-checkout-review-order table.shop_table tfoot th { width: 38%; }
.woocommerce-checkout-review-order table.shop_table td.product-total, .woocommerce-checkout-review-order table.shop_table tfoot td { text-align: right; }
.woocommerce-checkout-review-order table.shop_table tr.woocommerce-shipping-totals td { text-align: left; }
.woocommerce-checkout-review-order table.shop_table tr.woocommerce-shipping-totals ul { margin: 0; padding: 0; list-style: none; }

/* ======================================================================
   TELEFOON-PAS (≤767px): groter, ruimer, duimvriendelijk
   ====================================================================== */
@media (max-width: 767px) {
	/* type: kleine labels en mono-tekst een maat groter */
	.djk-label { font-size: 0.78rem !important; letter-spacing: 0.18em; }
	.djk-mono { font-size: 0.82rem; }
	.djk-crumb { font-size: 0.78rem; gap: 0.7rem; flex-wrap: wrap; }
	.djk-crumb a, .djk-crumb span { padding: 0.35rem 0; display: inline-block; }

	/* knoppen: hoger, volle breedte in knoppenrijen */
	.djk-btn { font-size: 0.82rem; padding: 1.15em 1.6em; min-height: 3.25rem; }
	.djk-btn-row { flex-direction: column; gap: 0.7rem; }
	.djk-btn-row .djk-btn, .djk-pdp__side .djk-btn { width: 100%; justify-content: center; }

	/* header: taalkeuze zit in het menu, dus niet ook nog in de balk */
	header .gtranslate_wrapper, header .djk-hdr__lang { display: none !important; }
	.djk-hdr__panel .gtranslate_wrapper { display: flex !important; }
	.djk-hdr__tools { gap: 0.6rem; }
	.djk-hdr__plink { padding: 0.9rem 0; font-size: 1.6rem; }

	/* filters: veegbare rij van pillen i.p.v. vier regels losse woorden */
	.djk-filter { flex-wrap: nowrap; overflow-x: auto; gap: 0.5rem; margin: 0 -20px; padding: 0.2rem 20px 0.6rem; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
	.djk-filter::-webkit-scrollbar { display: none; }
	.djk-filter a { flex: none; white-space: nowrap; font-size: 0.74rem; letter-spacing: 0.1em; padding: 0.7rem 1rem; border: 1px solid var(--rule, #d6cbb4); border-radius: 999px; color: var(--fg, #17140f); }
	.djk-filter a[aria-current] { background: var(--fg, #17140f); border-color: var(--fg, #17140f); color: var(--bg, #f3efe3); }
	.djk-filter a[aria-current] .djk-mono { color: var(--bone-2, #b0a189); }

	/* kast: tegels met vierkante foto, grotere titel en prijs */
	.djk-kast ul.products { gap: 2rem 1rem !important; }
	.djk-kast ul.products li.product.djk-vak { aspect-ratio: auto; }
	.djk-kast ul.products li.product.djk-vak .bde-woo-product-image { aspect-ratio: 1 / 1; height: auto; }
	.djk-kast ul.products li.product.djk-vak .djk-vak__meta { gap: 0.35rem; padding-top: 0.8rem; margin-top: 0.8rem; }
	.djk-kast ul.products li.product.djk-vak .djk-vak__meta > * { font-size: 1.05rem; line-height: 1.25; }
	.djk-kast ul.products li.product.djk-vak .djk-vak__meta .djk-mono, .djk-kast ul.products li.product.djk-vak .djk-vak__meta .price { font-size: 0.85rem; }
	.djk-kast ul.products li.product.djk-vak .djk-vak__new { font-size: 0.7rem; padding: 0.45em 0.8em; }

	/* productpagina: label gestapeld, maatkeuze vol-breed */
	.djk-specs > div { grid-template-columns: 1fr; gap: 0.35rem; padding-top: 1rem; }
	.djk-specs dt { font-size: 0.74rem; }
	.djk-specs dd { font-size: 1.05rem; }
	.djk-sizes li b { font-size: 1rem; }
	.djk-sizes li span { font-size: 0.95rem; }
	.djk-sizes li em { font-size: 0.85rem; }
	.djk-pdp__cta table.variations, .djk-pdp__cta table.variations tbody, .djk-pdp__cta table.variations tr, .djk-pdp__cta table.variations th.label, .djk-pdp__cta table.variations td.value { display: block; width: 100%; }
	.djk-pdp__cta table.variations th.label { padding: 0 0 0.4rem; font-size: 0.74rem; }
	.djk-pdp__cta .bde-woo-select { max-width: none; }
	.djk-pdp__cta table.variations select { min-height: 3.4rem; font-size: 1.05rem; }
	.djk-pdp__cta .woocommerce-variation-price .price { font-size: 1.3rem; }
	.djk-pdp__cta a.reset_variations { padding: 0.5rem 0; }

	/* hero-kaartje en puntjes */
	.djk-heronew__t { font-size: 1.45rem; }
	.djk-heronew__dots { gap: 0.6rem; }
	.djk-heronew__dots i { width: 0.62rem; height: 0.62rem; }

	/* winkelwagen: elke regel als kaart met foto links, naam + prijs rechts */
	.woocommerce-cart-form table.shop_table_responsive, .woocommerce-cart-form table.shop_table_responsive tbody { display: block; width: 100%; }
	.woocommerce-cart-form table.shop_table_responsive tr.cart_item { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr) auto; gap: 0.3rem 1rem; align-items: start; padding: 1.1rem 0; border-bottom: 1px solid var(--rule, #d6cbb4); }
	.woocommerce-cart-form table.shop_table_responsive tr.cart_item td { display: block !important; padding: 0 !important; border: 0 !important; background: transparent !important; text-align: left !important; }
	.woocommerce-cart-form table.shop_table_responsive tr.cart_item td::before { display: none !important; }
	.woocommerce-cart-form table.shop_table_responsive td.product-thumbnail { grid-column: 1; grid-row: 1 / 4; }
	.woocommerce-cart-form table.shop_table_responsive td.product-thumbnail img { width: 5.5rem; height: 5.5rem; object-fit: contain; background: var(--paper-2, #ebe4d3); display: block; }
	.woocommerce-cart-form table.shop_table_responsive td.product-name { grid-column: 2; grid-row: 1; font-size: 1.1rem; line-height: 1.3; }
	.woocommerce-cart-form table.shop_table_responsive td.product-name dl.variation { margin: 0.25rem 0 0; font-size: 0.9rem; display: flex; gap: 0.3em; }
	.woocommerce-cart-form table.shop_table_responsive td.product-name dl.variation dt, .woocommerce-cart-form table.shop_table_responsive td.product-name dl.variation dd { margin: 0; padding: 0; float: none; }
	.woocommerce-cart-form table.shop_table_responsive td.product-name dl.variation dd p { margin: 0; display: inline; }
	.woocommerce-cart-form table.shop_table_responsive td.product-price, .woocommerce-cart-form table.shop_table_responsive td.product-quantity { display: none !important; }
	.woocommerce-cart-form table.shop_table_responsive td.product-subtotal { grid-column: 2; grid-row: 2; font-size: 1rem; margin-top: 0.4rem; }
	.woocommerce-cart-form table.shop_table_responsive td.product-remove { grid-column: 3; grid-row: 1; }
	.woocommerce-cart-form table.shop_table_responsive tr:not(.cart_item) td.actions { display: block; padding: 1rem 0 0 !important; border: 0 !important; }
	.woocommerce-cart-form table.shop_table_responsive td.actions::before { display: none !important; }
	.woocommerce-cart-form button[name="update_cart"] { display: none !important; }
	/* footer: ruimer en beter tikbaar */
	.djk-ftr__col { gap: 0.8rem; }
	.djk-ftr__text { font-size: 1.05rem; line-height: 1.8; }
	.djk-ftr__text a { display: inline-block; padding: 0.15rem 0; }
	.djk-ftr__link { font-size: 1.1rem; padding: 0.4rem 0; }
	.djk-ftr__nav { gap: 0; }
	.djk-ftr__basetext { font-size: 0.78rem; line-height: 1.7; }
	.djk-ftr .djk-mono, .djk-ftr__hours { font-size: 0.85rem !important; line-height: 1.8; }
	.djk-ftr__icons a { width: 3rem; height: 3rem; }
}

/* ======================================================================
   BEWEGING: onthullen bij scrollen (front.js zet .djk-rv / .is-in)
   ====================================================================== */
html.djk-js .djk-rv { opacity: 0; transform: translate3d(0, 1.1rem, 0); transition: opacity 0.75s cubic-bezier(0.22, 0.75, 0.25, 1), transform 0.75s cubic-bezier(0.22, 0.75, 0.25, 1); transition-delay: var(--djk-d, 0s); will-change: opacity, transform; }
html.djk-js .djk-rv.is-in { opacity: 1; transform: none; }
html.djk-js .djk-rv.is-in.djk-kast, html.djk-js li.product.djk-rv.is-in { will-change: auto; }
html.djk-js .djk-hero .djk-rv { transition-duration: 1s; }
@media (prefers-reduced-motion: reduce) { html.djk-js .djk-rv { opacity: 1; transform: none; transition: none; } }

/* ======================================================================
   SNELHEID OP TELEFOON: geen dure filter-schaduwen, wel een zachte vloer-schaduw
   ====================================================================== */
@media (max-width: 767px), (hover: none) {
	.djk-heronew__img, .djk-kast ul.products li.product.djk-vak img { filter: none !important; }
	.djk-heronew__stage::after { content: ''; position: absolute; left: 18%; right: 18%; bottom: 2%; height: 9%; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(58,44,28,0.22), rgba(58,44,28,0) 70%); pointer-events: none; }
	.djk-kast ul.products li.product.djk-vak .bde-woo-product-image::after { content: ''; position: absolute; left: 22%; right: 22%; bottom: 8%; height: 7%; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(58,44,28,0.16), rgba(58,44,28,0) 70%); pointer-events: none; }
	.djk-kast ul.products li.product.djk-vak img { transition: none; }
	.djk-kast ul.products li.product.djk-vak { content-visibility: auto; contain-intrinsic-size: auto 16rem; }
	.djk-heronew__slide .djk-heronew__img { transition: none; }
}
/* winkelwagen telefoon: prijs/aantal/actiebalk echt weg (specifieker dan de rij-regel hierboven) */
@media (max-width: 767px) {
	.woocommerce-cart-form table.shop_table_responsive tr.cart_item td.product-price, .woocommerce-cart-form table.shop_table_responsive tr.cart_item td.product-quantity { display: none !important; }
	.woocommerce-cart-form table.shop_table_responsive tr:not(.cart_item) td.actions { display: none !important; }
	.woocommerce-cart-form table.shop_table_responsive td.product-subtotal { font-family: var(--mono, monospace); }
}

/* ======================================================================
   BEWEGING 2 (1.6.0): het logo schrijft zichzelf, de jaarringen zweven en volgen de muis,
   tekeningen tekenen zich pas in beeld, koppen komen woord voor woord uit de inkt,
   de kop verdwijnt bij omlaag scrollen, en de foto vliegt van de kast naar de productpagina.
   ====================================================================== */

/* --- het logo wordt geschreven: een brede veeg volgt de middenlijn door "De Java", met een pennetje op de punt --- */
.djk-lw { display: block; width: min(100%, 20rem); height: auto; overflow: visible; }
.djk-lw__stroke { stroke-dasharray: 1; stroke-dashoffset: 1; }
.djk-lw__caps { opacity: 0; }
.djk-lw__pen { fill: var(--accent, #a1522f); opacity: 0; offset-distance: 0%; offset-rotate: 0deg; }
.djk-lw.is-on .djk-lw__stroke { animation: djk-lw-write 2.5s cubic-bezier(0.55, 0.06, 0.3, 1) 0.35s forwards; }
.djk-lw.is-on .djk-lw__caps { animation: djk-lw-caps 0.9s cubic-bezier(0.22, 0.75, 0.25, 1) 2.15s forwards; }
.djk-lw.is-on .djk-lw__pen { animation: djk-lw-pen 2.5s cubic-bezier(0.55, 0.06, 0.3, 1) 0.35s forwards; }
html:not(.djk-js) .djk-lw__stroke { stroke-dashoffset: 0; }
html:not(.djk-js) .djk-lw__caps { opacity: 1; }
html:not(.djk-js) .djk-lw__pen { display: none; }
@keyframes djk-lw-write { to { stroke-dashoffset: 0; } }
@keyframes djk-lw-caps { from { opacity: 0; transform: translateY(0.35rem); } to { opacity: 1; transform: none; } }
@keyframes djk-lw-pen { 0% { offset-distance: 0%; opacity: 0; } 5% { opacity: 1; } 88% { opacity: 1; } 100% { offset-distance: 100%; opacity: 0; } }
@media (max-width: 1023px) { .djk-lw { width: min(100%, 22rem); } }
@media (max-width: 767px) { .djk-lw { margin-bottom: 0.5rem; } }
@media (prefers-reduced-motion: reduce) { .djk-lw__stroke { stroke-dashoffset: 0; animation: none; } .djk-lw__caps { opacity: 1; animation: none; } .djk-lw__pen { display: none; } }

/* --- jaarringen: zweven langzaam en volgen de muis een paar pixels (front.js zet --mx/--my) --- */
.djk-heronew__rings { display: block; }
.djk-heronew__ringsimg { display: block; width: 100%; height: auto; transform: translate3d(calc(var(--mx, 0) * 1px), calc(var(--my, 0) * 1px), 0); transition: transform 1.5s cubic-bezier(0.16, 1, 0.3, 1); animation: djk-drift 15s ease-in-out infinite; }
@keyframes djk-drift { 0%, 100% { translate: 0 0; rotate: -0.9deg; } 50% { translate: 0 -1.3rem; rotate: 0.9deg; } }
@media (prefers-reduced-motion: reduce) { .djk-heronew__ringsimg { animation: none; transform: none; } }

/* --- houticonen, Java-omtrek en maatlat: wachten met tekenen tot ze in beeld zijn (front.js zet .is-in) --- */
html.djk-js .djk-wi:not(.is-in) path, html.djk-js .djk-java:not(.is-in) .java__isle { animation-play-state: paused; }
html.djk-js .djk-scale:not(.is-in) .djk-scale__fill, html.djk-js .djk-scale:not(.is-in) .djk-scale__mark { animation-play-state: paused; }

/* --- koppen woord voor woord uit de inkt (front.js splitst in .djk-w > i) --- */
.djk-w { display: inline-block; overflow: hidden; vertical-align: top; padding: 0 0.12em 0.16em; margin: 0 -0.12em -0.16em; }
.djk-w > i { display: inline-block; font-style: inherit; transform: translateY(112%); transition: transform 1s cubic-bezier(0.22, 0.75, 0.25, 1); transition-delay: calc(var(--i, 0) * 55ms); will-change: transform; }
.djk-words.is-in .djk-w > i { transform: none; will-change: auto; }
@media (prefers-reduced-motion: reduce) { .djk-w > i { transform: none; transition: none; } }

/* --- kop: verdwijnt bij omlaag scrollen, komt terug zodra je omhoog scrolt --- */
.djk-hdr { transition: transform 0.45s cubic-bezier(0.22, 0.75, 0.25, 1), border-color 0.35s ease; }
.djk-hdr[data-hide] { transform: translateY(-101%); }
@media (prefers-reduced-motion: reduce) { .djk-hdr { transition: none; } }

/* --- pagina's vloeien in elkaar over; de productfoto vliegt van de kast naar de productpagina --- */
@view-transition { navigation: auto; }
@media (prefers-reduced-motion: no-preference) {
	/* oude pagina zakt licht weg, nieuwe komt rustig omhoog; de kop staat stil (eigen naam) */
	::view-transition-old(root) { animation: djk-vt-out 0.32s cubic-bezier(0.4, 0, 0.6, 1) both; }
	::view-transition-new(root) { animation: djk-vt-in 0.6s cubic-bezier(0.22, 0.75, 0.25, 1) 0.08s both; }
	::view-transition-group(*) { animation-duration: 0.7s; animation-timing-function: cubic-bezier(0.22, 0.75, 0.25, 1); }
	::view-transition-group(djk-hdr) { animation-duration: 0.45s; }
	::view-transition-old(djk-hdr), ::view-transition-new(djk-hdr) { animation: none; mix-blend-mode: normal; }
	::view-transition-old(djk-hdr) { display: none; }
}
@keyframes djk-vt-out { to { opacity: 0; transform: translateY(-10px); } }
@keyframes djk-vt-in { from { opacity: 0; transform: translateY(18px); } }
.djk-hdr { view-transition-name: djk-hdr; }
/* tijdens de overgang niets verborgen houden, anders vliegt de foto naar een onzichtbaar vak */
html:active-view-transition .djk-kast li.product.djk-rv, html:active-view-transition .djk-hero__fig.djk-rv { opacity: 1 !important; transform: none !important; transition: none !important; }

/* =====================================================================
   1.7.0 — feedback klant (okt. 2026)
   ===================================================================== */

/* koppen in Helvetica (op Mac/iPhone de echte, elders Inter Tight als lookalike) */
html:root { --display: 'Helvetica Neue', Helvetica, 'Inter Tight', Arial, sans-serif; --djk-radius: 6px; }
.djk-h1, .djk-h2, .djk-h3 { letter-spacing: -0.028em; line-height: 1.04; }
.djk-h1 { letter-spacing: -0.035em; }
.djk-em { font-style: normal; }
.djk-winkel__qp, .djk-vak__notetext, .djk-heronew__t { letter-spacing: -0.025em; }

/* knoppen een beetje rond */
.djk-btn, .djk-socials a, .djk-hdr__cart .woocommerce-mini-cart__buttons a.button, .djk-pdp__cta .single_add_to_cart_button, .djk-pdp__cta button.button, .woocommerce a.button, .woocommerce button.button, .wc-proceed-to-checkout a, #place_order, .djk-vak__buy, .djk-heronew__card, .djk-pdp__cta table.variations select { border-radius: var(--djk-radius) !important; }

/* kast: knop onder elk vak (in de winkelmand / maat kiezen / vraag ernaar) */
.djk-kast ul.products li.product.djk-vak { aspect-ratio: auto; display: flex; flex-direction: column; overflow: visible; }
.djk-kast ul.products li.product.djk-vak a.woocommerce-LoopProduct-link { height: auto; flex: 1 1 auto; grid-template-rows: auto auto 1fr; }
.djk-kast ul.products li.product.djk-vak .bde-woo-product-image { aspect-ratio: 1 / 1; height: auto; overflow: hidden; }
.djk-kast ul.products li.djk-vak--note { aspect-ratio: auto; min-height: 100%; }
.djk-vak__buy { align-self: flex-start; display: inline-flex !important; align-items: center; gap: 0.55em; margin-top: 0.85rem !important; padding: 0.7em 1.05em !important; border: 1px solid var(--rule, #d6cbb4) !important; background: transparent !important; color: var(--fg, #17140f) !important; font-family: var(--sans, sans-serif) !important; font-size: 0.66rem !important; font-weight: 500 !important; letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none !important; line-height: 1.2 !important; transition: background-color 0.3s, border-color 0.3s, color 0.3s; }
.djk-vak__buy:hover { background: var(--accent, #a1522f) !important; border-color: var(--accent, #a1522f) !important; color: #fff !important; }
.djk-vak__buy .djk-icon { width: 0.95rem; height: 0.95rem; flex: none; }
.djk-vak__buy.loading { opacity: 0.6; pointer-events: none; }
.djk-vak__buy.added { background: var(--fg, #17140f) !important; border-color: var(--fg, #17140f) !important; color: var(--bg, #f3efe3) !important; }
.djk-vak__buy.added::after { content: '\2713'; margin-left: 0.2em; }
.djk-kast ul.products li.product .added_to_cart { display: inline-block; margin-top: 0.5rem; font-family: var(--sans, sans-serif); font-size: 0.66rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent, #a1522f); text-decoration: underline; text-underline-offset: 0.25em; }
.djk-vak__buy--ask { color: var(--fg-2, #4a4237) !important; }
@media (max-width: 767px) {
	.djk-vak__buy { width: 100%; justify-content: center; font-size: 0.72rem !important; padding: 0.85em 0.8em !important; }
}

/* contact met iconen */
ul.djk-contact { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; }
ul.djk-contact li { margin: 0; }
ul.djk-contact a { display: inline-flex; align-items: center; gap: 0.6em; color: inherit; text-decoration: none; }
ul.djk-contact a:hover span { text-decoration: underline; text-underline-offset: 0.22em; }
ul.djk-contact .djk-icon { flex: none; width: 1rem; height: 1rem; color: var(--accent, #a1522f); }
.djk-hours-note { margin: 0.6rem 0 0; font-family: var(--serif, Georgia, serif); font-size: 0.85rem; font-style: italic; line-height: 1.5; color: var(--fg-3, #7d7362); }

/* ---------- het hout: vijf soorten, wist u dat, keurmerken ---------- */
.djk-hout .bde-shortcode { grid-column: 1 / -1; min-width: 0; }
.djk-hx { display: grid; gap: var(--sp-4, 4rem); }
.djk-hx__head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter, 2rem); row-gap: var(--sp-2, 1.5rem); align-items: end; }
.djk-hx__h { grid-column: 1 / 6; color: var(--fg); }
.djk-hx__intro { grid-column: 7 / 12; margin: 0; font-family: var(--serif); font-size: var(--step-1, 1.2rem); line-height: 1.5; color: var(--fg-2); }
.djk-hx__list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--sp-3, 2rem) clamp(1.2rem, 2.2vw, 2.2rem); }
.djk-hx__item { display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 0.3rem; align-content: start; padding-top: var(--sp-2, 1.5rem); border-top: 1px solid var(--rule); }
.djk-hx__name { color: var(--fg); }
.djk-hx__latin { display: block; margin: 0 0 var(--sp-1, 0.6rem); color: var(--fg-3); }
.djk-hx__p { margin: 0; font-family: var(--serif); font-size: 0.95rem; line-height: 1.62; color: var(--fg-2); }
.djk-hx .djk-wi { width: 4.2rem; height: 4.2rem; margin-bottom: var(--sp-2, 1.2rem); color: var(--accent); }
.djk-hx .djk-wi path { stroke-dasharray: 1; stroke-dashoffset: 1px; animation: djk-draw 1.4s cubic-bezier(0.5, 0.05, 0.3, 1) forwards; animation-delay: calc(0.4s + var(--i, 0) * 140ms); }
html.djk-js .djk-hx .djk-wi:not(.is-in) path { animation-play-state: paused; }
@keyframes djk-draw { to { stroke-dashoffset: 0; } }

.djk-wist { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--sp-3, 2rem) var(--gutter, 3rem); padding: clamp(1.6rem, 3.5vw, 3.2rem); border: 1px solid var(--rule); border-radius: var(--djk-radius); background: var(--night-2, #221a11); position: relative; }
.djk-wist::before { content: ''; position: absolute; inset: 0.45rem; border: 1px solid var(--rule-soft); border-radius: 3px; pointer-events: none; }
.djk-wist__txt { display: grid; gap: var(--sp-1, 0.8rem); align-content: start; position: relative; }
.djk-wist__txt .djk-label { color: var(--accent); }
.djk-wist__h { color: var(--fg); max-width: 16ch; }
.djk-wist__p { margin: 0; font-family: var(--serif); line-height: 1.62; color: var(--fg-2); max-width: 44ch; }
.djk-wist__stats { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2, 1.4rem) var(--sp-3, 2rem); align-content: center; position: relative; }
.djk-wist__stats > div { padding-top: var(--sp-1, 0.8rem); border-top: 1px solid var(--rule); display: grid; gap: 0.35rem; }
.djk-wist__n { font-family: var(--display); font-size: clamp(1.9rem, 1.4rem + 1.8vw, 3.1rem); line-height: 1; letter-spacing: -0.03em; color: var(--fg); }
.djk-wist__l { margin: 0; font-family: var(--serif); font-size: 0.92rem; line-height: 1.45; color: var(--fg-2); }

.djk-keur { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--sp-3, 2rem) var(--gutter, 3rem); align-items: center; padding-top: var(--sp-3, 2rem); border-top: 1px solid var(--rule); }
.djk-keur__txt { display: grid; gap: var(--sp-1, 0.8rem); }
.djk-keur__p { margin: 0; font-family: var(--serif); line-height: 1.62; color: var(--fg-2); max-width: 46ch; }
.djk-keur__logos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 1rem; justify-content: flex-end; }
.djk-keur__logos li { margin: 0; display: grid; place-items: center; width: 10.5rem; height: 7rem; padding: 1rem 1.2rem; background: var(--paper, #f3efe3); border-radius: var(--djk-radius); }
.djk-keur__logos img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }

/* ---------- Indonesië: kaart + uitleg ---------- */
.djk-indonesie-sec .bde-shortcode { grid-column: 1 / -1; min-width: 0; }
.djk-indo { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--sp-3, 2rem) var(--gutter, 3rem); align-items: center; }
.djk-indo__map { margin: 0; display: grid; gap: var(--sp-1, 0.8rem); }
.djk-indo__map svg { width: 100%; height: auto; display: block; overflow: visible; }
.djk-indo__map figcaption { color: var(--fg-3); }
.djk-map__land { fill: var(--paper-2, #e7e0d0); stroke: var(--fg, #17140f); stroke-width: 0.7; stroke-linejoin: round; }
.djk-map__other { fill: none; stroke: var(--rule, #d6cbb4); stroke-width: 0.6; }
.djk-map__java { fill: var(--accent, #a1522f); stroke: var(--accent, #a1522f); stroke-width: 0.7; }
.djk-map__eq { stroke: var(--fg-3, #7d7362); stroke-width: 0.6; stroke-dasharray: 3 4; }
.djk-map__eqt { font-family: var(--mono); font-size: 9px; letter-spacing: 0.08em; fill: var(--fg-3, #7d7362); }
.djk-map__lbl { font-family: var(--sans); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; fill: var(--fg-2, #4a4237); }
.djk-map__lbl--java { fill: var(--accent, #a1522f); font-weight: 600; }
.djk-indo__txt { display: grid; gap: var(--sp-2, 1.2rem); align-content: start; }
.djk-indo__h { max-width: 18ch; }
.djk-indo__p { margin: 0; font-family: var(--serif); line-height: 1.65; color: var(--fg-2); max-width: 46ch; }
.djk-indo__facts { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2, 1.2rem); }
.djk-indo__facts > div { padding-top: 0.7rem; border-top: 1px solid var(--rule); display: grid; gap: 0.35rem; }
.djk-indo__facts dd { margin: 0; font-family: var(--serif); font-size: 0.95rem; line-height: 1.45; color: var(--fg); }
.djk-indo__src { margin: 0; color: var(--fg-3); }

@media (max-width: 1023px) {
	.djk-hx__h, .djk-hx__intro { grid-column: 1 / -1; }
	.djk-hx__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.djk-wist, .djk-keur, .djk-indo { grid-template-columns: minmax(0, 1fr); }
	.djk-keur__logos { justify-content: flex-start; }
}
@media (max-width: 600px) {
	.djk-hx__list { grid-template-columns: minmax(0, 1fr); }
	.djk-hx__p { font-size: 1rem; }
	.djk-wist__l { font-size: 0.88rem; }
	.djk-indo__facts { grid-template-columns: minmax(0, 1fr); }
	.djk-keur__logos li { width: calc(50% - 0.5rem); height: 6rem; }
}

/* ---------- video's ---------- */
.djk-vids { display: grid; gap: var(--sp-2, 1.2rem); margin: var(--sp-4, 4rem) 0 0; padding-top: var(--sp-3, 2rem); border-top: 1px solid var(--rule); }
.djk-vids__p { margin: 0; font-family: var(--serif); line-height: 1.62; color: var(--fg-2); max-width: 46ch; }
.djk-vids__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(0.8rem, 2vw, 1.4rem); margin-top: var(--sp-1, 0.6rem); }
.djk-vids__more { justify-self: start; }
.djk-vid { margin: 0; display: grid; gap: 0.6rem; align-content: start; }
.djk-vid__btn, .djk-vid__frame { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; padding: 0; border-radius: var(--djk-radius); overflow: hidden; background: var(--night, #17120c); cursor: pointer; }
.djk-vid--short .djk-vid__btn, .djk-vid--short .djk-vid__frame { aspect-ratio: 9 / 16; }
.djk-vid__btn img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.36); transition: transform 0.8s cubic-bezier(0.22, 0.75, 0.25, 1), opacity 0.4s; opacity: 0.92; }
.djk-vid:not(.djk-vid--short) .djk-vid__btn img { transform: none; }
.djk-vid__btn:hover img { opacity: 1; transform: scale(1.4); }
.djk-vid__play { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; }
.djk-vid__play .djk-icon { width: 3.2rem; height: 3.2rem; filter: drop-shadow(0 2px 8px rgba(0,0,0,0.45)); }
.djk-vid__play .djk-icon path { fill: #fff; }
.djk-vid__btn:focus-visible { outline: 2px solid var(--accent, #a1522f); outline-offset: 3px; }
.djk-vid__cap { font-family: var(--serif); font-size: 0.92rem; line-height: 1.4; color: var(--fg-2); }
@media (max-width: 600px) {
	.djk-vids__grid { grid-template-columns: repeat(3, minmax(9.5rem, 1fr)); overflow-x: auto; scroll-snap-type: x mandatory; margin-inline: -20px; padding: 0 20px 0.4rem; scrollbar-width: none; }
	.djk-vids__grid::-webkit-scrollbar { display: none; }
	.djk-vids__grid .djk-vid { scroll-snap-align: start; }
}

/* ---------- krantenartikel + video van de opening ---------- */
.djk-pers { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: clamp(1rem, 2.5vw, 1.8rem); align-items: start; margin: var(--sp-3, 2rem) 0; }
.djk-pers__clip { margin: 0; display: grid; gap: 0.6rem; }
.djk-pers__clip a { display: block; border-radius: var(--djk-radius); overflow: hidden; box-shadow: 0 1rem 2.2rem var(--shadow-soft, rgba(58,44,28,0.1)); }
.djk-pers__clip img { display: block; width: 100%; height: auto; transition: transform 0.8s cubic-bezier(0.22, 0.75, 0.25, 1); }
.djk-pers__clip a:hover img { transform: scale(1.02); }
.djk-pers__clip figcaption { color: var(--fg-3); }
@media (max-width: 600px) { .djk-pers { grid-template-columns: minmax(0, 1fr); } .djk-pers .djk-vid { max-width: 16rem; } }

/* 1.7.1: logo-tegels en kaart netjes binnen hun vak */
.djk-keur__logos li { display: flex; align-items: center; justify-content: center; }
.djk-keur__logos img { max-height: 5rem; max-width: 100%; }
@media (max-width: 600px) { .djk-keur__logos img { max-height: 4rem; } }
.djk-indo__map svg { overflow: hidden; }

/* 1.7.2: brede video boven de shorts */
.djk-vids__wide { margin-top: var(--sp-1, 0.6rem); }
.djk-vids__wide .djk-vid__btn img { transform: none; }

/* 1.7.3: winkelfoto's */
.djk-photo { margin: var(--sp-3, 2rem) 0 0; display: grid; gap: 0.6rem; }
.djk-photo__img { display: block; width: 100%; height: auto; border-radius: var(--djk-radius); }
.djk-photo figcaption { color: var(--fg-3); }
.djk-photo--bezoek { max-width: 30rem; }
.djk-photo--bezoek .djk-photo__img { aspect-ratio: 4 / 5; object-fit: cover; }
.djk-photo--verhaal .djk-photo__img { aspect-ratio: 4 / 5; object-fit: cover; max-width: 26rem; }

/* 1.7.5: geen lege "Ook in de winkel" als een soort maar één stuk heeft */
.djk-pdp__rel:not(:has(li.product)) { display: none; }

/* =====================================================================
   1.8.0 – terugknop op de productpagina, winkelblok met etalagefoto
   ===================================================================== */
.djk-back { display: inline-flex; align-items: center; gap: 0.5rem; margin: 0 0 1.1rem; padding: 0.55rem 1rem 0.55rem 0.75rem; border: 1px solid var(--rule); border-radius: var(--djk-radius, 6px); font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--fg); text-decoration: none; background: var(--bg, #f3efe3); transition: border-color 0.2s, color 0.2s, background 0.2s; }
.djk-back svg { transition: transform 0.25s cubic-bezier(0.22, 0.75, 0.25, 1); }
.djk-back:hover, .djk-back:focus-visible { border-color: var(--accent, #a1522f); color: var(--accent, #a1522f); }
.djk-back:hover svg { transform: translateX(-3px); }
.djk-back + .djk-crumb { margin-top: 0.2rem; }
/* telefoon: een kopie van de knop zweeft linksonder (front.js hangt hem aan body, want transforms in de pagina breken position:fixed) */
.djk-back--float { display: none; }
@media (max-width: 767px) {
	.djk-back:not(.djk-back--float) { display: none; }
	.djk-back--float { display: inline-flex; position: fixed; left: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 60; margin: 0; min-height: 46px; padding: 0.6rem 1.1rem 0.6rem 0.85rem; background: var(--night, #17140f); color: var(--bone, #f3efe3); border-color: transparent; box-shadow: 0 8px 24px rgba(23, 20, 15, 0.28); transition: transform 0.35s cubic-bezier(0.22, 0.75, 0.25, 1), opacity 0.35s; }
	.djk-back--float:hover, .djk-back--float:focus-visible { color: var(--bone, #f3efe3); border-color: var(--accent, #a1522f); }
	html:active-view-transition .djk-back--float { view-transition-name: djk-back; }
}

/* winkelblok: tekst links, etalagefoto rechts; de feitenlijst (zat dubbel met de footer) is weg */
.djk-winkel__grid { align-items: start; }
.djk-winkel__q { grid-column: 1 / 7 !important; grid-row: 1; }
.djk-winkel__body { grid-column: 1 / 6 !important; grid-row: 2; }
.djk-winkel__grid > .bde-shortcode:has(> .djk-wf) { grid-column: 7 / 13; grid-row: 1 / span 2; align-self: stretch; }
.djk-wf { margin: 0; height: 100%; display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 1rem; }
.djk-wf__img { display: block; width: 100%; height: 100%; min-height: 22rem; max-height: 36rem; object-fit: cover; border-radius: var(--djk-radius, 6px); }
.djk-wf__cap { display: grid; grid-template-columns: auto 1fr auto 1fr; gap: 0.4rem 1rem; align-items: baseline; padding-top: 0.9rem; border-top: 1px solid var(--rule); }
.djk-wf__k { font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--fg-3); }
.djk-wf__v { font-family: var(--serif); font-size: var(--step--1, 0.95rem); color: var(--fg-2); white-space: pre; }
@media (max-width: 1023px) {
	.djk-winkel__q, .djk-winkel__body { grid-column: 1 / -1 !important; }
	.djk-winkel__grid > .bde-shortcode:has(> .djk-wf) { grid-column: 1 / -1; grid-row: 3; }
	.djk-wf__img { min-height: 0; aspect-ratio: 4 / 3; height: auto; }
}
@media (max-width: 520px) { .djk-wf__cap { grid-template-columns: auto 1fr; } }

/* 1.9.0: keurmerklogo's in de voettekst, op lichte tegeltjes zodat ze op de donkere grond leesbaar blijven */
.djk-ftr-keur { list-style: none; margin: 1.6rem 0 0; padding: 0; display: flex; gap: 0.75rem; }
.djk-ftr-keur li { margin: 0; display: flex; align-items: center; justify-content: center; width: 6.2rem; height: 4.4rem; padding: 0.6rem 0.75rem; background: #f3efe3; border-radius: var(--djk-radius, 6px); }
.djk-ftr-keur img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }

/* 1.9.3: toegankelijkheid — de gedempte tekstkleur haalde 4,05:1 op papier; nu ≥ 4,5:1 (WCAG AA), ook in donkere vlakken */
html:root { --fg-3: #6b6252; --bone-3: #9a8b76; }
html .djk-inset { --fg-3: #9a8b76; }
html:root { --ink-3: #6b6252; }
.price del, .price del .amount, .price del bdi { opacity: 1 !important; color: var(--fg-3, #6b6252) !important; }
.djk-wist__txt > .djk-label { color: #d98a5f; }

/* ==========================================================================
   1.10: BEWEGING DIE MEELOOPT MET DE SCROLL (html.djk-scrub, zie assets.php)
   Hangt aan de scrollpositie in plaats van aan een timer: werkt heen én terug en staat stil als de bezoeker stilstaat.
   Alleen in browsers met CSS scroll-timelines; anders blijft de eenmalige onthulling.
   ========================================================================== */
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		/* overflow: hidden maakt van een ouder een scrollcontainer, en dan hangt view() daaraan in plaats van aan de pagina.
		   clip knipt hetzelfde af zonder scrollcontainer te zijn. */
		html.djk-scrub .djk-section,
		html.djk-scrub .djk-kast ul.products li.product.djk-vak .bde-woo-product-image { overflow: clip !important; }
		/* 1.12.18: de kastfoto's zweven NIET meer mee met de scroll (klant: foto's leken te laggen en mee naar beneden te schuiven).
		   De eenmalige onthulling (fade-up) en de hover blijven. */
		/* houticonen (vijf houtsoorten): tekenen zich na elkaar mee met de scroll */
		html.djk-scrub .djk-wi:not(.djk-noscrub) path {
			animation: djk-draw linear both !important;
			animation-timeline: view() !important;
			animation-range: cover calc(4% + var(--i, 0) * 3%) cover calc(30% + var(--i, 0) * 3%) !important;
			animation-delay: 0s !important;
			animation-play-state: running !important;
		}
		/* Java-omtrek (verhaalblok, footer, productpagina) tekent mee; het tweede eilandje iets later */
		html.djk-scrub .djk-java:not(.djk-noscrub) .java__isle {
			animation: djk-java-draw linear both;
			animation-timeline: view();
			animation-range: cover 2% cover 34%;
			animation-delay: 0s;
			animation-play-state: running !important;
		}
		html.djk-scrub .djk-java:not(.djk-noscrub) .java__isle--2 { animation-range: cover 22% cover 40%; }
		/* jaarringen in de hero draaien langzaam mee als je van de hero wegscrolt */
		html.djk-scrub .djk-heronew__rings {
			animation: djk-rings-turn linear both;
			animation-timeline: scroll(root);
			animation-range: 0px 100vh;
		}
		/* tussenkoppen: elk woord loopt vol met inkt, iets na het vorige; terugscrollen laat ze weer leeglopen */
		html.djk-scrub .djk-ink { view-timeline: --djk-ink block; }
		html.djk-scrub .djk-ink .djk-iw {
			display: inline-block;
			animation: djk-ink linear both;
			animation-timeline: --djk-ink;
			animation-range: cover calc(4% + var(--p, 0) * 16%) cover calc(16% + var(--p, 0) * 16%);
		}
	}
}
@keyframes djk-rings-turn { from { rotate: 0deg; scale: 1; } to { rotate: 24deg; scale: 1.06; } }
@keyframes djk-float {
	from { translate: 0 4%; scale: 1.035; }
	50% { translate: 0 0; scale: 1; }
	to { translate: 0 -4%; scale: 1.035; }
}
@keyframes djk-float-sm {
	from { translate: 0 3%; }
	to { translate: 0 -3%; }
}
@keyframes djk-ink {
	from { opacity: 0.14; translate: 0 0.14em; }
	to { opacity: 1; translate: 0 0; }
}

/* 1.10.6 telefoon-puntjes: menu over het hele scherm, hero-puntjes onder het kaartje, grotere tikvlakken */
@media (max-width: 767px) {
	header .djk-hdr__panel { min-height: calc(100dvh - var(--djk-hdr-h, 4.3rem)); max-height: calc(100dvh - var(--djk-hdr-h, 4.3rem)); }
	.djk-heronew__dots { left: calc((100% - 0.75rem) * 5 / 12 + 0.75rem); bottom: 0.2rem; }
	nav.djk-crumb a, a.djk-more { position: relative; }
	nav.djk-crumb a::after, a.djk-more::after { content: ''; position: absolute; inset: -0.75rem -0.35rem; }
}

/* 1.10.7 afrekenen compacter: kleinere koppen, kolommen gelijk bovenaan, postcode + plaats naast elkaar, verzendopties gestapeld */
.djk-chk form.woocommerce-checkout::before, .djk-chk form.woocommerce-checkout::after,
.djk-chk #customer_details::before, .djk-chk #customer_details::after { display: none !important; content: none !important; }
.djk-chk .djk-chk__title { font-size: clamp(1.9rem, 1.3rem + 1.6vw, 2.6rem); }
.djk-chk .djk-chk__in { gap: clamp(1.5rem, 1rem + 1.5vw, 2.5rem); }
.djk-chk .woocommerce-billing-fields h3, .djk-chk .woocommerce-additional-fields h3, .djk-chk #order_review_heading {
	font-size: 1.3rem !important; line-height: 1.2; letter-spacing: -0.01em; margin: 0 0 1.1rem !important; }
.djk-chk .woocommerce-billing-fields h3::before, .djk-chk #order_review_heading::before {
	display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; margin-right: 0.6rem; border-radius: 50%;
	background: var(--fg, #17140f); color: var(--bg, #f3efe3); font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.75rem; font-weight: 600; vertical-align: 0.15em; }
.djk-chk .woocommerce-billing-fields h3::before { content: '1'; }
.djk-chk #order_review_heading::before { content: '2'; }
.djk-chk h3#ship-to-different-address { font-size: 1rem !important; margin: 0.4rem 0 0 !important; }
.djk-chk #customer_details { gap: 1.25rem !important; }
.djk-chk p.form-row { margin: 0 0 0.85rem !important; }
.djk-chk p.form-row label { margin-bottom: 0.35rem; }
.djk-chk #billing_postcode_field, .djk-chk #billing_city_field, .djk-chk #shipping_postcode_field, .djk-chk #shipping_city_field { grid-column: span 1 !important; }
.djk-chk #billing_country_field strong, .djk-chk #shipping_country_field strong { font-weight: 400; }
.djk-chk #order_comments { min-height: 5.5rem; height: 5.5rem; }
.djk-chk table.woocommerce-checkout-review-order-table, .djk-chk table.woocommerce-checkout-review-order-table > tbody, .djk-chk table.woocommerce-checkout-review-order-table > tfoot { display: block; width: 100%; border: 0 !important; }
.djk-chk table.woocommerce-checkout-review-order-table > tbody > tr, .djk-chk table.woocommerce-checkout-review-order-table > tfoot > tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.3rem 1rem; align-items: baseline; padding: 0.85rem 0; border-top: 1px solid var(--rule, #d6cbb4); }
.djk-chk table.woocommerce-checkout-review-order-table > tbody > tr:first-child { border-top: 0; padding-top: 0; }
.djk-chk table.woocommerce-checkout-review-order-table th, .djk-chk table.woocommerce-checkout-review-order-table td { display: block; width: auto !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
.djk-chk table.woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals { grid-template-columns: minmax(0, 1fr); gap: 0.55rem; }
.djk-chk tr.woocommerce-shipping-totals ul { display: grid; gap: 0.5rem; }
.djk-chk tr.woocommerce-shipping-totals ul li { display: flex; align-items: flex-start; gap: 0.6rem; margin: 0; }
.djk-chk tr.woocommerce-shipping-totals ul li input { margin: 0.3em 0 0 !important; flex: none; }
.djk-chk table.woocommerce-checkout-review-order-table tr.order-total { padding-top: 1.1rem; }
@media (max-width: 767px) {
	.djk-chk.djk-section--tight, section.djk-chk { padding-top: 1.75rem !important; padding-bottom: 2.5rem !important; }
	.djk-chk .djk-chk__head { gap: 0.6rem; }
	.djk-chk .djk-chk__intro { gap: 0.3rem; }
	.djk-chk form.woocommerce-checkout { gap: 2rem !important; }
	.djk-chk #order_review { padding: 1.1rem !important; }
}

/* 1.11.0 sorteerkeuze naast het soortfilter */
.djk-filterbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; }
.djk-filterbar .djk-filter { flex: 1 1 32rem; min-width: 0; }
.djk-sort { display: flex; align-items: center; gap: 0.7rem; margin: 0; flex: none; }
.djk-sort__l { font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.72rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--fg-3, #6b6252); }
.djk-sort__wrap { position: relative; display: inline-block; }
.djk-sort__wrap::after { content: ''; position: absolute; right: 0.85rem; top: 50%; width: 0.4rem; height: 0.4rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-70%) rotate(45deg); pointer-events: none; color: var(--fg, #17140f); }
.djk-sort select { appearance: none; -webkit-appearance: none; font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.82rem; color: var(--fg, #17140f); background: transparent; border: 1px solid var(--rule, #d6cbb4); border-radius: var(--djk-radius, 6px); padding: 0.6rem 2.3rem 0.6rem 0.9rem; min-height: 2.6rem; cursor: pointer; }
.djk-sort select:hover { border-color: var(--fg-3, #6b6252); }
.djk-sort select:focus-visible { outline: 2px solid var(--accent, #a1522f); outline-offset: 2px; }
.djk-sort__go { margin-left: 0.4rem; }
@media (max-width: 767px) {
	.djk-filterbar { display: block; }
	.djk-sort { margin-top: 0.4rem; justify-content: space-between; }
	.djk-sort select { min-height: 2.9rem; font-size: 0.9rem; }
}

/* 1.12.4 eigen sorteermenu (vervangt de kale <select>) */
.djk-sortdd { position: relative; flex: none; margin: 0; }
.djk-sortdd__btn { list-style: none; display: inline-flex; align-items: center; gap: 0.75rem; min-height: 2.75rem; padding: 0.55rem 0.95rem 0.55rem 1.05rem; border: 1px solid var(--rule, #d6cbb4); border-radius: var(--djk-radius, 6px); background: transparent; cursor: pointer; user-select: none; transition: border-color 0.25s, background-color 0.25s; }
.djk-sortdd__btn::-webkit-details-marker { display: none; }
.djk-sortdd__btn::marker { content: ''; }
.djk-sortdd__btn:hover, .djk-sortdd[open] .djk-sortdd__btn { border-color: var(--fg-3, #6b6252); }
.djk-sortdd__btn:focus-visible { outline: 2px solid var(--accent, #a1522f); outline-offset: 2px; }
.djk-sortdd__l { font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.68rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--fg-3, #6b6252); }
.djk-sortdd__v { font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.86rem; color: var(--fg, #17140f); }
.djk-sortdd__chev { color: var(--fg, #17140f); transition: transform 0.25s ease; }
.djk-sortdd[open] .djk-sortdd__chev { transform: rotate(180deg); }
.djk-sortdd__menu { position: absolute; right: 0; top: calc(100% + 0.4rem); z-index: 30; min-width: 100%; width: max-content; margin: 0; padding: 0.35rem; list-style: none; background: var(--bg, #f3efe3); border: 1px solid var(--rule, #d6cbb4); border-radius: var(--djk-radius, 6px); box-shadow: 0 18px 40px -18px rgba(23, 20, 15, 0.35); }
.djk-sortdd[open] .djk-sortdd__menu { animation: djk-sortdd-in 0.18s ease-out; }
@keyframes djk-sortdd-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.djk-sortdd__menu li { margin: 0; padding: 0; }
.djk-sortdd__opt { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 0.65rem 0.8rem; border-radius: calc(var(--djk-radius, 6px) - 2px); font-family: var(--sans, 'Archivo', sans-serif); font-size: 0.86rem; color: var(--fg, #17140f); text-decoration: none; white-space: nowrap; }
.djk-sortdd__opt:hover, .djk-sortdd__opt:focus-visible { background: var(--paper-2, #e9e1cf); outline: none; }
.djk-sortdd__opt[aria-current]::after { content: ''; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--accent, #a1522f); flex: none; }
@media (prefers-reduced-motion: reduce) { .djk-sortdd[open] .djk-sortdd__menu { animation: none; } .djk-sortdd__chev { transition: none; } }
@media (max-width: 767px) {
	.djk-sortdd { display: block; margin-top: 0.4rem; }
	.djk-sortdd__btn { display: flex; width: 100%; min-height: 3rem; }
	.djk-sortdd__v { margin-left: auto; font-size: 0.92rem; }
	.djk-sortdd__menu { left: 0; right: 0; width: auto; }
	.djk-sortdd__opt { padding: 0.85rem 0.9rem; font-size: 0.95rem; }
}

/* ---------- productpagina: vaste kolommen ----------
 * .djk-pdp__in is een raster van drie kolommen (maatlat | foto's | tekst). Zonder maat is de maatlat leeg
 * (display: none) en schoven foto's en tekst een kolom op: de galerij belandde in de smalle 'auto'-kolom
 * en klapte in tot een paar pixels. Daarom elk blok vast in zijn eigen kolom. */
@media (min-width: 1024px) {
	.djk-pdp__in > .djk-pdp__scale { grid-column: 1; }
	.djk-pdp__in > .djk-pdp__media { grid-column: 2; }
	.djk-pdp__in > .djk-pdp__side { grid-column: 3; }
}

/* Staande video's (telefoon, 9:16) werden over de volle breedte meer dan twee schermen hoog: maximaal 80% van het scherm. */
.djk-video video { width: auto; max-width: 100%; max-height: 80vh; }

/* hero: kop zwaarder gedrukt. Instrument Serif heeft geen vette snede; een dunne omlijning dikt de letters aan. */
.djk-hero__h { font-weight: 500; -webkit-text-stroke: 0.014em currentColor; paint-order: stroke fill; }
.djk-hero__h .djk-em { -webkit-text-stroke-color: var(--accent, #a1522f); }

/* ---------- voettekst: contactkolom was 2 van 12 kolommen (Breakdance), e-mailadres liep de kolom 'Meer' in op smallere desktops/Safari (2026-10-23) ---------- */
@media (min-width: 1024px) {
  .djk-ftr__mark, .djk-ftr__claim { grid-column: 1 / 4 !important; }
  .djk-ftr__col--a { grid-column: 5 / 8 !important; }
  .djk-ftr__col--b { grid-column: 8 / 11 !important; }
  .djk-ftr__col--c { grid-column: 11 / 13 !important; }
}
.djk-ftr__col, .djk-ftr__text, ul.djk-contact, ul.djk-contact li { min-width: 0; }
ul.djk-contact a { display: flex; max-width: 100%; }
ul.djk-contact a span { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 1023px) { .djk-ftr__text { font-size: 1rem; } }

/* ======================================================================
   1.12.19: PARKEREN + LOOPROUTE (inc/route.php, assets/route-sneek.svg)
   De route tekent zichzelf als de kaart in beeld komt (front.js zet .is-in op .djk-wi); een stipje loopt mee.
   ====================================================================== */
.djk-route-blk { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: var(--sp-4, 3rem); align-items: center; }
.djk-route-blk__h { margin: 0.4rem 0 0.6rem; }
.djk-route-blk__text .djk-p + .djk-p { margin-top: 0.8rem; }
.djk-route-blk__meta { margin-top: 0.8rem; font-size: 0.8rem; letter-spacing: 0.06em; color: var(--fg-3, #7d7362); }
.djk-route-fig { margin: 0; border: 1px solid var(--rule, #d6cbb4); background: var(--paper-2, #e7e0d0); overflow: hidden; }
.djk-route-fig__cap { padding: 0.7rem 1rem; border-top: 1px solid var(--rule, #d6cbb4); font-size: 0.72rem; letter-spacing: 0.08em; color: var(--fg-3, #7d7362); background: var(--paper, #f3efe3); }
.djk-route { display: block; width: 100%; height: auto; }
.djk-route__paper { fill: var(--paper-2, #e7e0d0); }
.djk-route__water polygon { fill: #d9d3c2; stroke: #b9af98; stroke-width: 0.8; }
.djk-route__canal polyline { fill: none; stroke: #d9d3c2; stroke-width: 9; stroke-linecap: round; stroke-linejoin: round; }
.djk-route__st polyline { fill: none; stroke: var(--paper, #f3efe3); stroke-linecap: round; stroke-linejoin: round; }
.djk-route__st--foot polyline { stroke-width: 1.6; stroke: #ece6d6; }
.djk-route__st--ped polyline { stroke-width: 5; }
.djk-route__st--res polyline { stroke-width: 6; }
.djk-route__st--main polyline { stroke-width: 9; }
.djk-route__lbl { font-family: var(--sans); font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; fill: var(--fg-3, #7d7362); }
.djk-route__poi circle { fill: var(--fg-3, #7d7362); }
.djk-route__line { fill: none; stroke: var(--accent, #a1522f); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: djk-route-draw 2.6s cubic-bezier(0.55, 0.06, 0.3, 1) 0.4s forwards; }
.djk-route__walker { fill: var(--fg, #17140f); offset-distance: 0%; offset-rotate: 0deg; opacity: 0; animation: djk-route-walk 2.6s cubic-bezier(0.55, 0.06, 0.3, 1) 0.4s forwards; }
.djk-route__mark circle { fill: var(--paper, #f3efe3); stroke: var(--fg, #17140f); stroke-width: 1.4; }
.djk-route__mark text { font-family: var(--sans); font-size: 18px; font-weight: 600; fill: var(--fg, #17140f); }
.djk-route__mark--shop circle { fill: var(--accent, #a1522f); stroke: var(--accent, #a1522f); }
.djk-route__mark--shop text { fill: #fff; font-size: 12px; }
.djk-route__cap { font-family: var(--mono); font-size: 15px; fill: var(--fg, #17140f); }
.djk-route__cap--sub { font-size: 12.5px; fill: var(--fg-3, #7d7362); }
.djk-route__cap--shop { fill: var(--accent, #a1522f); }
/* wachten tot de kaart in beeld is; de scrub-regel voor .djk-wi slaat deze kaart over (.djk-noscrub) */
html.djk-js .djk-route:not(.is-in) .djk-route__line, html.djk-js .djk-route:not(.is-in) .djk-route__walker { animation-play-state: paused; }
@keyframes djk-route-draw { to { stroke-dashoffset: 0; } }
@keyframes djk-route-walk { 0% { offset-distance: 0%; opacity: 0; } 6% { opacity: 1; } 90% { opacity: 1; } 100% { offset-distance: 100%; opacity: 0; } }
@media (max-width: 1023px) { .djk-route-blk { grid-template-columns: minmax(0, 1fr); gap: var(--sp-3, 2rem); } }
@media (prefers-reduced-motion: reduce) { .djk-route__line { stroke-dashoffset: 0; animation: none; } .djk-route__walker { display: none; } }

/* ======================================================================
   1.12.24: BEZOEK-PAGINA OPNIEUW INGEDEELD (klantfeedback 29-10, tweede ronde)
   - kaart: Breakdance' .djk-wi (4,6 rem, houticonen) laadt na front.css en maakte de kaart 74 px breed
   - hero = twee kolommen: links kop + inleiding + etalagefoto (vult de resthoogte, sluit af op de onderkant
     van het adrespaneel), rechts het adrespaneel; element 139 (foto) staat in container 103 (.djk-bz__copy)
   - parkeren: tekst bovenaan uitgelijnd met een 3:2-kaart, knoppen onder de kaart
   - praktisch: twee kolommen (het losse Parkeren-blok is weg)
   ====================================================================== */
svg.djk-route.djk-wi { width: 100%; height: auto; margin: 0; color: inherit; }
.djk-route-blk { align-items: start; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); }
.djk-route-blk__text .djk-route-blk__h { margin: var(--sp-1, .6rem) 0 var(--sp-2, 1.2rem); }
.djk-route-fig svg.djk-route { aspect-ratio: 800 / 533; }
.djk-route-blk__actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: var(--sp-2, 1.2rem); }
.djk-bz .djk-bz__in { grid-template-columns: 1.1fr 0.9fr; align-items: stretch; }
.djk-bz .djk-bz__in .djk-bz__copy { display: flex; flex-direction: column; min-width: 0; }
/* de foto zit in een Breakdance-shortcode-wrapper; die wrapper vult de resthoogte van de copy-kolom.
   img met height:0 + min-height:100% (height:100% rekte live uit tot 1500 px, percentage-lus) */
.djk-bz .djk-bz__in .djk-bz__copy > .bde-shortcode { flex: 1 1 auto; min-height: 0; display: grid; margin-top: var(--sp-3, 2rem); }
.djk-bz .djk-bz__in .djk-bz__copy .djk-photo--bezoek { margin: 0; max-width: none; height: 100%; grid-template-rows: minmax(0, 1fr) auto; }
.djk-bz .djk-bz__in .djk-bz__copy .djk-photo--bezoek .djk-photo__img { height: 0; min-height: 100%; aspect-ratio: auto; object-fit: cover; object-position: 50% 42%; }
.djk-prac .djk-prac__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4, 3rem); }
.djk-prac .djk-prac__item p { max-width: 46ch; }
@media (max-width: 1023px) {
	.djk-route-blk { grid-template-columns: minmax(0, 1fr); gap: var(--sp-3, 2rem); }
	.djk-bz .djk-bz__in { grid-template-columns: minmax(0, 1fr); align-items: start; }
	.djk-bz .djk-bz__in .djk-bz__copy { display: block; }
	.djk-bz .djk-bz__in .djk-bz__copy > .bde-shortcode { display: block; margin-top: var(--sp-3, 2rem); }
	.djk-bz .djk-bz__in .djk-bz__copy .djk-photo--bezoek { max-width: 30rem; height: auto; }
	.djk-bz .djk-bz__in .djk-bz__copy .djk-photo--bezoek .djk-photo__img { height: auto; min-height: 0; aspect-ratio: 4 / 5; }
	.djk-prac .djk-prac__grid { grid-template-columns: minmax(0, 1fr); gap: var(--sp-3, 2rem); }
}
