Redesign storefront to match minimal reference design

Product cards, header, footer, PDP, and typography reworked toward a
leaner layout; adds shop policy pages backed by the Storefront API.

- Type: switch to Geist Sans/Mono, regular-weight headings
- Product cards: drop borders, rounded corners, and action buttons
- Header: shorter bar, no bottom border, center-out hover underline,
  bag icon replacing the cart icon (drawer wording updated to match)
- Footer: single line with policy links and social icons on bg-background
- Policies: /policies/[handle] renders shop.privacyPolicy,
  termsOfService, refundPolicy, shippingPolicy, subscriptionPolicy
  (SSG, hourly revalidation)
- PDP: image grid with mobile carousel + dots and click-to-zoom,
  sticky info column, colour swatches from option optionValues with a
  configurable name-to-colour fallback in config/swatches.ts,
  Shop-purple checkout button
- Recommendations: left-aligned heading on bg-background
- Ignore .env*.local and tsconfig.tsbuildinfo

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_016jWbNNJLksC1QG8z8845FX

graphql/policies.js

@@ -0,0 +1,43 @@
+// Shop policies are exposed on the `shop` object of the Storefront API.
+// There is no lookup-by-handle field, so we fetch all of them and match.
+export const GET_SHOP_POLICIES_QUERY = `
+  query GetShopPolicies {
+    shop {
+      privacyPolicy {
+        id
+        title
+        handle
+        body
+        url
+      }
+      termsOfService {
+        id
+        title
+        handle
+        body
+        url
+      }
+      refundPolicy {
+        id
+        title
+        handle
+        body
+        url
+      }
+      shippingPolicy {
+        id
+        title
+        handle
+        body
+        url
+      }
+      subscriptionPolicy {
+        id
+        title
+        handle
+        body
+        url
+      }
+    }
+  }
+`;