Webpage UI: Public Profile Empty State (not needed)

## Overview
All section components have already been built. This ticket covers assembling the public-facing empty state of the User Profile page — i.e. what a visitor sees when viewing a profile where the user has not yet filled in their bio, achievements, badges, or posts. This is a variant of the existing User Profile page ticket, with the same layout but empty state content throughout, and a "Share Profile" link in place of social links.

[Figma](https://www.figma.com/design/5j0fQssrV9ipoU16P7hfKy/Website-Deliverables?node-id=6635-23266&t=kz3wtApAF2dVawKp-4)

---

## Background
The following components exist and are ready to use:

| Component | Description |
|---|---|
| `NavBar` | Logo, nav links, search (CTRL+K), theme toggle, log in |
| `ProfileHeader` | User avatar, username, role badge, member since, board role, "Share Profile" link |
| `BioBlock` | Renders empty state prompt when no bio data is present |
| `AchievementsBlock` | Renders empty state message + "Learn how achievements work" CTA |
| `BadgesBlock` | Renders empty state message + "Explore available badges" CTA |
| `PostsBlock` | Renders empty state message + "Create a post" CTA |
| `Footer` | Nav links + social icons |

---

## Breakpoints

| Label | Width |
|---|---|
| Mobile | < 768px |
| Tablet | 768px – 1279px |
| Desktop | ≥ 1280px |

---

## Layout
Desktop and tablet use a 2-column layout. Left column: Bio, Posts. Right column: Achievements, Badges. On mobile all sections stack in a single column.

---

## Empty State Copy
- `BioBlock` — "This user hasn't added a bio yet."
- `AchievementsBlock` — "No achievements earned yet." + "Learn how achievements work" CTA
- `BadgesBlock` — "No badges unlocked yet." + "Learn how badges work" CTA
- `PostsBlock` — "No posts yet." + "Create a post" CTA

---

## Props / Data Wiring
- `ProfileHeader` — pass username, avatar, role badge, memberSince, boardRole, shareProfileHref
- `BioBlock` — pass null bio to trigger empty state
- `AchievementsBlock` — pass empty array to trigger empty state
- `BadgesBlock` — pass empty array to trigger empty state
- `PostsBlock` — pass empty array to trigger empty state

---

## Acceptance Criteria
- All components render in the correct order per breakpoint
- Desktop and tablet: two-column layout — left: Bio, Posts; right: Achievements, Badges
- Mobile: single-column stack
- ProfileHeader shows "Share Profile" link
- Light and dark mode render correctly for all components
- No layout overflow or clipping at 320px, 768px, 1280px, 1440px
- All props wired with mock data
- Tested in Chrome, Safari, Firefox

---

## Out of Scope
- Building or modifying individual components (separate tickets)
- Live data fetching — use mock data for now
- Profile editing functionality (separate ticket)