/* 125.0 - professionele homepage- en assortimentstegels
   Productgroep eerst; Zaagtool uitsluitend als subtiele service-indicatie. */

.vh-feature-tile{
  min-width:0;
  overflow:hidden;
  border:1px solid #d4e1e9!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:0 6px 20px rgba(7,48,90,.055)!important;
  color:#16384d!important;
  text-decoration:none!important;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.vh-feature-tile:hover{
  transform:translateY(-2px);
  border-color:#a8ccde!important;
  box-shadow:0 12px 28px rgba(7,48,90,.10)!important;
}
.vh-feature-tile__image{
  display:block!important;
  overflow:hidden;
  background:#eef3f6;
}
.vh-feature-tile__image>img{
  display:block!important;
  width:100%!important;
  height:190px!important;
  min-height:0!important;
  max-height:none!important;
  object-fit:cover!important;
  transition:transform .22s ease;
}
.vh-feature-tile:hover .vh-feature-tile__image>img{transform:scale(1.025)}
.vh-feature-tile__body{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  min-height:220px;
  padding:0 16px 16px!important;
  color:#16384d!important;
}
.vh-feature-tile__title{
  display:block!important;
  margin:0 -16px 13px!important;
  padding:12px 16px!important;
  background:#078fc5!important;
  color:#fff!important;
  font-size:20px!important;
  font-weight:900!important;
  line-height:1.16!important;
  letter-spacing:-.02em!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
}
.vh-feature-tile__intro{
  display:block!important;
  margin:0 0 10px!important;
  color:#496879!important;
  font-size:13px!important;
  font-weight:500!important;
  line-height:1.48!important;
}
.vh-feature-tile__count{
  display:block!important;
  margin:0 0 10px!important;
  color:#748a98!important;
  font-size:11px!important;
  font-weight:750!important;
}
.vh-feature-tile__saw{
  display:inline-flex!important;
  align-items:center!important;
  align-self:flex-start!important;
  width:auto!important;
  max-width:100%!important;
  margin:0 0 12px!important;
  padding:6px 10px!important;
  border:1px solid #bfe5d0!important;
  border-radius:999px!important;
  background:#eef9f3!important;
  color:#17643a!important;
  font-size:11px!important;
  font-weight:850!important;
  line-height:1.1!important;
  white-space:nowrap!important;
}
.vh-feature-tile__saw>span{margin-right:5px;font-size:11px;line-height:1}
.vh-feature-tile__cta{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  margin-top:auto!important;
  padding-top:12px!important;
  border-top:1px solid #edf2f5!important;
  color:#0783bd!important;
  font-size:12px!important;
  font-weight:900!important;
  text-transform:none!important;
}

/* Homepage: geen oude glossy Zaagtool-afbeelding meer. */
.vh-category-strip{padding:20px 0 22px!important;background:#fff!important}
.vh-category-strip__grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;
  gap:14px!important;
  overflow:visible!important;
}
.vh-home-category.vh-feature-tile{
  display:flex!important;
  flex-direction:column!important;
  min-height:390px!important;
}
.vh-home-category.vh-feature-tile .vh-feature-tile__image>img{height:165px!important}
.vh-home-category.vh-feature-tile .vh-feature-tile__body{flex:1;min-height:220px!important}
.vh-home-category.vh-feature-tile .vh-feature-tile__title{font-size:18px!important}
.vh-home-category.vh-feature-tile .vh-feature-tile__intro{font-size:12px!important}

/* Hoofd-assortiment: dezelfde visuele taal als goedgekeurde productgroeptegels. */
.vh-assortment-tiles{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
}
.vh-assortment-tiles>.vh-feature-tile{display:flex!important;flex-direction:column!important;min-height:450px!important}
.vh-assortment-tiles>.vh-feature-tile .vh-feature-tile__image>img{height:210px!important}
.vh-assortment-tiles>.vh-feature-tile .vh-feature-tile__body{flex:1!important}

@media(max-width:1180px){
  .vh-assortment-tiles{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:900px){
  .vh-category-strip__grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  .vh-home-category.vh-feature-tile{min-height:0!important;flex:initial!important}
  .vh-assortment-tiles{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  .vh-assortment-tiles>.vh-feature-tile{min-height:0!important}
  .vh-feature-tile__body{min-height:210px!important;padding:0 14px 14px!important}
  .vh-feature-tile__title{margin:0 -14px 12px!important;padding:11px 14px!important;font-size:17px!important}
  .vh-feature-tile__image>img,
  .vh-home-category.vh-feature-tile .vh-feature-tile__image>img,
  .vh-assortment-tiles>.vh-feature-tile .vh-feature-tile__image>img{height:150px!important}
  .vh-feature-tile__intro{font-size:12px!important}
}
@media(max-width:520px){
  .vh-category-strip__grid,.vh-assortment-tiles{grid-template-columns:1fr!important}
  .vh-feature-tile__image>img,
  .vh-home-category.vh-feature-tile .vh-feature-tile__image>img,
  .vh-assortment-tiles>.vh-feature-tile .vh-feature-tile__image>img{height:190px!important}
  .vh-feature-tile__body{min-height:0!important}
  .vh-feature-tile__saw{white-space:normal!important}
}