.step-icon {
  display: block;
  width: 76px;
  height: 76px;
  margin: 24px 0 22px;
  transition: transform .25s ease;
}

.steps li:hover .step-icon {
  transform: translateY(-4px);
}

.steps .step-icon + h3 {
  margin-top: 0;
}

@media (max-width: 520px) {
  .step-icon {
    width: 68px;
    height: 68px;
  }
}

/* Deutlicher Hover-Effekt für die sechs Leistungskacheln */
.services .card {
  transition: transform .32s ease, box-shadow .32s ease, border-color .32s ease;
}

.services .card .card-body {
  transition: background-color .32s ease;
}

.services .card .card-image {
  transition: transform .48s ease, filter .38s ease;
}

.services .card:hover,
.services .card:focus-within {
  transform: translateY(-16px) scale(1.025);
  border-color: #16a7df;
  box-shadow:
    0 0 0 3px rgba(22, 167, 223, .30),
    0 34px 70px rgba(7, 38, 61, .30);
}

.services .card:hover .card-body,
.services .card:focus-within .card-body {
  background-color: #cceefb;
}

.services .card:hover .card-image,
.services .card:focus-within .card-image {
  transform: scale(1.10);
  filter: saturate(1.16) contrast(1.08) brightness(1.04);
}

@media (prefers-reduced-motion: reduce) {
  .services .card,
  .services .card .card-body,
  .services .card .card-image {
    transition: none;
  }
}