💳 Tarjeta Interactiva con Gradiente Animado

¡Hola! 👋 Este mini proyecto marca el inicio de una nueva etapa en mi formación como desarrollador.

Soy Backend Developer, y aunque seguiré siéndolo, decidí complementar mis habilidades aprendiendo Frontend. Entender el lado visual del desarrollo web me ayudará a comunicarme mejor con otros miembros del equipo, resolver detalles de integración y, por qué no, crear cosas atractivas como esta. 😄

---

🎥 Basado en este tutorial

Este trabajo está inspirado en el video de Código369 en YouTube, donde se explica cómo crear una tarjeta con un efecto de borde animado usando solo HTML y CSS.

---

🧠 ¿Qué aprendí?

• Centrado de elementos con Flexbox
• Uso de pseudoelementos ::before y ::after para crear decoraciones
• Aplicación de gradientes lineales
• Manejo de transiciones suaves con cubic-bezier
• Efectos visuales al hacer hover, incluyendo rotación y desenfoque

---

📂 Estructura del proyecto

📁 tarjeta-gradiente
│
├── index.html        # Estructura principal
├── style.css         # Estilos y animaciones
└── README.md         # Documentación del proyecto

---

📸 Vista previa

Abre el archivo index.html en cualquier navegador y pasa el mouse por la tarjeta para ver el efecto visual.

---

💡 ¿Por qué este tipo de práctica?

Porque como backend, muchas veces subestimamos lo que implica hacer cosas "simples" del frontend. Con ejercicios como este, empiezo a entender mejor los detalles que hacen que una interfaz se sienta moderna y profesional.

---

✍️ Próximos pasos

• Añadir interactividad con JavaScript
• Explorar componentes dinámicos con React
• Crear una landing page simple aplicando estos conocimientos

---

Este es solo el primer paso de muchos más. Lo importante no es volverse experto en todo, sino construir puentes entre áreas y equipos. 💡