/* Koelkastwijzer 3.3 centraal frontendcontract. */
.wg-container,.wg-apparaten-container,.wg-problem-page__container,.wg-problem__container,.wg-koopgids-shell,.wg-page__container,.kw-shell{width:min(var(--wg-container-width),calc(100% - (2 * var(--wg-page-gutter))));max-width:none;margin-inline:auto;padding-inline:0}
.kw-reading,.wg-content-container{width:min(var(--wg-reading-width),100%);margin-inline:auto}
.kw-kicker,.wg-hub-eyebrow,.wg-apparaten-eyebrow,.wg-guides-hub__eyebrow,.wg-section-heading__eyebrow,.wg-koopgids-editorial__eyebrow,.wg-koopgids-faq__eyebrow,.wg-koopgids-related__eyebrow,.kw-results-kicker{display:block;margin:0 0 10px;color:var(--kw-blue);font-size:13px;font-weight:800;line-height:1.3;letter-spacing:.08em;text-transform:uppercase}
.kw-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 20px;border:1px solid transparent;border-radius:7px;font-size:15px;font-weight:750;line-height:1;text-decoration:none;white-space:nowrap}
.kw-button--primary{color:#fff;background:var(--kw-blue);border-color:var(--kw-blue)}.kw-button--primary:hover{color:#fff;background:var(--kw-blue-hover);border-color:var(--kw-blue-hover)}
.kw-button--secondary{color:var(--kw-navy);background:#fff;border-color:var(--kw-border-strong)}.kw-button--secondary:hover{color:var(--kw-blue);background:var(--kw-blue-soft);border-color:#b8cae0}
.kw-button--light{color:var(--kw-navy);background:#fff;border-color:#fff}.kw-button--light:hover{color:var(--kw-blue);background:#f1f6ff}
.kw-text-link{display:inline-flex;align-items:center;gap:7px;color:var(--kw-blue);font-weight:700;text-decoration:none}.kw-text-link:hover{text-decoration:underline}
.wg-breadcrumbs,.wg-choice-breadcrumbs{display:flex;align-items:center;flex-wrap:wrap;gap:7px;min-width:0;margin:0;padding:0;color:var(--kw-subtle);font-size:13px;line-height:1.45}
.wg-breadcrumbs a,.wg-choice-breadcrumbs a{color:var(--kw-muted);text-decoration:none}.wg-breadcrumbs a:hover,.wg-choice-breadcrumbs a:hover{color:var(--kw-blue);text-decoration:underline}.wg-breadcrumbs [aria-current="page"],.wg-choice-breadcrumbs [aria-current="page"]{color:var(--kw-subtle)}
.kw-section{padding:var(--wg-section-space) 0}.kw-section--compact{padding:var(--wg-section-space-small) 0}.kw-section--soft{background:var(--kw-bg)}
.kw-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,420px);align-items:end;gap:36px;margin-bottom:34px;padding-bottom:20px;border-bottom:1px solid var(--kw-border)}.kw-heading>div{min-width:0}.kw-heading>span{grid-column:1/-1;margin-bottom:-26px;color:var(--kw-blue);font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.kw-heading h2{margin:0}.kw-heading p{margin:0;font-size:16px;line-height:1.65}
.kw-divider{border-top:1px solid var(--kw-border)}
.kw-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:900px){.wg-container,.wg-apparaten-container,.wg-problem-page__container,.wg-problem__container,.wg-koopgids-shell,.wg-page__container,.kw-shell{width:min(var(--wg-container-width),calc(100% - (2 * var(--wg-page-gutter-mobile))))}.kw-heading{grid-template-columns:1fr;gap:10px}.kw-heading>span{margin-bottom:0}.wg-breadcrumbs,.wg-choice-breadcrumbs{flex-flow:row nowrap;overflow-x:auto;white-space:nowrap;scrollbar-width:none}.wg-breadcrumbs::-webkit-scrollbar,.wg-choice-breadcrumbs::-webkit-scrollbar{display:none}}
@media(max-width:520px){.kw-button{width:100%}}


/* Compact energielabel — één visuele taal in catalogus, apparaatpagina, keuzehulp en koopgidsen. */
.kw-energy-label{
  --kw-energy-color:#008c4a;
  display:inline-flex;
  align-items:center;
  vertical-align:middle;
  min-width:0;
  line-height:1;
  white-space:nowrap;
  filter:drop-shadow(0 1px 1px rgba(7,29,23,.12));
}
.kw-energy-label__scale{
  box-sizing:border-box;
  display:grid;
  grid-template-rows:1fr .75fr 1fr;
  align-items:center;
  justify-items:center;
  width:10px;
  height:24px;
  padding:2px 1px;
  border:1px solid #9eaaa5;
  border-right:0;
  border-radius:2px 0 0 2px;
  background:#fff;
  color:#14241f;
  font-size:5px;
  font-weight:800;
  letter-spacing:-.02em;
}
.kw-energy-label__scale span{display:block;line-height:1}
.kw-energy-label__scale-arrow{font-size:6px;font-weight:900}
.kw-energy-label__arrow{
  position:relative;
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:2px;
  width:29px;
  height:24px;
  padding:2px 3px 2px 5px;
  border:1px solid rgba(6,33,24,.38);
  border-right:0;
  background:var(--kw-energy-color);
  color:#fff;
  font-weight:900;
}
.kw-energy-label__arrow::after{
  content:"";
  position:absolute;
  z-index:-1;
  top:2px;
  right:-9px;
  width:18px;
  height:18px;
  border-top:1px solid rgba(6,33,24,.38);
  border-right:1px solid rgba(6,33,24,.38);
  border-radius:1px;
  background:var(--kw-energy-color);
  transform:rotate(45deg);
}
.kw-energy-label__arrow b{position:relative;z-index:1;font-size:13px;line-height:1;color:inherit}
.kw-energy-label__arrow small{position:relative;z-index:1;font-size:5px;line-height:1;color:inherit}
.kw-energy-label--a{--kw-energy-color:#008c4a}
.kw-energy-label--b{--kw-energy-color:#56aa39}
.kw-energy-label--c{--kw-energy-color:#c7d72c}
.kw-energy-label--d{--kw-energy-color:#f1d42b}
.kw-energy-label--e{--kw-energy-color:#f5a623}
.kw-energy-label--f{--kw-energy-color:#ed6a2c}
.kw-energy-label--g{--kw-energy-color:#d43c2f}
.kw-energy-label--c .kw-energy-label__arrow,
.kw-energy-label--d .kw-energy-label__arrow,
.kw-energy-label--e .kw-energy-label__arrow{color:#13251f}
.kw-energy-label--small{transform:scale(.88);transform-origin:left center;margin:-2px 2px -2px 0}
.kw-energy-label--large{transform:scale(1.08);transform-origin:left center;margin:1px 5px 1px 0}
.wg-apparaten-card-spec dd .kw-energy-label,
.wg-hero-spec__value .kw-energy-label,
.wg-specification-row strong .kw-energy-label,
.wg-comparison-table td .kw-energy-label,
.wg-choice-card__specs .kw-energy-label{margin-right:10px}
@media(max-width:767px){
  .kw-energy-label--small{transform:scale(.92)}
  .kw-energy-label--large{transform:scale(1)}
}
