feat: implement meet the team design

[jzchenn]

Summary

Closes #60 by implementing a responsive "Meet the Team" page following the Figma design with a dynamic, polaroid-style card layout.

Screen.Recording.2026-09-18.at.10.02.24.PM.mov

Reusable UI Card Component

A reusable polaroid-style card component (MemberInfo.tsx) displaying member's image, role, and name by default; on hover, reveals optional fields (degree, MBTI, favourite artist, ethnicity, quote, Instagram username).
Optional fields degrade gracefully — a member missing any of them still renders correctly

Screen.Recording.2026-09-18.at.10.04.00.PM.mov

UI Card Layout Logic (Desktop)

COMMITTEE_ORDER defines a fixed display order for the committees.

To keep the layout dynamic, COMMITTEE_ORDER is mapped over and checked against the (currently mock) data for each committee. If a committee has no members, it's skipped entirely. This means no empty division is rendered, so the next committee moves up rather than leaving a gap.

Each row has its own offset pattern (COMMITTEE_PATTERNS) to create the scattered polaroid feel, alternating between odd- and even-indexed cards within the row.

Decorative illustrations (glasses, pens, etc.) are absolutely positioned to match the Figma layout, hidden below the 1215px breakpoint.

Each committee's card colour is resolved via COMMITTEE_BG_COLORS (keyed by committee) and passed down to MemberInfo as a bgColor prop shared by both the desktop and mobile layouts below.

UI Card Layout Logic (Mobile)

Instead of the per-committee divs used on desktop, mobile renders a single flat wrapper that maps over all members directly, shown/hidden via breakpoint classes.

Follow-ups

Mock Data

Currently uses fullName + role + idx as the key, which prevents collisions with the current mock data. Using _id instead would be more robust once real data is connected.

Layout Scaling

The layout mapping supports any number of members programmatically, but the offset patterns and decorative SVGs were tuned specifically to match the Figma design, allowing for roughly 1–2 additional members per committee if needed. This scope was chosen because, realistically, a club committee's size should only fluctuate within that range year to year so the layout wasn't built to gracefully handle significantly larger jumps.