/* Pie de página lunar: la misma esfera con cráteres y brillo naranja del final de la web.
   Lo usan la página de precios y el login / registro de la app. */
.moon-footer {
  position: relative; height: 170px; margin-top: 24px; padding: 0; overflow: hidden; border: 0;
  /* el brillo se funde con el fondo por arriba (sin borde recto) */
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 45%); mask-image: linear-gradient(to bottom, transparent, #000 45%);
}
.moon-footer::before {
  content: ""; position: absolute; left: 50%; top: 82px; width: max(170vw, 1400px); aspect-ratio: 1; translate: -50% 0; border-radius: 50%;
  background:
    radial-gradient(ellipse 1.6% 0.45% at 41% 1.6%, rgb(7 10 23 / 0.6) 70%, transparent 74%),
    radial-gradient(ellipse 1% 0.3% at 47% 0.9%, rgb(7 10 23 / 0.55) 70%, transparent 74%),
    radial-gradient(ellipse 2.2% 0.6% at 57% 2.1%, rgb(7 10 23 / 0.55) 70%, transparent 74%),
    radial-gradient(ellipse 1.2% 0.35% at 63% 1.1%, rgb(7 10 23 / 0.5) 70%, transparent 74%),
    radial-gradient(ellipse 1.8% 0.5% at 35% 2.4%, rgb(7 10 23 / 0.5) 70%, transparent 74%),
    radial-gradient(circle at 50% 0%, #2a3160, #171c3c 9%, #0f1329 22%, #0b0f1a 40%);
  box-shadow: 0 -1px 0 #fde68a, 0 -8px 36px rgb(251 146 60 / 0.75), 0 -30px 90px rgb(236 72 153 / 0.42), 0 -70px 160px rgb(168 85 247 / 0.28);
}
.moon-footer .text {
  position: absolute; left: 0; right: 0; bottom: 16px; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 0 20px; text-align: center; font-size: 13px; color: rgb(224 231 255 / 0.5); text-shadow: 0 0 8px #0b0f1a;
}
.moon-footer .made { margin: 0; max-width: none; font-size: 14px; color: rgb(224 231 255 / 0.75); }
.moon-footer .heart { display: inline-block; color: #f472b6; animation: moon-beat 1.4s ease-in-out infinite; }
@keyframes moon-beat { 0%, 60%, 100% { transform: scale(1); } 15% { transform: scale(1.3); } 30% { transform: scale(1.05); } 45% { transform: scale(1.2); } }
@media (prefers-reduced-motion: reduce) { .moon-footer .heart { animation: none; } }
@media (max-width: 600px) { .moon-footer { height: 180px; } .moon-footer::before { top: 74px; } .moon-footer .made { font-size: 13px; } }
/* aliens haciendo ejercicio sobre la luna */
.moon-alien { position: absolute; z-index: 1; pointer-events: none; transform-origin: 50% 93%; opacity: 0.75; filter: drop-shadow(0 0 5px rgb(168 85 247 / 0.3)); }
.moon-alien svg { display: block; width: 100%; height: 100%; }