Toggle Monthly / Yearly Billing and Update Buttons Using JavaScript

Nice work @deomrd on the plan selection section so far! The next improvement is to make the **billing toggle functional**. Right now, the toggle visually exists, but the interface doesn’t update the **plan prices or active button state** when the user switches between **Monthly** and **Yearly** billing.
Your task is to use **JavaScript** to:
- Detect when the **billing toggle** is clicked
- Activate the correct option (Monthly or Yearly) and visually highlight it
- Update the plan prices dynamically according to the selected billing cycle
- Make sure the UI clearly shows which option is currently active

The goal is that when a user switches from **Monthly → Yearly** (or back), the **buttons, prices, and discounts** update instantly and the selection feels intuitive.

Here’s a screenshot showing how the targeting design toggle should behave and why it needs JavaScript:

Tips for implementation:
- Select the toggle buttons and the plan cards using JavaScript
- Add a click event listener to the toggle
- Update classes to reflect the active selection (e.g., `.active`)
- Update the displayed prices and any “months free” labels dynamically

By completing this, users will have a **fully interactive plan selection** and will clearly see how switching billing cycles affects their subscription. This also reinforces **DOM manipulation and state management using JavaScript**, a key skill for frontend development.