@import url('/photo-watermarks.css');
/* Alleen zeer smalle schermen: ruimte voor categorietitel en lange CTA. */
@media (max-width:380px) {
  .vh-category-intro {flex-direction:column;}
  .vh-category-intro > div {min-width:0;max-width:100%;overflow-wrap:anywhere;}
  .vh-category-contract {padding:26px 20px!important;}
  .vh-category-contract > div {min-width:0;max-width:100%;overflow-wrap:anywhere;}
  .vh-category-contract > a {max-width:100%;white-space:normal!important;text-align:center;overflow-wrap:anywhere;}
}
/* Warmtepompoverzicht: gelijke beeldvakken, losse prijsregels en vaste CTA. */
.vh-heat-products > .vh-product-card > [data-product-photo] {
  width:calc(100% - 24px)!important;
  margin:12px!important;
  aspect-ratio:4/3;
  height:auto!important;
  border-radius:12px!important;
  overflow:hidden;
  flex:none;
}
.vh-heat-products > .vh-product-card > [data-product-photo] > img {
  width:100%!important;
  height:100%!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  padding:0!important;
}
.vh-heat-products > .vh-product-card > [data-product-photo]::after {
  position:absolute!important;
  right:8px!important;
  bottom:8px!important;
  width:clamp(54px,24%,76px)!important;
  margin:0!important;
  background-color:rgba(255,255,255,.85)!important;
  border-radius:4px;
}
.vh-heat-products .vh-product-card-body {padding:20px!important;}
.vh-heat-products h3 {min-height:2.6em;line-height:1.3;}
.vh-heat-products .vh-product-price-footer {
  flex-direction:column;
  align-items:stretch!important;
  gap:18px!important;
  padding-top:20px;
}
.vh-heat-products .vh-product-price-copy {display:block;min-height:164px;}
.vh-heat-price {display:flex;flex-direction:column;gap:6px;}
.vh-heat-price-label {font:500 12px/1.4 'Hanken Grotesque',sans-serif;color:var(--ink2);}
.vh-heat-price-amount {font:600 clamp(25px,2.6vw,32px)/1.15 'Source Sans 3',sans-serif;letter-spacing:-.025em;}
.vh-heat-price-details {display:flex;flex-direction:column;gap:8px;margin-top:10px;padding-top:12px;border-top:1px solid var(--line);font:400 12px/1.5 'Hanken Grotesque',sans-serif;color:var(--ink2);}
.vh-heat-price-details > span {display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 8px;}
.vh-heat-price-details b {font-weight:600;white-space:nowrap;color:var(--ink);}
.vh-heat-products .vh-product-view {display:block;text-align:center;padding:12px 10px;border:1px solid #c8dfed;border-radius:10px;background:#eef6fb;white-space:nowrap;}
@media(min-width:561px) and (max-width:1000px) {
  .vh-heat-products {grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:560px) {
  .vh-heat-products {grid-template-columns:minmax(0,1fr)!important;}
  .vh-heat-products h3 {min-height:0;}
  .vh-heat-products .vh-product-price-copy {min-height:0;}
  .vh-heat-price-amount {font-size:32px;}
  .vh-heat-price-details,.vh-heat-price-label {font-size:14px;}
}
/* Goedgekeurde zachte gloed: alleen de introductie, uitlopend naar wit. */
.vh-intro-glow {
  background:
    linear-gradient(180deg, transparent 65%, #fff 100%),
    radial-gradient(ellipse at 88% 16%, #0e76c935 0%, #0e76c919 28%, transparent 59%),
    radial-gradient(ellipse at 73% 80%, #51b14e25 0%, transparent 50%),
    radial-gradient(ellipse at 4% 25%, #ffffffbc 0%, transparent 65%),
    #f5f5f1 !important;
}
.vh-intro-glow .vh-hero-proof {
  box-shadow: 0 26px 70px -34px #01253d60 !important;
}

/* Gelijksoortige inhoudskaarten delen hun maatvoering. */
.vh-info-card {
  padding: 26px !important;
  border-radius: 18px !important;
}
.vh-product-card-body {
  padding: 26px !important;
  min-width: 0;
}
.vh-product-card {
  min-width: 0;
}
.vh-price-card {
  padding: 24px !important;
  border-radius: 16px !important;
}
.vh-price-card > h3 {
  flex: 1;
}

/* De compacte diensttegels op mobiel blijven ongewijzigd. */
@media (min-width: 861px) {
  .vh-service-card {
    padding: 26px !important;
  }
  .vh-service-card-actions {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 12px !important;
  }
  .vh-service-card-actions > a:first-child {
    min-height: 2.8em;
    display: flex;
    align-items: flex-end;
  }
}
@media (hover: hover) and (min-width: 861px) {
  .vh-product-card:hover,
  .vh-service-card:hover {
    box-shadow: 0 14px 32px -22px rgba(1, 37, 61, .32) !important;
    transform: translateY(-2px) !important;
  }
}

/* Subgrid lijnt titels, beschrijvingen en prijzen per zichtbare rij uit.
   De bestaande flexindeling blijft fallback voor oudere browsers. */
@supports (grid-template-rows: subgrid) {
  .vh-quatt-card {
    display: grid !important;
    grid-row: span 4;
    grid-template-rows: subgrid;
    row-gap: 0;
  }
  .vh-quatt-card > .vh-product-card-body {
    display: grid !important;
    grid-row: span 3;
    grid-template-rows: subgrid;
    row-gap: 0;
  }
  .vh-quatt-card .vh-quatt-price {
    margin-top: 0;
  }
}
@media (max-width: 720px) {
  .vh-intro-glow {
    background:
      linear-gradient(180deg, transparent 65%, #fff 100%),
      radial-gradient(ellipse at 110% 12%, #0e76c932, transparent 65%),
      radial-gradient(ellipse at 5% 75%, #51b14e1f, transparent 50%),
      #f5f5f1 !important;
  }
}
