Proyecto web estático para mostrar y gestionar opciones de pago en 360pay.

1. Clonar este repositorio.

git clone https://github.com/phpeitor/vecinos-360.git cd vecinos-360

2. Abrir index.html en tu navegador.

• index.html: plantilla principal de la interfaz.
• css/general.css: estilos globales, responsive y keyframes de animación.
• js/functions.js: lógica de interacción de botones de pago.
• js/360pay-iframe.js: contenido modal para términos y políticas.
• img/: recursos gráficos (logo, frames del inka, iconos).

La animación se compone de 4 frames (inka1.png a inka4.png) superpuestos en el mismo contenedor y controlados con CSS keyframes. Cada frame tiene su propia ventana de opacidad para mostrar una secuencia continua y cerrar con fade out en el último estado.

• El logo principal tiene animación suave flotante.
• Los botones de bancos/billeteras aplican una animación de selección (zoom) al hacer clic.
• El personaje Inka se muestra en escritorio y tablet, y se oculta en mobile para evitar solapamiento de contenido.

• Para ajustar ritmo de animación, modificar la duración en los keyframes del bloque Inka.
• Para cambiar intensidad visual, editar transform y opacity en el frame final.
• Mantener assets optimizados para no afectar tiempos de carga.