/* ===== Flip Card ===== */
.flip-card {
  perspective: 1000px;
  cursor: pointer;
}

.flip-card-inner {
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.flip-card.flipped .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front,
.flip-card-back {
  backface-visibility: hidden;
}

.flip-card-back {
  transform: rotateY(180deg);
  background: linear-gradient(to top, #04af93, #1f204e);
}

/* ===== Custom text sizes ===== */
.text-3xs {
  font-size: 0.5rem;
  line-height: 0.75rem;
}

@media (min-width: 768px) {
  .text-3xs {
    font-size: 0.55rem;
    line-height: 0.8rem;
  }
}