/* HL Blog listing — match homepage “Veel artikleid” mini cards.
 * Lead + grid: horizontal image|text, white media, no double boxes.
 * Keep ≲15KB FTP. */

.hl-blog{padding:.15rem 0 1.75rem}
.hl-blog-article{max-width:920px}

/* ——— Article detail hero = homepage featured language ——— */
.hl-blog-article{max-width:920px;margin:0 auto}
.hl-blog-article__hero{
  margin:0 0 1.25rem;
  padding:0!important;
  border:1px solid #e6e9ee!important;
  border-radius:8px;
  background:#fff!important;
  box-shadow:none!important;
  overflow:hidden;
  transition:border-color .15s ease;
}
.hl-blog-article__hero:hover{border-color:#d0d4db}
.hl-blog-article__hero-layout{
  display:grid;
  grid-template-columns:minmax(0,.38fr) minmax(0,.62fr);
  gap:0!important;
  align-items:stretch;
  min-height:180px;
  max-height:210px;
  background:#fff;
}
.hl-blog-article__hero--text-only .hl-blog-article__hero-layout{
  grid-template-columns:1fr;min-height:0;max-height:none;
}
.hl-blog-article__media,
.hl-blog-article__hero .hl-blog-article__media{
  display:block;margin:0!important;height:100%;min-width:0;
  background:#fff!important;
}
.hl-blog-media--hero,
.hl-blog-media--hero .hl-blog-media__frame{
  display:flex!important;align-items:center;justify-content:center;
  width:100%;height:100%;min-height:180px;max-height:210px;
  aspect-ratio:auto!important;
  padding:0!important;margin:0!important;
  border:0!important;border-radius:0!important;
  background:#fff!important;box-shadow:none!important;overflow:hidden;
}
.hl-blog-media--hero .hl-blog-media__frame img,
.hl-blog-article__hero .hl-blog-media__frame img{
  display:block;
  width:100%!important;height:100%!important;
  max-width:100%!important;max-height:100%!important;
  object-fit:contain!important;object-position:center;
  transform:none!important;
  border:0!important;box-shadow:none!important;
}
.hl-blog-article__hero-body{
  display:flex;flex-direction:column;justify-content:center;
  gap:.2rem;min-width:0;background:#fff;
  padding:.85rem 1.1rem .9rem .95rem;box-sizing:border-box;
}
.hl-blog-article__topic{
  margin:0;font-size:.6875rem;font-weight:600;
  letter-spacing:.07em;text-transform:uppercase;color:#9ca3af;
}
.hl-blog-article__topic a{color:inherit!important;text-decoration:none!important}
.hl-blog-article__topic a:hover{color:var(--hl-red,#d71920)!important}
.hl-blog-article__title{
  margin:0;
  font-family:Mulish,"Segoe UI",sans-serif;
  font-size:clamp(1.15rem,1.05rem + .5vw,1.4rem)!important;
  font-weight:600!important;line-height:1.18;letter-spacing:-.015em;color:#111827!important;
}
.hl-blog-article__meta{margin:0;font-size:.75rem;line-height:1.3;color:#9ca3af}
.hl-blog-article__lead{
  margin:.1rem 0 0;font-size:.875rem;line-height:1.45;color:#4b5563;font-weight:400;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}

/* Article body — full article width, connected to hero */
.hl-blog-article__body{
  font-size:1rem;line-height:1.65;color:#1f2937;
  max-width:none;width:100%;
  margin:0;padding:0 .15rem;
}
.hl-blog-article__hero{margin:0 0 .95rem}
.hl-blog-article__body p{margin:0 0 .9em}
.hl-blog-article__body h2{
  margin:1.25em 0 .45em;padding-top:.45rem;
  font-size:1.15rem;font-weight:600!important;line-height:1.25;letter-spacing:-.01em;
  color:#111827;border-top:1px solid #eef0f3;
}
.hl-blog-article__body h2:first-child{border-top:0;padding-top:0;margin-top:.15rem}
.hl-blog-article__body h3{
  margin:1.05em 0 .35em;font-size:1.02rem;font-weight:600!important;line-height:1.28;color:#111827;
}
.hl-blog-article__body ul,.hl-blog-article__body ol{margin:0 0 .9em;padding-left:1.15em}
.hl-blog-article__body a{
  color:#111827!important;text-decoration:underline;text-underline-offset:2px;
}
.hl-blog-article__body a:hover{color:var(--hl-red,#d71920)!important}
.hl-blog-article__body img,
.hl-blog-article__body figure,
.hl-blog-article__body .hl-blog-media__frame{
  border:0!important;box-shadow:none!important;background:#fff!important;
}
.hl-blog-article__body img{
  max-width:100%;height:auto;border-radius:0;display:block;margin:.85rem 0;
}
.hl-blog-article__archive{
  margin:1.35rem 0 0;padding-top:.85rem;border-top:1px solid #eef0f3;font-size:.8125rem;
}
.hl-blog-article__archive a{
  color:#111827!important;font-weight:600;text-decoration:none!important;
}
.hl-blog-article__archive a:hover{color:var(--hl-red,#d71920)!important}

/* Related heading */
.hl-blog-related__eyebrow{
  margin:0 0 .2rem;font-size:.6875rem;font-weight:600;
  letter-spacing:.07em;text-transform:uppercase;color:#9ca3af;
}

/* ——— Index chrome ——— */
.hl-blog-index__header{margin:0 0 .65rem;padding-bottom:.55rem}
.hl-blog-index__title{font-size:clamp(1.35rem,1.15rem + .7vw,1.7rem);line-height:1.1;margin:0 0 .2rem}
.hl-blog-index__lead{font-size:.8125rem;line-height:1.4;max-width:32rem}
.hl-blog-topics{margin:0 0 .85rem}
.hl-blog-topics__link{min-height:1.7rem;padding:.2rem .6rem;font-size:.72rem;border-radius:2px}

/* Kill grey/white double surfaces on all listing media */
.hl-blog-index .hl-blog-media__frame,
.hl-blog-lead .hl-blog-media__frame,
.hl-blog-card .hl-blog-media__frame{
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
}
.hl-blog-index .hl-blog-media__frame img,
.hl-blog-lead .hl-blog-media__frame img,
.hl-blog-card .hl-blog-media__frame img,
.hl-blog-media--hero .hl-blog-media__frame img,
.hl-blog-article__hero .hl-blog-media__frame img{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center;
  transform:none!important;
}

/* ——— Lead = homepage featured language ——— */
.hl-blog-lead{
  margin:0 0 .85rem;
  padding:0;
  border:1px solid #e6e9ee;
  border-radius:8px;
  background:#fff;
  box-shadow:none;
  overflow:hidden;
  transition:border-color .15s ease;
}
.hl-blog-lead:hover{border-color:#d0d4db}
.hl-blog-lead__layout{
  display:grid;
  grid-template-columns:minmax(0,.36fr) minmax(0,.64fr);
  gap:0;
  align-items:stretch;
  min-height:168px;
  max-height:190px;
}
.hl-blog-lead__media-link{
  display:block;min-width:0;height:100%;text-decoration:none;overflow:hidden;
}
.hl-blog-media--lead,
.hl-blog-media--lead .hl-blog-media__frame{
  height:100%;min-height:168px;max-height:190px;aspect-ratio:auto;overflow:hidden;
}
.hl-blog-lead__body{
  display:flex;flex-direction:column;justify-content:center;
  gap:.22rem;min-width:0;max-width:none;
  padding:.7rem 1rem .75rem .85rem;box-sizing:border-box;
}
.hl-blog-lead__title{
  margin:0;font-size:clamp(1.05rem,.95rem + .35vw,1.25rem);
  font-weight:600!important;line-height:1.18;letter-spacing:-.015em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.hl-blog-lead__excerpt{
  margin:0;font-size:.84375rem;line-height:1.45;color:#4b5563;
  -webkit-line-clamp:3;
}
.hl-blog-lead .hl-blog-card__cta{
  margin-top:.35rem;padding-top:0;color:var(--hl-red,#d71920)!important;
}

/* ——— Lower cards: more text room, equal image visual mass ——— */
.hl-blog-card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:.7rem;row-gap:.7rem;
  margin:0 0 1rem;
}
.hl-blog-card{
  display:grid!important;
  grid-template-columns:minmax(0,.42fr) minmax(0,.58fr);
  align-items:stretch;
  min-height:150px;max-height:170px;height:auto;
  padding:0!important;
  border:1px solid #e6e9ee;
  border-radius:8px;
  background:#fff;
  box-shadow:none!important;
  overflow:hidden;
  transition:border-color .15s ease;
}
.hl-blog-card:hover{
  border-color:#d0d4db!important;
  box-shadow:none!important;
  transform:none!important;
}
.hl-blog-card__media-link{
  display:block;min-width:0;height:100%;margin:0!important;text-decoration:none;overflow:hidden;
}
.hl-blog-media--card,
.hl-blog-media--card .hl-blog-media__frame{
  height:100%;min-height:150px;max-height:170px;aspect-ratio:auto;overflow:hidden;
}
.hl-blog-card__body{
  display:flex;flex-direction:column;justify-content:center;
  gap:.16rem;min-width:0;min-height:0;overflow:hidden;
  padding:.55rem .65rem .55rem .55rem!important;
}
.hl-blog-card__topic{font-size:.6875rem;letter-spacing:.07em;color:#9ca3af;margin:0}
.hl-blog-card__title{
  min-height:0!important;margin:0!important;
  font-size:.875rem;font-weight:600;line-height:1.22;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.hl-blog-card__meta{font-size:.6875rem;color:#9ca3af;margin:0}
.hl-blog-card__excerpt{
  margin:0;font-size:.75rem;line-height:1.35;color:#6b7280;
  -webkit-line-clamp:2;
}
.hl-blog-card__cta{
  margin-top:.2rem;padding-top:0;font-size:.75rem;font-weight:600;
  color:var(--hl-red,#d71920)!important;text-decoration:none!important;
}
.hl-blog-card__cta:hover{text-decoration:underline!important;text-underline-offset:2px}

/* Related / product cards keep existing compact look */
.hl-blog-related{margin:1.25rem auto 0;padding:1rem 0 0}
.hl-blog-related__head{margin:0 0 .7rem}
.hl-blog-related__lead{display:none}
.hl-blog-sec-title{font-size:1.05rem}

.hl-blog-product-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin:.95rem 0 1.1rem}
/* 1–2 products: full-width horizontal cards (same language as article listing) */
.hl-blog-product-row--solo,
.hl-blog-product-row--duo,
.hl-blog-product-row:has(> .hl-blog-pcard:only-child),
.hl-blog-product-row:has(> .hl-blog-pcard:first-child:nth-last-child(2)){
  grid-template-columns:1fr!important;
  gap:.65rem;
  margin:.85rem 0 1rem;
  width:100%;
}
.hl-blog-pcard,.hl-blog-article__body .hl-blog-pcard{
  position:relative;
  display:flex;flex-direction:column;align-items:stretch;
  padding:.6rem;border:1px solid #e6e9ee;border-radius:8px;background:#fff;gap:.4rem;box-sizing:border-box;
  box-shadow:none;transition:border-color .15s ease;
  text-decoration:none!important;color:inherit!important;
}
.hl-blog-pcard__hit{
  position:absolute;inset:0;z-index:2;
  display:block!important;border:0!important;background:transparent!important;
  text-decoration:none!important;cursor:pointer;
}
.hl-blog-article__body a.hl-blog-pcard__hit,
.hl-blog-article__body a.hl-blog-pcard__hit:hover{
  color:transparent!important;text-decoration:none!important;background:transparent!important;
}
.hl-blog-pcard:hover{border-color:#d0d4db}
.hl-blog-pcard__img,.hl-blog-pcard__body,.hl-blog-pcard__title,.hl-blog-pcard__excerpt,.hl-blog-pcard__cta{
  position:relative;z-index:1;pointer-events:none;
}
.hl-blog-pcard__img{display:flex;align-items:center;justify-content:center;max-height:140px;min-height:100px;background:#fff;border-radius:0;overflow:hidden}
.hl-blog-pcard__img img{max-width:100%;max-height:140px;object-fit:contain}
.hl-blog-pcard__body{display:flex;flex-direction:column;gap:.35rem;min-width:0}
.hl-blog-pcard__title{min-height:2.4em;margin:0;font-size:.8125rem;line-height:1.3;font-weight:600;color:#111827}
.hl-blog-pcard__cta{font-size:.75rem;font-weight:600;color:var(--hl-red,#d71920)!important;text-decoration:none!important}
.hl-blog-pcard__excerpt{
  margin:0;font-size:.78rem;line-height:1.4;color:#9ca3af;font-weight:400;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.hl-blog-product-row--solo .hl-blog-pcard,
.hl-blog-product-row--duo .hl-blog-pcard,
.hl-blog-article__body .hl-blog-product-row--solo .hl-blog-pcard,
.hl-blog-article__body .hl-blog-product-row--duo .hl-blog-pcard,
.hl-blog-product-row:has(> .hl-blog-pcard:only-child) > .hl-blog-pcard,
.hl-blog-product-row:has(> .hl-blog-pcard:first-child:nth-last-child(2)) > .hl-blog-pcard{
  display:grid!important;
  grid-template-columns:minmax(150px,.36fr) minmax(0,.64fr)!important;
  grid-template-rows:auto;
  align-items:center;
  width:100%!important;
  max-width:100%!important;
  min-height:140px;max-height:none;
  padding:0!important;gap:0!important;
  overflow:hidden;
}
.hl-blog-product-row--solo .hl-blog-pcard__img,
.hl-blog-product-row--duo .hl-blog-pcard__img,
.hl-blog-product-row:has(> .hl-blog-pcard:only-child) > .hl-blog-pcard > .hl-blog-pcard__img,
.hl-blog-product-row:has(> .hl-blog-pcard:first-child:nth-last-child(2)) > .hl-blog-pcard > .hl-blog-pcard__img{
  display:flex!important;align-items:center;justify-content:center;
  grid-column:1;grid-row:1 / -1;
  width:100%;height:100%;
  min-height:140px;max-height:168px;
  margin:0;padding:.5rem .55rem;border-radius:0;background:#fff;
}
.hl-blog-product-row--solo .hl-blog-pcard__img img,
.hl-blog-product-row--duo .hl-blog-pcard__img img,
.hl-blog-product-row:has(> .hl-blog-pcard:only-child) > .hl-blog-pcard > .hl-blog-pcard__img img,
.hl-blog-product-row:has(> .hl-blog-pcard:first-child:nth-last-child(2)) > .hl-blog-pcard > .hl-blog-pcard__img img{
  width:auto!important;height:auto!important;
  max-width:100%!important;max-height:148px!important;
  object-fit:contain!important;object-position:center;
}
.hl-blog-product-row--solo .hl-blog-pcard__body,
.hl-blog-product-row--duo .hl-blog-pcard__body,
.hl-blog-product-row:has(> .hl-blog-pcard:only-child) > .hl-blog-pcard > .hl-blog-pcard__body,
.hl-blog-product-row:has(> .hl-blog-pcard:first-child:nth-last-child(2)) > .hl-blog-pcard > .hl-blog-pcard__body{
  display:flex!important;flex-direction:column;justify-content:center;
  grid-column:2;grid-row:1 / -1;
  gap:.28rem;min-width:0;min-height:0;
  padding:.65rem .95rem .65rem .7rem;box-sizing:border-box;
}
.hl-blog-product-row--solo .hl-blog-pcard__title,
.hl-blog-product-row--duo .hl-blog-pcard__title,
.hl-blog-product-row:has(> .hl-blog-pcard:only-child) > .hl-blog-pcard .hl-blog-pcard__title{
  min-height:0!important;margin:0;font-size:1.05rem;font-weight:650;line-height:1.25;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.hl-blog-product-row--solo .hl-blog-pcard__excerpt,
.hl-blog-product-row--duo .hl-blog-pcard__excerpt,
.hl-blog-product-row:has(> .hl-blog-pcard:only-child) > .hl-blog-pcard .hl-blog-pcard__excerpt{
  margin:0;font-size:.78rem;line-height:1.4;color:#9ca3af;font-weight:400;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.hl-blog-product-row--solo .hl-blog-pcard__cta,
.hl-blog-product-row--duo .hl-blog-pcard__cta{
  margin-top:.15rem;font-size:.8125rem;font-weight:700;
}

@media (min-width:768px) and (max-width:1023.98px){
  .hl-blog-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hl-blog-card-grid > li:last-child:nth-child(odd){grid-column:1 / -1;max-width:50%}
  .hl-blog-lead__layout{min-height:150px;max-height:170px}
  .hl-blog-media--lead,.hl-blog-media--lead .hl-blog-media__frame{min-height:150px;max-height:170px}
}

@media (max-width:991.98px){
  .hl-blog-article__hero-layout{
    grid-template-columns:1fr!important;min-height:0;max-height:none;
  }
  .hl-blog-media--hero,.hl-blog-media--hero .hl-blog-media__frame{
    min-height:140px;max-height:180px;height:160px;
  }
  .hl-blog-product-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hl-blog-product-row--solo,
  .hl-blog-product-row--duo{grid-template-columns:1fr}
}

@media (max-width:767.98px){
  .hl-blog-article__hero{padding:0!important}
  .hl-blog-article__hero-body{padding:.7rem .8rem .8rem}
  .hl-blog-article__title{font-size:1.15rem}
  .hl-blog-article__lead{-webkit-line-clamp:2;font-size:.8125rem}
  .hl-blog-article__body{font-size:.9rem;line-height:1.55;max-width:none}
  .hl-blog-lead__layout{
    grid-template-columns:1fr;min-height:0;max-height:none;
  }
  .hl-blog-media--lead,.hl-blog-media--lead .hl-blog-media__frame{
    min-height:140px;max-height:150px;height:140px;
  }
  .hl-blog-lead__body{padding:.65rem .75rem .75rem}
  .hl-blog-card-grid{grid-template-columns:1fr;gap:.55rem}
  .hl-blog-card-grid > li:last-child:nth-child(odd){max-width:none;grid-column:auto}
  .hl-blog-card{
    grid-template-columns:120px minmax(0,1fr)!important;
    min-height:118px;max-height:none;
  }
  .hl-blog-media--card,.hl-blog-media--card .hl-blog-media__frame{
    min-height:118px;max-height:none;height:100%;
  }
  .hl-blog-card__body{padding:.5rem .6rem!important}
  .hl-blog-card__title{font-size:.8125rem}
  .hl-blog-card__excerpt{-webkit-line-clamp:1;font-size:.71875rem}
  .hl-blog-product-row{grid-template-columns:1fr;gap:.55rem}
  .hl-blog-product-row--solo .hl-blog-pcard,
  .hl-blog-product-row--duo .hl-blog-pcard{
    grid-template-columns:104px minmax(0,1fr)!important;
    align-items:start!important;
    min-height:0;max-height:none;overflow:visible!important;
  }
  .hl-blog-product-row--solo .hl-blog-pcard__img,
  .hl-blog-product-row--duo .hl-blog-pcard__img{
    min-height:104px;max-height:none;height:auto;align-self:stretch;padding:.35rem;
  }
  .hl-blog-product-row--solo .hl-blog-pcard__img img,
  .hl-blog-product-row--duo .hl-blog-pcard__img img{max-height:118px!important}
  .hl-blog-product-row--solo .hl-blog-pcard__body,
  .hl-blog-product-row--duo .hl-blog-pcard__body{
    padding:.5rem .65rem!important;justify-content:flex-start!important;min-height:0;overflow:visible;
  }
  /* Full product name on mobile — no clamp / ellipsis */
  .hl-blog-product-row--solo .hl-blog-pcard__title,
  .hl-blog-product-row--duo .hl-blog-pcard__title,
  .hl-blog-product-row:has(> .hl-blog-pcard:only-child) > .hl-blog-pcard .hl-blog-pcard__title{
    display:block!important;
    -webkit-line-clamp:unset!important;
    -webkit-box-orient:unset;
    overflow:visible!important;
    white-space:normal!important;
    text-overflow:unset;
    font-size:.875rem;line-height:1.3;max-height:none;
  }
  .hl-blog-product-row--solo .hl-blog-pcard__excerpt,
  .hl-blog-product-row--duo .hl-blog-pcard__excerpt{-webkit-line-clamp:2;font-size:.72rem;color:#9ca3af}
}
