🎴 Random Card Dealer (Vanilla JS)

---

📌 Project Description

This project consists of building a dynamic playing card generator using Vanilla JavaScript.

The application generates a completely random card every time the page loads by selecting:

• A random suit (Hearts, Spades, Clubs, Diamonds)
• A random value (2–10, Jack, Queen, King, Ace)

The card styling updates dynamically based on the generated suit.

---

🎯 Objective of the Exercise

The goal of this exercise was to:

• Practice DOM manipulation
• Apply dynamic CSS classes
• Understand how the window.onload lifecycle works
• Generate random values using Math.random()
• Maintain proper separation between structure (HTML), style (CSS), and logic (JavaScript)

---

🧠 Concepts Applied

• Page lifecycle (window.onload)
• Random number generation
• DOM element selection and manipulation
• Dynamic class switching
• CSS reusable base classes + suit modifiers

---

🛠 Technologies Used

• HTML5
• CSS3
• Vanilla JavaScript (ES6)

---

🚀 Features

✔ Generates a new random card on every page refresh
✔ Suit-specific styling applied dynamically
✔ Clean and reusable CSS structure

---

👨‍💻 Author

Matheo Flores
Frontend Developer in Progress