/*
 * KPI cards that link to a customer case study (blocks pasted in the
 * "Paragraphs" layout, see PIM Cloud / PIM On-Premise pages).
 * Base look is inline in the block; this file only adds hover / focus.
 */
.kpi-card,
.kpi-card:hover,
.kpi-card:focus {
  text-decoration: none !important;
  color: #101830 !important;
}

.kpi-card {
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.kpi-card:hover,
.kpi-card:focus-visible {
  transform: translateY(-4px);
  border-color: #5078f0 !important;
  box-shadow: 0 18px 40px rgba(16, 24, 48, 0.14) !important;
}

.kpi-card:focus-visible {
  outline: 2px solid #5078f0;
  outline-offset: 3px;
}

.kpi-card__arrow {
  display: inline-block;
  transition: transform 0.2s ease;
}

.kpi-card:hover .kpi-card__arrow,
.kpi-card:focus-visible .kpi-card__arrow {
  transform: translateX(5px);
}

@media (prefers-reduced-motion: reduce) {
  .kpi-card,
  .kpi-card__arrow {
    transition: none;
  }

  .kpi-card:hover,
  .kpi-card:focus-visible,
  .kpi-card:hover .kpi-card__arrow {
    transform: none;
  }
}