/* v21: Services vertical cards + keep first two About team portraits grayscale */

.team-grid-custom > *:nth-child(1) img,
.team-grid-custom > *:nth-child(2) img,
.team-grid-custom > *:nth-child(1):hover img,
.team-grid-custom > *:nth-child(2):hover img {
  filter: grayscale(1) !important;
  -webkit-filter: grayscale(1) !important;
}

@media (min-width: 768px) {
  .services-vertical-card img {
    object-fit: cover !important;
  }
}

/* v22: keep Services images in the original compact card size, only vertical ratio */
.services-vertical-image-v22 {
  width: min(320px, 100%) !important;
  max-width: 320px !important;
  aspect-ratio: 3 / 4 !important;
  flex: 0 0 auto !important;
  opacity: .8 !important;
  transform: scale(.95) !important;
  transition: transform .7s ease, opacity .7s ease, filter .7s ease !important;
}
.group:hover .services-vertical-image-v22 {
  opacity: 1 !important;
  transform: scale(1.02) !important;
}
.services-vertical-image-v22-img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center center !important;
  filter: grayscale(1) !important;
  transition: transform .7s ease, filter .7s ease, brightness .7s ease !important;
}
.group:hover .services-vertical-image-v22-img {
  transform: scale(1.04) !important;
  filter: grayscale(0) brightness(1.1) !important;
}
@media (max-width: 767px) {
  .services-vertical-image-v22 {
    width: 100% !important;
    max-width: 360px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}