.cp-category-visual-banner {
  width: min(1180px, calc(100% - 48px));
  aspect-ratio: 600 / 122;
  max-height: 220px;
  margin: 8px auto 26px;
  border-radius: 22px;
  overflow: hidden;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  box-shadow: 0 16px 36px rgba(4, 24, 44, .18);
  border: 1px solid rgba(255, 127, 0, .24);
  animation: cpCategoryBannerIn .65s ease both;
}
.cp-category-visual-banner[data-category='products'] { background-image: url('/category-producten.svg'); }
.cp-category-visual-banner[data-category='vehicles'] { background-image: url('/category-voertuigen.svg'); }
.cp-category-visual-banner[data-category='homes'] { background-image: url('/category-woningen.svg'); }
.cp-category-visual-banner[data-category='jobs-services'] { background-image: url('/category-vacatures-diensten.svg'); }

@keyframes cpCategoryBannerIn {
  from { opacity: 0; transform: translateY(8px); filter: blur(3px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}

@media (max-width: 700px) {
  .cp-category-visual-banner {
    width: calc(100% - 24px);
    aspect-ratio: 600 / 122;
    max-height: 150px;
    border-radius: 16px;
    margin: 8px auto 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cp-category-visual-banner { animation: none; }
}