.zona-cartas {
  background-color: #f6e8d5;
  border: 2px dashed #c9ad92;
  padding: 20px;
  border-radius: 16px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: flex-start;
  min-height: 250px;
  flex: 1 1 50%;
}


.carta-container {
  width: 140px;
  height: 210px;
  perspective: 1000px;
}

.carta-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
  cursor: pointer;
}

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

.carta-front,
.carta-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  border-radius: 8px;
  overflow: hidden;
}

.carta-front {
  transform: rotateY(180deg);
}