/* =========================================================
   DSV Headless — layout & components (header/footer chrome)
   ========================================================= */

/* ---------- Topbar ---------- */
.dsv-topbar{background:var(--c-primary);color:#fff;font-size:13px;letter-spacing:.4px}
.dsv-topbar__inner{display:flex;align-items:center;justify-content:space-between;gap:20px;
  min-height:38px;padding-block:7px}
.dsv-topbar__msg strong{font-weight:700}
.dsv-topbar__usp{opacity:.85}
@media(max-width:900px){.dsv-topbar__usp{display:none}.dsv-topbar__inner{justify-content:center;text-align:center}}

/* ---------- Header ---------- */
.dsv-header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.96);
  backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--c-line);
  transition:box-shadow var(--t)}
.dsv-header.is-stuck{box-shadow:var(--shadow)}
.dsv-header__inner{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  min-height:var(--header-h);gap:12px}
.dsv-logo{justify-self:center}
.dsv-logo img{height:52px;width:auto;object-fit:contain}
.dsv-header__actions{justify-self:end;display:flex;align-items:center;gap:4px}

.dsv-iconbtn{position:relative;display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;color:var(--c-ink);transition:background var(--t),color var(--t)}
.dsv-iconbtn:hover{background:var(--c-offwhite);color:var(--c-primary)}
.dsv-cart-count{position:absolute;top:4px;right:4px;min-width:18px;height:18px;padding:0 4px;
  display:flex;align-items:center;justify-content:center;background:var(--c-sale);color:#fff;
  font-family:var(--f-body);font-size:11px;font-weight:700;border-radius:999px;line-height:1}
.dsv-cart-count[data-count="0"]{display:none}

/* burger */
.dsv-burger{flex-direction:column;gap:4px;justify-self:start;display:none}
.dsv-burger span{width:22px;height:2px;background:var(--c-ink);border-radius:2px;transition:var(--t)}

/* ---------- Nav ---------- */
.dsv-nav{border-top:1px solid var(--c-line);position:relative}
.dsv-nav__list{display:flex;justify-content:center;flex-wrap:wrap;gap:2px}
.dsv-nav__list > li{position:relative}
.dsv-nav__link{display:inline-flex;align-items:center;gap:6px;padding:14px 16px;font-family:var(--f-body);
  font-weight:600;font-size:15px;text-transform:uppercase;letter-spacing:.5px;color:var(--c-ink)}
.dsv-nav__link:hover{color:var(--c-primary)}
.dsv-nav__item.is-sale > .dsv-nav__link{color:var(--c-sale)}
.dsv-nav__chev{transition:transform var(--t);opacity:.7}
.dsv-nav__item.has-mega:hover .dsv-nav__chev{transform:rotate(180deg)}

/* ---------- Mega panel ---------- */
.dsv-nav__item.has-mega{position:static}
.dsv-mega{position:absolute;left:0;right:0;top:100%;background:#fff;
  border-top:1px solid var(--c-line);box-shadow:var(--shadow);
  opacity:0;visibility:hidden;transform:translateY(10px);transition:var(--t);z-index:55}
.dsv-nav__item.has-mega:hover .dsv-mega,
.dsv-nav__item.has-mega:focus-within .dsv-mega{opacity:1;visibility:visible;transform:translateY(0)}
.dsv-mega__inner{display:flex;gap:40px;padding-block:30px;align-items:flex-start;
  max-height:min(72vh,640px);overflow-y:auto}
.dsv-mega__cols{flex:1;display:flex;flex-wrap:wrap;gap:18px 32px;align-content:flex-start}
.dsv-mega__col{flex:1 1 165px;min-width:150px;max-width:230px}
.dsv-mega__col li{margin-bottom:1px}
.dsv-mega__col a{display:block;padding:5px 0;font-size:14px;line-height:1.3;color:var(--c-dark,#431E18)}
.dsv-mega__col a:hover{color:var(--c-primary)}
.dsv-mega__col a.is-sale{color:var(--c-sale);font-weight:700}
.dsv-mega__head{display:block;font-family:var(--f-head);font-weight:600;font-size:15px;
  text-transform:uppercase;letter-spacing:.4px;color:var(--c-ink)!important;
  padding:0 0 8px!important;margin-bottom:6px;border-bottom:1px solid var(--c-line)}
.dsv-mega__head:hover{color:var(--c-primary)!important}
.dsv-mega__col--flat{padding-top:29px}/* lijn losse merken/links uit met kolommen mét kop */
/* featured products */
.dsv-mega__feat{width:300px;flex-shrink:0;border-left:1px solid var(--c-line);padding-left:40px}
.dsv-mega__feat-label{display:block;font-family:var(--f-head);font-size:16px;font-weight:500;
  text-transform:uppercase;letter-spacing:.5px;margin-bottom:14px;color:var(--c-ink)}
.dsv-mega__feat-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.dsv-mega__product{display:block;position:relative}
.dsv-mega__product-img img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--radius-sm,8px);
  background:var(--c-offwhite);margin-bottom:8px}
.dsv-mega__product-title{display:block;font-size:13px;line-height:1.3;color:var(--c-ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dsv-mega__product:hover .dsv-mega__product-title{color:var(--c-primary)}
.dsv-mega__product-price{display:block;margin-top:3px;font-size:13px;font-weight:700;color:var(--c-ink)}
.dsv-mega__product-price del{color:var(--c-muted);font-weight:400;margin-right:5px}
.dsv-mega__product-price ins{text-decoration:none;color:var(--c-sale)}
.dsv-mega__sale{position:absolute;top:6px;left:6px;z-index:2;background:var(--c-orange,#EF7D00);color:#fff;
  font-size:10px;font-weight:700;letter-spacing:.5px;padding:3px 7px;border-radius:999px}
@media(max-width:1280px){.dsv-mega__feat{display:none}}

@media(max-width:1024px){.dsv-nav{display:none}.dsv-burger{display:inline-flex}
  .dsv-header__inner{grid-template-columns:auto 1fr auto}}

/* ---------- Search overlay ---------- */
.dsv-search{position:fixed;inset:0 0 auto 0;z-index:80;background:#fff;
  transform:translateY(-100%);transition:transform var(--t);box-shadow:var(--shadow)}
.dsv-search.is-open{transform:translateY(0)}
.dsv-search__inner{display:flex;align-items:center;gap:16px;padding-block:28px}
.dsv-search form{display:flex;flex:1;gap:10px}
.dsv-search input[type=search]{flex:1;border:0;border-bottom:2px solid var(--c-ink);
  padding:10px 4px;font-size:22px;font-family:var(--f-head);background:transparent}
.dsv-search input[type=search]:focus{outline:none;border-color:var(--c-primary)}
.dsv-search__close{font-size:30px;line-height:1;color:var(--c-ink)}

/* ---------- Scrim ---------- */
.dsv-scrim{position:fixed;inset:0;z-index:70;background:rgba(27,28,28,.45);
  opacity:0;visibility:hidden;transition:var(--t)}
.dsv-scrim.is-open{opacity:1;visibility:visible}

/* ---------- Off-canvas (mobile nav) ---------- */
.dsv-offcanvas{position:fixed;inset:0 auto 0 0;z-index:90;width:min(86vw,360px);
  transform:translateX(-100%);transition:transform var(--t)}
.dsv-offcanvas.is-open{transform:translateX(0)}
.dsv-offcanvas__panel{height:100%;background:#fff;display:flex;flex-direction:column;overflow-y:auto}
.dsv-offcanvas__head{display:flex;align-items:center;justify-content:space-between;
  padding:18px 20px;border-bottom:1px solid var(--c-line);font-family:var(--f-head);font-size:20px}
.dsv-offcanvas__head button{font-size:28px;line-height:1}

/* mobile mega nav (accordion) */
.dsv-mnav{padding:6px 0}
.dsv-mnav > li > a{display:block;padding:14px 20px;font-weight:600;text-transform:uppercase;
  font-size:15px;letter-spacing:.4px;border-bottom:1px solid var(--c-line);color:var(--c-ink)}
.dsv-mnav > li > a.is-sale{color:var(--c-sale)}
.dsv-mnav__acc{border-bottom:1px solid var(--c-line)}
.dsv-mnav__acc summary{display:flex;align-items:center;justify-content:space-between;
  padding:14px 20px;font-weight:600;text-transform:uppercase;font-size:15px;letter-spacing:.4px;
  cursor:pointer;list-style:none;color:var(--c-ink)}
.dsv-mnav__acc summary::-webkit-details-marker{display:none}
.dsv-mnav__acc summary::after{content:"+";font-size:22px;font-weight:400;line-height:1;color:var(--c-primary)}
.dsv-mnav__acc[open] > summary::after{content:"–"}
.dsv-mnav__acc[open] > summary{color:var(--c-primary)}
.dsv-mnav__sub{background:var(--c-offwhite);padding:6px 0 12px}
.dsv-mnav__sub a{display:block;padding:9px 24px;font-size:14px;color:var(--c-dark,#431E18)}
.dsv-mnav__sub a:hover{color:var(--c-primary)}
.dsv-mnav__sub .dsv-mnav__all{font-weight:700;color:var(--c-primary)}
/* geneste sub-accordion (niveau 2 → 3) */
.dsv-mnav__acc--sub{border-bottom:1px solid var(--c-line)}
.dsv-mnav__acc--sub summary{padding:11px 24px;text-transform:none;font-size:14px;font-weight:600}
.dsv-mnav__sub2{background:#fff;padding:2px 0 8px}
.dsv-mnav__sub2 a{display:block;padding:8px 36px;font-size:13.5px;color:var(--c-dark,#431E18)}
.dsv-mnav__sub2 a:hover{color:var(--c-primary)}
.dsv-mnav__sub2 .dsv-mnav__all{font-weight:700;color:var(--c-primary)}

/* ---------- Cart drawer ---------- */
.dsv-drawer{position:fixed;inset:0 0 0 auto;z-index:90;width:min(92vw,420px);
  transform:translateX(100%);transition:transform var(--t)}
.dsv-drawer.is-open{transform:translateX(0)}
.dsv-drawer__panel{height:100%;background:#fff;display:flex;flex-direction:column}
.dsv-drawer__head{display:flex;align-items:center;justify-content:space-between;
  padding:18px 22px;border-bottom:1px solid var(--c-line);font-family:var(--f-head);font-size:22px}
.dsv-drawer__head button{font-size:28px;line-height:1}
.dsv-drawer__body{flex:1;display:flex;flex-direction:column;padding:18px 22px;overflow-y:auto}
.dsv-drawer__empty{color:var(--c-muted);margin-bottom:20px}

.dsv-minicart{flex:1;display:flex;flex-direction:column;gap:14px}
.dsv-minicart__item{display:flex;gap:12px;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--c-line)}
.dsv-minicart__thumb img{width:64px;height:64px;object-fit:cover;border-radius:8px}
.dsv-minicart__meta{flex:1;display:flex;flex-direction:column;gap:3px}
.dsv-minicart__name{font-weight:600;font-size:14px}
.dsv-minicart__qty{font-size:13px;color:var(--c-muted)}
.dsv-minicart__remove{font-size:20px;color:var(--c-muted)}
.dsv-minicart__remove:hover{color:var(--c-sale)}
.dsv-minicart__foot{padding-top:14px;margin-top:auto;display:flex;flex-direction:column;gap:10px}
.dsv-minicart__total{display:flex;justify-content:space-between;font-size:16px;margin-bottom:4px}

/* ---------- Footer ---------- */
.dsv-footer{background:var(--c-offwhite);color:var(--c-ink);margin-top:64px}
.dsv-footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;padding-block:56px}
.dsv-footer__brand img{height:50px;width:auto;margin-bottom:14px}
.dsv-footer__brand p{color:var(--c-muted);font-size:14px;max-width:34ch}
.dsv-footer h4{font-size:18px;margin-bottom:16px}
.dsv-footer__list li{margin-bottom:9px}
.dsv-footer__list a{font-size:14px;color:var(--c-ink)}
.dsv-footer__list a:hover{color:var(--c-primary)}
.dsv-footer__hours li{display:flex;justify-content:space-between;font-size:14px;margin-bottom:8px;
  gap:12px;color:var(--c-muted)}
.dsv-social{display:flex;gap:14px;margin-top:16px;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.dsv-newsletter{margin-top:22px}
.dsv-newsletter__form{display:flex;gap:8px;margin-top:8px}
.dsv-newsletter__form input{flex:1;min-width:0;border:1px solid var(--c-line);border-radius:999px;padding:11px 16px;background:#fff}
.dsv-newsletter__form input:focus{outline:none;border-color:var(--c-primary)}
.dsv-newsletter__form .btn{padding-inline:18px}
.dsv-footer__bar{border-top:1px solid var(--c-line)}
.dsv-footer__bar-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding-block:18px;font-size:12.5px;color:var(--c-muted)}
@media(max-width:1024px){.dsv-footer__grid{grid-template-columns:1fr 1fr;gap:30px}}
@media(max-width:600px){.dsv-footer__grid{grid-template-columns:1fr}
  .dsv-footer__bar-inner{flex-direction:column;text-align:center}}

/* ---------- Generic post list (blog/search fallback) ---------- */
.dsv-postlist{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.dsv-postcard__media img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);margin-bottom:14px}
.dsv-postcard__title{font-size:22px;margin-bottom:8px}
@media(max-width:900px){.dsv-postlist{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.dsv-postlist{grid-template-columns:1fr}}

/* lock scroll when a panel is open */
body.dsv-no-scroll{overflow:hidden}