/* Pola kartu lift: terangkat sedikit saat diarahkan kursor,
   dengan transisi pada properti yang murah (transform, box-shadow) */
.kartu {
  background-color: rgb(255, 255, 255);
  border: 1px solid rgb(226, 232, 240);
  border-radius: 12px;
  padding: 20px;
  max-width: 260px;
  transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;
}

.kartu:hover,
.kartu:focus-within {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgb(15 23 42 / 0.12);
}

/* Hormati preferensi pengguna yang mengurangi gerakan */
@media (prefers-reduced-motion: reduce) {
  .kartu {
    transition-duration: 0.01ms;
  }
  .kartu:hover,
  .kartu:focus-within {
    transform: none;
    box-shadow: 0 4px 10px rgb(15 23 42 / 0.10);
  }
}