/* Bordjeskoning huisstijl
   Koningsblauw #1f3a5f, signaalgeel #f7c600, goud #d99a00, inkt #14213d, creme #faf7f0 */
:root {
  --bk-navy: #1f3a5f; --bk-ink: #14213d; --bk-yellow: #f7c600; --bk-gold: #d99a00;
  --bk-cream: #faf7f0; --bk-light: #eef2f7; --bk-line: #e6e2d9; --bk-grey: #5b6577;
  --bk-radius: 14px; --bk-shadow: 0 1px 2px rgba(20,33,61,.06), 0 8px 24px rgba(20,33,61,.08);
}
@font-face { font-family: "Material Icons"; font-style: normal; font-weight: 400; font-display: block; src: url("fonts/material-icons-latin-400-normal.woff2") format("woff2"); }
.mi { font-family: "Material Icons"; font-weight: normal; font-style: normal; font-size: 1.6em; line-height: 1; display: inline-block; letter-spacing: normal; text-transform: none; white-space: nowrap; direction: ltr; font-feature-settings: "liga"; -webkit-font-smoothing: antialiased; vertical-align: middle; }

html, body { overflow-x: hidden; }
body { -webkit-font-smoothing: antialiased; }

/* Header */
.bk-topbar { background: var(--bk-ink); color: #fff; font-size: .85rem; text-align: center; padding: .5rem 1rem; letter-spacing: .01em; }
.bk-topbar p { margin: 0; }
.bk-topbar strong { color: var(--bk-yellow); }
header.wp-block-template-part { position: sticky; top: 0; z-index: 50; background: #fff; box-shadow: 0 1px 0 var(--bk-line); }
.wp-block-site-logo img { height: auto; width: 200px !important; max-width: 46vw; }
header .wp-block-navigation { font-weight: 600; font-size: .92rem; gap: .2rem .95rem; }
header .wp-block-navigation__container { flex-wrap: nowrap; }
header .wp-block-navigation a:hover { color: var(--bk-gold); }
.wp-block-search__button { background: transparent !important; color: var(--bk-navy) !important; border: 0 !important; padding: 6px !important; }
.wp-block-search__button svg { width: 26px; height: 26px; fill: currentColor; }
.wc-block-mini-cart__badge { background: var(--bk-yellow) !important; color: var(--bk-ink) !important; font-weight: 800; }

/* Knoppen */
.bk-btn-primary .wp-block-button__link, .single_add_to_cart_button, .checkout-button, .wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button {
  background: var(--bk-yellow) !important; color: var(--bk-ink) !important; font-weight: 800 !important; border-radius: 10px !important; border: 0 !important;
  box-shadow: 0 2px 0 rgba(0,0,0,.12); transition: transform .12s ease, filter .12s ease;
}
.bk-btn-primary .wp-block-button__link:hover, .single_add_to_cart_button:hover { filter: brightness(.96); transform: translateY(-1px); }
.bk-btn-ghost .wp-block-button__link { background: transparent !important; color: #fff !important; border: 2px solid rgba(255,255,255,.7) !important; }

/* Hero */
.bk-hero { background: radial-gradient(1200px 500px at 85% 20%, #2b4d7a 0%, var(--bk-navy) 55%, var(--bk-ink) 100%); border-radius: 22px; overflow: hidden; padding: clamp(1.75rem, 4.5vw, 3.5rem) clamp(1.25rem, 4.5vw, 3.5rem); color: #fff; }
.bk-hero .bk-hero-title { color: #fff; font-size: clamp(2.1rem, 5vw, 3.6rem); line-height: 1.05; max-width: 15ch; margin-bottom: .6rem; }
.bk-hero .bk-hero-title em { font-style: normal; color: var(--bk-yellow); }
.bk-hero p { color: #dfe7f1; max-width: 52ch; font-size: 1.12rem; }
.bk-hero-img img { border-radius: 16px; box-shadow: 0 20px 50px rgba(0,0,0,.35); }
.bk-hero-trust { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; margin-top: 1.4rem !important; font-size: .95rem; color: #dfe7f1 !important; }
.bk-hero-trust span { display: inline-flex; align-items: center; gap: .35rem; }
.bk-hero-trust .mi { color: var(--bk-yellow); font-size: 1.3em; }

/* USP-blokken */
.bk-usps { margin-top: 1.75rem; gap: 1rem; }
.bk-usps .wp-block-column { background: var(--bk-cream); border: 1px solid var(--bk-line); border-radius: var(--bk-radius); padding: 1.15rem 1.25rem; }
.bk-usps .mi { color: var(--bk-navy); background: var(--bk-yellow); border-radius: 12px; padding: .45rem; font-size: 1.5rem; margin-bottom: .5rem; }
.bk-usps h3 { font-size: 1.02rem; margin: 0 0 .2rem; }
.bk-usps p { margin: 0; font-size: .92rem; color: var(--bk-grey); line-height: 1.45; }

/* Secties */
.bk-section { margin-top: clamp(2.5rem, 6vw, 4.5rem) !important; }
.bk-kicker { text-transform: uppercase; letter-spacing: .12em; font-weight: 800; font-size: .78rem; color: var(--bk-gold); margin: 0 0 .3rem !important; }
.bk-band { background: var(--bk-cream); border-radius: 22px; padding: clamp(1.5rem, 4vw, 3rem) !important; }
.bk-card { background: #fff; border: 1px solid var(--bk-line); border-radius: var(--bk-radius); padding: 1.4rem !important; box-shadow: var(--bk-shadow); }
.bk-card h3 { margin: .6rem 0 .4rem; font-size: 1.15rem; }
.bk-card p { margin: 0 0 .6rem; color: var(--bk-grey); font-size: .97rem; }
.bk-card .mi { color: var(--bk-navy); font-size: 2rem; }
.bk-card figure img { border-radius: 10px; aspect-ratio: 4/3; object-fit: cover; width: 100%; }
.bk-steps .bk-card .mi { background: var(--bk-yellow); border-radius: 50%; padding: .5rem; font-size: 1.6rem; }
.bk-compare table { border-collapse: collapse; width: 100%; background: #fff; border-radius: 12px; overflow: hidden; font-size: .97rem; }
.bk-compare td, .bk-compare th { padding: .75rem .95rem; border-bottom: 1px solid var(--bk-line); text-align: left; }
.bk-compare thead th { background: var(--bk-navy); color: #fff; }

/* Productlijsten: grid i.p.v. floats */
.woocommerce ul.products { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; margin: 0 0 2rem !important; }
.woocommerce ul.products.columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none !important; }
.woocommerce ul.products li.product { width: auto !important; margin: 0 !important; float: none !important; }
@media (max-width: 1000px) { .woocommerce ul.products, .woocommerce ul.products.columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .woocommerce ul.products, .woocommerce ul.products.columns-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; } }
.woocommerce ul.products li.product { background: #fff; border: 1px solid var(--bk-line); border-radius: var(--bk-radius); padding: .75rem .75rem 1rem !important; transition: box-shadow .15s ease, transform .15s ease; display: flex; flex-direction: column; }
.woocommerce ul.products li.product:hover { box-shadow: var(--bk-shadow); transform: translateY(-2px); }
.woocommerce ul.products li.product a img { border-radius: 10px; margin-bottom: .8rem !important; background: var(--bk-cream); }
.woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product h2 { font-size: 1rem !important; font-weight: 700; line-height: 1.3; min-height: 2.6em; }
.woocommerce ul.products li.product .price { color: var(--bk-ink) !important; font-weight: 800; font-size: 1rem; }
.woocommerce ul.products li.product .button { margin-top: auto !important; background: var(--bk-navy) !important; color: #fff !important; border-radius: 10px !important; font-weight: 700; text-align: center; }
.woocommerce ul.products li.product .button:hover { background: var(--bk-ink) !important; }
.woocommerce ul.products li.product-category { padding: 0 !important; overflow: hidden; }
.woocommerce ul.products li.product-category a img { margin: 0 !important; border-radius: 0; aspect-ratio: 1; object-fit: cover; }
.woocommerce ul.products li.product-category h2 { padding: .9rem 1rem; margin: 0 !important; min-height: 0; font-size: 1.05rem !important; }
.woocommerce ul.products li.product-category mark.count { background: var(--bk-yellow); color: var(--bk-ink); border-radius: 999px; padding: .05rem .5rem; font-size: .8rem; }
.woocommerce-result-count, .woocommerce-ordering select { font-size: .92rem; color: var(--bk-grey); }
.woocommerce-ordering select { border: 1px solid var(--bk-line); border-radius: 8px; padding: .4rem .6rem; }

/* Categoriepagina */
.term-description { color: var(--bk-grey); font-size: 1.05rem; max-width: 70ch; }
.bk-cat-seo { max-width: 860px; margin: 3.5rem auto 1rem; padding: 2.25rem; background: var(--bk-cream); border: 1px solid var(--bk-line); border-radius: 22px; }
.bk-cat-seo h2 { font-size: 1.6rem; margin-top: 0; }
.bk-cat-seo h3 { font-size: 1.2rem; margin-top: 1.5rem; }

/* Productpagina */
.woocommerce div.product .product_title { font-family: var(--wp--preset--font-family--display); font-weight: 400; font-size: clamp(1.7rem, 3.5vw, 2.4rem); line-height: 1.1; }
.woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--bk-ink); font-weight: 800; }
.woocommerce div.product .woocommerce-product-gallery { overflow: hidden; max-width: 100%; }
.woocommerce div.product .woocommerce-product-gallery__image img { border-radius: 16px; }
.woocommerce div.product .flex-control-thumbs li img { border-radius: 8px; border: 2px solid transparent; }
.woocommerce div.product .flex-control-thumbs li img.flex-active { border-color: var(--bk-yellow); }
table.variations { margin-bottom: 1rem !important; }
table.variations th.label { padding-right: 1rem; font-weight: 700; }
table.variations select { max-width: 100%; width: 100%; padding: .7rem .8rem; border: 2px solid var(--bk-line); border-radius: 10px; font-size: 1rem; font-weight: 600; background-color: #fff; }
table.variations select:focus { border-color: var(--bk-navy); outline: none; }
.woocommerce div.product form.cart .quantity input { border: 2px solid var(--bk-line); border-radius: 10px; padding: .6rem; width: 4.5rem; }
.woocommerce div.product form.cart .single_add_to_cart_button { padding: .85rem 1.6rem !important; font-size: 1.05rem !important; }
.woocommerce-variation-price .price { font-size: 1.6rem !important; }
.bk-trust { list-style: none; padding: 1rem 1.1rem; margin: 1.1rem 0 0; font-size: .95rem; background: var(--bk-light); border-radius: 12px; }
.bk-trust li { padding-left: 1.7rem; position: relative; margin: .3rem 0; }
.bk-trust li::before { content: "check_circle"; font-family: "Material Icons"; position: absolute; left: 0; top: -1px; color: #1a8f4c; font-size: 1.2rem; font-feature-settings: "liga"; }
.bk-mount { margin-top: 1rem; padding: 1rem 1.1rem; border: 1px dashed #c9c2b4; border-radius: 12px; font-size: .95rem; }
.bk-mount strong { display: block; margin-bottom: .2rem; }
.bk-mount a { font-weight: 700; }
.upsells.products > h2, .related.products > h2, .cross-sells > h2 { font-size: 1.5rem; }

/* Footer */
.bk-footer { margin-top: 4rem !important; }
.bk-footer a { text-decoration: none; opacity: .9; }
.bk-footer a:hover { opacity: 1; color: var(--bk-yellow) !important; }
.bk-footer ul { list-style: none; padding-left: 0; line-height: 2; }
.bk-footer-logo img { display: block; margin-bottom: .75rem; }
.bk-pay { list-style: none; display: flex; gap: .45rem; flex-wrap: wrap; justify-content: center; margin: 1rem 0 .5rem; padding: 0; }
.bk-pay li { background: #fff; border-radius: 6px; padding: 3px 6px; display: flex; align-items: center; height: 30px; border: 1px solid var(--bk-line); }
.bk-pay img { height: 22px; width: auto; display: block; }
.bk-trust + .bk-pay { justify-content: flex-start; }

/* FAQ */
.wp-block-details { border: 1px solid var(--bk-line); border-radius: 12px; padding: .9rem 1.1rem; margin: .6rem 0 !important; background: #fff; }
.wp-block-details summary { font-weight: 700; cursor: pointer; list-style: none; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "expand_more"; font-family: "Material Icons"; float: right; color: var(--bk-navy); font-feature-settings: "liga"; }
.wp-block-details[open] summary::after { content: "expand_less"; }

/* Mobiel */
@media (max-width: 1100px) { header .wp-block-navigation { font-size: .9rem; } }
@media (max-width: 600px) {
  .wp-block-site-logo img { width: 140px !important; }
  header .wp-block-group.is-content-justification-right { gap: .35rem !important; }
  header .wp-block-woocommerce-customer-account { display: none; }
  table.variations th, table.variations td { display: block; width: 100%; padding: .25rem 0; }
  .bk-topbar { font-size: .78rem; }
  .bk-hero { border-radius: 16px; }
  .woocommerce ul.products li.product .button { font-size: .85rem; padding: .55rem .5rem; }
  .woocommerce ul.products li.product-category h2 { font-size: .9rem !important; padding: .7rem .75rem; overflow-wrap: anywhere; hyphens: auto; }
  .bk-hero p { font-size: 1rem; }
}

/* Mobiel menu (overlay) */
.wp-block-navigation__responsive-container.is-menu-open { background: var(--bk-navy) !important; color: #fff !important; padding: 1.25rem 1.5rem 2rem !important; opacity: 1 !important; animation: none !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog, .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { width: 100%; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container, .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { align-items: flex-start !important; justify-content: flex-start !important; text-align: left !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 3.5rem; align-items: flex-start !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 0 !important; width: 100%; flex-wrap: wrap !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid rgba(255,255,255,.14); }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { display: block; padding: .95rem 0 !important; font-size: 1.15rem; font-weight: 700; color: #fff !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover { color: var(--bk-yellow) !important; }
.wp-block-navigation__responsive-container-close { color: #fff; top: 1.1rem !important; right: 1.1rem !important; }
.wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg { width: 30px; height: 30px; }
.wp-block-navigation__responsive-container-open { color: var(--bk-ink); padding: 4px; }

/* Leesbaarheid op mobiel */
@media (max-width: 781px) {
  body { font-size: 1rem; line-height: 1.7; }
  .has-global-padding { padding-left: 1.1rem !important; padding-right: 1.1rem !important; }
  main h1, .wp-block-post-title { font-size: 1.85rem !important; line-height: 1.15; }
  main h2 { font-size: 1.45rem !important; }
  main h3 { font-size: 1.12rem !important; }
  main p, main li { font-size: 1rem; }
  .bk-band, .bk-cat-seo { padding: 1.25rem !important; border-radius: 16px; }
  .bk-usps .wp-block-column { padding: 1rem; }
  .bk-compare { overflow-x: auto; }
  .bk-compare table { min-width: 560px; font-size: .9rem; }
  .woocommerce div.product .product_title { font-size: 1.7rem; }
  .woocommerce div.product form.cart { display: flex; flex-wrap: wrap; gap: .6rem; }
  .woocommerce div.product form.cart .single_add_to_cart_button { flex: 1; }
  .woocommerce-tabs ul.tabs { display: flex; overflow-x: auto; white-space: nowrap; }
  .wp-block-woocommerce-checkout, .wp-block-woocommerce-cart { font-size: 1rem; }
  .bk-footer .wp-block-columns { gap: 1.25rem; }
}

/* Bordje aanpassen */
.bk-custom { margin: 0 0 1rem; border: 2px solid var(--bk-yellow); border-radius: 14px; background: #fffdf3; }
.bk-custom summary { cursor: pointer; padding: .85rem 1rem; font-weight: 800; list-style: none; display: flex; align-items: center; gap: .5rem; }
.bk-custom summary::-webkit-details-marker { display: none; }
.bk-custom summary small { font-weight: 600; color: #1a8f4c; }
.bk-custom summary .mi { font-size: 1.3rem; color: var(--bk-navy); }
.bk-custom-body { padding: 0 1rem 1rem; }
.bk-custom-label { font-weight: 700; margin: .6rem 0 .35rem; font-size: .95rem; }
.bk-custom input[type=text] { width: 100%; padding: .6rem .75rem; border: 2px solid var(--bk-line); border-radius: 10px; margin-bottom: .4rem; font-size: 1rem; font-weight: 600; }
.bk-custom input[type=text]:focus { border-color: var(--bk-navy); outline: none; }
.bk-swatches { display: flex; flex-wrap: wrap; gap: .4rem; }
.bk-swatch { width: 42px; height: 42px; border-radius: 10px; border: 2px solid var(--bk-line); font-weight: 800; cursor: pointer; }
.bk-swatch.is-active { outline: 3px solid var(--bk-navy); outline-offset: 2px; }
.bk-pickers { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: .6rem; font-size: .92rem; }
.bk-pickers label { display: flex; align-items: center; gap: .5rem; }
.bk-pickers input[type=color] { width: 44px; height: 34px; border: 1px solid var(--bk-line); border-radius: 8px; padding: 2px; background: #fff; }
.bk-contrast { color: #b3261e; font-weight: 700; font-size: .9rem; }
.bk-note, .bk-preview-status { font-size: .85rem; color: var(--bk-grey); margin: .5rem 0 0; }
.bk-part-of { font-size: .85rem; opacity: .85; }
.bk-part-of a { text-decoration: underline !important; }
