[BUG]: Memory leak and layout shift in Finance page (pages/finance.tsx)

### Describe the bug.

The Finance page (`pages/finance.tsx`) has two significant issues:

1. **Memory Leak (High Severity)**: The `handleResizeRef` is explicitly updated on *every* render (lines 23-25),
creating a new function identity each time. The `useEffect` cleanup function (line 33) uses `handleResizeRef.current` to
remove the listener, but by the time cleanup runs, `handleResizeRef.current` points to a *different* function instance
than the one passed to `addEventListener` (line 30). This causes `removeEventListener` to fail, resulting in a duplicate resize listener being permanently attached to the `window` on every render.

2. **Layout Shift (CLS)**: The `windowWidth` state is initialized to `0`. On the server and initial client render, `shouldUseContainer` is `false`. Immediately after hydration, `useEffect` updates the width, triggering a re-render that switches `shouldUseContainer` to `true` (for screens > 1700px). This causes a visible layout shift (Flash of Unstyled Content).

### Expected behavior

1. Resize listeners should be cleaned up properly when the component unmounts.
2. The layout shouldn't jump around after loading.

### Screenshots

### How to Reproduce

1. Open `pages/finance.tsx` and notice the `useEffect` lineup (runs once) vs the `handleResizeRef` assignment (runs every render).
2. Open the application in a browser.
3. Navigate to the **Finance** page.
4. Resize the window (this updates the ref).
5. Navigate to another page and come back to Finance.
6. Repeat this a few times.
7. Check the event listener count on `window`. You will see it increase by 1 for every time you visited the page, because the old listeners were never removed.

**Proposed Solution**
1. **For the leak**: Wrap the resize handler in `useCallback` so the function stays the same, or just define it inside the `useEffect`.
2. **For the layout**: Use CSS media queries (like Tailwind's `2xl:`) to handle the wide layout instead of waiting for JavaScript to check the window width.

**Files Involved**
- `pages/finance.tsx`

### 🖥️ Device Information [optional]

- Operating System (OS):Linux
- Browser:Chrome
- Browser Version:144.0.7559.109

### 👀 Have you checked for similar open issues?

- [x] I checked and didn't find similar issue

### 🏢 Have you read the Contributing Guidelines?

- [x] I have read the [Contributing Guidelines](https://github.com/asyncapi/.github/blob/master/CONTRIBUTING.md)

### Are you willing to work on this issue ?

Yes I am willing to submit a PR!

Start in pages/finance.tsx by tracing handleResizeRef, the resize useEffect, windowWidth, and shouldUseContainer through initial render, hydration, resizing, and navigation away. Reproduce the Finance page behavior in Chrome and inspect listener cleanup and the wide-screen transition. Done means revisiting the page does not accumulate resize listeners and the layout does not visibly shift after loading.

Written by the indexing model from the issue text.