feat: PageCollectionsDetail

[lux-v]

These pages are built for Storybook and serve as mocked examples to demonstrate page composition and data flow using existing components.

All pages use mock data from stories/mock/Funkhaus, while PageMainSearchFieldResults.stories includes an example Elasticsearch integration using the useElasticsearchSearch composable.

useElasticsearchSearch is a lightweight, MVP-level composable used only for demonstration purposes. It showcases how search queries, filters, pagination, and sorting can be translated into Elasticsearch requests and consumed at the page level. Due to the Storybook environment and URL-based search handling, this implementation should be treated as an example of usage.

Overall, this PR provides reference implementations to guide future page integration.

Design link:
https://www.figma.com/design/CDhWDARLb36ftkQce1LyLC/Breakpoints?node-id=51-781&m=dev

[pghorpade]

@lux-v
I think there’s a grid alignment issue between the hero and metadata sections.

The vertical divider in the metadata doesn’t line up with the edge of the hero image, which makes the layout feel a bit disconnected—especially when the metadata is sparse.

Could we align both sections to the same column grid so the divider matches the image boundary?