.index-carousel__item[aria-current='true'] .index-family-card,
.index-family-card:focus-within {
  border-color: color-mix(in srgb, var(--index-accent) 72%, var(--line));
  box-shadow:
    0 1.5rem 4rem color-mix(in srgb, var(--shadow) 16%, transparent),
    inset 0 0 0 1px color-mix(in srgb, var(--index-accent) 24%, transparent);
}

.index-carousel__item[aria-current='true'] .index-family-card::before {
  height: 4px;
  box-shadow: 0 0 2rem color-mix(in srgb, var(--index-accent) 32%, transparent);
}

.index-carousel__item:not([aria-current='true']) .index-family-card__visual img {
  filter: saturate(.78) contrast(.96) drop-shadow(0 1.2rem 1.25rem rgba(0, 0, 0, .16));
}

.index-carousel__item[aria-current='true'] .index-family-card__visual img {
  filter: saturate(1.04) drop-shadow(0 1.7rem 1.6rem rgba(0, 0, 0, .23));
}

.index-carousel__item[aria-current='true'] .index-family-card__action {
  color: var(--index-accent);
  background: color-mix(in srgb, var(--index-accent) 6%, transparent);
}

.index-carousel__viewport[aria-describedby] {
  scroll-margin-inline: 1rem;
}

@media (max-width: 620px) {
  .index-carousel__item[aria-current='true'] .index-family-card,
  .index-family-card:focus-within {
    box-shadow:
      0 1rem 2.5rem color-mix(in srgb, var(--shadow) 13%, transparent),
      inset 0 0 0 1px color-mix(in srgb, var(--index-accent) 26%, transparent);
  }

  .index-family-card__top {
    align-items: flex-start;
  }

  .index-family-card__top small {
    line-height: 1.35;
  }

  .index-family-card__body > p {
    max-width: 96%;
  }

}

@media (prefers-reduced-motion: reduce) {
  .index-carousel__item .index-family-card,
  .index-carousel__item .index-family-card__visual img,
  .index-carousel__item .index-family-card__action {
    transition-duration: .01ms !important;
  }
}