/* El Petit Món · landing · detalles no expresables en Tailwind */

html { scroll-behavior: smooth; scroll-padding-top: 96px; }

/* Estrellas flotantes del hero */
.pm-float {
  font-size: 30px;
  opacity: .65;
  animation: pmFloat 6s ease-in-out infinite;
}
.pm-float-2 { animation-duration: 7.5s; animation-delay: 1.2s; font-size: 22px; }
.pm-float-3 { animation-duration: 9s; animation-delay: .6s; font-size: 26px; }
@keyframes pmFloat {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50%      { transform: translateY(-18px) rotate(12deg); }
}

/* Entrada suave del logo del hero */
.pm-pop { animation: pmPop .8s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes pmPop {
  from { opacity: 0; transform: scale(.88) translateY(14px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* Tarjetas de stats con leve rotación alterna */
.pm-tilt { transition: transform .35s ease; }
.pm-tilt:nth-child(odd)  { transform: rotate(-1.2deg); }
.pm-tilt:nth-child(even) { transform: rotate(1.2deg); }
.pm-tilt:hover { transform: rotate(0) translateY(-4px); }

details summary::-webkit-details-marker { display: none; }

@media (prefers-reduced-motion: reduce) {
  .pm-float, .pm-pop { animation: none; }
  html { scroll-behavior: auto; }
}