[Feature] Create Club Executives Display Component

[AlotOfTypos]

User story

As a website visitor or potential new member,
I want to see a well-organized section detailing the club's executive team,
so that I can understand the club's structures, and learn more about the people leading the organization.

Acceptance criteria

• A new component and its corresponding ClubExecsSection.module.css stylesheet are created, or edit the previous cards.
• The component must faithfully implement the design specified in the Figma mockups for the executives section.
• The component accepts a structured array of executive data as a prop. The data structure must support grouping members under a category title (e.g., "Marketing", "Finance").
• The component renders a category title (e.g.,

  Marketing

  ) above the group of relevant executive cards.
• There should be variations
  • Transparent or grey background cards (possibly alternating depending on row)
  • 2 cards on one row
  • 1 card across the entire row
• Each executive is displayed on an individual "card" showing their name, specific role, brief intro, and a photo.
• When a user clicks on an executive's card, the card expands or triggers a modal to display additional information, such as a detailed biography or description. Clicking it again (or a close button) will hide the description.
• The component's layout is fully responsive, ensuring the cards and groups look good on desktop, tablet, and mobile devices.
• If no executive data is provided, the component should not render.

Definition of done

• Acceptance criteria met
• Agreed tests written
• PR reviewed
• Merged into the main/feature branch

Notes

• You should be making the card itself as a component
• A component that includes the group title (e.g. Marketing) with the execs under that group. Or if more admin execs they should be at the top without a group title
• Possibly another component that contains all the groups/ execs