/* Flip-card base — used by product cards (M5+). */

.flip-scene {
  perspective: 1200px;
}

.flip-card {
  position: relative;
  transform-style: preserve-3d;
  transition: transform 0.6s var(--ease);
}

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

.flip-face {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  border-radius: var(--radius);
  overflow: hidden;
}

.flip-front {
  z-index: 2;
}

.flip-back {
  transform: rotateY(180deg);
}

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