Homepage hero: SSR hydration flash on mobile and portrait desktop getting mobile layout

[RisingOrange]

Two issues with the homepage hero section:

1. SSR hydration flash on mobile: image selection is done via a JS isMobile variable that starts false on SSR, causing a flash when onMount swaps to the mobile image after hydration.

2. Portrait desktop incorrectly gets mobile layout: the mobile breakpoint uses (max-width: 850px), (orientation: portrait) (OR), so any portrait-oriented viewport triggers the mobile layout — including a half-screen browser window on a wide desktop monitor, causing the image to be zoomed in and truncated.

Fixed in #667 by replacing the JS switching with a native <picture> element and changing the breakpoint to width-only ((max-width: 850px)).

Screenshots

Vertical window on desktop

Before	After