/* ============================================================
   Hemkes / Hermes Maritime — huisstijl (v2), restyle over Classic.
   Bron: design-HTML "Hermes (7)" (productpagina-header als basis).
   Doel: tokens + componenten doorvoeren zonder de dynamische
   Classic-structuur (zoek, winkelwagen, menu) te breken.
   ============================================================ */

:root{
  --navy:#0E2742; --navy-2:#16395e; --navy-deep:#0e2742;
  --orange:#E8541E; --accent:#E8541E; --orange-deep:#cf4715; --tint-orange:#FFF7F3;
  --blue:#0E2742;             /* productpagina-blauw: gelijkgetrokken met navy voor één consistente donkerblauwe tint */
  --green:#1F8A5B;            /* uitsluitend voor de voorraad-indicator */
  --ink:#1c2b3a; --gray:#5a6b7b; --gray-2:#7a8a9a;
  --line:#e6ebf0; --line-2:#eef2f6; --tint:#F5F7FA; --tint-2:#f7f8fa;
}

/* ---------- Basis / typografie ---------- */
body{font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:var(--ink);}
/* Geen lelijk focus-kader bij muisklik; wél een nette focus-ring bij toetsenbordnavigatie (toegankelijk). */
a:focus,a:active,button:focus,button:active,[role="button"]:focus,.btn:focus,.btn:active,.hm-cta:focus,.hm-cta:active,.hm-cta:hover,summary:focus,input:focus,select:focus,textarea:focus{outline:none!important;box-shadow:none!important;}
a:focus-visible,button:focus-visible,[role="button"]:focus-visible,.btn:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px;}
h1,h2,h3,h4,h5,.h1,.h2,.h3,.h4{font-family:'Inter',system-ui,sans-serif;color:var(--ink);font-weight:700;letter-spacing:-.2px;}
a{color:var(--navy);}
a:hover{color:var(--navy-deep);}
/* ===== Site-breed: Classic cyaan-accent (#24b9d7) vervangen door huisstijl =====
   oranje voor hover-tekst, navy voor actieve/gevulde staten, oranje focus-ring.
   Topbalk + footer behouden hun witte tekst (hogere specificiteit/aparte regels). */
/* alle header-link-hovers -> oranje (vangt #header a:hover cyaan af), behalve de witte topbalk */
#header a:hover:not(.hm-cta):not(.hm-mega__cardbtn):not(.btn),#header .top-menu a[data-depth="0"]:hover,.top-menu .sub-menu a:hover,
.dropdown-item:hover,.dropdown-item:focus,.dropdown:hover .expand-more,
#subcategories ul li .subcategory-name:hover,.cart-grid-body a.label:hover,
.page-my-account #content .links a:hover i,.product-miniature .highlighted-informations .quick-view:hover,
.carousel .carousel-control .icon-next:hover i,.carousel .carousel-control .icon-prev:hover i,
.search-widget form button[type=submit] .search:hover{color:var(--orange)!important;}
/* topbalk-links blijven wit bij hover (hogere specificiteit dan #header a:hover) */
#header .hm-util-right a:hover,#header .hm-util a:hover{color:#fff!important;}
.dropdown-item.active,.dropdown-item.active:hover,.dropdown-item.active:focus,
.page-item.active .page-link,.page-item.active .page-link:hover,.list-group-item.active,
.brands-sort .select-list:hover,.products-sort-order .select-list:hover,.suppliers-sort .select-list:hover,
.facet-dropdown .select-list:hover,.bg-primary,.tag-primary,.card-primary{background-color:var(--navy)!important;border-color:var(--navy)!important;color:#fff!important;}
.btn-link,.text-primary,.pagination .current a,.page-link,.product-price,.product-price.h5{color:var(--navy)!important;}
.form-control:focus,.input-group.focus,.search-widget form input[type=text]:focus{outline-color:var(--orange)!important;}
.tabs .nav-tabs .nav-link.active,.tabs .nav-tabs .nav-link:hover{border-bottom-color:var(--orange)!important;}
.tabs .nav-tabs .nav-link.active{color:var(--navy)!important;}
#product-modal .product-images img:hover,#subcategories ul li:hover .subcategory-image a{border-color:var(--navy)!important;}
.page-header h1,.h1.page-title{color:var(--ink);}

/* ---------- Knoppen ---------- */
.btn-primary{background-color:var(--navy)!important;border-color:var(--navy)!important;color:#fff!important;border-radius:4px!important;font-weight:600;}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active{background-color:var(--navy-deep)!important;border-color:var(--navy-deep)!important;}
.btn-secondary,.btn-tertiary{background-color:#fff!important;border:1.5px solid #c5cfdb!important;color:var(--navy)!important;border-radius:4px!important;font-weight:600;}
.btn-secondary:hover{background-color:#f6f8fb!important;}
.btn-add-to-cart,.add-to-cart{background-color:var(--orange)!important;border-color:var(--orange)!important;color:#fff!important;border-radius:4px!important;font-weight:600;}
.btn-add-to-cart:hover,.add-to-cart:hover{background-color:var(--orange-deep)!important;border-color:var(--orange-deep)!important;}

/* ---------- Prijzen / voorraad ---------- */
.product-price,.current-price span,.current-price .price,.product-prices .current-price,
.h3.product-price,.product-miniature .price{color:var(--ink)!important;font-weight:700;}
.product-availability .product-available,.in-stock,.product-unavailable.in-stock{color:var(--green)!important;}

/* ---------- Formulieren ---------- */
.form-control,input[type=text],input[type=email],input[type=password],input[type=search],select,textarea{
  border:1px solid #d8dee6;border-radius:4px;color:var(--ink);}
.form-control:focus{border-color:var(--navy);box-shadow:0 0 0 2px rgba(21,41,76,.12);}

/* ============================================================
   HEADER (child-thema header.tpl: .hm-top witte rij + .hm-nav navy)
   ============================================================ */
#header{background:#fff;color:var(--ink);border-top:none;box-shadow:0 1px 0 var(--line-2);}

/* ---- Hoofd-rij: logo links · zoek ernaast · acties rechts ---- */
.hm-top{background:#fff;border-bottom:1px solid var(--line-2);}
/* Header-container mirrort de Bootstrap .container van de hoofdinhoud (zelfde
   responsive max-widths + 15px padding) zodat het logo links exact uitlijnt
   met de pagina-content (kaarten/koppen) op elke schermbreedte. */
.hm-top-inner{max-width:1140px;margin:0 auto;padding:16px 15px;display:flex;align-items:center;gap:30px;}
@media (max-width:1199.98px){.hm-top-inner{max-width:960px;}}
@media (max-width:991.98px){.hm-top-inner{max-width:720px;}}
@media (max-width:767.98px){.hm-top-inner{max-width:540px;}}
.hm-logo{flex-shrink:0;display:flex;align-items:center;}
.hm-logo img{max-height:70px;width:auto;}
.hm-search input[type=text]::placeholder{color:#9aa6b2;}

/* ---- Acties rechts (taal + account + winkelwagen) ---- */
.hm-actions{margin-left:0;display:flex;align-items:center;gap:28px;flex-shrink:0;}
.hm-user{display:flex;align-items:center;gap:28px;}
/* account + winkelwagen als icoon-boven-label */
#_desktop_user_info .user-info a,#_desktop_cart .blockcart .header,#_desktop_cart .blockcart{
  display:flex;flex-direction:column;align-items:center;gap:3px;color:#33414f;font-size:12.5px;text-align:center;line-height:1.1;}
#_desktop_user_info .material-icons,#_desktop_cart .material-icons{color:#3a4a5a;font-size:24px;}
#_desktop_user_info .hidden-sm-down,#_desktop_cart .hidden-sm-down{display:block!important;}
/* Winkelwagen-aantal als badge op het icoon. Anders valt '(0)' op een 3e regel
   en staan Inloggen + Winkelwagen niet meer op één lijn. */
#_desktop_cart .blockcart{position:relative;}
#_desktop_cart .blockcart .cart-products-count{
  position:absolute;top:-5px;left:calc(50% + 3px);
  background:var(--navy);color:#fff;font-weight:700;font-size:10px;line-height:1;
  padding:2px 5px;border-radius:4px;min-width:16px;text-align:center;}
.hemkes-ds__item--current{color:var(--navy)!important;}

/* ---- Navy navigatiebalk (full-width, items links uitgelijnd) ---- */
.hm-nav{background:var(--navy);}
.hm-nav-inner{max-width:1140px;margin:0 auto;padding:0 15px;}
@media (max-width:1199.98px){.hm-nav-inner{max-width:960px;}}
@media (max-width:991.98px){.hm-nav-inner{max-width:720px;}}
@media (max-width:767.98px){.hm-nav-inner{max-width:540px;}}
.hm-nav #_desktop_top_menu{background:transparent;box-shadow:none;clip-path:none;margin:0;}
.hm-nav .top-menu{margin:0;display:flex;flex-wrap:wrap;justify-content:flex-start;}
.hm-nav .top-menu > li{border:none;}
.hm-nav .top-menu > li > a.dropdown-item,
.hm-nav .top-menu > li > a{color:#fff!important;text-transform:uppercase;font-size:12.5px;font-weight:600;letter-spacing:.5px;padding:15px 14px;background:transparent;}
.hm-nav .top-menu > li:first-child > a{padding-left:0;}
.hm-nav .top-menu > li > a:hover{background:var(--navy-2);color:#fff!important;text-decoration:none;}
.hm-nav .top-menu .sub-menu{background:#fff;border:1px solid var(--line);box-shadow:0 8px 24px rgba(0,0,0,.10);}
.hm-nav .top-menu .sub-menu a{color:var(--ink)!important;text-transform:none;font-weight:500;}
.hm-nav .top-menu .sub-menu a:hover{color:var(--navy)!important;background:var(--tint);}
/* mobiele iconen */
#_mobile_user_info .material-icons,#_mobile_cart .material-icons,#menu-icon .material-icons{color:var(--navy);}

/* ============================================================
   HEADER v3 — design-handoff 2026-06-26 (utility-balk + witte topbar).
   Overschrijft de oude .hm-top/.hm-nav-styling hierboven (latere regels winnen).
   ============================================================ */
/* (1) donkere utility-balk */
.hm-util{background:#0e2742;color:#fff;font-size:12.5px;letter-spacing:.2px;}
.hm-util-inner{max-width:1200px;margin:0 auto;padding:11px 24px;display:flex;align-items:center;gap:26px;flex-wrap:wrap;}
.hm-util .hm-ub{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;color:#fff;}
.hm-util .hm-ub svg{width:15px;height:15px;flex:none;}
.hm-util-right{margin-left:auto;display:inline-flex;align-items:center;gap:18px;}
/* color !important: Classic's "#header a{color:#232323}" + ":hover{#24b9d7}"
   (ID-selectoren) wonnen anders en maakten tel/mail donkergrijs resp. cyaan. */
.hm-util-right a{color:#fff!important;text-decoration:none;display:inline-flex;align-items:center;gap:6px;}
.hm-util-right a:hover{color:#fff!important;text-decoration:underline;}
.hm-util-right a svg{width:13px;height:13px;flex:none;}

/* (2) witte topbar — design: logo | nav(center) | CTA | zoek + winkelwagen */
.hm-top{position:relative;border-bottom:1px solid #e6ebf0;box-shadow:none;background:#fff;}
.hm-top-inner{max-width:1200px;margin:0 auto;gap:30px;padding:26px 24px;display:flex;align-items:center;}
.hm-logo{flex-shrink:0;display:flex;align-items:center;}
.hm-logo img{height:46px;width:auto;max-height:46px;}
.hm-mainnav{flex:1 1 auto;display:flex;align-items:center;justify-content:center;gap:24px;font-size:13px;min-width:0;}
.hm-nav-link{display:inline-flex;align-items:center;gap:5px;background:none;border:none;color:var(--navy);font-size:13px;font-weight:500;padding:4px 0;text-decoration:none;white-space:nowrap;cursor:pointer;}
.hm-nav-link:hover{color:var(--orange);}
.hm-nav-link--assort{color:var(--orange);border-bottom:2px solid var(--orange);}
.hm-assort__chev{width:11px;height:11px;}
/* --- mega menu (3 koloms, full-width onder de balk) --- */
.hm-assort{position:static;}
.hm-mega{position:absolute;left:0;right:0;top:100%;z-index:60;display:flex;justify-content:center;padding:0 24px;opacity:0;visibility:hidden;transition:opacity .16s ease;}
.hm-assort:hover .hm-mega{opacity:1;visibility:visible;}
.hm-mega::before{content:"";position:absolute;left:0;right:0;top:-44px;height:44px;} /* hover-brug */
.hm-mega__inner{background:#fff;border:1px solid #e6ebf0;border-top:none;border-radius:0 0 4px 4px;box-shadow:0 26px 50px rgba(8,24,44,.18);width:100%;max-width:1120px;display:grid;grid-template-columns:30% 40% 30%;}
.hm-mega__h{font-size:12px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--navy);margin-bottom:4px;}
.hm-mega__cats{padding:14px 18px 12px;border-right:1px solid #f0f3f7;}
.hm-megacat{display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:4px;color:var(--navy);text-decoration:none;border-bottom:1px solid #f1f4f8;transition:background .16s,color .16s;}
.hm-megacat:hover{background:#FFF5F0;color:var(--orange);}
.hm-megacat__ic{display:flex;align-items:center;justify-content:center;color:var(--navy);flex-shrink:0;transition:color .16s;}
.hm-megacat__ic svg{width:17px;height:17px;}
.hm-megacat:hover .hm-megacat__ic{color:var(--orange);}
.hm-megacat__l{flex:1;font-size:14px;font-weight:500;}
.hm-megacat__chev{width:11px;height:11px;transition:transform .16s,stroke .16s;}
.hm-megacat:hover .hm-megacat__chev{transform:translateX(3px);stroke:var(--orange);}
.hm-mega__all{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:4px 10px;color:var(--orange);font-size:14px;font-weight:600;text-decoration:none;}
.hm-mega__all:hover{color:var(--orange-deep);}
.hm-mega__pop{padding:14px 18px;border-right:1px solid #f0f3f7;display:flex;flex-direction:column;}
.hm-megapop{flex:1;display:flex;align-items:center;gap:16px;padding:6px 8px;border-bottom:1px solid #f0f3f7;border-radius:4px;text-decoration:none;}
.hm-megapop:last-child{border-bottom:none;}
.hm-megapop:hover{background:#FFF7F3;}
.hm-megapop img{width:58px;height:58px;object-fit:contain;flex-shrink:0;}
.hm-megapop__txt{flex:1;min-width:0;}
.hm-megapop__t{display:block;font-size:15px;font-weight:700;color:var(--navy);margin-bottom:2px;}
.hm-megapop__d{display:block;font-size:12px;color:#98a6b5;line-height:1.4;}
.hm-megapop__chev{width:11px;height:11px;flex-shrink:0;}
.hm-mega__cta{padding:10px;}
.hm-mega__card{background:var(--tint);border:1px solid var(--line-2);border-radius:4px;padding:14px 16px;height:100%;display:flex;flex-direction:column;}
.hm-mega__cardic{width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--navy);margin-bottom:8px;}
.hm-mega__cardic svg{width:19px;height:19px;}
.hm-mega__cardt{font-size:14px;font-weight:700;color:var(--navy);margin-bottom:3px;}
.hm-mega__cardd{font-size:12px;color:var(--gray-2);line-height:1.45;margin-bottom:10px;}
/* color !important: Classic's "#header a" (ID) maakte de knoptekst anders donker/cyaan op navy. */
.hm-mega__cardbtn{align-self:flex-start;background:var(--navy);color:#fff!important;border-radius:4px;font-size:14px;font-weight:600;padding:10px 14px;text-decoration:none;}
.hm-mega__cardbtn:hover,.hm-mega__cardbtn:focus{background:var(--navy-2);color:#fff!important;}
.hm-mega__cardusps{margin-top:auto;padding-top:10px;display:flex;flex-direction:column;gap:7px;}
.hm-mega__cardusps span{display:inline-flex;align-items:center;gap:9px;font-size:13px;color:#3a4a5a;}
.hm-mega__cardusps svg{width:17px;height:17px;flex:none;}

/* oranje "Advies / offerte"-CTA */
.hm-cta{flex-shrink:0;display:inline-flex;align-items:center;gap:8px;background:var(--orange);color:#fff!important;border-radius:4px;font-weight:600;font-size:13.5px;padding:11px 18px;text-decoration:none;white-space:nowrap;}
/* color !important: Classic's "#header a:hover{color:#24b9d7}" (ID-selector) won
   anders van .hm-cta en kleurde tekst + icoon cyaan-blauw bij hover. */
.hm-cta:hover,.hm-cta:focus,.hm-cta:active{background:var(--orange-deep);color:#fff!important;text-decoration:none;}
.hm-cta svg{width:16px;height:16px;flex:none;}

/* acties rechts: zoek-icoon (klapt uit) + winkelwagen-icoon (geen account/labels, conform ontwerp) */
.hm-actions{margin-left:auto;display:flex;align-items:center;gap:14px;flex-shrink:0;}
.hm-search{position:relative;display:flex;align-items:center;}
.hm-search button{background:none;border:none;cursor:pointer;color:var(--navy);display:flex;padding:4px;}
.hm-search button svg{width:20px;height:20px;}
/* zoekveld INLINE (geen absolute) -> klapt uit binnen de actie-groep en kort de nav in
   i.p.v. over de "Advies/offerte"-knop te schuiven */
.hm-search input{width:0;min-width:0;opacity:0;height:38px;padding:0;margin:0;border:1.5px solid transparent;border-radius:4px;background:#fff;font:13.5px Inter,sans-serif;color:var(--ink);box-shadow:none;transition:width .2s ease,opacity .15s,padding .2s,margin .2s,border-color .2s;}
.hm-search:hover input,.hm-search:focus-within input{width:190px;opacity:1;padding:0 12px;margin-right:6px;border-color:#d6dee6;box-shadow:0 4px 14px rgba(14,39,66,.12);}

/* ---------- Predictive search (ps_searchbar autocomplete-dropdown) ---------- */
/* Neutraliseer ps_searchbar.css' basisregels op #search_widget (float/overflow/
   min-width) die anders de header-flexlayout en het uitklap-zoekveld breken. */
#search_widget.hm-search{min-width:0;margin:0;overflow:visible;float:none;}
/* Dropdown wordt door jQuery-UI aan <body> gehangen, dus buiten #header: geen
   last van Classic's #header a-kleuren. min-width verslaat de smalle inline-width. */
.ui-autocomplete.searchbar-autocomplete{min-width:340px;max-width:92vw;background:#fff;list-style:none;margin:6px 0 0;padding:6px 0;border:1px solid var(--line);border-radius:6px;box-shadow:0 18px 40px rgba(14,39,66,.18);z-index:9999;overflow:hidden;}
.ui-autocomplete.searchbar-autocomplete li{margin:0;}
.ui-autocomplete.searchbar-autocomplete li a{display:flex;align-items:center;gap:12px;padding:9px 14px;margin:0;border:none;border-radius:0;background:none;color:var(--ink);font:500 13.5px Inter,sans-serif;line-height:1.3;cursor:pointer;text-decoration:none;}
.ui-autocomplete.searchbar-autocomplete li a:hover,.ui-autocomplete.searchbar-autocomplete li a.ui-state-focus{background:var(--tint-orange);color:var(--orange-deep);}
.ui-autocomplete.searchbar-autocomplete .autocomplete-thumbnail{float:none;width:44px;height:44px;object-fit:contain;flex:none;border:1px solid var(--line-2);border-radius:4px;background:#fff;margin:0;}
.ui-autocomplete.searchbar-autocomplete .product{font-weight:600;color:inherit;}

/* ============================================================
   404 / "niet gevonden"-pagina (themes/hemkes/templates/errors/404.tpl)
   ============================================================ */
.hm-404{padding:64px 16px 84px;background:linear-gradient(180deg,#F5F7FA 0%,#fff 60%);}
.hm-404__inner{max-width:680px;margin:0 auto;text-align:center;}
.hm-404__badge{display:inline-flex;align-items:center;gap:14px;}
.hm-404__badge svg{width:54px;height:54px;color:var(--orange);}
.hm-404__code{font-size:64px;font-weight:800;letter-spacing:-1px;line-height:1;color:var(--navy);}
.hm-404__title{margin:22px 0 10px;font-size:26px;font-weight:700;color:var(--ink);}
.hm-404__lead{margin:0 auto 26px;max-width:520px;color:var(--gray);font-size:15px;line-height:1.6;}
.hm-404__search{display:flex;align-items:center;max-width:520px;margin:0 auto 26px;background:#fff;border:1.5px solid #d6dee6;border-radius:6px;padding:4px 4px 4px 14px;box-shadow:0 6px 20px rgba(14,39,66,.08);}
.hm-404__searchic{width:20px;height:20px;color:var(--gray-2);flex:none;}
.hm-404__search input{flex:1;min-width:0;border:none;outline:none;background:none;font:15px Inter,sans-serif;color:var(--ink);padding:12px;}
.hm-404__search button{flex:none;background:var(--orange);color:#fff;border:none;border-radius:4px;font:600 14px Inter,sans-serif;padding:11px 22px;cursor:pointer;}
.hm-404__search button:hover{background:var(--orange-deep);}
.hm-404__cats{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin-bottom:30px;}
.hm-404__catslabel{width:100%;font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--gray-2);margin-bottom:4px;}
.hm-404__cats a{display:inline-flex;align-items:center;padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--navy);font-size:13.5px;font-weight:600;text-decoration:none;transition:background .15s,border-color .15s,color .15s;}
.hm-404__cats a:hover{background:var(--tint-orange);border-color:var(--orange);color:var(--orange-deep);}
.hm-404__actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;}
.hm-404__btn{display:inline-flex;align-items:center;justify-content:center;border-radius:4px;font-weight:600;font-size:14.5px;padding:13px 26px;text-decoration:none;}
.hm-404__btn--primary{background:var(--orange);color:#fff!important;}
.hm-404__btn--primary:hover{background:var(--orange-deep);color:#fff!important;}
.hm-404__btn--ghost{background:#fff;color:var(--navy)!important;border:1.5px solid #c5cfdb;}
.hm-404__btn--ghost:hover{background:#f6f8fb;border-color:var(--navy);}
@media (max-width:560px){.hm-404__code{font-size:52px;}.hm-404__title{font-size:22px;}.hm-404__search{flex-wrap:wrap;}.hm-404__search button{width:100%;margin-top:6px;}}

/* ============================================================
   Lege zoekresultaten / lege categorie (catalog/listing/product-list.tpl)
   ============================================================ */
.hm-noresult{max-width:620px;margin:24px auto 56px;text-align:center;padding:0 16px;}
.hm-noresult__ic{display:inline-flex;align-items:center;justify-content:center;width:74px;height:74px;border-radius:50%;background:var(--tint-orange);color:var(--orange);margin-bottom:18px;}
.hm-noresult__ic svg{width:34px;height:34px;}
.hm-noresult__title{font-size:23px;font-weight:700;color:var(--ink);margin:0 0 10px;}
.hm-noresult__lead{color:var(--gray);font-size:14.5px;line-height:1.6;margin:0 auto 24px;max-width:480px;}
.hm-noresult__search{display:flex;align-items:center;max-width:480px;margin:0 auto 24px;background:#fff;border:1.5px solid #d6dee6;border-radius:6px;padding:4px 4px 4px 14px;box-shadow:0 6px 20px rgba(14,39,66,.07);}
.hm-noresult__searchic{width:19px;height:19px;color:var(--gray-2);flex:none;}
.hm-noresult__search input{flex:1;min-width:0;border:none;outline:none;background:none;font:15px Inter,sans-serif;color:var(--ink);padding:11px 12px;}
.hm-noresult__search button{flex:none;background:var(--orange);color:#fff;border:none;border-radius:4px;font:600 13.5px Inter,sans-serif;padding:10px 18px;cursor:pointer;white-space:nowrap;}
.hm-noresult__search button:hover{background:var(--orange-deep);}
.hm-noresult__cats{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:9px;margin-bottom:26px;}
.hm-noresult__catslabel{width:100%;font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--gray-2);margin-bottom:4px;}
.hm-noresult__cats a{display:inline-flex;align-items:center;padding:7px 15px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--navy);font-size:13px;font-weight:600;text-decoration:none;transition:background .15s,border-color .15s,color .15s;}
.hm-noresult__cats a:hover{background:var(--tint-orange);border-color:var(--orange);color:var(--orange-deep);}
.hm-noresult__actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;}
.hm-noresult__btn{display:inline-flex;align-items:center;justify-content:center;border-radius:4px;font-weight:600;font-size:14px;padding:12px 24px;text-decoration:none;}
.hm-noresult__btn--primary{background:var(--orange);color:#fff!important;}
.hm-noresult__btn--primary:hover{background:var(--orange-deep);color:#fff!important;}
.hm-noresult__btn--ghost{background:#fff;color:var(--navy)!important;border:1.5px solid #c5cfdb;}
.hm-noresult__btn--ghost:hover{background:#f6f8fb;border-color:var(--navy);}
@media (max-width:560px){.hm-noresult__search{flex-wrap:wrap;}.hm-noresult__search button{width:100%;margin-top:6px;}}
.hm-cart{position:relative;color:var(--navy);display:flex;padding:4px;text-decoration:none;}
.hm-cart svg{width:21px;height:21px;}
.hm-cart__c{position:absolute;top:-2px;right:-4px;background:var(--orange);color:#fff;font-size:9px;font-weight:700;border-radius:50%;width:16px;height:16px;display:flex;align-items:center;justify-content:center;}

@media (max-width:1199.98px){
  .hm-top-inner{max-width:100%;gap:18px;}
  .hm-mainnav{gap:16px;}
  .hm-mega__inner{max-width:100%;}
}

/* ---- bredere content-breedte op de design-pagina's (home/categorie/CMS) ---- */
@media (min-width:1200px){
  body.page-index #wrapper > .container,
  body.page-category #wrapper > .container,
  body.page-cms #wrapper > .container{max-width:1200px;width:100%;}
}

/* ============================================================
   BREADCRUMB / PAGINAKOPPEN
   ============================================================ */
/* breadcrumb-ruimte gelijk boven/onder: section-padding op 0, ruimte op de breadcrumb zelf */
section:has(> .container > .breadcrumb){padding-top:0!important;padding-bottom:0!important;}
.page-product .breadcrumb,.breadcrumb{background:none;margin:0;padding:14px 0!important;}
.breadcrumb ol{margin:0;padding:0;}
/* color !important: Classic's "#wrapper .breadcrumb li a{color:#232323}" (ID) won anders */
.breadcrumb li,.breadcrumb li a{color:var(--navy)!important;font-size:13.5px;font-weight:500;}
.breadcrumb li:last-child a,.breadcrumb li:last-child{color:var(--navy)!important;font-weight:600;}
/* categoriepagina: native breadcrumb-strook BOVEN de hero verbergen; eigen breadcrumb staat ONDER de hero */
/* Geen grijze strook boven een full-bleed hero: zodra de pagina zo'n hero bevat
   (categorie OF CMS), vervalt de #wrapper-bovenruimte automatisch. */
#wrapper:has(.hm-phero),#wrapper:has(.hm-zak-hero),#wrapper:has(.hm-over-hero),#wrapper:has(.hm-kc-hero),#wrapper:has(.hm-inthero),#wrapper:has(.hm-off-hero){padding-top:0;}
body.page-category #wrapper > .container > .breadcrumb{display:none!important;}
.hm-crumb{margin:24px 0 4px;}
.hm-crumb ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:0;padding:0;}
.hm-crumb li{display:flex;align-items:center;gap:9px;}
.hm-crumb a{color:var(--gray-2);font-size:13.5px;text-decoration:none;}
.hm-crumb a:hover{color:var(--accent);}
.hm-crumb__sep{color:#c2ccd6;}
.hm-crumb__cur{color:var(--gray);font-size:13.5px;}
#main .page-header h1,.page-header .h1,.page-title{font-size:30px;font-weight:800;color:var(--ink);letter-spacing:-.3px;}

/* ============================================================
   PRODUCT-KAARTEN (grid)
   ============================================================ */
/* nieuwe ProductCard (design-handoff): kaart, beeld, titel, prijs, CTA, voorraad */
.product-miniature.pm-card{border:1px solid #e6ebf0;border-radius:4px;overflow:hidden;background:#fff;transition:box-shadow .15s,transform .15s;height:100%;}
.product-miniature.pm-card:hover{box-shadow:0 14px 32px rgba(11,33,74,.13);transform:translateY(-3px);}
.product-miniature.pm-card .thumbnail-container{margin:0;width:100%;box-shadow:none;}
.product-miniature.pm-card .thumbnail-top{position:relative;}
.product-miniature.pm-card .product-thumbnail{display:flex;align-items:center;justify-content:center;height:210px;background:#fff;border-bottom:1px solid #f0f3f6;padding:14px;}
.product-miniature.pm-card .product-thumbnail img{max-height:182px;max-width:80%;width:auto;object-fit:contain;}
.product-miniature.pm-card .product-description{padding:18px;display:flex;flex-direction:column;flex:1;text-align:left;}
.product-miniature.pm-card .product-title{margin:0 0 5px;min-height:42px;}
.product-miniature.pm-card .product-title a{color:var(--navy);font-weight:700;font-size:16px;line-height:1.3;}
.product-miniature.pm-card .product-title a:hover{color:var(--orange);}
.product-miniature.pm-card .pm-ref{font-size:12.5px;color:#8a98a8;margin-bottom:6px;}
.product-miniature.pm-card .product-price-and-shipping{margin-top:auto;padding-top:10px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;}
.product-miniature.pm-card .price{color:var(--navy)!important;font-weight:800;font-size:21px;}
.product-miniature.pm-card .pm-pricenote{font-size:12px;color:#8a98a8;}
.product-miniature.pm-card .regular-price{color:var(--gray-2);text-decoration:line-through;font-size:14px;}
.product-miniature.pm-card .pm-add{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:14px;background:#0e2742;border:1.5px solid #0e2742;border-radius:4px;color:#fff;font-weight:600;font-size:14px;padding:11px;text-decoration:none;transition:background .15s;}
.product-miniature.pm-card .pm-add:hover{background:#0e2742;color:#fff;}
.product-miniature.pm-card .pm-add svg{width:18px;height:18px;flex:none;}
.product-miniature.pm-card .pm-cta{display:block;width:100%;text-align:center;margin-top:8px;background:#fff;border:1.5px solid var(--navy);border-radius:4px;color:var(--navy);font-weight:600;font-size:14px;padding:11px;text-decoration:none;transition:background .15s,color .15s;}
.product-miniature.pm-card .pm-cta:hover{background:var(--navy);color:#fff;}
/* "Op aanvraag" — zelfde indeling als de witte kaartknop; offerte-knop eronder blijft blauw (.pm-add) */
.product-miniature.pm-card .pm-onrequest{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:14px;background:#fff;border:1.5px solid var(--navy);border-radius:4px;color:var(--navy);font-weight:600;font-size:14px;padding:11px;box-sizing:border-box;}
.product-miniature.pm-card .pm-onrequest svg{width:18px;height:18px;flex:none;}
.product-miniature.pm-card .pm-onrequest + .pm-add{margin-top:8px;}
.product-miniature.pm-card .pm-stock{display:flex;align-items:center;gap:7px;font-size:12.5px;color:#6b7a8a;margin-top:13px;}
.product-miniature.pm-card .pm-dot{width:9px;height:9px;border-radius:50%;background:var(--green);flex-shrink:0;}
.product-miniature.pm-card .product-flags{position:absolute;top:12px;left:12px;margin:0;padding:0;z-index:2;list-style:none;}
.product-miniature.pm-card .product-flag{position:static;margin:0 0 4px;}
/* badges: alleen specifieke labels (geen automatische NIEUW/online-only) — conform ontwerp */
.product-flag{background:var(--orange)!important;color:#fff!important;border-radius:4px;font-weight:700;text-transform:uppercase;font-size:11px;letter-spacing:.5px;}
.product-flag.new,.product-flag.online-only,.product-flag.pack{display:none!important;}
/* geen wishlist-hartje op de kaart (niet in ontwerp; module is uitgezet) */
.product-miniature .wishlist-button-add,.pm-card .wishlist-button-add{display:none!important;}

/* Trust/reassurance-iconen */
.block-reassurance svg,.block-reassurance .material-icons,.reassurance-item .material-icons{color:var(--navy);}

/* ============================================================
   PRODUCTDETAIL (single product) — design-handoff 2026-06-26
   ============================================================ */
.page-product h1,.product-detail-name,h1.h1.product-title{font-size:27px;font-weight:800;color:var(--navy);letter-spacing:-.2px;line-height:1.25;text-transform:none;}
/* geen social-share ("Delen") en wishlist op productpagina — niet in ontwerp */
.page-product .social-sharing,.page-product .product-actions .social-sharing,.page-product .wishlist-button-add{display:none!important;}
.product-prices .current-price .regular-price{color:var(--gray-2);text-decoration:line-through;font-size:18px;}
.product-information .product-description-short{font-size:15px;color:#46566a;line-height:1.6;}
/* ---- Winkelwagen-sectie (design 1:1): geen kader, grijze − 1 + stepper, blauwe knop ---- */
.product-actions .product-add-to-cart{background:none;border:none;padding:0;margin-top:4px;}
.product-add-to-cart .control-label{display:block;font-size:13px;font-weight:700;color:var(--blue);margin-bottom:9px;}
.product-add-to-cart .product-quantity{display:flex;align-items:stretch;gap:0;flex-wrap:nowrap;margin:0;}
.product-add-to-cart .qty{margin:0;}
/* grijze stepper: touchspin omvormen naar horizontaal − 1 + */
.product-add-to-cart .qty .bootstrap-touchspin{display:flex;align-items:center;background:#fff;border-radius:4px;overflow:hidden;border:1px solid #d2dbe5;width:max-content;height:52px;box-shadow:none;}
.product-add-to-cart .qty .input-group-btn-vertical{display:contents;}
.product-add-to-cart .qty .bootstrap-touchspin .input-group-addon{display:none!important;}
.product-add-to-cart #quantity_wanted{order:2;width:42px;height:50px;border:none!important;background:transparent!important;text-align:center;font:600 16px/50px Inter,sans-serif;color:var(--blue)!important;box-shadow:none!important;padding:0;-moz-appearance:textfield;}
.product-add-to-cart #quantity_wanted::-webkit-outer-spin-button,.product-add-to-cart #quantity_wanted::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.product-add-to-cart .btn-touchspin{background:none!important;border:none!important;box-shadow:none!important;width:42px;height:50px;color:var(--blue)!important;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;}
.product-add-to-cart .bootstrap-touchspin-down{order:1;}
.product-add-to-cart .bootstrap-touchspin-up{order:3;}
.product-add-to-cart .btn-touchspin .material-icons{display:none;}
.product-add-to-cart .bootstrap-touchspin-down::before{content:'\2212';font:500 18px/1 Inter,sans-serif;color:var(--blue);display:block;}
.product-add-to-cart .bootstrap-touchspin-up::before{content:'+';font:500 18px/1 Inter,sans-serif;color:var(--blue);display:block;}
.product-add-to-cart .add{flex:1;display:flex;margin-left:12px;}
.page-product .product-add-to-cart .add-to-cart,.page-product .add-to-cart{flex:1;display:flex;align-items:center;justify-content:center;gap:9px;min-height:52px;background-color:var(--blue)!important;border-color:var(--blue)!important;padding:0 22px!important;font-size:15px!important;border-radius:4px!important;}
.page-product .product-add-to-cart .add-to-cart:hover,.page-product .add-to-cart:hover{background-color:#152f57!important;border-color:#152f57!important;}
/* voorraadmelding + min-aantal verbergen op productpagina (voorraad staat al bij titel) — voorkomt extra ruimte boven de advies-knop */
.page-product #product-availability,.page-product .product-minimal-quantity{display:none!important;}
/* reassurance onder de prijs */
.product-additional-info,.product-actions .social-sharing{border-top:1px solid var(--line-2);}
/* tabs (Beschrijving / Productinformatie) */
.product-tabs .nav-tabs,.tabs .nav-tabs{border-bottom:2px solid var(--line);}
.product-tabs .nav-tabs .nav-link,.tabs .nav-tabs .nav-link{color:var(--gray);font-weight:600;border:none;background:none;padding:12px 4px;margin-right:22px;}
.product-tabs .nav-tabs .nav-link.active,.tabs .nav-tabs .nav-link.active{color:var(--navy);border-bottom:3px solid var(--orange);background:none;}
/* specificatie-tabel */
.product-features .data-sheet{display:grid;grid-template-columns:1fr 1fr;gap:0;}
.product-features dt.name{color:var(--navy);font-weight:600;background:var(--tint);}
.product-features dd.value,.product-features dt.name{padding:11px 14px;border-bottom:1px solid var(--line-2);font-size:14px;}
/* afbeeldingen */
.product-cover img,.js-qv-product-cover img{border:1px solid var(--line);border-radius:4px;background:#fff;}
.product-images li img,.images-container .product-images img{border:1px solid var(--line)!important;border-radius:4px;}
/* geen cyaan rand bij hover/selected (Classic-accent) -> subtiel navy/neutraal */
.page-product .product-images .thumb:hover,.page-product .product-images li:hover img{border-color:#c5cfdb!important;}
.page-product .product-images li.selected img,.page-product .product-images img.selected,.page-product .product-images .thumb.selected{border-color:var(--navy)!important;}
.page-product .product-images img:focus,.page-product .product-images .thumb:focus,.page-product .product-images a:focus{outline:none!important;box-shadow:none!important;}
/* ---- Alle tekst op de productpagina in donkerblauw ---- */
.page-product #main,
.page-product #main p,.page-product #main span,.page-product #main li,.page-product #main a,
.page-product #main dt,.page-product #main dd,.page-product #main small,.page-product #main label,
.page-product #main h1,.page-product #main h2,.page-product #main h3,.page-product #main h4,
.page-product #main strong,.page-product #main b,.page-product #main summary,.page-product #main td,.page-product #main th{color:var(--navy);}
/* uitzonderingen: witte knoptekst, NIEUW-badge, groene voorraad blijven */
.page-product #main .add-to-cart,.page-product #main .add-to-cart *{color:#fff!important;}
.page-product #main .hm-pd-new{color:#fff!important;}
.page-product #main .hm-pd-advice:hover,.page-product #main .hm-pd-advice:hover *{color:#fff!important;}
.page-product #main .hm-pd-stock,.page-product #main .hm-pd-stock *{color:var(--green)!important;}
/* merklabel + artikelcode boven/onder titel */
.hm-pd-new{display:inline-block;background:var(--navy);color:#fff;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;padding:4px 10px;border-radius:4px;margin-bottom:10px;}
.hm-pd-brand{font-size:12.5px;color:var(--navy);letter-spacing:.4px;margin-bottom:4px;}
.page-product .hm-pd-code,.product-detail .hm-pd-code{font-size:13.5px;color:var(--navy);margin:2px 0 12px;}
/* voorraad-indicator met vinkje bij de titel */
.hm-pd-stock{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--green);margin:0 0 16px;}
.hm-pd-stock__ic{width:18px;height:18px;border-radius:50%;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;flex:none;}
.hm-pd-stock__ic svg{width:11px;height:11px;}
/* USP-checklist: blauw (#1B3F73) tekst + vinkje, geen cirkel (design 1:1) */
.hm-pd-usps{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:11px;}
.hm-pd-usps li{display:flex;align-items:center;gap:11px;font-size:14.5px;font-weight:500;color:var(--blue);}
.hm-pd-check{width:15px;height:15px;background:none;color:var(--blue);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.hm-pd-check svg{width:15px;height:15px;}
/* prijs: €.. (navy 800 32px) + "excl. btw" inline; incl. btw blauw eronder */
.page-product .product-prices{background:none;border:none;padding:0;margin:0;}
.page-product .product-prices .current-price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
.page-product .product-prices .product-price,.page-product .current-price-value{font-size:32px!important;font-weight:800!important;color:var(--navy)!important;line-height:1.1;}
.page-product .current-price .hm-pd-excl{font-size:13px!important;font-weight:500!important;color:var(--navy)!important;}
.hm-pd-incl{margin:2px 0 22px;color:var(--blue);font-size:13.5px;font-weight:600;}
/* variant-keuze: 2 kaarten naast elkaar (radio + thumbnail + naam + omschrijving + prijs) */
.product-variants .hm-var{margin:0 0 20px;}
.hm-var__label{display:block;font-size:13.5px;font-weight:700;color:var(--navy);margin-bottom:10px;}
.hm-var__list{list-style:none;margin:0;padding:0;display:flex;gap:12px;align-items:stretch;}
.hm-var__item{flex:1;min-width:0;margin:0;float:none!important;display:flex;}
.hm-var__card{position:relative;display:flex;align-items:flex-start;gap:12px;width:100%;border:1.5px solid var(--line);border-radius:4px;padding:14px;margin:0;cursor:pointer;background:#fff;text-align:left;transition:border-color .15s,box-shadow .15s;}
.hm-var__card:hover{border-color:#c5cfdb;}
.hm-var .input-radio{position:absolute;opacity:0;width:0;height:0;}
.hm-var__radio{position:relative;width:18px;height:18px;border-radius:50%;border:2px solid #c5cfdb;background:#fff;flex-shrink:0;margin-top:2px;}
.hm-var .input-radio:checked + .hm-var__radio{border-color:var(--blue);}
.hm-var .input-radio:checked + .hm-var__radio::after{content:'';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:9px;height:9px;border-radius:50%;background:var(--blue);}
.hm-var__card:has(.input-radio:checked){border-color:var(--blue);box-shadow:0 0 0 1px var(--blue) inset;}
.hm-var__img{width:46px;height:46px;object-fit:contain;flex-shrink:0;}
.hm-var__txt{min-width:0;align-self:stretch;display:flex;flex-direction:column;}
.hm-var__name{display:block;font-weight:700;font-size:14px;color:var(--blue);line-height:1.25;}
.hm-var__desc{display:block;font-size:12px;color:var(--gray-2);margin:3px 0 6px;}
/* prijs altijd onderaan de kaart (margin-top:auto), zodat beide kaarten netjes meegroeien */
.hm-var__price{display:block;margin-top:auto;padding-top:6px;font-weight:700;font-size:13.5px;color:var(--blue);}
.hm-var__price small{font-weight:400;color:var(--navy);font-size:11.5px;}
@media (max-width:520px){.hm-var__list{flex-direction:column;}}
/* "Advies / offerte voor dit product"-knop */
.hm-pd-advice{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:52px;background:#fff;border:1.5px solid var(--blue);border-radius:4px;color:var(--blue)!important;font-weight:600;font-size:15px;padding:0 14px;margin-top:8px;text-decoration:none;transition:background .15s,color .15s;}
.hm-pd-advice:hover{background:var(--blue);color:#fff!important;text-decoration:none;}
.hm-pd-advice svg{width:18px;height:18px;flex:none;}
/* WhatsApp-variant van de offerteknop (groen, tekst blijft wit bij hover) */
.hm-pd-advice.hm-pd-advice--wa{background:#25D366;border-color:#25D366;color:#fff!important;}
.page-product #main .hm-pd-advice.hm-pd-advice--wa:hover,.hm-pd-advice.hm-pd-advice--wa:hover{background:#1EBE5A!important;border-color:#1EBE5A!important;color:#fff!important;}
.hm-pd-advice.hm-pd-advice--wa svg{width:20px;height:20px;}
/* galerij-cover met design-ronding (pijlen/zoom/thumbs verschijnen bij meerdere foto's) */
.page-product .product-cover,.page-product .product-cover .js-qv-product-cover{border-radius:4px;overflow:hidden;border:1px solid var(--line);}
.page-product .images-container .product-cover img{border-radius:4px;}
/* Productfoto's staan klein-gecentreerd op een vierkant wit canvas (ingebakken
   witruimte). We schalen de cover iets op zodat het product het vlak beter vult;
   .product-cover heeft overflow:hidden dus alleen het wit wordt bijgesneden. */
.page-product .product-cover img{transform:scale(1.28);transition:transform .25s ease;}
.page-product .product-cover:hover img{transform:scale(1.34);}
/* galerij links uitlijnen (page-content had margin-left:44px) + thumbnails 4-naast-elkaar */
.page-product .product-container .page-content{margin-left:0!important;}
.page-product .images-container{margin:0;}
.page-product .images-container .js-qv-mask{overflow-x:auto;overflow-y:hidden;width:auto!important;-webkit-overflow-scrolling:touch;}
.page-product .images-container .js-qv-product-images{display:flex!important;flex-wrap:nowrap;gap:12px;transform:none!important;width:auto!important;margin:14px 0 0;padding:0;list-style:none;}
.page-product .images-container .js-qv-product-images .thumb-container{flex:0 0 calc(25% - 9px);margin:0!important;}
.page-product .images-container .js-qv-product-images .thumb-container img,.page-product .images-container .js-qv-product-images .thumb{width:100%;height:auto;}
.page-product .scroll-box-arrows{display:none!important;}
/* zoom-modal: titel/caption weg, thumbnails verticaal rechts (native) niet door bovenstaande laten breken */
#product-modal .image-caption{display:none!important;}
/* grote cover-afbeelding niet beeldvullend: begrens hoogte zodat hij op 100% niet te groot is */
#product-modal .modal-body figure{margin:0;display:flex;align-items:center;justify-content:center;}
#product-modal .product-cover-modal{max-height:62vh;width:auto!important;max-width:100%;height:auto!important;object-fit:contain;}
/* cover prev/next pijlen */
.page-product .product-cover{position:relative;}
.hm-cov-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.92);color:var(--navy);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px rgba(14,39,66,.12);transition:border-color .15s,background .15s;}
.hm-cov-arrow:hover{border-color:var(--navy);background:#fff;}
.hm-cov-arrow svg{width:18px;height:18px;}
.hm-cov-arrow--prev{left:12px;}
.hm-cov-arrow--next{right:12px;}
/* ---- Full-width: montage-sectie (links) + "Vaak mee besteld"-lijst (rechts) ---- */
.hm-pd-below{margin-top:30px;}
.hm-pd-below__grid{display:grid;grid-template-columns:1.25fr 1fr;gap:28px;align-items:stretch;}
.hm-pd-montage{background:#fff;border:1px solid var(--line-2);border-radius:4px;padding:26px 28px;display:flex;flex-direction:column;}
.hm-pd-montage__h{margin:0 0 16px;font:800 19px Inter,sans-serif;color:var(--navy);}
.hm-pd-montage__body{display:flex;gap:24px;align-items:flex-start;margin-bottom:20px;}
.hm-pd-montage__txt{flex:1;min-width:0;}
.hm-pd-montage__txt p{margin:0 0 16px;font-size:13.5px;line-height:1.6;color:#5a6b7b;}
.hm-pd-montage__checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.hm-pd-montage__checks li{display:flex;align-items:center;gap:9px;font-size:13.5px;color:#3a4a5a;}
.hm-pd-montage__checks svg{width:14px;height:14px;color:var(--blue);flex-shrink:0;}
.hm-pd-montage__img{width:230px;flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.hm-pd-montage__img img{width:100%;object-fit:contain;}
.hm-pd-montage__wa{display:flex;gap:14px;align-items:center;border-top:1px solid var(--line-2);padding-top:18px;margin-top:auto;text-decoration:none;}
.hm-pd-montage__wa-ic{width:40px;height:40px;border-radius:50%;object-fit:cover;flex-shrink:0;}
.hm-pd-montage__wa-t{display:block;font:700 14px Inter,sans-serif;color:var(--navy);margin-bottom:2px;}
.hm-pd-montage__wa-s{display:block;font-size:13px;line-height:1.5;color:#5a6b7b;}
.hm-pd-cross__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.hm-pd-cross__head h3{margin:0;font:800 18px Inter,sans-serif;color:var(--navy);}
.hm-pd-cross__head a{font:600 12.5px Inter,sans-serif;color:var(--blue);text-decoration:none;white-space:nowrap;}
.hm-pd-cross__head a:hover{color:var(--orange);}
.hm-pd-cross__list{border:1px solid var(--line-2);border-radius:4px;overflow:hidden;}
.hm-pd-cross__row{display:flex;align-items:center;gap:16px;padding:16px 22px;border-top:1px solid #f1f4f7;background:#fff;text-decoration:none;transition:background .15s;}
.hm-pd-cross__row:first-child{border-top:none;}
.hm-pd-cross__row:hover{background:#F8FAFC;}
.hm-pd-cross__img{width:64px;height:64px;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.hm-pd-cross__img img{max-width:100%;max-height:100%;object-fit:contain;}
.hm-pd-cross__txt{flex:1;min-width:0;}
.hm-pd-cross__name{display:block;font:600 14px Inter,sans-serif;color:var(--navy);line-height:1.35;}
.hm-pd-cross__price{display:block;font-size:12.5px;color:var(--blue);font-weight:700;margin-top:4px;}
.hm-pd-cross__price small{font-weight:400;color:var(--navy);font-size:11px;}
.hm-pd-cross__chev{width:16px;height:16px;color:var(--blue);flex-shrink:0;}
/* 3 USP-strip full-width */
.hm-pd-strip{margin-top:26px;}
.hm-pd-strip__grid{border:1px solid var(--line);border-radius:4px;display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden;background:#fff;}
.hm-pd-strip__item{padding:22px 26px;display:flex;gap:14px;align-items:flex-start;border-left:1px solid var(--line-2);background:#fff;}
.hm-pd-strip__item:first-child{border-left:none;}
.hm-pd-strip__ic{color:var(--blue);flex-shrink:0;margin-top:1px;}
.hm-pd-strip__ic svg{width:26px;height:26px;}
.hm-pd-strip__t{font:700 15px Inter,sans-serif;color:var(--blue);margin-bottom:6px;}
.hm-pd-strip__d{font-size:13px;line-height:1.55;color:var(--blue);}
.hm-pd-strip__d + .hm-pd-strip__d{margin-top:8px;}
@media (max-width:820px){.hm-pd-below__grid{grid-template-columns:1fr;}.hm-pd-strip__grid{grid-template-columns:1fr;}.hm-pd-strip__item{border-left:none;border-top:1px solid var(--line-2);}.hm-pd-strip__item:first-child{border-top:none;}.hm-pd-montage__body{flex-direction:column;}.hm-pd-montage__img{width:100%;max-width:280px;}}
/* 4 tabs — full-width onder de hero */
.hm-pd-tabs{margin-top:40px;padding-top:36px;border-top:1px solid var(--line-2);clear:both;}
.hm-pd-tabs .nav-tabs{border-bottom:1px solid var(--line);display:flex;gap:28px;flex-wrap:wrap;}
.hm-pd-tabs .nav-tabs .nav-item{margin:0;}
.hm-pd-tabs .nav-tabs .nav-link{color:var(--gray);font-weight:600;font-size:15px;border:none;background:none;padding:12px 0;margin:0;border-bottom:3px solid transparent;}
.hm-pd-tabs .nav-tabs .nav-link.active{color:var(--navy);border-bottom-color:var(--orange)!important;background:none;}
/* geen cyaan onderstreping bij hover/focus (Classic-accent) */
.hm-pd-tabs .nav-tabs .nav-link:hover,.hm-pd-tabs .nav-tabs .nav-link:focus{color:var(--navy);border-bottom-color:var(--orange)!important;}
.hm-pd-tabs .tab-content{padding-top:24px;}
.hm-pd-tabs .product-description{max-width:780px;font-size:15.5px;line-height:1.75;color:#3a4a5a;}
/* "In de doos"-box */
.hm-pd-box{max-width:620px;display:flex;align-items:flex-start;gap:12px;font-size:15px;color:#3a4a5a;line-height:1.8;}
.hm-pd-box .hm-pd-check{margin-top:3px;}
/* FAQ binnen tab — compacte variant van hm-faq */
.hm-pd-faq{max-width:820px;margin:0;}

/* ============================================================
   CATEGORIE / FACETTEN
   ============================================================ */
#left-column #search_filters,#left-column .block-categories{border:1px solid var(--line);border-radius:4px;background:#fff;box-shadow:none;}
#search_filters .facet .facet-title,.block-categories .h6,.facet-title{color:var(--ink)!important;font-weight:700;font-size:15px;text-transform:none!important;letter-spacing:0;}
#search_filters .facet .facet-label a,.facet-label{color:#3f4f60;font-size:14px;}
#search_filters .facet .facet-label a:hover{color:var(--navy);}
.custom-checkbox input[type=checkbox]:checked+span,.custom-checkbox span.checkbox-checked{background:var(--navy)!important;border-color:var(--navy)!important;color:#fff;}
.products-sort-order .select-title{border:1px solid #d3dae2;border-radius:4px;color:var(--ink);}
.total-products p,.products-selection .total-products{color:var(--navy);font-weight:700;}
/* Paginering — nette knoppen i.p.v. de kale Classic-stijl */
.pagination{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;margin:28px 0 6px;}
.pagination > .col-md-4{flex:0 0 auto;width:auto;max-width:none;padding:0;color:var(--gray-2);font-size:14px;}
.pagination > [class*="col-md-6"]{flex:0 0 auto;width:auto;max-width:none;margin:0;padding:0;}
.pagination .page-list{display:inline-flex;align-items:center;gap:8px;margin:0;padding:0;list-style:none;}
.pagination .page-list li{margin:0;}
.pagination .page-list li a{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 14px;border:1px solid var(--line);border-radius:4px;background:#fff;color:var(--navy)!important;font-weight:600;font-size:14px;line-height:1;text-decoration:none;transition:background .15s,border-color .15s,color .15s;}
.pagination .page-list li a:hover{border-color:var(--navy);background:#f4f6f9;color:var(--navy)!important;}
.pagination .page-list li.current a,.pagination .page-list li.current a.disabled{background:var(--navy)!important;border-color:var(--navy)!important;color:#fff!important;opacity:1;cursor:default;}
.pagination .page-list li.disabled a,.pagination .page-list li a.disabled{cursor:default;}
.pagination .page-list li a.next,.pagination .page-list li a.previous{gap:6px;padding:0 18px;}
.pagination .page-list li a .material-icons{font-size:18px;line-height:1;}

/* ============================================================
   INTERNET-PAKKETTEN-VERGELIJKING (design-handoff) — categorie 26
   ============================================================ */
/* Internet-categorie: sidebar weg -> content full-width (zoals het ontwerp) */
body.category-id-26 #left-column{display:none!important;}
body.category-id-26 #content-wrapper{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%;width:100%;}

/* internet-hero + USP-balk — FULL-BLEED (100vw), tekst gecentreerd op 1200px */
.hm-inthero{position:relative;overflow:hidden;margin:0 0 0;background:#0e2742;min-height:380px;display:flex;color:#fff;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.hm-inthero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center;z-index:0;}
.hm-inthero__ov{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(11,30,54,.93) 0%,rgba(11,30,54,.74) 36%,rgba(11,30,54,0) 62%);}
.hm-inthero__inner{position:relative;z-index:2;padding:40px 24px 34px;display:flex;flex-direction:column;justify-content:space-between;width:100%;max-width:1200px;margin:0 auto;}
.hm-inthero__main h1{font-size:42px;font-weight:800;color:#fff;margin:0 0 12px;letter-spacing:-.5px;}
.hm-inthero__main p{font-size:17px;color:#cdd9e7;max-width:430px;line-height:1.55;margin:0;}
.hm-intusp{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:680px;margin-top:36px;}
.hm-intusp__i{display:flex;flex-direction:column;gap:10px;}
.hm-intusp__i svg{width:34px;height:34px;}
.hm-intusp__i span{font-weight:600;font-size:13px;color:#eef3f9;line-height:1.35;}
@media (max-width:767px){.hm-inthero{min-height:auto;}.hm-inthero__main h1{font-size:30px;}.hm-intusp{grid-template-columns:1fr 1fr;}}

/* Starlink-infokaarten */
.hm-starlink{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:34px 0 6px;}
.hm-sl-card{border-radius:4px;padding:26px 30px;display:flex;gap:22px;align-items:center;}
.hm-sl-card--blue{background:#EAF1F9;border:1px solid #dce8f3;}
.hm-sl-card--green{background:#E7F3EC;border:1px solid #cfe6d8;}
.hm-sl-mark{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:8px;width:64px;}
.hm-sl-mark svg{width:52px;height:30px;}
.hm-sl-mark span{font-size:11px;font-weight:800;letter-spacing:2.5px;color:var(--navy);}
.hm-sl-ico{width:48px;height:50px;flex-shrink:0;}
.hm-sl-txt h3{margin:0 0 9px;font-size:19px;font-weight:800;color:var(--navy);}
.hm-sl-txt p{margin:0;font-size:14.5px;line-height:1.65;color:#5a6b7b;}
@media (max-width:767px){.hm-starlink{grid-template-columns:1fr;}}

.hm-pkgs{background:#F5F7FA;margin:18px 0 6px;padding:46px 28px 48px;border-radius:4px;}
.hm-pkgs__head{text-align:center;max-width:760px;margin:0 auto 36px;}
.hm-pkgs__head h2{margin:0 0 12px;font-size:28px;font-weight:800;color:var(--navy);letter-spacing:-.2px;}
.hm-pkgs__head p{margin:0;font-size:15.5px;line-height:1.6;color:var(--gray);}
.hm-pkgs__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch;max-width:1080px;margin:0 auto;}
.hm-pkg{position:relative;background:#fff;border:2px solid #e6ebf0;border-radius:4px;padding:30px 28px 28px;display:flex;flex-direction:column;box-shadow:0 8px 26px rgba(11,33,74,.06);}
.hm-pkg--featured{border-color:var(--orange);}
.hm-pkg__badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--orange);color:#fff;font-size:10px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;padding:5px 14px;border-radius:4px;white-space:nowrap;}
.hm-pkg__name{font-size:20px;font-weight:800;color:var(--navy);letter-spacing:1px;margin-bottom:6px;}
.hm-pkg__sub{font-size:14.5px;font-weight:600;color:var(--navy);line-height:1.35;margin-bottom:18px;}
.hm-pkg__img{width:100%;height:150px;object-fit:contain;margin-bottom:20px;}
.hm-pkg__feats{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:13px;flex:1;}
.hm-pkg__feats li{display:flex;align-items:flex-start;gap:10px;font-size:14.5px;color:#3a4a5a;line-height:1.4;}
.hm-pkg__feats li svg{width:16px;height:16px;flex-shrink:0;margin-top:2px;}
.hm-pkg__note{font-size:12.5px;color:#8a98a8;line-height:1.5;margin-bottom:16px;border-top:1px solid #eef2f6;padding-top:14px;}
.hm-pkg__btn{display:flex;align-items:center;justify-content:center;gap:10px;background:#fff;border:2px solid var(--navy);border-radius:4px;color:var(--navy);font-size:15px;font-weight:600;padding:13px;text-decoration:none;transition:opacity .15s;}
.hm-pkg__btn svg{width:16px;height:16px;}
.hm-pkg__btn:hover{opacity:.9;color:var(--navy);text-decoration:none;}
.hm-pkg__btn--featured{background:var(--orange);border-color:var(--orange);color:#fff;}
.hm-pkg__btn--featured:hover{color:#fff;}
@media (max-width:991px){.hm-pkgs__grid{grid-template-columns:1fr;max-width:440px;}}

/* ============================================================
   CATEGORIE-OVERZICHT (cat 2 = Home) — design-handoff CategoryCard
   ============================================================ */
body.category-id-2 #left-column{display:none!important;}
body.category-id-2 #content-wrapper{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%;width:100%;}
body.category-id-2 #js-product-list,body.category-id-2 #js-product-list-top,body.category-id-2 #js-product-list-bottom,body.category-id-2 .subcategories,body.category-id-2 #subcategories{display:none!important;}
.hm-catov-head{margin:8px 0 30px;}
.hm-catov-bc{font-size:13px;color:#8a98a8;margin-bottom:16px;}
.hm-catov-bc span{color:var(--navy);font-weight:600;}
.hm-catov-top{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.hm-catov-txt h1{font-size:40px;font-weight:800;color:var(--navy);margin:0 0 12px;letter-spacing:-.3px;}
.hm-catov-txt p{font-size:16.5px;color:#5a6b7b;line-height:1.6;margin:0;max-width:560px;}
.hm-catov-search{display:flex;align-items:center;background:#fff;border:1.5px solid #d6dee6;border-radius:4px;padding:0 6px 0 14px;min-width:340px;margin-top:6px;}
.hm-catov-search svg{width:18px;height:18px;flex:none;}
.hm-catov-search input{flex:1;border:none;outline:none;padding:13px 10px;font:14px Inter,sans-serif;color:var(--ink);background:none;min-width:0;}
.hm-catov-search button{background:var(--orange);border:none;border-radius:4px;color:#fff;font:600 14px Inter,sans-serif;padding:10px 18px;cursor:pointer;}
.hm-catov-search button:hover{background:var(--orange-deep);}
.hm-catov-cta{background:var(--tint);border:1px solid var(--line-2);border-radius:4px;padding:26px 30px;display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:30px;}
.hm-catov-cta__ic{width:54px;height:54px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--navy);flex-shrink:0;}
.hm-catov-cta__ic svg{width:26px;height:26px;}
.hm-catov-cta__txt{flex:1;min-width:240px;}
.hm-catov-cta__t{font-size:17px;font-weight:700;color:var(--navy);margin-bottom:5px;}
.hm-catov-cta__d{font-size:14px;color:var(--gray-2);line-height:1.5;}
.hm-catov-cta__btn{background:var(--navy);border-radius:4px;color:#fff;font-weight:600;font-size:14px;padding:13px 22px;text-decoration:none;flex-shrink:0;}
.hm-catov-cta__btn:hover{background:var(--navy-2);color:#fff;}
.hm-catov-usps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:34px;padding:18px 0 56px;}
.hm-catov-usp{display:flex;align-items:center;gap:14px;}
.hm-catov-usp__ic{display:flex;align-items:center;justify-content:center;color:var(--navy);flex:none;}
.hm-catov-usp__ic svg{width:32px;height:32px;}
.hm-catov-usp div b{display:block;font-weight:700;font-size:14.5px;color:var(--navy);}
.hm-catov-usp div span{display:block;font-size:12.5px;color:var(--gray-2);}
/* USP-balk onderaan categoriepagina's (design-handoff UspBar) */
.hm-cbar{background:#fff;border-top:1px solid #e6eaf0;width:100vw;margin:48px 0 0;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.hm-cbar__inner{max-width:1200px;margin:0 auto;padding:28px 24px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.1fr;gap:22px;}
.hm-cbar__i{display:flex;align-items:flex-start;gap:13px;}
.hm-cbar__ic{flex-shrink:0;width:42px;height:42px;display:flex;align-items:center;justify-content:center;color:var(--navy);}
.hm-cbar__ic svg{width:38px;height:38px;}
.hm-cbar__i b{display:block;font-weight:700;font-size:14px;color:var(--navy);line-height:1.3;}
.hm-cbar__i span{display:block;font-size:12px;color:#7a8aa0;margin-top:5px;line-height:1.45;}
@media (max-width:991px){.hm-cbar__inner{grid-template-columns:1fr 1fr 1fr;row-gap:24px;}}
@media (max-width:560px){.hm-cbar__inner{grid-template-columns:1fr 1fr;}}
.hp-catgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;}
@media (max-width:991px){.hm-catov-usps{grid-template-columns:1fr 1fr;}.hp-catgrid{grid-template-columns:repeat(3,1fr);}.hm-catov-search{min-width:0;width:100%;}}
@media (max-width:560px){.hm-catov-usps{grid-template-columns:1fr;}.hp-catgrid{grid-template-columns:1fr 1fr;}.hm-catov-txt h1{font-size:30px;}}
.hm-catgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-bottom:10px;}
.hm-catcard{display:flex;flex-direction:column;background:#fff;border:1px solid #e6ebf0;border-radius:4px;overflow:hidden;text-decoration:none;transition:box-shadow .15s,transform .15s;}
.hm-catcard:hover{box-shadow:0 16px 36px rgba(11,33,74,.14);transform:translateY(-3px);}
.hm-catcard__img{height:170px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #eef2f6;background:#fff;padding:14px;}
.hm-catcard__img img{max-width:100%;max-height:100%;object-fit:contain;}
.hm-catcard__body{padding:20px;display:flex;flex-direction:column;flex:1;}
.hm-catcard__t{font-size:18px;font-weight:700;color:var(--navy);margin-bottom:7px;}
.hm-catcard__d{font-size:13.5px;color:#5a6b7b;line-height:1.55;margin-bottom:16px;flex:1;}
.hm-catcard__link{display:inline-flex;align-items:center;gap:7px;color:#1763a8;font-weight:600;font-size:13.5px;}
.hm-catcard__link svg{width:15px;height:15px;}
@media (max-width:991px){.hm-catgrid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.hm-catgrid{grid-template-columns:1fr;}}

/* ============================================================
   CATEGORIE-HERO (alle categorieën) — design-handoff
   ============================================================ */
/* alle categoriepagina's full-width (geen sidebar, zoals het ontwerp) */
body.page-category #left-column{display:none!important;}
body.page-category #content-wrapper{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%;width:100%;}
.hm-cathero{position:relative;overflow:hidden;background:linear-gradient(110deg,#0e2742 0%,#0E2742 100%);color:#fff;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.hm-cathero__circle{position:absolute;right:-60px;top:-60px;width:320px;height:320px;border:54px solid rgba(232,84,30,.08);border-radius:50%;z-index:0;}
.hm-cathero__inner{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:46px 24px 0;}
.hm-cathero--nousp .hm-cathero__inner{padding-bottom:46px;}
.hm-cathero h1{font-size:42px;font-weight:800;color:#fff;margin:0 0 12px;letter-spacing:-.5px;}
.hm-cathero p{font-size:16.5px;color:#bccadb;line-height:1.6;margin:0;max-width:660px;}
.hm-cathero__usps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:34px;}
.hm-cathero__usp{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-bottom:none;border-radius:4px 4px 0 0;padding:16px 16px 18px;}
.hm-cathero__uspic{width:42px;height:42px;border-radius:4px;background:rgba(232,84,30,.18);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#E8541E;}
.hm-cathero__uspic svg{width:22px;height:22px;}
.hm-cathero__uspt{font-weight:700;font-size:14.5px;color:#fff;}
.hm-cathero__uspd{font-size:12px;color:#9fb4cc;}
@media (max-width:880px){.hm-cathero__usps{grid-template-columns:1fr 1fr;}.hm-cathero h1{font-size:30px;}}
@media (max-width:480px){.hm-cathero__usps{grid-template-columns:1fr;}}

/* ============================================================
   FAQ (design-handoff FaqBlock) — accordion op categoriepagina's
   ============================================================ */
.hm-faq{margin:36px 0 6px;}
.hm-faq__head{text-align:center;margin-bottom:28px;}
.hm-faq__eyebrow{color:var(--orange);font-weight:700;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:8px;}
.hm-faq__head h2{margin:0;font-size:30px;font-weight:800;color:var(--navy);}
.hm-faq__list{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:10px;}
.hm-faq__item{background:#fff;border:1px solid #e6ebf0;border-radius:4px;overflow:hidden;}
.hm-faq__item[open]{border-color:#d4dde8;box-shadow:0 6px 22px rgba(14,39,66,.08);}
.hm-faq__item summary{list-style:none;cursor:pointer;padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:16.5px;font-weight:600;color:var(--navy);}
.hm-faq__item summary::-webkit-details-marker{display:none;}
.hm-faq__ico{flex-shrink:0;width:30px;height:30px;border-radius:50%;background:#eef2f7;color:var(--navy);display:flex;align-items:center;justify-content:center;transition:transform .25s ease,background .2s,color .2s;}
.hm-faq__ico svg{width:15px;height:15px;}
.hm-faq__item[open] .hm-faq__ico{background:var(--tint-orange);transform:rotate(180deg);}
.hm-faq__a{padding:0 24px 22px;color:#5a6b7b;font-size:14.5px;line-height:1.7;max-width:680px;}

/* ============================================================
   ADVIES-BANNER (design-handoff AdviceBanner) — categoriepagina's
   ============================================================ */
.hm-advice{position:relative;display:flex;border:1px solid #e6ebf0;border-radius:4px;overflow:hidden;background:#F5F7FA;min-height:188px;margin:34px 0 12px;}
.hm-advice__body{position:relative;z-index:2;flex:1 1 56%;display:flex;align-items:center;gap:22px;padding:30px 34px;}
.hm-advice__badge{width:62px;height:68px;flex-shrink:0;}
.hm-advice__txt h3{margin:0 0 8px;font-size:19px;font-weight:700;color:var(--navy);line-height:1.25;}
.hm-advice__txt p{margin:0 0 16px;font-size:13.5px;color:#6b7a8a;line-height:1.55;max-width:430px;}
.hm-advice__btn{display:inline-block;background:var(--orange);border-radius:4px;color:#fff;font-weight:600;font-size:14px;padding:11px 22px;text-decoration:none;}
.hm-advice__btn:hover{background:var(--orange-deep);color:#fff;text-decoration:none;}
.hm-advice__media{flex:1 1 44%;position:relative;background-position:center;background-size:cover;background-repeat:no-repeat;}
.hm-advice__ov{position:absolute;inset:0;background:linear-gradient(90deg,#F5F7FA 0%,rgba(245,247,250,.55) 18%,rgba(245,247,250,0) 42%);}
@media (max-width:767px){.hm-advice__media{display:none;}.hm-advice__body{flex:1 1 100%;}}

/* ============================================================
   OVER ONS (CMS 4) — design-handoff overons-view
   ============================================================ */
.hm-over{font-family:'Inter',system-ui,sans-serif;}
.hm-over-hero__inner{max-width:1200px;margin:0 auto;padding:34px 24px 50px;display:grid;grid-template-columns:1fr 1.05fr;gap:50px;align-items:center;}
.hm-over-hero__txt h1{font-size:40px;font-weight:800;color:var(--navy);margin:0 0 20px;}
.hm-over-hero__txt p{font-size:15.5px;color:var(--gray-2);line-height:1.7;margin:0 0 18px;max-width:440px;}
.hm-over-hero__txt p:last-child{margin-bottom:0;}
.hm-over-hero__img{border-radius:4px;overflow:hidden;height:300px;box-shadow:0 14px 36px rgba(11,33,74,.12);}
.hm-over-hero__img img{width:100%;height:100%;object-fit:cover;display:block;}
.hm-over-wat{background:#F5F7FA;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.hm-over-wat__inner{max-width:1200px;margin:0 auto;padding:54px 24px 64px;display:grid;grid-template-columns:1.05fr 1fr;gap:50px;align-items:center;}
.hm-over-wat__img{border-radius:4px;overflow:hidden;height:340px;box-shadow:0 14px 36px rgba(11,33,74,.12);}
.hm-over-wat__img img{width:100%;height:100%;object-fit:cover;display:block;}
.hm-over-wat__txt h2{font-size:26px;font-weight:800;color:var(--navy);margin:0 0 16px;}
.hm-over-wat__txt p{font-size:15px;color:var(--gray-2);line-height:1.7;margin:0 0 26px;max-width:480px;}
.hm-over-checks{display:flex;flex-direction:column;gap:18px;}
.hm-over-check{display:flex;align-items:center;gap:13px;font-size:14.5px;font-weight:600;color:var(--navy);}
.hm-over-check svg{width:20px;height:20px;flex-shrink:0;}
.hm-over-spec__inner{max-width:1200px;margin:0 auto;padding:48px 24px;display:grid;grid-template-columns:1fr 1.25fr;gap:30px;align-items:center;}
.hm-over-spec__txt{padding-right:30px;}
.hm-over-spec__txt h2{font-size:24px;font-weight:800;color:var(--navy);margin:0 0 14px;}
.hm-over-spec__txt p{font-size:14px;line-height:1.65;color:var(--gray-2);margin:0 0 26px;max-width:400px;}
.hm-over-btn{display:inline-flex;align-items:center;gap:10px;background:var(--orange);color:#fff;border-radius:4px;font-weight:600;font-size:14.5px;padding:14px 28px;text-decoration:none;}
.hm-over-btn:hover{background:var(--orange-deep);color:#fff;text-decoration:none;}
.hm-over-btn svg{width:15px;height:15px;}
.hm-over-spec__usps{display:grid;grid-template-columns:repeat(3,1fr);border-left:1px solid #e0e7ee;}
.hm-over-uspi{text-align:center;padding:0 16px;}
.hm-over-uspi>svg{width:30px;height:30px;color:var(--navy);margin-bottom:16px;}
.hm-over-uspi__t{font-size:14px;font-weight:700;color:var(--navy);margin-bottom:7px;}
.hm-over-uspi__d{font-size:12.5px;color:var(--gray-2);line-height:1.5;}
@media (max-width:767px){.hm-over-hero__inner,.hm-over-wat__inner,.hm-over-spec__inner{grid-template-columns:1fr;}.hm-over-spec__usps{grid-template-columns:1fr;border-left:none;gap:24px;}.hm-over-hero__txt h1{font-size:30px;}}

/* ============================================================
   CONTACT (native controller) — design-handoff
   ============================================================ */
/* full-width (de native contactpagina staat op layout-left-column) */
body.page-contact #left-column{display:none!important;}
body.page-contact #content-wrapper{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%;width:100%;}
/* native breadcrumb verbergen op contact (eigen breadcrumb in de hero) */
body.page-contact #wrapper > .container > .breadcrumb,body.page-contact nav.breadcrumb{display:none!important;}
.hm-contact-page{background:#F5F7FA;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.hm-contact-wrap{max-width:1200px;margin:0 auto;padding:30px 24px 64px;}
.hm-contact-bc{font-size:13px;color:#8395a8;margin-bottom:24px;}
.hm-contact-bc a{color:#8395a8;text-decoration:none;}
.hm-contact-bc a:hover{color:var(--navy);}
.hm-contact-bc span{color:#445469;}
.hm-contact-grid{display:grid;grid-template-columns:1fr 1.32fr;gap:48px;align-items:start;}
.hm-contact-left h1{font-size:40px;font-weight:800;color:var(--navy);margin:0 0 12px;letter-spacing:-.4px;}
.hm-contact-intro{font-size:15.5px;color:#5a6b7d;line-height:1.6;max-width:380px;margin:0 0 30px;}
/* contact-rijen (icoon + label/waarde/sub) — design-handoff */
.hm-ci-rows{display:flex;flex-direction:column;gap:22px;margin-bottom:30px;}
.hm-ci-row{display:flex;gap:16px;text-decoration:none;}
.hm-ci-ic{flex-shrink:0;width:44px;height:44px;border-radius:4px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;}
.hm-ci-ic svg{width:20px;height:20px;}
.hm-ci-txt{padding-top:2px;}
.hm-ci-t{display:block;font-size:15px;font-weight:700;color:var(--navy);margin-bottom:3px;}
.hm-ci-v{display:block;font-size:14px;color:var(--navy);line-height:1.5;}
.hm-ci-v--link{color:var(--orange);}
.hm-ci-row:hover .hm-ci-v--link{text-decoration:underline;}
.hm-ci-s{display:block;font-size:13px;color:#8395a8;margin-top:1px;}
/* formulier-card */
.hm-contact-form{background:#fff;border:1px solid #e6ebf0;border-radius:4px;padding:34px 36px;box-shadow:0 10px 30px rgba(11,33,74,.06);}
.hm-contact-form h2{font-size:22px;font-weight:800;color:var(--navy);margin:0 0 6px;}
.hm-contact-form__sub{font-size:14px;color:var(--gray-2);margin:0 0 24px;}
/* --- native contactformulier netjes opmaken --- */
.hm-contact-form .contact-form{margin:0;}
.hm-contact-form .form-fields > .form-group:first-child{display:none;} /* dubbele "CONTACTEER ONS"-titel weg */
.hm-contact-form .form-group.row{display:block;margin:0 0 16px;}
.hm-contact-form .form-control-label,.hm-contact-form label.form-control-label{display:block;width:100%;max-width:100%;text-align:left;padding:0 0 7px;font-size:13px;font-weight:600;color:#3a4a5a;}
.hm-contact-form [class*=col-md-]{width:100%;max-width:100%;-ms-flex:0 0 100%;flex:0 0 100%;padding:0;margin:0;}
.hm-contact-form .offset-md-3,.hm-contact-form .col-md-offset-3{margin-left:0!important;}
.hm-contact-form input.form-control,.hm-contact-form textarea.form-control,.hm-contact-form select.form-control{width:100%;border:1.5px solid #d6dee6;border-radius:4px;padding:12px 14px;font-size:14px;color:var(--ink);background-color:#fff;box-shadow:none;height:auto;}
/* native select: vaste hoogte zonder verticale padding -> tekst klipt niet (Chrome/Windows) */
.hm-contact-form select.form-control{height:48px;padding:0 14px;line-height:normal;}
.hm-contact-form textarea.form-control{min-height:120px;resize:vertical;}
.hm-contact-form .form-control:focus{border-color:var(--orange);box-shadow:none;outline:none;}
.hm-contact-form .form-control-comment{display:block;width:100%;text-align:left;padding:6px 0 0;font-size:12.5px;color:var(--gray-2);}
/* bestand-upload als brand-knop */
.hm-contact-form .group-span-filestyle .btn,.hm-contact-form .bootstrap-filestyle .btn,.hm-contact-form .input-group-btn .btn{background:var(--navy)!important;border:none!important;color:#fff!important;border-radius:4px!important;font-weight:600;font-size:13px;padding:10px 16px;box-shadow:none;}
.hm-contact-form .group-span-filestyle .btn:hover{background:var(--navy-2)!important;}
/* verstuur-knop full-width oranje */
.hm-contact-form .form-footer{text-align:left!important;margin-top:6px;padding:0;}
.hm-contact-form .form-footer .btn-primary,.hm-contact-form button[type=submit],.hm-contact-form input[type=submit]{width:100%;background:var(--orange)!important;border:none!important;border-radius:4px!important;color:#fff!important;font-weight:600;font-size:15px;padding:15px;box-shadow:none;}
.hm-contact-form .form-footer .btn-primary:hover,.hm-contact-form button[type=submit]:hover{background:var(--orange-deep)!important;}
@media (max-width:880px){.hm-contact-grid{grid-template-columns:1fr;gap:30px;}}
@media (max-width:560px){.hm-contact-left h1{font-size:30px;}.hm-contact-form{padding:26px 22px;}}
/* rechterkolom: formulier + bezoek-kaart */
.hm-contact-right{display:flex;flex-direction:column;gap:24px;}
/* groene WhatsApp-kaart */
.hm-ci-wa{display:flex;gap:16px;align-items:flex-start;background:#EAF6EE;border:1px solid #d3ead9;border-radius:4px;padding:22px 24px;}
.hm-ci-wa__ic{flex-shrink:0;width:42px;height:42px;border-radius:4px;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;}
.hm-ci-wa__ic svg{width:22px;height:22px;}
.hm-ci-wa__t{font-size:15px;font-weight:700;color:var(--navy);margin-bottom:4px;}
.hm-ci-wa__body p{margin:0 0 14px;font-size:13.5px;color:#4f6173;line-height:1.55;}
.hm-ci-wa__btn{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1.5px solid #25D366;color:#1F8A4D;font-weight:600;font-size:13.5px;padding:10px 16px;border-radius:4px;text-decoration:none;}
.hm-ci-wa__btn svg{width:15px;height:15px;}
.hm-ci-wa__btn:hover{background:#25D366;color:#fff;}
/* "Direct langskomen?"-kaart met pandfoto */
.hm-ct-visit{background:#F0F3F7;border:1px solid #e3e9ef;border-radius:4px;overflow:hidden;display:grid;grid-template-columns:1fr 1.05fr;}
.hm-ct-visit__img{min-height:200px;}
.hm-ct-visit__img img{width:100%;height:100%;object-fit:cover;display:block;}
.hm-ct-visit__body{padding:30px 32px;display:flex;flex-direction:column;justify-content:center;}
.hm-ct-visit__body h3{margin:0 0 10px;font-size:19px;font-weight:800;color:var(--navy);}
.hm-ct-visit__body p{margin:0 0 20px;font-size:14px;color:#5a6b7d;line-height:1.6;}
.hm-ct-visit__btn{align-self:start;display:inline-flex;align-items:center;gap:9px;white-space:nowrap;background:var(--navy);color:#fff;font-weight:600;font-size:13.5px;padding:12px 18px;border-radius:4px;text-decoration:none;}
.hm-ct-visit__btn:hover{background:var(--navy-2);color:#fff;}
.hm-ct-visit__btn svg{width:15px;height:15px;}
@media (max-width:560px){.hm-ct-visit{grid-template-columns:1fr;}}

/* ============================================================
   ZAKELIJK (CMS 16) — design-handoff
   ============================================================ */
/* native breadcrumb + page-header(h1) verbergen op design-CMS-pagina's (hero heeft eigen titel) */
body.page-cms:has(.hm-zak-hero) .breadcrumb,body.page-cms:has(.hm-zak-hero) .page-header,
body.page-cms:has(.hm-over-hero) .breadcrumb,body.page-cms:has(.hm-over-hero) .page-header,
body.page-cms:has(.hm-kc-hero) .breadcrumb,body.page-cms:has(.hm-kc-hero) .page-header{display:none!important;}
/* hero strak onder de topbar (geen content-padding boven de full-bleed hero) */
body.page-cms:has(.hm-zak-hero) #content.page-cms,
body.page-cms:has(.hm-over-hero) #content.page-cms,
body.page-cms:has(.hm-kc-hero) #content.page-cms{padding:0;margin-top:0;margin-bottom:0;background:transparent;}
/* CMS-tekst niet uitvullen (overschrijft text-align:justify uit het Classic-thema) */
#content.page-content.page-cms{text-align:left;}
.hm-zak-hero{position:relative;overflow:hidden;background:#eef2f6 url('/themes/hemkes/assets/img/zakelijk-hero.jpg') right center/cover no-repeat;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);min-height:440px;display:flex;align-items:center;}
.hm-zak-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,#fff 28%,rgba(255,255,255,.88) 42%,rgba(255,255,255,.35) 56%,rgba(255,255,255,0) 70%);z-index:0;}
.hm-zak-hero__inner{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:48px 24px;width:100%;}
.hm-zak-hero__txt{max-width:520px;}
.hm-zak-bc{font-size:13px;color:#7a8a9a;margin-bottom:22px;display:flex;align-items:center;gap:8px;}
.hm-zak-bc a{color:#7a8a9a;text-decoration:none;}
.hm-zak-bc a:hover{color:var(--orange);}
.hm-zak-bc span{color:#c2ccd6;}
.hm-zak-bc strong{color:#445469;font-weight:600;}
.hm-zak-hero__txt h1{font-size:38px;font-weight:800;color:var(--navy);margin:0 0 16px;letter-spacing:-.4px;line-height:1.14;}
.hm-zak-hero__txt p{font-size:15.5px;color:#5a6b7d;line-height:1.65;margin:0 0 14px;max-width:440px;}
.hm-zak-hero__txt p:last-of-type{margin-bottom:26px;}
.hm-zak-hero__btns{display:flex;gap:14px;flex-wrap:wrap;}
.hm-zak-btn{display:inline-flex;align-items:center;gap:10px;border-radius:4px;font-weight:600;font-size:15px;padding:13px 24px;text-decoration:none;}
.hm-zak-btn svg{width:16px;height:16px;}
.hm-zak-btn--orange{background:var(--orange);color:#fff;}
.hm-zak-btn--orange:hover{background:var(--orange-deep);color:#fff;}
.hm-zak-btn--ghost{background:#fff;color:var(--navy);border:1.5px solid #cfd8e2;}
.hm-zak-btn--ghost:hover{border-color:var(--navy);color:var(--navy);}
.hm-zak-btn--dark{background:var(--navy);color:#fff;}
.hm-zak-btn--dark:hover{background:var(--navy-2);color:#fff;}
/* ── Vangnet: inline-SVG's in custom CMS-/sectie-content krijgen altijd een maximale
   grootte. Zo kan een icoon nooit het hele scherm vullen als de CMS-content (DB) en de
   CSS ooit niet in sync zijn (bijv. oude pagina-inhoud + nieuwe stylesheet). Legitieme
   iconen (≤ ~40px) blijven ongemoeid; dit is uitsluitend een plafond. ── */
.hm-zak svg,.hm-off svg,.hm-cbar svg,.hm-smfeat svg,.hm-smwhy svg,.hm-maat svg,.hm-catov-usps svg,.hm-catov-cta svg,.hm-advice svg,.hm-zak-points svg{max-width:72px;max-height:72px;}
.hm-zak-info{margin:44px 0 0;}
.hm-zak-info__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;}
.hm-zak-card{background:none;border:none;border-radius:0;padding:4px 28px;}
.hm-zak-card:first-child{padding-left:0;}
.hm-zak-card:not(:first-child){border-left:1px solid #e3e9f0;}
.hm-zak-ic{display:flex;color:var(--navy);align-items:center;justify-content:flex-start;margin-bottom:16px;}
.hm-zak-ic svg{width:36px;height:36px;}
.hm-zak-card h3{font-size:16px;font-weight:700;color:var(--navy);margin:0 0 7px;}
.hm-zak-card p{font-size:13.5px;color:var(--gray);line-height:1.55;margin:0;}
.hm-zak-steps{margin:54px 0 0;text-align:left;}
.hm-zak-steps h2{font-size:24px;font-weight:800;color:var(--navy);margin:0 0 36px;}
.hm-zak-flow{display:flex;align-items:flex-start;justify-content:center;gap:6px;}
.hm-zak-fstep{flex:1 1 0;max-width:230px;text-align:center;display:flex;flex-direction:column;align-items:center;}
.hm-zak-fstep__ic{position:relative;width:72px;height:72px;border-radius:50%;background:#eef2f7;display:flex;align-items:center;justify-content:center;color:var(--navy);margin-bottom:18px;}
.hm-zak-fstep__ic svg{width:30px;height:30px;}
.hm-zak-fstep__n{position:absolute;top:-4px;left:-4px;width:24px;height:24px;border-radius:50%;background:var(--navy);color:#fff;font-weight:800;font-size:12px;display:flex;align-items:center;justify-content:center;}
.hm-zak-fstep h3{font-size:15.5px;font-weight:700;color:var(--navy);margin:0 0 8px;}
.hm-zak-fstep p{font-size:13.5px;color:var(--gray);line-height:1.55;margin:0;max-width:200px;}
.hm-zak-farrow{display:flex;align-items:center;justify-content:center;color:#c2ccd6;padding-top:24px;flex:0 0 auto;}
.hm-zak-farrow svg{width:22px;height:22px;}
@media (max-width:760px){.hm-zak-flow{flex-direction:column;align-items:center;gap:26px;}.hm-zak-farrow{padding-top:0;transform:rotate(90deg);}}
.hm-zak-steps__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;text-align:left;}
.hm-zak-step{background:var(--tint);border:1px solid var(--line);border-radius:4px;padding:26px 24px;}
.hm-zak-step__n{display:flex;width:38px;height:38px;border-radius:50%;background:var(--navy);color:#fff;font-weight:800;font-size:17px;align-items:center;justify-content:center;margin-bottom:14px;}
.hm-zak-step h3{font-size:16px;font-weight:700;color:var(--navy);margin:0 0 7px;}
.hm-zak-step p{font-size:13.5px;color:var(--gray);line-height:1.55;margin:0;}
.hm-zak-cta{margin:48px 0 10px;background:#0e2742;border-radius:4px;padding:44px 40px;text-align:center;color:#fff;}
.hm-zak-cta h2{font-size:26px;font-weight:800;color:#fff;margin:0 0 10px;}
.hm-zak-cta p{font-size:15.5px;color:#cdd9e7;margin:0 auto 22px;max-width:560px;}
.hm-zak-cta .hm-zak-hero__btns{justify-content:center;}
@media (max-width:991px){.hm-zak-hero__inner,.hm-zak-info__grid,.hm-zak-steps__grid{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.hm-zak-hero__inner,.hm-zak-info__grid,.hm-zak-steps__grid{grid-template-columns:1fr;}.hm-zak-hero__txt h1{font-size:30px;}}

/* ============================================================
   KENNISCENTRUM (CMS 17) — design-handoff
   ============================================================ */
.hm-kc-hero{background:linear-gradient(120deg,#0E2742 0%,#16395e 100%);color:#fff;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.hm-kc-hero__inner{max-width:1200px;margin:0 auto;padding:54px 24px;text-align:center;}
.hm-kc-eyebrow{color:var(--orange);font-weight:700;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:10px;}
.hm-kc-hero h1{font-size:42px;font-weight:800;color:#fff;margin:0 0 14px;letter-spacing:-.5px;}
.hm-kc-hero p{font-size:16.5px;color:#cdd9e7;line-height:1.6;margin:0 auto;max-width:620px;}
.hm-kc-search{max-width:560px;margin:28px auto 0;display:flex;align-items:center;background:#fff;border-radius:4px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.2);}
.hm-kc-search__ic{display:flex;align-items:center;padding:0 4px 0 16px;color:#9aabbc;}
.hm-kc-search__ic svg{width:20px;height:20px;}
.hm-kc-search input{flex:1;border:none;outline:none;padding:15px 12px;font-size:15px;color:var(--ink);background:none;}
.hm-kc-search button{background:var(--orange);border:none;color:#fff;font-weight:600;font-size:14px;padding:0 26px;cursor:pointer;align-self:stretch;}
.hm-kc-search button:hover{background:var(--orange-deep);}
.hm-kc-topics{margin:44px 0 0;text-align:center;}
.hm-kc-topics h2{font-size:28px;font-weight:800;color:var(--navy);margin:0 0 28px;}
.hm-kc-topics__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;}
.hm-kc-topic{display:flex;flex-direction:column;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:4px;padding:24px 14px;text-decoration:none;color:var(--navy);font-weight:600;font-size:14px;text-align:center;transition:border-color .15s,box-shadow .15s;}
.hm-kc-topic:hover{border-color:var(--orange);box-shadow:0 8px 20px rgba(11,33,74,.08);color:var(--navy);}
.hm-kc-ic{width:46px;height:46px;border-radius:4px;background:var(--tint);color:var(--navy);display:flex;align-items:center;justify-content:center;}
.hm-kc-ic svg{width:24px;height:24px;}
.hm-kc-cta{margin:48px 0 10px;background:#F5F7FA;border:1px solid var(--line);border-radius:4px;padding:40px;text-align:center;}
.hm-kc-cta h2{font-size:24px;font-weight:800;color:var(--navy);margin:0 0 10px;}
.hm-kc-cta p{font-size:15px;color:var(--gray);margin:0 auto 20px;max-width:560px;}
@media (max-width:991px){.hm-kc-topics__grid{grid-template-columns:repeat(3,1fr);}}
@media (max-width:560px){.hm-kc-topics__grid{grid-template-columns:1fr 1fr;}.hm-kc-hero h1{font-size:30px;}}

/* ============================================================
   HOMEPAGE v3 (design-handoff 2026-06-26) — nieuwe secties
   ============================================================ */
.hp-eyebrow{color:var(--orange);font-weight:700;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:8px;}
.hp-btn-ghost{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.4);}
.hp-btn-ghost:hover{background:rgba(255,255,255,.22);color:#fff;}

/* techniek-strip */
.hp-tech{text-align:center;margin:38px 0 0;}
.hp-tech h2{font-size:22px;font-weight:800;color:var(--navy);margin:0 0 22px;}
.hp-tech__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;}
.hp-tech__i{display:flex;flex-direction:column;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:4px;padding:22px 12px;text-decoration:none;color:var(--navy);font-weight:600;font-size:13.5px;text-align:center;transition:border-color .15s,background .15s;}
.hp-tech__i:hover{border-color:var(--orange);background:var(--tint-orange);color:var(--navy);}
.hp-tech__ic svg{width:30px;height:30px;}

/* USP-balk (5) — overschrijft de oude hp-usp */
.hp-usp{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr 1fr;gap:22px;margin-top:30px;padding:26px 0 6px;border-top:1px solid var(--line);}
.hp-usp .hp-u{display:flex;align-items:flex-start;gap:12px;font-size:inherit;color:inherit;line-height:normal;}
.hp-usp .hp-u svg{width:34px;height:34px;color:var(--navy);flex-shrink:0;}
.hp-usp .hp-u b{display:block;font-size:14px;font-weight:700;color:var(--navy);line-height:1.3;}
.hp-usp .hp-u span{display:block;font-size:12px;color:var(--gray);margin-top:4px;line-height:1.45;}

/* Direct naar ons assortiment */
.hp-assort{margin:46px 0 0;}
.hp-assort__head{text-align:center;margin-bottom:28px;}
.hp-assort__head h2{font-size:26px;font-weight:800;color:var(--navy);margin:0;}
.hp-assort__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.hp-promo{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:4px;padding:26px 24px;text-decoration:none;transition:box-shadow .15s,transform .15s;}
.hp-promo:hover{box-shadow:0 14px 32px rgba(11,33,74,.1);transform:translateY(-3px);}
.hp-promo__ic{width:50px;height:50px;border-radius:4px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.hp-promo__ic svg{width:26px;height:26px;}
.hp-promo__t{font-size:17px;font-weight:700;color:var(--navy);margin-bottom:6px;}
.hp-promo__d{font-size:13.5px;color:var(--gray);line-height:1.5;margin-bottom:14px;flex:1;}
.hp-promo__link{font-weight:600;font-size:13.5px;}

/* Onze hardlopers */
.hp-hard{margin:48px 0 0;}
.hp-hard__head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px;gap:16px;}
.hp-hard__head h2{font-size:26px;font-weight:800;color:var(--navy);margin:0;}
.hp-hard__all{color:var(--navy);font-weight:600;font-size:14px;border:1.5px solid #c5cfdb;border-radius:4px;padding:9px 16px;text-decoration:none;white-space:nowrap;}
.hp-hard__all:hover{border-color:var(--orange);color:var(--orange);}
.hp-hard__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.hp-hcard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:4px;overflow:hidden;text-decoration:none;transition:box-shadow .15s,transform .15s;}
.hp-hcard:hover{box-shadow:0 14px 32px rgba(11,33,74,.13);transform:translateY(-3px);}
.hp-hcard__img{position:relative;height:200px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #f0f3f6;padding:16px;}
.hp-hcard__img img{max-width:80%;max-height:100%;object-fit:contain;}
.hp-hcard__badge{position:absolute;top:12px;left:12px;background:var(--orange);color:#fff;font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;padding:5px 10px;border-radius:4px;}
.hp-hcard__body{padding:18px;display:flex;flex-direction:column;flex:1;}
.hp-hcard__t{font-size:16px;font-weight:700;color:var(--navy);line-height:1.3;margin-bottom:8px;min-height:42px;}
.hp-hcard__price{font-size:20px;font-weight:800;color:var(--navy);margin-top:auto;}
.hp-hcard__price small{font-size:12px;font-weight:400;color:var(--gray-2);}
.hp-hcard__cta{margin-top:14px;text-align:center;border:1.5px solid var(--navy);border-radius:4px;color:var(--navy);font-weight:600;font-size:14px;padding:10px;transition:background .15s,color .15s;}
.hp-hcard:hover .hp-hcard__cta{background:var(--navy);color:#fff;}

/* zakelijke band */
.hp-zband{margin:48px 0 10px;}
.hp-zband__inner{position:relative;overflow:hidden;background:linear-gradient(180deg,#edf2f7 0%,#f7fafc 55%,#e9eff5 100%);border:1px solid #e1e7ee;border-radius:4px;padding:26px 44px;display:grid;grid-template-columns:1fr 1.5fr;gap:44px;align-items:center;}
.hp-zband__txt,.hp-zband__usps{position:relative;z-index:1;}
.hp-zband__head{display:flex;align-items:center;gap:14px;margin-bottom:14px;}
.hp-zband__num{width:34px;height:34px;border-radius:4px;background:var(--navy);color:#fff;font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:center;flex:none;}
.hp-zband__txt h2{font-size:23px;font-weight:800;color:var(--navy);margin:0;line-height:1.2;}
.hp-zband__txt p{font-size:14.5px;color:#5a6b7d;line-height:1.65;margin:0 0 22px;max-width:380px;}
.hp-zband__btn{display:inline-flex;align-items:center;gap:10px;background:var(--navy);color:#fff;font-weight:600;font-size:14.5px;padding:13px 24px;border-radius:4px;text-decoration:none;transition:background .15s;}
.hp-zband__btn:hover{background:var(--blue);color:#fff;}
.hp-zband__btn svg{width:16px;height:16px;}
.hp-zband__usps{display:grid;grid-template-columns:repeat(5,1fr);}
.hp-zband__usp{text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;padding:0 12px;}
.hp-zband__usp:not(:first-child){border-left:1px solid #d7e0ea;}
.hp-zband__usp>svg{width:38px;height:38px;color:var(--navy);}
.hp-zband__usp b{display:block;font-weight:700;font-size:13px;color:var(--navy);line-height:1.3;}
.hp-zband__usp span{display:block;font-size:12px;color:#7a8a9a;line-height:1.3;}
@media (max-width:991px){.hp-tech__grid,.hp-usp,.hp-assort__grid,.hp-hard__grid{grid-template-columns:1fr 1fr;}.hp-zband__inner{grid-template-columns:1fr;gap:30px;}.hp-zband__usps{gap:8px;}}
@media (max-width:560px){.hp-zband__usps{grid-template-columns:1fr 1fr 1fr;row-gap:22px;}.hp-zband__usp:nth-child(4){border-left:none;}}
@media (max-width:560px){.hp-tech__grid,.hp-usp,.hp-assort__grid,.hp-hard__grid{grid-template-columns:1fr;}}

/* ============================================================
   FORMULIEREN (login/registratie/contact/checkout)
   ============================================================ */
.form-control-label,.col-form-label,.page-customer-account label,.contact-form label{color:var(--ink);font-weight:600;}
.required-field .form-control-label .text-danger,.text-danger{color:#c0392b;}
.input-group .form-control:focus,.form-control:focus{border-color:var(--navy);}

/* ============================================================
   CONTENT / CMS-pagina's
   ============================================================ */
#content.page-content.card,.page-cms,.cms-content{border-radius:4px;}
#main .page-header h2,.cms-content h2,.page-cms h2{color:var(--ink);font-weight:700;}

/* ============================================================
   FOOTER — navy, meerkoloms (Hermes-design)
   ============================================================ */
/* LET OP: Classic heeft 2 footers — een leeg <footer class="page-footer"> en de
   echte <footer id="footer"> (sibling, niet genest). Target dus #footer.
   Thema-CSS laadt na deze module -> structurele regels met !important. */
#footer{background:var(--navy)!important;color:#fff!important;margin-top:0;padding:0 0 10px!important;}
#footer .container{max-width:1110px;}
#footer a{color:#aab6c6!important;}
#footer a:hover{color:#fff!important;}
#footer .h3,#footer .h4,#footer h3,#footer h4,#footer .links .title,
#footer .block-contact-title,#footer #block-newsletter-label{color:#fff!important;}
#footer,.footer-container,#footer .block_newsletter,#footer .block-social,
.footer-container .links ul,#footer .links ul{box-shadow:none!important;border:none!important;}
.footer-container,#footer .block_newsletter,#footer .block-social,
.footer-container .links ul,#footer .links ul{background:transparent!important;}
#footer .links a,#footer .account-list a,#footer #contact-infos,#footer .block-contact,
#footer .block_newsletter p,#footer .block_newsletter .text-muted{color:#aab6c6!important;font-size:14px;}
#footer .block-contact .material-icons{color:#fff!important;}
/* nieuwsbrief-veld + knop */
#footer .block_newsletter input[type=email],#footer .block_newsletter input[type=text]{height:44px!important;border:1px solid rgba(255,255,255,.22)!important;border-radius:4px!important;background:#fff!important;color:var(--ink)!important;}
#footer .block_newsletter .btn,#footer .block_newsletter button[type=submit],
#footer .block_newsletter input[type=submit]{background:var(--orange)!important;border-color:var(--orange)!important;color:#fff!important;border-radius:4px!important;}
#footer .block-social a,#footer .social-sharing a{color:#fff!important;}
/* onderbalk / copyright */
.footer-copyright,#footer .copyright,.copyright{
  color:#8595a8!important;border-top:1px solid rgba(255,255,255,.12);background:var(--navy)!important;}

/* ============================================================
   FOOTER — EXACT volgens ontwerp (anker + merk + 4 kolommen + onderbalk).
   STAAT BEWUST IN DE MODULE (niet in thema-custom.css): deze CSS laadt via een
   directe <link> in hookDisplayHeader en is daardoor NIET onderhevig aan de
   CCC-cache van het thema, die op de VPS hardnekkig stale bleef (reuzen-anker).
   ============================================================ */
#footer{padding:0!important;}
.hm-footer{position:relative;background:#0c1e34 url('/themes/hemkes/assets/img/footer-ship.jpg') right center/cover no-repeat;color:#fff!important;}
.hm-footer::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,30,52,.95) 0%,rgba(12,30,52,.7) 45%,rgba(12,30,52,.4) 100%);z-index:0;}
.hm-footer-inner{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:46px 24px 36px;display:grid;grid-template-columns:1.6fr 1fr 1.25fr 1fr 1fr;gap:34px;}
/* design-sectienummer (handoff-marker) */
.hm-footer .hm-f-num{position:absolute;top:-6px;left:24px;width:34px;height:34px;border-radius:4px;background:#16304d;border:1px solid rgba(255,255,255,.14);color:#fff;font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:center;}

/* merk-kolom */
.hm-footer .hm-f-brand{padding-top:0;}
.hm-footer .hm-f-brand .hm-f-logo{display:inline-flex;align-items:center;gap:12px;margin-bottom:14px;color:#fff!important;text-decoration:none;}
.hm-footer .hm-f-brand .hm-f-logo svg{width:30px!important;height:30px!important;flex:none;}
.hm-footer .hm-f-word b{display:block;font-weight:800;font-size:21px;letter-spacing:5px;color:#fff;line-height:1;}
.hm-footer .hm-f-word > span{display:block;font-size:9px;letter-spacing:5px;color:#E8541E;font-weight:700;margin-top:4px;}
.hm-footer .hm-f-brand p{font-size:13.5px;color:#aebccd;line-height:1.65;max-width:230px;margin:0 0 20px;}
#footer .hm-f-offerte,.hm-footer .hm-f-offerte{display:inline-flex;align-items:center;gap:10px;background:var(--orange);color:#fff!important;font-weight:600;font-size:14px;padding:12px 22px;border-radius:4px;text-decoration:none;transition:background .15s;}
.hm-footer .hm-f-offerte:hover{background:var(--orange-deep);}
.hm-footer .hm-f-offerte svg{width:16px;height:16px;}

/* link-/inhoud-kolommen */
.hm-footer .hm-f-col{padding-top:0;}
.hm-footer .hm-f-col h4{font-size:14px;font-weight:700;color:#fff;margin:0 0 16px;letter-spacing:.2px;}
.hm-footer .hm-f-col a{display:block;font-size:14px;color:#aebccd!important;margin-bottom:11px;text-decoration:none;}
.hm-footer .hm-f-col a:hover{color:#fff!important;}
.hm-footer .hm-f-addr{font-size:14px;color:#aebccd;line-height:1.7;margin:0 0 16px;}
.hm-footer .hm-f-addr--note{color:#8696aa;margin-bottom:0;}

/* contact-kolom: icoon + tekst */
.hm-footer .hm-f-contact a,.hm-footer .hm-f-contact .hm-f-ci{display:flex;align-items:flex-start;gap:10px;margin-bottom:13px;color:#aebccd!important;font-size:14px;text-decoration:none;line-height:1.45;}
.hm-footer .hm-f-contact a:hover{color:#fff!important;}
.hm-footer .hm-f-contact svg{width:16px;height:16px;flex-shrink:0;margin-top:1px;color:#E8541E;}
.hm-footer .hm-f-contact .hm-f-phone{color:#fff!important;font-weight:600;}

/* onderbalk */
.hm-footer .hm-footer-bottom{position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.12);}
.hm-footer .hm-footer-bottom-inner{max-width:1200px;margin:0 auto;padding:18px 24px;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:12.5px;color:#8595a8;}
.hm-footer .hm-fb-left{display:flex;align-items:center;gap:22px;flex-wrap:wrap;}
.hm-footer .hm-fb-links{display:flex;gap:22px;}
.hm-footer .hm-fb-links a{color:#aebccd!important;text-decoration:none;}
.hm-footer .hm-fb-links a:hover{color:#fff!important;}
.hm-footer .hm-f-social{display:flex;gap:10px;}
.hm-footer .hm-f-social a{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:#fff!important;transition:background .15s;}
.hm-footer .hm-f-social a:hover{background:var(--orange);}
.hm-footer .hm-f-social svg{width:17px;height:17px;}

@media (max-width:991px){
  .hm-footer-inner{grid-template-columns:1fr 1fr 1fr;gap:28px;}
  .hm-footer::before{background:rgba(12,30,52,.9);}
}
@media (max-width:600px){
  /* footer-menu's onder elkaar (1 kolom) op mobiel */
  .hm-footer-inner{grid-template-columns:1fr;gap:28px;padding:36px 22px 30px;}
  .hm-footer .hm-footer-bottom-inner{flex-direction:column;gap:12px;text-align:center;}
  .hm-footer .hm-fb-left{flex-direction:column;gap:8px;}
}

/* ============================================================
   HOMEPAGE — hero + zakelijke band (ook uit thema-CSS hierheen, zelfde reden)
   ============================================================ */
.hp-hero{position:relative;overflow:hidden;margin-top:0;min-height:440px;display:flex;align-items:center;background:#0e2742;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.hp-hero .hp-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 45%;z-index:0;}
.hp-hero .hp-ov{position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(8,22,40,.93) 0%,rgba(8,22,40,.78) 34%,rgba(8,22,40,.40) 58%,rgba(8,22,40,0) 82%);}
.hp-hero .hp-hc{position:relative;z-index:2;padding:52px 24px;max-width:1200px;width:100%;margin:0 auto;}
.hp-hero .hp-hc h1,.hp-hero .hp-hc .hp-lead,.hp-hero .hp-hc .hp-hero-btns{max-width:560px;}
.hp-hero h1{font-size:48px;line-height:1.06;font-weight:800;color:#fff;letter-spacing:-.5px;margin-bottom:16px;text-shadow:0 1px 8px rgba(0,0,0,.35);}
.hp-hero .hp-lead{font-size:17px;color:#cdd8e6;line-height:1.55;margin-bottom:26px;max-width:430px;}
.hp-hero-btns{display:flex;gap:14px;flex-wrap:wrap;}
/* secundaire hero-knop = transparant op donker (hp-btn-white blijft elders wit) */
.hp-hero .hp-btn-white{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.4);}
.hp-hero .hp-btn-white:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.6);color:#fff;}

.hp-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:4px;font-weight:600;font-size:15px;padding:13px 24px;cursor:pointer;border:none;text-decoration:none;}
.hp-btn-blue{background:var(--orange);color:#fff;}
.hp-btn-blue:hover{background:var(--orange-deep);color:#fff;}
.hp-btn-white{background:#fff;color:var(--navy);border:1px solid #c5cfdb;}
.hp-btn-white:hover{background:#f5f8fb;border-color:var(--navy);color:var(--navy);}

.hp-reder{position:relative;background:#fff;border:1px solid var(--line);border-radius:4px;margin-top:18px;padding:22px 32px;overflow:hidden;min-height:126px;}
.hp-reder .hp-reder-bg{position:absolute;right:0;top:0;bottom:0;width:42%;height:100%;object-fit:cover;z-index:0;}
.hp-reder .hp-ov2{position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,#fff 0%,#fff 42%,rgba(255,255,255,.4) 64%,rgba(255,255,255,0) 80%);}
.hp-reder .hp-rc{position:relative;z-index:2;max-width:520px;}
.hp-reder h2{font-size:21px;font-weight:700;color:var(--ink);margin-bottom:8px;}
.hp-reder p{font-size:14.5px;color:#46566a;line-height:1.5;margin-bottom:14px;max-width:430px;}
.hp-reder .hp-btn{padding:11px 20px;font-size:14px;}

/* ---- category row ---- */
.hp-cats{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:18px;}
.hp-cat{background:#fff;border:1px solid var(--line);border-radius:4px;padding:20px 18px 18px;display:flex;flex-direction:column;color:var(--ink);transition:box-shadow .15s ease,border-color .15s ease;}
.hp-cat:hover{border-color:#c5d0de;box-shadow:0 6px 18px rgba(21,41,76,.07);color:var(--ink);}
.hp-cat .hp-ci{width:30px;height:30px;color:var(--navy);stroke-width:1.6;margin-bottom:12px;}
.hp-cat h3{font-size:16px;font-weight:700;color:var(--ink);line-height:1.2;margin-bottom:7px;}
.hp-cat p{font-size:13px;color:var(--gray);line-height:1.4;margin-bottom:14px;}
.hp-cat .hp-catimg{width:100%;height:220px;margin-top:auto;object-fit:contain;}

/* ---- promo cards ---- */
.hp-promos{display:grid;grid-template-columns:1.95fr 1fr;gap:18px;margin-top:18px;}
.hp-sailor{position:relative;border-radius:4px;overflow:hidden;background:linear-gradient(115deg,#0e2742 0%,#0e2742 100%);padding:24px 32px;display:flex;align-items:center;}
.hp-sailor .hp-sc{position:relative;z-index:2;max-width:330px;}
.hp-sailor h2{color:#fff;font-size:23px;font-weight:700;margin-bottom:12px;}
.hp-sailor ul{list-style:none;display:flex;flex-direction:column;gap:8px;margin-bottom:14px;padding:0;}
.hp-sailor ul li{display:flex;align-items:center;gap:11px;color:#e8eef7;font-size:14.5px;}
.hp-sailor ul li svg{width:16px;height:16px;color:#7fb0e6;flex-shrink:0;}
.hp-sailor .hp-price{color:#fff;font-size:24px;font-weight:700;margin-bottom:16px;}
.hp-sailor .hp-price small{font-size:13px;font-weight:400;color:#c3d0e2;margin-left:4px;}
.hp-sailor-btns{display:flex;gap:12px;flex-wrap:wrap;}
.hp-btn-sm{display:inline-flex;align-items:center;justify-content:center;border-radius:4px;font-weight:600;font-size:14px;padding:11px 20px;cursor:pointer;border:none;text-decoration:none;white-space:nowrap;}
.hp-btn-onwhite{background:#fff;color:var(--navy);}
.hp-btn-onwhite:hover{background:#eef2f8;color:var(--navy);}
.hp-btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55);}
.hp-btn-ghost:hover{background:rgba(255,255,255,.12);color:#fff;}
.hp-sailor-img{position:absolute;right:16px;top:50%;transform:translateY(-50%);width:55%;height:90%;z-index:1;}
.hp-sailor-img img{width:100%;height:100%;object-fit:contain;background:transparent;}

.hp-mobil{background:#fff;border:1px solid var(--line);border-radius:4px;padding:28px 28px 0;position:relative;overflow:hidden;display:flex;flex-direction:column;}
.hp-mobil h2{font-size:21px;font-weight:700;color:var(--ink);margin-bottom:10px;}
.hp-mobil .hp-ms{font-size:15px;color:#33414f;font-weight:600;line-height:1.35;margin-bottom:16px;}
.hp-mobil .hp-mq{font-size:13.5px;color:var(--gray);margin-bottom:16px;}
.hp-mobil .hp-btn{align-self:flex-start;padding:11px 20px;font-size:14px;margin-bottom:28px;}
.hp-mobil .hp-mobimg{position:absolute;right:14px;bottom:0;width:135px;height:150px;object-fit:contain;z-index:0;}

/* ---- usp bar ---- */
.hp-usp{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:18px;padding:18px 2px 4px;border-top:1px solid var(--line);}
.hp-usp .hp-u{display:flex;align-items:flex-start;gap:9px;font-size:12.5px;color:#3a4a5a;line-height:1.35;}
.hp-usp .hp-u svg{width:22px;height:22px;color:var(--navy);stroke-width:1.5;flex-shrink:0;}

/* ---- partners ---- */
.hp-partners{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:22px 20px 14px;margin-top:10px;border-top:1px solid var(--line);}
.hp-plogo{text-align:center;color:#5e6b7a;}
.hp-plogo b{display:block;font-size:21px;font-weight:800;letter-spacing:1px;color:#46535f;line-height:1;}
.hp-plogo span{display:block;font-size:9px;letter-spacing:1px;color:#9aa6b2;margin-top:5px;}

@media (max-width:767px){
  .hp-cats{grid-template-columns:1fr 1fr;}
  .hp-promos{grid-template-columns:1fr;}
  .hp-sailor-img{display:none;}
  .hp-sailor .hp-sc{max-width:none;}
  .hp-usp{grid-template-columns:1fr 1fr;gap:14px;}
  .hp-partners{flex-wrap:wrap;gap:18px;justify-content:center;}
  .hp-hero h1{white-space:normal;}
  .hp-hero{min-height:auto;}
  .hp-hero .hp-hc{max-width:none;padding:30px 22px;}
  .hp-hero h1{font-size:30px;}
  .hp-hero .hp-ov{background:linear-gradient(180deg,rgba(8,22,40,.86) 0%,rgba(8,22,40,.78) 100%);}
  .hp-reder .hp-reder-bg{width:100%;opacity:.22;}
  .hp-reder .hp-rc{max-width:none;}
}

/* ============================================================
   NIEUWE CATEGORIE-LANDINGS (ATEX 28 / MF-HF 29 / STROOM 30)
   design-handoff 28-06-2026
   ============================================================ */
/* geen sidebar + geen lege PS-productgrid op deze landingspagina's */
body.category-id-28 #left-column,body.category-id-29 #left-column,body.category-id-30 #left-column{display:none!important;}
body.category-id-28 #content-wrapper,body.category-id-29 #content-wrapper,body.category-id-30 #content-wrapper{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%;width:100%;}
/* MF/HF (29) = maatwerk + Stroom (30) = eigen secties -> standaard productgrid verbergen; ATEX(28) toont de echte grid */
body.category-id-29 #js-product-list,body.category-id-29 #js-product-list-top,body.category-id-29 #js-product-list-bottom,
body.category-id-30 #js-product-list,body.category-id-30 #js-product-list-top,body.category-id-30 #js-product-list-bottom{display:none!important;}
/* productgrid 4-koloms (design) op alle categoriepagina's */
.page-category #js-product-list .products{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:0;}
.page-category #js-product-list .products > .product,.page-category #js-product-list .products > .js-product{width:auto;max-width:100%;flex:none;padding:0;margin:0;}
@media (max-width:991px){.page-category #js-product-list .products{grid-template-columns:repeat(3,1fr);}}
@media (max-width:680px){.page-category #js-product-list .products{grid-template-columns:1fr 1fr;}}
@media (max-width:420px){.page-category #js-product-list .products{grid-template-columns:1fr;}}

/* --- foto-hero (donker, full-bleed) --- */
.hm-phero{position:relative;overflow:hidden;color:#fff;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);background:#0e2742;}
.hm-phero__bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0;}
.hm-phero--atex .hm-phero__bg{background-color:#000;}
.hm-phero--stroom{background:#0e2742;}
.hm-phero__ov{position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(8,22,40,.95) 0%,rgba(8,22,40,.85) 32%,rgba(8,22,40,.55) 54%,rgba(8,22,40,.15) 76%,rgba(8,22,40,0) 100%);}
/* extra donkere gradient onderaan zodat de bullets altijd leesbaar zijn, ongeacht de foto */
.hm-phero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;z-index:1;pointer-events:none;background:linear-gradient(to top,rgba(8,22,40,.9) 0%,rgba(8,22,40,.55) 34%,rgba(8,22,40,0) 100%);}
.hm-phero--atex .hm-phero__ov{background:linear-gradient(100deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.35) 38%,rgba(0,0,0,0) 64%);}
.hm-phero--stroom .hm-phero__ov{background:linear-gradient(100deg,rgba(10,33,66,.93) 0%,rgba(10,33,66,.6) 40%,rgba(10,33,66,0) 70%);}
.hm-phero__inner{position:relative;z-index:2;max-width:1200px;margin:0 auto;padding:40px 24px 30px;min-height:320px;display:flex;flex-direction:column;}
.hm-phero h1{font-size:42px;font-weight:800;color:#fff;margin:auto 0 12px;letter-spacing:-.5px;}
.hm-phero__big{font-size:52px!important;}
.hm-phero p{font-size:16.5px;color:#bccadb;line-height:1.6;margin:0;max-width:660px;}
.hm-phero--mfhf p,.hm-phero--stroom p{color:#cdd9e6;}
.hm-phero__usps{display:flex;flex-wrap:wrap;gap:28px;margin-top:auto;padding-top:0;padding-bottom:0;max-width:none;justify-content:flex-start;}
.hm-phero__usps--compact{gap:28px;}
.hm-phero__usp{display:flex;align-items:center;gap:14px;}
.hm-phero__usp b{display:block;font-weight:700;font-size:16px;color:#fff;line-height:1.25;}
.hm-phero__usp span{display:block;font-size:13.5px;color:#fff;line-height:1.3;}
.hm-phero__usp--compact b{font-size:16px;}
.hm-phero__uspic{width:42px;height:42px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.hm-phero__uspic svg{width:40px;height:40px;}
.hm-phero--nousp .hm-phero__inner{padding-bottom:50px;}
@media (max-width:880px){.hm-phero h1{font-size:30px;}.hm-phero__big{font-size:36px!important;}.hm-phero__inner{padding-top:48px;min-height:0;}.hm-phero__usps{gap:18px 26px;}}

/* --- product-listing-secties op landings --- */
.hm-pl{max-width:1200px;margin:0 auto;padding:42px 24px 8px;}
.hm-pl__h{font-size:26px;font-weight:800;color:var(--navy);margin:0 0 24px;}
.hm-pl__h--sub{font-size:22px;margin-top:40px;}
.hm-pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
@media (max-width:991px){.hm-pgrid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.hm-pgrid{grid-template-columns:1fr;}}

/* --- generieke product-card (ATEX) --- */
.hm-pc{display:flex;flex-direction:column;background:#fff;border:1px solid #e6ebf0;border-radius:4px;overflow:hidden;transition:box-shadow .15s,transform .15s;}
.hm-pc:hover{box-shadow:0 14px 32px rgba(11,33,74,.13);transform:translateY(-3px);}
.hm-pc__img{position:relative;height:210px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #e3e9ef;padding:14px;}
.hm-pc__img img{max-width:80%;max-height:182px;object-fit:contain;}
.hm-pc__badge{position:absolute;top:12px;left:12px;background:var(--navy);color:#fff;font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;padding:5px 10px;border-radius:4px;}
.hm-pc__body{padding:18px;display:flex;flex-direction:column;flex:1;}
.hm-pc__name{font-size:16px;font-weight:700;color:var(--navy);line-height:1.3;margin-bottom:5px;min-height:42px;}
.hm-pc__note{font-size:12.5px;color:var(--gray-2);margin-bottom:6px;}
.hm-pc__price{margin-top:auto;padding-top:10px;display:flex;align-items:baseline;gap:8px;}
.hm-pc__price span{font-size:21px;font-weight:800;color:var(--navy);white-space:nowrap;}
.hm-pc__price em{font-size:12px;color:var(--gray-2);font-style:normal;}
.hm-pc__cta{display:block;text-align:center;width:100%;margin-top:14px;background:#fff;border:1.5px solid var(--navy);border-radius:4px;color:var(--navy);font-weight:600;font-size:14px;padding:11px;text-decoration:none;transition:background .15s,color .15s;}
.hm-pc__cta:hover{background:var(--navy);color:#fff;text-decoration:none;}
.hm-pc__stock{display:flex;align-items:center;gap:7px;font-size:12.5px;color:#6b7a8a;margin-top:13px;}
.hm-pc__dot{width:9px;height:9px;border-radius:50%;background:var(--green);flex-shrink:0;}

/* --- victron-card (Stroom) --- */
.hm-vc{display:flex;flex-direction:column;background:#fff;border:1px solid #e6ebf0;border-radius:4px;overflow:hidden;transition:box-shadow .15s,transform .15s;}
.hm-vc:hover{box-shadow:0 14px 32px rgba(11,33,74,.13);transform:translateY(-3px);}
.hm-vc__img{height:188px;background:#eef1f4;border-bottom:1px solid #e6ebf0;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.hm-vc__img img{max-width:82%;max-height:82%;object-fit:contain;}
.hm-vc__btn{cursor:pointer;}
.hm-vc__body{padding:18px;display:flex;flex-direction:column;flex:1;}
.hm-vc__name{font-size:16px;font-weight:700;color:var(--navy);line-height:1.3;margin-bottom:6px;min-height:42px;}
.hm-vc__type{font-size:13px;color:var(--gray-2);margin-bottom:14px;}
.hm-vc__price{display:flex;align-items:baseline;gap:8px;margin-top:auto;margin-bottom:16px;}
.hm-vc__price span{font-size:20px;font-weight:800;color:var(--orange);white-space:nowrap;}
.hm-vc__price em{font-size:12px;color:var(--gray-2);font-style:normal;}
.hm-vc__btn{display:block;text-align:center;width:100%;background:var(--orange);border:none;border-radius:4px;color:#fff;font-weight:700;font-size:13px;letter-spacing:.3px;padding:12px;text-decoration:none;transition:background .15s;}
.hm-vc__btn:hover{background:var(--orange-deep);color:#fff;text-decoration:none;}

/* --- mf/hf component-card (geen prijs) --- */
.hm-mc{display:flex;flex-direction:column;background:#fff;border:1px solid #eef2f6;border-radius:4px;overflow:hidden;}
.hm-mc__img{height:170px;background:var(--tint);display:flex;align-items:center;justify-content:center;}
.hm-mc__img svg{width:54px;height:54px;}
.hm-mc__body{padding:18px 18px 22px;display:flex;flex-direction:column;flex:1;}
.hm-mc__name{font-size:15px;font-weight:700;color:var(--navy);line-height:1.32;margin-bottom:12px;}
.hm-mc__rule{width:26px;height:3px;background:var(--orange);border-radius:4px;display:block;margin-bottom:10px;}
.hm-mc__desc{font-size:13px;color:var(--gray);line-height:1.5;}

/* --- mf/hf maatwerk-blok --- */
.hm-maat{position:relative;overflow:hidden;background:var(--tint);border:1px solid #eef2f6;border-radius:4px;padding:34px 40px;display:flex;align-items:center;gap:30px;flex-wrap:wrap;margin:30px 0 0;}
.hm-maat--band{margin-top:44px;}
.hm-maat__band{position:absolute;right:0;top:0;bottom:0;width:58%;background-size:cover;background-position:center;opacity:.42;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 30%,#000 60%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 30%,#000 60%,transparent 100%);}
.hm-maat__ic{position:relative;width:62px;height:62px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.hm-maat__ic svg{width:32px;height:32px;}
.hm-maat__txt{position:relative;flex:1;min-width:300px;}
.hm-maat__txt h2{margin:0 0 8px;font-size:23px;font-weight:800;color:var(--navy);}
.hm-maat__txt p{margin:0;font-size:14.5px;line-height:1.6;color:var(--gray);max-width:560px;}
.hm-maat__cta{position:relative;display:flex;flex-direction:column;gap:12px;align-items:flex-end;flex-shrink:0;}
.hm-maat__btn{display:inline-flex;align-items:center;gap:10px;background:var(--orange);border:none;border-radius:4px;color:#fff;font-weight:600;font-size:15px;padding:14px 24px;text-decoration:none;box-shadow:0 6px 16px rgba(232,84,30,.28);transition:background .15s;}
.hm-maat__btn:hover{background:var(--orange-deep);color:#fff;text-decoration:none;}
.hm-maat__btn svg{width:16px;height:16px;}
.hm-maat__link{color:var(--navy);font-weight:700;font-size:13px;text-decoration:none;}
.hm-maat__link:hover{color:var(--orange);}
@media (max-width:767px){.hm-maat__cta{align-items:stretch;width:100%;}.hm-maat__band{width:100%;opacity:.18;}}

/* ============================================================
   SMEERMIDDELEN (cat 27) — design-handoff 28-06-2026
   ============================================================ */
body.category-id-27 #left-column{display:none!important;}
body.category-id-27 #content-wrapper{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%;width:100%;}
body.category-id-27 #js-product-list,body.category-id-27 #js-product-list-top,body.category-id-27 #js-product-list-bottom{display:none!important;}

/* hero (licht, foto rechts, full-bleed) */
.hm-smhero{position:relative;overflow:hidden;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);background:linear-gradient(120deg,#EAF1F8 0%,#F4F8FC 55%,#EAF1F8 100%);}
.hm-smhero__bg{position:absolute;right:0;top:0;height:100%;width:50%;object-fit:cover;object-position:center;}
.hm-smhero__ov{position:absolute;inset:0;background:linear-gradient(90deg,#EAF1F8 0%,rgba(234,241,248,.97) 34%,rgba(234,241,248,.6) 46%,rgba(234,241,248,0) 60%);}
.hm-smhero__inner{position:relative;max-width:1200px;margin:0 auto;padding:48px 24px;display:flex;flex-direction:column;align-items:flex-start;min-height:300px;justify-content:center;}
.hm-smhero__inner>*{max-width:470px;}
.hm-smhero__eyebrow{font-size:13px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#0e2742;margin-bottom:14px;}
.hm-smhero h1{font-size:38px;line-height:1.1;font-weight:800;color:var(--navy);margin:0 0 14px;}
.hm-smhero__lead{font-size:17px;line-height:1.4;font-weight:700;color:#0e2742;margin:0 0 16px;}
.hm-smhero__txt{font-size:14.5px;line-height:1.6;color:var(--gray);margin:0 0 24px;max-width:420px;}
.hm-smhero__btn{display:inline-flex;align-items:center;gap:10px;background:var(--navy);border-radius:4px;color:#fff;font-weight:600;font-size:15px;padding:14px 24px;text-decoration:none;transition:background .15s;}
.hm-smhero__btn:hover{background:var(--navy-2);color:#fff;text-decoration:none;}
.hm-smhero__btn svg{width:17px;height:17px;}
.hm-smhero__trust{display:flex;align-items:center;gap:10px;margin-top:20px;color:var(--gray-2);font-size:13px;max-width:340px;}
.hm-smhero__trust svg{width:18px;height:18px;flex-shrink:0;}
@media (max-width:767px){.hm-smhero__bg,.hm-smhero__ov{display:none;}.hm-smhero{background:#EAF1F8;}.hm-smhero h1{font-size:28px;}}

/* feature-balk */
.hm-smfeat{max-width:1200px;margin:0 auto;padding:34px 24px;display:grid;grid-template-columns:repeat(5,1fr);gap:28px;border-bottom:1px solid var(--line-2);}
.hm-smfeat__i{text-align:center;position:relative;}
.hm-smfeat__i--div::before{content:"";position:absolute;left:-14px;top:4px;bottom:4px;width:1px;background:#e7edf3;}
.hm-smfeat__ic{display:inline-flex;color:#0e2742;margin-bottom:10px;}
.hm-smfeat__ic svg{width:30px;height:30px;}
.hm-smfeat__t{font-size:14px;font-weight:700;color:var(--navy);margin-bottom:5px;}
.hm-smfeat__d{font-size:12.5px;color:var(--gray-2);line-height:1.45;}
@media (max-width:880px){.hm-smfeat{grid-template-columns:1fr 1fr 1fr;gap:24px;}.hm-smfeat__i--div::before{display:none;}}
@media (max-width:520px){.hm-smfeat{grid-template-columns:1fr 1fr;}}

/* portfolio-tabel + formulier */
.hm-smport{max-width:1200px;margin:0 auto;padding:56px 24px;display:grid;grid-template-columns:1.35fr 1fr;gap:40px;align-items:start;}
.hm-smport__h{margin:0 0 6px;font-size:26px;font-weight:800;color:var(--navy);}
.hm-smport__sub{margin:0 0 22px;font-size:14px;color:var(--gray-2);}
.hm-smport__foot{margin:14px 0 0;font-size:12px;color:#98a6b5;}
.hm-smtable{border:1px solid #d9e0e7;overflow:hidden;background:#fff;}
.hm-smtable__head{display:grid;grid-template-columns:150px 1.5fr 1.7fr;background:#0e2742;color:#fff;font-size:12.5px;font-weight:700;letter-spacing:.3px;}
.hm-smtable__head>div{padding:14px 18px;}
.hm-smtable__seg{display:grid;grid-template-columns:150px 1fr;border-top:2px solid var(--line-2);}
.hm-smtable__segname{padding:16px 18px;background:#fff;font-weight:600;font-size:13.5px;color:var(--navy);display:flex;align-items:center;}
.hm-smtable__row{display:grid;grid-template-columns:1.5fr 1.7fr;border-top:1px solid #f0f3f7;}
.hm-smtable__row:first-child{border-top:none;}
.hm-smtable__row:hover{background:#F8FAFC;}
.hm-smtable__toep{padding:14px 18px;font-size:13.5px;color:var(--gray);line-height:1.45;}
.hm-smtable__prod{padding:14px 18px;font-size:13.5px;color:var(--navy);font-weight:600;line-height:1.45;}
.hm-smform{background:#fff;border:1px solid var(--line);border-radius:4px;padding:30px 32px;}
.hm-smform h2{margin:0 0 6px;font-size:22px;font-weight:800;color:var(--navy);}
.hm-smform>p{margin:0 0 22px;font-size:13.5px;color:var(--gray-2);line-height:1.5;}
.hm-smform label{display:block;margin-bottom:15px;}
.hm-smform label span{display:block;font-size:13px;font-weight:600;color:var(--navy);margin-bottom:6px;}
.hm-smform label span i{color:var(--orange);font-style:normal;}
.hm-smform input,.hm-smform select,.hm-smform textarea{width:100%;border:1.5px solid #d6dee6;border-radius:4px;padding:12px 13px;font:14px Inter,sans-serif;outline:none;background:#fff;color:var(--ink);}
.hm-smform input:focus,.hm-smform select:focus,.hm-smform textarea:focus{border-color:#0e2742;}
.hm-smform textarea{resize:vertical;}
.hm-smform button{width:100%;margin-top:4px;background:var(--navy);border:none;border-radius:4px;color:#fff;font-weight:600;font-size:15px;padding:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px;transition:background .15s;}
.hm-smform button:hover{background:var(--navy-2);}
.hm-smform button svg{width:16px;height:16px;}
.hm-smform__note{display:flex;align-items:center;gap:8px;color:#98a6b5;font-size:12px;margin-top:12px;}
.hm-smform__note svg{width:14px;height:14px;flex-shrink:0;}
@media (max-width:880px){.hm-smport{grid-template-columns:1fr;}}

/* waarom Mobil */
.hm-smwhy-wrap{max-width:1200px;margin:0 auto;padding:36px 24px 24px;}
.hm-smwhy{background:#EEF3FA;border-radius:4px;padding:40px 44px;}
.hm-smwhy h2{margin:0 0 30px;font-size:22px;font-weight:800;color:#0e2742;}
.hm-smwhy__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;}
.hm-smwhy__i{display:flex;gap:14px;align-items:flex-start;}
.hm-smwhy__ic{display:inline-flex;color:#0e2742;flex-shrink:0;margin-top:2px;}
.hm-smwhy__ic svg{width:30px;height:30px;}
.hm-smwhy__t{font-size:14.5px;font-weight:700;color:#0e2742;margin-bottom:5px;}
.hm-smwhy__d{font-size:13.5px;color:var(--gray);line-height:1.5;}
@media (max-width:880px){.hm-smwhy__grid{grid-template-columns:1fr 1fr;gap:28px;}.hm-smwhy{padding:30px 28px;}}
@media (max-width:520px){.hm-smwhy__grid{grid-template-columns:1fr;}}

/* ============================================================
   KENNISCENTRUM v2 (CMS 17) — design-handoff 28-06-2026
   (overschrijft de v1-hero hierboven: nu wit, 2-koloms + zoek rechts)
   ============================================================ */
.hm-kc-hero{background:#fff;color:inherit;border-bottom:1px solid var(--line-2);width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.hm-kc-hero__inner{max-width:1200px;margin:0 auto;padding:34px 24px 38px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;text-align:left;}
.hm-kc-bc{font-size:13px;color:#9aa8b6;margin-bottom:16px;}
.hm-kc-hero h1{font-size:40px;font-weight:800;color:var(--navy);margin:0 0 14px;letter-spacing:-.3px;}
.hm-kc-hero .hm-kc-lead{font-size:15.5px;color:var(--gray-2);max-width:460px;line-height:1.6;margin:0;}
.hm-kc-searchbox{display:flex;background:#fff;border:1px solid #dbe3ec;border-radius:4px;overflow:hidden;box-shadow:0 4px 16px rgba(14,39,66,.06);}
.hm-kc-searchbox input{flex:1;border:none;outline:none;padding:16px 20px;font-size:15px;color:var(--ink);background:none;}
.hm-kc-searchbox button{background:none;border:none;display:flex;align-items:center;padding:0 20px;color:var(--navy);cursor:pointer;}
.hm-kc-searchbox button svg{width:20px;height:20px;}
.hm-kc-pop{margin-top:16px;display:flex;align-items:center;flex-wrap:wrap;gap:14px;font-size:13px;}
.hm-kc-pop>span{color:#9aa8b6;}
.hm-kc-pop a{color:#1763a8;font-weight:600;text-decoration:none;}
.hm-kc-pop a:hover{color:var(--orange-deep);}

/* onderwerpen-band */
.hm-kc-topics{background:#F5F7FA;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);text-align:left;}
.hm-kc-topics__inner{max-width:1200px;margin:0 auto;padding:46px 24px 24px;}
.hm-kc-topics h2{font-size:24px;font-weight:800;color:var(--navy);margin:0 0 22px;}
.hm-kc-topics__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;}
.hm-kc-topic{background:#fff;border:1px solid var(--line);border-radius:4px;padding:24px 14px 22px;text-align:center;text-decoration:none;transition:border-color .15s,background .15s;}
.hm-kc-topic:hover{border-color:var(--orange);background:var(--tint-orange);}
.hm-kc-topic__ic{display:flex;align-items:center;justify-content:center;color:var(--navy);margin:0 auto 14px;}
.hm-kc-topic__ic svg{width:30px;height:30px;}
.hm-kc-topic__t{font-size:13px;font-weight:600;color:var(--navy);line-height:1.35;}
.hm-kc-topic__c{font-size:12px;color:var(--gray-2);margin-top:7px;}

/* uitgelichte artikelen + lijst */
.hm-kc-feat-wrap{background:#F5F7FA;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.hm-kc-feat__inner{max-width:1200px;margin:0 auto;padding:30px 24px 64px;}
.hm-kc-feat__inner h2{font-size:24px;font-weight:800;color:var(--navy);margin:0 0 22px;}
.hm-kc-feat__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:34px;}
.hm-kc-fcard{background:#fff;border:1px solid var(--line);border-radius:4px;overflow:hidden;text-decoration:none;display:block;transition:box-shadow .15s;}
.hm-kc-fcard:hover{box-shadow:0 14px 32px rgba(11,33,74,.12);}
.hm-kc-fcard__img{height:175px;background:#eef2f6;overflow:hidden;}
.hm-kc-fcard__img img{width:100%;height:100%;object-fit:cover;display:block;}
.hm-kc-fcard__body{padding:20px 22px 24px;}
.hm-kc-fcard__t{font-size:18px;font-weight:700;color:var(--navy);line-height:1.3;margin-bottom:9px;}
.hm-kc-fcard__d{font-size:14px;color:var(--gray-2);line-height:1.55;margin-bottom:16px;}
.hm-kc-fcard__link{color:#1763a8;font-weight:600;font-size:14px;display:inline-flex;align-items:center;gap:7px;}
.hm-kc-fcard__link svg{width:15px;height:15px;}
.hm-kc-list{border:1px solid var(--line);border-radius:4px;overflow:hidden;background:#fff;box-shadow:0 2px 14px rgba(14,39,66,.05);}
.hm-kc-list__head{display:flex;align-items:center;gap:28px;padding:18px 28px;border-bottom:1px solid var(--line-2);font-size:13px;color:var(--gray-2);}
.hm-kc-list__tab{font-weight:600;color:var(--navy);border-bottom:2px solid var(--orange);padding-bottom:13px;margin-bottom:-19px;}
.hm-kc-list__tab--off{color:var(--gray-2);border-bottom-color:transparent;}
.hm-kc-list__count{margin-left:auto;}
.hm-kc-row{display:flex;align-items:center;gap:20px;padding:18px 28px;border-bottom:1px solid #f2f5f8;text-decoration:none;}
.hm-kc-row:hover{background:#fafcfe;}
.hm-kc-row__img{width:130px;height:78px;border-radius:4px;background:#eef2f6;flex-shrink:0;overflow:hidden;}
.hm-kc-row__img img{width:100%;height:100%;object-fit:cover;display:block;}
.hm-kc-row__body{flex:1;min-width:0;}
.hm-kc-row__t{font-size:16px;font-weight:700;color:var(--navy);margin-bottom:5px;line-height:1.3;}
.hm-kc-row__d{font-size:13.5px;color:var(--gray-2);line-height:1.5;max-width:560px;}
.hm-kc-row__meta{display:flex;flex-direction:column;align-items:flex-end;gap:14px;flex-shrink:0;}
.hm-kc-row__date{font-size:13px;color:#9aa8b6;white-space:nowrap;}
.hm-kc-row__link{font-size:14px;font-weight:600;color:#1763a8;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;}
.hm-kc-row__link svg{width:15px;height:15px;}
@media (max-width:991px){.hm-kc-hero__inner{grid-template-columns:1fr;gap:28px;}.hm-kc-topics__grid{grid-template-columns:repeat(3,1fr);}.hm-kc-feat__grid{grid-template-columns:1fr;}}
@media (max-width:560px){.hm-kc-topics__grid{grid-template-columns:1fr 1fr;}.hm-kc-hero h1{font-size:30px;}.hm-kc-row__img{display:none;}.hm-kc-row__meta{display:none;}}

/* ============================================================
   OFFERTE (CMS 9) — design-handoff "offerte"
   ============================================================ */
body.page-cms:has(.hm-off) .breadcrumb,body.page-cms:has(.hm-off) .page-header{display:none!important;}
body.page-cms:has(.hm-off) #left-column{display:none!important;}
body.page-cms:has(.hm-off) #content-wrapper{flex:0 0 100%;max-width:100%;width:100%;}
/* witte top-sectie over de volledige breedte (grijze zijkanten weg) */
body.page-cms:has(.hm-off) .page-content{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);overflow-x:hidden;}
body.page-cms:has(.hm-off) .page-content > .hm-off > .hm-off-top{padding-left:24px;padding-right:24px;}
.hm-off{font-family:'Inter',system-ui,sans-serif;}
.hm-off-top{max-width:1100px;margin:0 auto;padding:34px 24px 10px;}
.hm-off-bc{font-size:13px;color:#8395a8;margin-bottom:24px;}
.hm-off-bc span{color:#445469;}
.hm-off h1{font-size:42px;font-weight:800;color:var(--navy);margin:0 0 14px;letter-spacing:-.4px;}
.hm-off-lead{font-size:15.5px;color:#5a6b7d;line-height:1.65;max-width:560px;margin:0 0 40px;}
.hm-off-usps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:8px 0 44px;}
.hm-off-usp{text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px;padding:0 8px;}
.hm-off-usp:not(:first-child){border-left:1px solid #e3e9f0;}
.hm-off-usp>svg{width:34px;height:34px;color:var(--navy);}
.hm-off-usp__t{font-size:14.5px;font-weight:700;color:var(--navy);}
.hm-off-usp__d{font-size:13px;color:#8395a8;line-height:1.5;}
.hm-off-main{background:#F5F7FA;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.hm-off-main__inner{max-width:1100px;margin:0 auto;padding:56px 24px;display:grid;grid-template-columns:1.5fr 1fr;gap:40px;align-items:start;}
.hm-off-form{background:#fff;border:1px solid var(--line);border-radius:4px;padding:34px 36px;}
.hm-off-form h2{font-size:21px;font-weight:800;color:var(--navy);margin:0 0 22px;}
.hm-off-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.hm-off-grid .full{grid-column:1/3;}
.hm-off-grid input,.hm-off-grid textarea{width:100%;border:1.5px solid #d6dee6;border-radius:4px;padding:14px 15px;font:14px Inter,sans-serif;color:var(--navy);outline:none;box-sizing:border-box;}
.hm-off-grid input:focus,.hm-off-grid textarea:focus{border-color:var(--orange);}
.hm-off-grid textarea{resize:vertical;line-height:1.55;}
.hm-off-lbl{display:block;text-align:left;font:700 14px Inter,sans-serif;color:var(--navy);margin-bottom:6px;}
.hm-off-form label{text-align:left;}
.hm-off-hint{font-size:13px;color:#8395a8;line-height:1.5;margin:0 0 10px;}
.hm-off-submit{grid-column:1/3;justify-self:start;display:inline-flex;align-items:center;gap:12px;background:var(--orange);border:none;border-radius:4px;color:#fff;font:600 15px Inter,sans-serif;padding:14px 26px;cursor:pointer;margin-top:8px;}
.hm-off-submit:hover{background:var(--orange-deep);}
.hm-off-submit svg{width:17px;height:17px;}
.hm-off-side{display:flex;flex-direction:column;gap:18px;}
.hm-off-card{background:#F4F6F9;border:1px solid #e8ecf1;border-radius:4px;padding:22px 24px;}
.hm-off-card__h{display:flex;align-items:center;gap:13px;margin-bottom:12px;}
.hm-off-card__h img{width:38px;height:38px;border-radius:4px;object-fit:cover;flex-shrink:0;}
.hm-off-card__h svg{width:30px;height:30px;color:var(--navy);flex-shrink:0;}
.hm-off-card__t{font:800 16px Inter,sans-serif;color:var(--navy);}
.hm-off-card p{margin:0 0 16px;font-size:13.5px;color:#5a6b7d;line-height:1.6;}
.hm-off-card p:last-child{margin-bottom:0;}
.hm-off-wa{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1.5px solid #25D366;color:#1F8A4D;font:600 13.5px Inter,sans-serif;padding:10px 18px;border-radius:4px;text-decoration:none;}
.hm-off-wa svg{width:15px;height:15px;}
.hm-off-wa:hover{background:#25D366;color:#fff;}
.hm-off-bel{display:inline-flex;align-items:center;gap:10px;background:var(--navy);color:#fff;font:600 13.5px Inter,sans-serif;padding:11px 18px;border-radius:4px;text-decoration:none;}
.hm-off-bel:hover{background:var(--navy-2);color:#fff;}
.hm-off-bel svg{width:15px;height:15px;}
@media (max-width:880px){.hm-off-main__inner{grid-template-columns:1fr;}.hm-off-usps{grid-template-columns:1fr 1fr;}.hm-off-usp:nth-child(3){border-left:none;}}
@media (max-width:520px){.hm-off h1{font-size:30px;}.hm-off-usps{grid-template-columns:1fr;}.hm-off-usp{border-left:none!important;}.hm-off-grid{grid-template-columns:1fr;}.hm-off-grid .full,.hm-off-submit{grid-column:1;}}

/* Offerte — per-product variant (module hemkesquote): WITTE hero + has-product velden */
body#module-hemkesquote-quote #left-column,body#module-hemkesquote-quote #right-column{display:none;}
body#module-hemkesquote-quote #content-wrapper{flex:0 0 100%;max-width:100%;width:100%;}
/* Hero volledig wit, met duidelijke scheidingslijn onder de sectie */
.hm-off-hero{position:relative;overflow:hidden;background:#fff;color:var(--navy);width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);border-bottom:1px solid #e1e7ee;}
.hm-off-hero__circle{position:absolute;right:-60px;top:-60px;width:320px;height:320px;border:54px solid rgba(232,84,30,.06);border-radius:50%;z-index:0;}
.hm-off-hero__inner{position:relative;z-index:1;max-width:1100px;margin:0 auto;padding:36px 24px;display:grid;grid-template-columns:1fr 1.1fr;gap:46px;align-items:center;}
.hm-off-hero__img{display:flex;align-items:center;justify-content:center;height:260px;background:#fff;border-radius:6px;padding:0;box-sizing:border-box;overflow:hidden;}
.hm-off-hero__img img{width:100%;height:100%;object-fit:contain;transform:scale(1.55);}
.hm-off-hero__eyebrow{font:700 12px Inter,sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:var(--orange);margin-bottom:14px;}
.hm-off-hero h1{margin:0 0 16px;font:800 38px Inter,sans-serif;color:var(--navy);line-height:1.15;letter-spacing:-.5px;}
.hm-off-hero__lead{margin:0 0 26px;font-size:16.5px;color:#5a6b7d;line-height:1.65;}
.hm-off-hero__back{display:inline-flex;align-items:center;gap:10px;color:var(--blue);font:600 14.5px Inter,sans-serif;text-decoration:none;}
.hm-off-hero__back:hover{color:var(--orange);}
.hm-off-hero__back svg{width:17px;height:17px;}
.hm-off-bcwrap{max-width:1100px;margin:0 auto;padding:0 24px;}
.hm-off-req{color:var(--orange);}
.hm-off-opt{color:#9aabbc;font-weight:400;}
.hm-off-sub{grid-column:1/3;display:grid;grid-template-columns:2fr 1fr;gap:16px;}
.hm-off-grid input[readonly]{background:#F5F7FA;color:#5a6b7d;cursor:default;}
.hm-off-grid input[type=file]{display:none;}
.hm-off-drop{display:flex;align-items:center;gap:16px;border:1.5px solid #d6dee6;border-radius:4px;padding:18px 20px;background:#fff;cursor:pointer;margin:0;}
.hm-off-drop>svg{width:30px;height:30px;flex-shrink:0;}
.hm-off-drop__txt{flex:1;min-width:0;font-size:13.5px;color:#8395a8;line-height:1.5;}
.hm-off-drop__btn{flex-shrink:0;background:#fff;border:1.5px solid #d6dee6;border-radius:4px;color:var(--navy);font:600 13.5px Inter,sans-serif;padding:10px 18px;}
.hm-off-drop:hover{border-color:var(--orange);}
.hm-off-drop:hover .hm-off-drop__btn{border-color:var(--orange);color:var(--orange);}
.hm-off-waic{width:38px;height:38px;border-radius:4px;background:#25D366;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.hm-off-waic svg{width:22px;height:22px;}
.hm-off-errors{background:#fdecea;border:1px solid #f3c4bc;border-radius:4px;padding:12px 16px;margin-bottom:18px;color:#b23a26;font-size:14px;}
.hm-off-errors ul{margin:0;padding-left:18px;}
@media (max-width:880px){.hm-off-hero__inner{grid-template-columns:1fr;gap:26px;padding:34px 24px;}.hm-off-hero h1{font-size:30px;}.hm-off-hero__img{height:200px;}.hm-off-sub{grid-template-columns:1fr;}}

/* ============================================================
   ZAKELIJK — formulier-sectie (aanvulling op bestaande hm-zak)
   ============================================================ */
.hm-zak-form-sec{max-width:1120px;margin:0 auto;padding:8px 24px 60px;}
.hm-zak-form{background:var(--tint);border:1px solid var(--line-2);border-radius:4px;padding:44px 46px;display:grid;grid-template-columns:1.55fr 1fr;gap:48px;align-items:start;}
.hm-zak-form__l h2{margin:0 0 4px;font-size:24px;font-weight:800;color:var(--navy);}
.hm-zak-form__l p{margin:0 0 26px;font-size:14.5px;color:#5a6b7d;}
.hm-zak-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.hm-zak-fields input,.hm-zak-fields textarea{border:1px solid #dde3ea;background:#fff;color:var(--navy);border-radius:4px;padding:14px 15px;font:14px Inter,sans-serif;outline:none;width:100%;box-sizing:border-box;}
.hm-zak-fields input:focus,.hm-zak-fields textarea:focus{border-color:var(--orange);}
.hm-zak-fields textarea{grid-column:1/3;resize:vertical;line-height:1.5;}
.hm-zak-fields button{grid-column:1/3;justify-self:start;display:inline-flex;align-items:center;gap:10px;background:var(--orange);border:none;border-radius:4px;color:#fff;font:600 15px Inter,sans-serif;padding:14px 26px;cursor:pointer;}
.hm-zak-fields button:hover{background:var(--orange-deep);}
.hm-zak-fields button svg{width:17px;height:17px;}
.hm-zak-form__r{background:#eef1f5;border-radius:4px;padding:30px;}
.hm-zak-form__r h3{margin:0 0 4px;font:800 19px Inter,sans-serif;color:var(--navy);}
.hm-zak-form__r>p{margin:0 0 24px;font-size:14px;color:#5a6b7d;}
.hm-zak-contact{display:flex;flex-direction:column;gap:18px;}
.hm-zak-contact div{display:flex;align-items:flex-start;gap:13px;font-size:15px;color:var(--ink);}
.hm-zak-contact svg{width:20px;height:20px;flex-shrink:0;color:var(--navy);margin-top:1px;}
@media (max-width:880px){.hm-zak-form{grid-template-columns:1fr;gap:30px;padding:30px 26px;}}
@media (max-width:520px){.hm-zak-fields{grid-template-columns:1fr;}.hm-zak-fields textarea,.hm-zak-fields button{grid-column:1;}}

/* ============================================================
   CHECKOUT / WINKELMAND — huisstijl (PS-kernpagina's)
   ============================================================ */
body.page-checkout #header,body.page-cart #header{box-shadow:none;}
.page-checkout .card,.page-cart .card,.cart-grid-body .card,.cart-grid-right .card{border:1px solid var(--line);border-radius:4px;box-shadow:0 6px 22px rgba(11,33,74,.05);}
.page-checkout .card-header,.cart-summary-line .label{color:var(--navy);}
.page-checkout .h1,.page-checkout h1,.page-cart h1,.cart-grid .h1{color:var(--navy);font-weight:800;}
.checkout-step .step-title,.checkout-step .step-number{color:var(--navy);}
.page-checkout .btn-primary,.page-cart .btn-primary,.checkout .btn-primary,#js-delivery .continue,.cart-detailed-actions .btn-primary{background:var(--orange)!important;border-color:var(--orange)!important;color:#fff!important;border-radius:4px!important;font-weight:600;}
.page-checkout .btn-primary:hover,.page-cart .btn-primary:hover,.checkout .btn-primary:hover{background:var(--orange-deep)!important;border-color:var(--orange-deep)!important;}
.cart-summary-line .value,.cart-total .value{color:var(--navy);font-weight:700;}

/* ===== Winkelwagen + checkout — nettere huisstijl ===== */
body.page-cart,body.page-checkout{background:#f5f7fa;}
.page-cart .cart-grid{margin-top:6px;}
.page-cart h1,.cart-grid h1,.card.cart-container .cart-title{font-size:22px;font-weight:800;color:var(--navy);}
.card.cart-container,.card.cart-summary,.cart-grid-body .card,.cart-grid-right .card{border:1px solid var(--line)!important;border-radius:6px!important;box-shadow:0 6px 22px rgba(11,33,74,.05)!important;}
/* productregels */
.cart-overview .cart-item{padding:18px 0;}
.cart-item .product-line-grid-left img{border:1px solid var(--line-2);border-radius:4px;}
.cart-item .product-line-info a.label,.cart-item .product-line-info a{color:var(--navy)!important;font-weight:700;text-decoration:none;}
.cart-item .product-price,.cart-item .current-price,.product-line-grid-body .price,.cart-line-product-actions .price{color:var(--navy)!important;font-weight:700;}
.cart-item .cart-line-product-actions .remove-from-cart{color:#9aabbc;}
.cart-item .cart-line-product-actions .remove-from-cart:hover{color:var(--orange);}
/* aantal-stepper in cart */
.cart-item .bootstrap-touchspin{border:1px solid #d2dbe5;border-radius:4px;box-shadow:none;}
.cart-item .bootstrap-touchspin .btn-touchspin{background:#f4f6f9;border:none;color:var(--navy);}
/* totalen-box */
.cart-summary-line{display:flex;justify-content:space-between;align-items:baseline;padding:7px 0;}
.cart-summary-line .label{color:var(--gray);font-weight:500;}
.cart-summary-line.cart-total{border-top:1px solid var(--line);margin-top:8px;padding-top:14px;}
.cart-summary-line.cart-total .label,.cart-summary-line.cart-total .value{color:var(--navy)!important;font-weight:800;font-size:17px;}
.cart-summary .checkout a.btn,.cart-detailed-actions .btn-primary{background:var(--orange)!important;border-color:var(--orange)!important;color:#fff!important;border-radius:4px!important;font-weight:600;width:100%;}
.cart-summary .checkout a.btn:hover,.cart-detailed-actions .btn-primary:hover{background:var(--orange-deep)!important;border-color:var(--orange-deep)!important;}
/* "Ga door met winkelen" */
.cart-grid-body .label.cart__card-link,.cart-detailed-actions .continue,.cart-grid-body a[href*="index"]:not(.btn){color:var(--blue);font-weight:600;}

/* lege winkelwagen — gebrand */
body.cart-empty .cart-grid-body .card.cart-container{text-align:center;padding:14px 0 6px;}
body.cart-empty .no-items{display:block;padding:46px 20px 40px;color:var(--gray);font-size:15.5px;}
body.cart-empty .no-items::before{content:"";display:block;width:74px;height:74px;margin:0 auto 18px;border-radius:50%;background:var(--tint-orange) no-repeat center / 34px 34px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8541E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><circle cx='9' cy='21' r='1.4'/><circle cx='19' cy='21' r='1.4'/><path d='M2.5 3H5l2.6 12.4a2 2 0 0 0 2 1.6h8.3a2 2 0 0 0 2-1.6L21.5 7H6'/></svg>");}

/* reassurance (cart-/checkout-zijbalk): nette rij met vinkje */
.blockreassurance_product{margin-top:16px;}
.blockreassurance_product > div{display:grid;grid-template-columns:26px 1fr;column-gap:13px;align-items:center;padding:13px 2px;border-bottom:1px solid var(--line-2);}
.blockreassurance_product > div:last-child{border-bottom:none;}
.blockreassurance_product .item-product{grid-column:1;grid-row:1 / span 2;width:26px;height:26px;border-radius:50%;background:var(--tint-orange);display:flex;align-items:center;justify-content:center;}
.blockreassurance_product .item-product img{display:none;}
.blockreassurance_product .item-product::before{content:"\2713";color:var(--orange);font-weight:800;font-size:13px;line-height:1;}
.blockreassurance_product .block-title{grid-column:2;grid-row:1;color:var(--navy)!important;font-weight:700;font-size:14px;}
.blockreassurance_product p{grid-column:2;grid-row:2;margin:2px 0 0!important;color:var(--gray)!important;font-size:12.5px;line-height:1.45;}

/* add-to-cart bevestigingsmodal */
#blockcart-modal .modal-content{border:none;border-radius:8px;overflow:hidden;}
#blockcart-modal .modal-header{background:var(--navy);border:none;padding:18px 24px;}
#blockcart-modal .modal-header .modal-title{color:#fff;font-weight:700;font-size:16px;display:flex;align-items:center;gap:10px;}
#blockcart-modal .modal-header .close{color:#fff;opacity:.8;text-shadow:none;}
#blockcart-modal .modal-body{padding:24px;}
#blockcart-modal .cart-content .btn{border-radius:4px;font-weight:600;}
#blockcart-modal .cart-content .btn-primary,#blockcart-modal a.btn-primary{background:var(--orange)!important;border-color:var(--orange)!important;color:#fff!important;}
#blockcart-modal .cart-content .btn-secondary{background:#fff;border:1.5px solid var(--navy);color:var(--navy)!important;}
#blockcart-modal .product-name{color:var(--navy);font-weight:700;}

/* Add-to-cart knop-feedback (spinner tijdens toevoegen, voorkomt dubbelklik) */
.hm-adding{position:relative!important;pointer-events:none!important;color:transparent!important;}
.hm-adding>*{visibility:hidden!important;}
.hm-adding::after{content:"";position:absolute;top:50%;left:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:hm-spin .6s linear infinite;}
.product-miniature.pm-card .pm-add.hm-adding::after,.page-product .add-to-cart.hm-adding::after{border-color:rgba(255,255,255,.45);border-top-color:#fff;}
@keyframes hm-spin{to{transform:rotate(360deg);}}

/* Add-to-cart toast-melding */
.hm-toast{position:fixed;top:88px;right:24px;z-index:99999;display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);border-left:4px solid #2bbf6a;border-radius:6px;box-shadow:0 14px 38px rgba(11,33,74,.18);padding:14px 18px;font:600 14px Inter,sans-serif;color:var(--navy);max-width:360px;transform:translateX(140%);opacity:0;transition:transform .35s ease,opacity .35s ease;}
.hm-toast.is-show{transform:translateX(0);opacity:1;}
.hm-toast__ic{flex:none;width:24px;height:24px;border-radius:50%;background:#2bbf6a;color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;}
.hm-toast a{margin-left:4px;color:var(--orange)!important;font-weight:700;text-decoration:none;white-space:nowrap;}
.hm-toast a:hover{text-decoration:underline;}
@media (max-width:560px){.hm-toast{left:16px;right:16px;max-width:none;}}

/* ============================================================
   CHECKOUT — huisstijl-verfijning (stappen, velden, knoppen)
   ============================================================ */
/* minimale checkout-header nette onderlijn */
#checkout #header .header-nav,#checkout header .header-top{border-bottom:1px solid var(--line);}
/* stap-nummers: PrestaShop-groen -> merk (grijs inactief, navy actief, oranje afgerond) */
#checkout .checkout-step .step-number{background:#fff!important;border:2px solid var(--line)!important;color:var(--gray)!important;width:34px;height:34px;min-width:34px;line-height:30px;text-align:center;border-radius:50%;font-weight:800;font-size:15px;}
#checkout .checkout-step.-current .step-number{background:var(--navy)!important;border-color:var(--navy)!important;color:#fff!important;}
#checkout .checkout-step.-complete .step-number{background:var(--orange)!important;border-color:var(--orange)!important;color:#fff!important;}
#checkout .checkout-step .step-title{color:var(--navy);font-weight:800;letter-spacing:.3px;}
#checkout .checkout-step.-complete .step-edit{color:var(--orange);font-weight:600;}
#checkout .checkout-step{border-bottom:1px solid var(--line);}
/* formuliervelden — merkstijl + focus */
#checkout .form-control,#checkout input[type=text],#checkout input[type=email],#checkout input[type=password],#checkout input[type=tel],#checkout input[type=number],#checkout select,#checkout textarea{border:1px solid #d2dbe5;border-radius:4px;min-height:46px;box-shadow:none;color:var(--navy);}
#checkout .form-control:focus,#checkout select:focus,#checkout textarea:focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(14,39,66,.09);outline:none;}
#checkout label,#checkout .form-control-label,#checkout .col-form-label{color:var(--navy);font-weight:600;}
#checkout .form-control-comment{color:var(--gray);font-size:12px;}
/* primaire/doorgaan-knop -> oranje (zelfde conversiepad als de winkelwagen) */
#checkout .continue,#checkout button[name=continue],#checkout .btn-primary,#checkout #payment-confirmation button.btn,#checkout .checkout-process button[type=submit].btn-primary{background:var(--orange)!important;border-color:var(--orange)!important;color:#fff!important;border-radius:4px!important;font-weight:700;min-height:48px;padding:0 26px;letter-spacing:.3px;}
#checkout .continue:hover,#checkout button[name=continue]:hover,#checkout .btn-primary:hover,#checkout #payment-confirmation button.btn:hover{background:var(--orange-deep)!important;border-color:var(--orange-deep)!important;}
/* wachtwoord-toggle netjes */
#checkout .input-group-btn button,#checkout button[data-action=show-password]{background:#fff!important;border:1px solid #d2dbe5!important;color:var(--navy)!important;font-weight:600;box-shadow:none;}
/* checkboxes + radio in merkkleur */
#checkout input[type=checkbox],#checkout input[type=radio]{accent-color:var(--orange);width:17px;height:17px;}
#checkout .custom-checkbox input[type=checkbox]+span,#checkout .custom-radio{border-color:#c4d0dd;}
/* gast/inloggen-tabs */
#checkout #checkout-personal-information-step .nav-inline .nav-link,#checkout .nav-inline .nav-link{color:var(--gray);font-weight:600;}
#checkout .nav-inline .nav-link.active{color:var(--navy)!important;border-bottom:2px solid var(--orange);}
/* adres-, verzend- en betaalopties als nette kaartjes */
#checkout .address-item,#checkout .delivery-option,#checkout .payment-option,#checkout .payment-options .payment-option{border:1px solid var(--line);border-radius:6px;padding:14px 16px;margin-bottom:10px;background:#fff;transition:border-color .15s,box-shadow .15s;}
#checkout .address-item:hover,#checkout .delivery-option:hover,#checkout .payment-option:hover{border-color:var(--navy);}
#checkout .address-item.selected,#checkout .delivery-option.selected{border-color:var(--orange)!important;box-shadow:0 0 0 2px rgba(232,84,30,.12);}
#checkout .carrier-name,#checkout .delivery-option label{color:var(--navy);font-weight:700;}
#checkout .carrier-price{color:var(--navy);font-weight:800;}
/* voorwaarden-blok onder de betaling */
#checkout #conditions-to-approve{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);}
#checkout #conditions-to-approve a{color:var(--orange);font-weight:600;}
/* compactere consent/checkbox-blokken (nieuwsbrief, privacy, voorwaarden) */
#checkout .checkout-step .content .custom-checkbox,#checkout .checkout-step .content .checkbox-field,#checkout .checkout-step .content .form-group > .row > div > .custom-checkbox{margin:0 0 10px!important;}
#checkout .checkout-step .content .custom-checkbox label,#checkout .checkout-step .content .checkbox-field label{margin-bottom:0;font-weight:600;}
#checkout .checkout-step .content .custom-checkbox em,#checkout .checkout-step .content .checkbox-field em,#checkout .checkout-step .content label + em,#checkout .checkout-step .content .psgdpr_consent_message{display:block;margin:1px 0 0!important;font-size:12px!important;line-height:1.4!important;font-style:normal!important;color:var(--gray)!important;}
/* nette minimale checkout-desktopheader (logo links) */
.hm-conav{padding:16px 0;border-bottom:1px solid var(--line);background:#fff;}
.hm-conav #_desktop_logo img{max-height:40px;width:auto;}
/* custom radio/checkbox in merkkleur (classic gebruikt cyaan) */
#checkout .custom-radio{border:1px solid #c4d0dd;box-shadow:none;}
#checkout .custom-radio input:checked+span,#checkout .custom-radio input[type=radio]:checked+span{background-color:var(--orange)!important;}
#checkout .custom-checkbox input[type=checkbox]:checked+span .checkbox-checked{color:var(--orange)!important;}

/* ============================================================
   CHECKOUT — MOBIEL (grondig): geen overflow, full-width, merk
   ============================================================ */
@media (max-width:767px){
  /* harde stop op horizontale overflow (html + alle wrappers) */
  html,#checkout{overflow-x:hidden;max-width:100%;}
  #checkout #wrapper,#checkout #wrapper > .container,#checkout #content-wrapper,#checkout #content,#checkout .checkout,#checkout .checkout-process{max-width:100%!important;width:auto!important;padding-left:0!important;padding-right:0!important;margin-left:0!important;margin-right:0!important;box-sizing:border-box;overflow-x:hidden;}
  #checkout #wrapper{padding-left:10px!important;padding-right:10px!important;}
  /* kolom-offsets die op mobiel blijven hangen (margin-left) -> weg */
  #checkout [class*="offset-"],#checkout [class*="col-md-offset"],#checkout [class*="col-lg-offset"]{margin-left:0!important;}
  /* stap-inhoud: gelijke insprong, geen bootstrap-negatieve-marge die uitsteekt */
  #checkout .checkout-step{padding-left:14px;padding-right:14px;}
  #checkout .checkout-step .content{padding-left:2px;padding-right:2px;}
  #checkout .checkout-step .content .row{margin-left:0;margin-right:0;}
  #checkout .checkout-step .content [class*="col-"]{padding-left:0;padding-right:0;float:none;width:100%;max-width:100%;flex:0 0 100%;}
  /* velden full-width + box-sizing (kern van de overflow) */
  #checkout .form-control,#checkout input[type=text],#checkout input[type=email],#checkout input[type=password],#checkout input[type=tel],#checkout input[type=number],#checkout select,#checkout textarea{width:100%;max-width:100%;box-sizing:border-box;}
  #checkout .form-group{margin-bottom:16px;}
  #checkout .form-control-comment{font-size:11.5px;line-height:1.4;margin-top:4px;}
  /* labels boven de velden, links uitgelijnd */
  #checkout .form-group .col-form-label,#checkout .form-group label{display:block;text-align:left!important;padding-bottom:6px;}
  /* "Optioneel" onder het veld i.p.v. rechts ernaast (anders overflow) */
  #checkout .form-group .col-md-3.text-md-right,#checkout .form-group .text-xs-right{text-align:left!important;}
  /* wachtwoord-toggle binnen beeld */
  #checkout .input-group{flex-wrap:nowrap;width:100%;}
  #checkout .input-group .form-control{flex:1 1 auto;min-width:0;}
  #checkout .input-group .input-group-btn button{white-space:nowrap;padding:0 12px;}
  /* knoppen full-width */
  #checkout .continue,#checkout button[name=continue],#checkout .btn-primary,#checkout .form-footer .btn,#checkout #payment-confirmation button.btn{width:100%;padding:0 16px;}
  #checkout .form-footer{padding:12px 0 0;text-align:center;}
  /* stap-kop compacter zodat hij past */
  #checkout .checkout-step .step-title{font-size:16.5px;line-height:1.25;letter-spacing:.2px;}
  #checkout .checkout-step .step-number{width:30px;height:30px;min-width:30px;line-height:26px;font-size:14px;margin-right:10px;}
  /* mobiele header-winkelwagen: cyaan -> merk-navy */
  #checkout #header .blockcart,#checkout .blockcart.cart-preview,#checkout #_mobile_cart .blockcart{background:var(--navy)!important;border-radius:6px;}
  #checkout #header .blockcart a,#checkout .blockcart.cart-preview a,#checkout .blockcart .header,#checkout .blockcart .material-icons{color:#fff!important;}
  /* samenvatting onder het formulier: nette kaart met marge */
  #checkout .cart-summary,#checkout #cart-summary,#checkout .checkout-process ~ *{max-width:100%;}
  #checkout #js-checkout-summary,#checkout .js-checkout-summary{margin-top:18px;}
  /* gast/inloggen-tabs niet inklappen */
  #checkout .nav-inline{display:flex;flex-wrap:wrap;gap:6px 18px;}
}

/* ============================================================
   MOBIELE HEADER (bar + uitschuifmenu) — zelfstandig, geen classic-JS
   ============================================================ */
.hm-mbar{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#fff;border-bottom:1px solid var(--line);}
.hm-mbar__burger{flex:none;width:44px;height:44px;display:flex;flex-direction:column;justify-content:center;gap:5px;padding:11px;background:none;border:none;cursor:pointer;}
.hm-mbar__burger span{display:block;height:2.5px;border-radius:2px;background:var(--navy);transition:transform .22s,opacity .22s;}
.hm-menu-cb{position:absolute;width:0;height:0;opacity:0;pointer-events:none;}
.hm-menu-cb:checked ~ .hm-mbar .hm-mbar__burger span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
.hm-menu-cb:checked ~ .hm-mbar .hm-mbar__burger span:nth-child(2){opacity:0;}
.hm-menu-cb:checked ~ .hm-mbar .hm-mbar__burger span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}
.hm-mbar__logo{flex:1;display:flex;justify-content:center;align-items:center;text-decoration:none;min-width:0;}
.hm-mbar__logo img{height:32px;width:auto;max-width:180px;object-fit:contain;}
.hm-mbar__logo span{color:var(--navy);font-weight:800;font-size:17px;}
.hm-mbar__cart{flex:none;position:relative;display:flex;padding:10px;color:var(--navy);}
.hm-mbar__cart svg{width:24px;height:24px;}
.hm-mbar__c{position:absolute;top:2px;right:1px;min-width:16px;height:16px;padding:0 3px;border-radius:8px;background:var(--orange);color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center;}
/* uitschuifmenu links */
.hm-mmenu{position:fixed;top:0;left:0;bottom:0;width:84%;max-width:330px;background:#fff;z-index:2050;transform:translateX(-100%);transition:transform .25s ease;overflow-y:auto;-webkit-overflow-scrolling:touch;box-shadow:2px 0 26px rgba(10,25,45,.18);padding:12px 0 24px;}
.hm-menu-overlay{display:none;}
.hm-menu-cb:checked ~ .hm-mmenu{transform:translateX(0);}
.hm-menu-cb:checked ~ .hm-menu-overlay{display:block;position:fixed;inset:0;background:rgba(10,25,45,.45);z-index:2040;border:none;margin:0;}
.hm-mmenu__top{display:flex;align-items:center;justify-content:space-between;padding:4px 10px 10px 22px;border-bottom:1px solid var(--line);margin-bottom:6px;}
.hm-mmenu__ttl{color:var(--gray);font-weight:800;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;}
.hm-mmenu__close{width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:none;border:none;color:var(--navy);cursor:pointer;padding:9px;}
.hm-mmenu__close svg{width:22px;height:22px;}
.hm-mmenu__a{display:block;padding:13px 22px;color:var(--navy)!important;font-weight:600;font-size:15px;text-decoration:none;border-bottom:1px solid var(--line-2);}
.hm-mmenu__a--head{font-weight:800;font-size:16px;background:#f6f8fb;}
.hm-mmenu__a--sub{padding:11px 22px 11px 38px;font-weight:500;font-size:14px;color:var(--gray)!important;}
.hm-mmenu__a:active{background:var(--tint-orange);}
.hm-mmenu__cta{display:block;margin:18px 22px 4px;padding:13px;border-radius:4px;background:var(--orange);color:#fff!important;font-weight:700;font-size:15px;text-align:center;text-decoration:none;}

/* ============================================================
   WINKELWAGEN-SAMENVATTING — strakker & overzichtelijker
   ============================================================ */
.cart-summary.card,.page-cart .cart-summary{padding:2px 2px 6px;}
.page-cart .cart-summary .card-block,#js-checkout-summary .card-block{padding:8px 20px;}
.cart-summary-line{display:flex!important;justify-content:space-between;align-items:baseline;gap:12px;padding:8px 0;margin:0!important;}
.cart-summary-line > *{flex:0 1 auto!important;width:auto!important;max-width:none!important;padding:0!important;margin:0!important;}
.cart-summary-line .label{flex:1 1 auto!important;color:var(--gray)!important;font-weight:500;font-size:14px;text-align:left;}
.cart-summary-line .value{flex:0 0 auto!important;color:var(--navy)!important;font-weight:700;font-size:14px;text-align:right;white-space:nowrap;}
.cart-detailed-subtotals{border-bottom:1px solid var(--line);}
.cart-summary-line.cart-total{margin-top:2px!important;padding-top:12px;border-top:none;}
.cart-summary-line.cart-total .label,.cart-summary-line.cart-total .value{color:var(--navy)!important;font-weight:800!important;font-size:18px!important;}
.cart-detailed-actions{padding:14px 20px 6px!important;}
.cart-detailed-actions .btn-primary,.cart-summary .checkout a.btn{width:100%;min-height:50px;font-weight:700;letter-spacing:.3px;display:flex;align-items:center;justify-content:center;}