/* COZO Footer v1.9, zelfde tokens als de productpagina (compuzone-product) */
:root{
  --czf-bg:#0F1115;--czf-bg2:#181B21;--czf-bg3:#1F232A;--czf-ink:#F2F4F7;--czf-ink2:#A8B0BC;--czf-ink3:#7A8391;--czf-line:#262A31;
  --czf-or:#FF6F00;--czf-orh:#E56300;
  --czf-lbg:#F3F5F8;--czf-ls:#FFFFFF;--czf-lline:#D9DFE8;--czf-link:#0F1B33;--czf-link2:#4A5568;
  --czf-r:10px;--czf-rs:6px;--czf-font:"COZO Poppins",Poppins,"Segoe UI",Helvetica,Arial,sans-serif
}
.czf-wrap{width:min(1240px,100% - 2rem);margin-inline:auto}

/* USP-balk: lichte variant, zoals kaarten op de productpagina */
.czf-usp{background:var(--czf-ls);border-top:1px solid var(--czf-lline);border-bottom:1px solid var(--czf-lline);font-family:var(--czf-font)}
.czf-usp .czf-wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:22px 0}
.czf-usp .czf-wrap>div{display:flex;gap:12px;align-items:center;font-weight:800;font-size:.92rem;color:var(--czf-link)}
.czf-usp p{margin:0;line-height:1.45}
.czf-usp p span{display:block;font-weight:500;color:var(--czf-link2);font-size:.82rem;margin-top:2px}
.czf-usp svg{width:28px;height:28px;stroke:var(--czf-or);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 28px}

/* Footer */
footer.czf{background:var(--czf-bg);color:var(--czf-ink2);font-family:var(--czf-font);font-size:.92rem;line-height:1.55;margin:0;padding:0}
footer.czf a{color:inherit;text-decoration:none}
footer.czf a:focus-visible,footer.czf button:focus-visible{outline:2px solid var(--czf-or);outline-offset:3px;border-radius:4px}
.czf-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.3fr;gap:36px;padding:56px 0 44px}
footer.czf--nonews .czf-top{grid-template-columns:1.6fr 1fr 1fr 1fr}

.czf-logo{display:inline-block;line-height:0}
.czf-logo img{height:48px;width:auto;max-width:220px;display:block}
.czf-about p{margin:16px 0 20px;max-width:36ch;line-height:1.65}
.czf-contact{display:flex;flex-direction:column;gap:10px}
.czf-contact>a,.czf-contact>span{display:flex;gap:10px;align-items:flex-start;color:var(--czf-ink)!important;font-weight:600}
.czf-contact>a:hover{color:var(--czf-or)!important}
.czf-contact svg{width:17px;height:17px;stroke:var(--czf-or);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:0 0 17px;margin-top:3px}
.czf-contact small{display:block;color:var(--czf-ink3);font-size:.8rem;font-weight:500}

/* kolomkoppen: zinsvorm, geen caps (zelfde toon als "Gegarandeerd veilig afrekenen") */
footer.czf h2.czf-h{margin:0 0 16px;padding:0;font-family:var(--czf-font);text-transform:none}
footer.czf h2.czf-h,.czf-acc{color:var(--czf-ink);font-size:1rem;font-weight:800;letter-spacing:0;line-height:1.3}
.czf-acc{all:unset;box-sizing:border-box;display:flex;width:100%;justify-content:space-between;align-items:center;gap:12px;cursor:default;font-family:var(--czf-font)}
.czf-acc svg{display:none;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s ease,color .2s ease}
.czf-panel{display:block}
.czf-panel>div{min-height:0}

footer.czf ul{list-style:none;display:flex;flex-direction:column;gap:11px;margin:0;padding:0}
footer.czf ul li{margin:0;padding:0}
footer.czf ul a{color:var(--czf-ink2)!important;transition:color .15s ease}
footer.czf ul a:hover{color:var(--czf-or)!important}

.czf-news p{margin:0 0 14px;line-height:1.6}
.czf-news input[type=email],.czf-news input[type=text]{background:var(--czf-bg2)!important;border:1.5px solid var(--czf-line)!important;border-radius:var(--czf-r)!important;color:var(--czf-ink)!important;padding:12px 14px!important;box-shadow:none!important}
.czf-news input::placeholder{color:var(--czf-ink3)}
.czf-news button,.czf-news input[type=submit]{background:var(--czf-or)!important;color:#fff!important;border:0!important;border-radius:var(--czf-r)!important;font-weight:800!important;padding:12px 18px!important;cursor:pointer}
.czf-news button:hover,.czf-news input[type=submit]:hover{background:var(--czf-orh)!important}

.czf-social{display:flex;gap:8px;margin-top:22px}
.czf-social a{width:40px;height:40px;border-radius:var(--czf-r);background:var(--czf-bg2);border:1px solid var(--czf-line);display:grid;place-items:center;transition:border-color .15s ease}
.czf-social a:hover{border-color:var(--czf-or)}
.czf-social svg{width:17px;height:17px;fill:var(--czf-ink2)}
.czf-social a:hover svg{fill:var(--czf-or)}

/* betalen + verzending: zelfde chips als de paybox op de productpagina */
.czf-mid{border-top:1px solid var(--czf-line);border-bottom:1px solid var(--czf-line);padding:20px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.czf-pay,.czf-ship{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.czf-pay b,.czf-ship b{font-size:.85rem;color:var(--czf-ink);margin-right:6px;font-weight:700}
.czf-pay span{background:#fff;color:var(--czf-link2);border:1px solid var(--czf-lline);font-size:.72rem;font-weight:800;padding:6px 10px;border-radius:5px;min-width:56px;text-align:center;line-height:1}
.czf-ship span{background:var(--czf-bg2);border:1px solid var(--czf-line);padding:6px 10px;border-radius:5px;font-weight:800;color:var(--czf-ink);font-size:.72rem;line-height:1}

.czf-bot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:18px 0 28px;font-size:.8rem;color:var(--czf-ink3)}
.czf-legalinfo{margin:0;display:flex;gap:6px 18px;flex-wrap:wrap}
footer.czf .czf-bot ul{flex-direction:row;gap:8px 18px;flex-wrap:wrap}
.czf-bot ul a{color:var(--czf-ink3)!important}
.czf-bot ul a:hover{color:var(--czf-ink)!important}

@media(max-width:1000px){
  .czf-top,footer.czf--nonews .czf-top{grid-template-columns:1fr 1fr 1fr;gap:32px}
  .czf-about,.czf-news{grid-column:1/-1}
  .czf-usp .czf-wrap{grid-template-columns:repeat(2,1fr)}
}

/* Mobiel: accordion in COZO-stijl (chevron draait, paneel schuift open) */
@media(max-width:600px){
  footer.czf{font-size:.9rem}
  .czf-usp .czf-wrap{grid-template-columns:1fr;gap:14px;padding:18px 0}
  .czf-top,footer.czf--nonews .czf-top{grid-template-columns:1fr;gap:0;padding:34px 0 20px}
  .czf-logo img{height:38px;max-width:150px}
  .czf-about{padding-bottom:22px}
  .czf-about p{margin:12px 0 16px}
  .czf-news{padding-top:22px}
  .czf-col{border-bottom:1px solid var(--czf-line);padding:6px 0}
  .czf-about + .czf-col{border-top:1px solid var(--czf-line)}
  footer.czf .czf-col h2.czf-h{margin:0}
  .czf-acc{cursor:pointer;padding:10px 0;min-height:48px}
  .czf-acc svg{display:block;color:var(--czf-ink3)}
  .czf-col.open .czf-acc svg{transform:rotate(180deg);color:var(--czf-or)}
  .czf-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s ease}
  .czf-panel>div{overflow:hidden}
  .czf-col.open .czf-panel{grid-template-rows:1fr}
  footer.czf .czf-panel ul{padding:0 0 18px}
  .czf-mid{flex-direction:column;align-items:flex-start;border-top:0}
  .czf-bot{flex-direction:column;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){
  .czf-panel,.czf-acc svg,footer.czf ul a,.czf-social a{transition:none!important}
}
