/* Contenedor principal */
.moneda-leonesa {
  background-color: transparent;
  width: 300px;
  height: 300px;
  perspective: 1000px;
  margin: 20px auto;
}

/* El cuerpo de la moneda que gira */
.moneda-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
  animation: giro-total 6s linear infinite;
}

/* Ambas caras */
.cara-anverso, .cara-reverso {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Oculta la espalda al girar */
  backface-visibility: hidden;
  border-radius: 50%;
}

/* Cara A */
.cara-anverso {
  background-image: url("/monedas/moneda-animacion.png");
  background-size: cover;
}

/* Cara B (Girada 180 grados de inicio) */
.cara-reverso {
  background-image: url("/monedas/moneda-animacion-2.png");
  background-size: cover;
  transform: rotateY(180deg);
}

/* Animación de rotación */
@keyframes giro-total {
  from { transform: rotateY(0deg); }
  to { transform: rotateY(360deg); }
}

.moneda-leonesa:after {
  content: "";
  display: block;
  width: 150px;
  height: 10px;
  background: rgba(0,0,0,0.1);
  margin: 10px auto;
  border-radius: 50%;
  filter: blur(4px);
}