/* -------------------------------- ElementServices -------------------------------- */
.service-card__link { display: block; height: 100%; color: inherit; }
.service-card__link:hover .card { box-shadow: 0 12px 28px rgba(10, 10, 10, 0.1); }

.service-card,
.service-cover-card { transition: box-shadow 0.25s ease; }

/* Cover card: content overlaid on the image */
.service-cover-card {
  position: relative;
  overflow: hidden;
  min-height: 16rem;
  color: #fff;
}
.service-cover-card > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* when the card carries a format, the image fills it instead of setting the height */
.service-cover-card[style*="aspect-ratio"] { min-height: 0; }
.service-cover-card[style*="aspect-ratio"] > img { position: absolute; inset: 0; aspect-ratio: auto; }

.service-cover-card--no-image { background-color: var(--primary, #203067); }

.service-cover-card__overlay {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.9) 33.33%, rgba(0, 0, 0, 0.12) 100%);
}
.service-cover-card--no-image .service-cover-card__overlay { background: none; }
.service-cover-card :where(h3, p) { color: inherit; }

@media (prefers-reduced-motion: reduce) {
  .service-card,
  .service-cover-card { transition: none; }
}
