Add Accordion FAQ Section

I need a clean, responsive FAQ section added to my existing website. I’d like each question to expand and collapse in a dropdown accordion style so visitors can scan quickly and only open what they need. The categories should appear in order of how often each question is asked, with the most common issues sitting right at the top.

Your task is to build and style this component so it blends seamlessly with our current layout, colour palette, and typography. Lightweight JavaScript (vanilla, jQuery, or an equivalent you suggest) is fine as long as it keeps load times low and the interaction smooth on both desktop and mobile. CSS should follow our site’s existing class naming conventions so future updates remain straightforward.

Please include:

• A fully functioning accordion FAQ section organised by frequency.
• Clear inline comments in the markup, CSS, and JavaScript for easy maintenance.
• Any minor tweaks we might need to maintain accessibility standards (ARIA attributes, keyboard navigation, etc.).

Once it’s complete, pass me the code snippets or a pull-request so I can drop it straight into production.