feat(menu-app): full redesign to Olive & Thyme design spec

Rebuild the public-facing digital menu from the design handoff bundle.
Matches high-fidelity spec: Bricolage Grotesque + Hanken Grotesk fonts,
cream/green/gold palette, per-category tinted panels, product cards with
gradient art, tag icon badges, bottom-sheet product detail, search overlay,
cart → checkout bottom-sheet flow posting to real API, floating cart button
with bump animation, and restyled order-confirm page.

- New: src/components/primitives.jsx (DishArt, Badge, DietChip, TagIcons,
  Price, DiscountFlag, Stepper, price helpers)
- Rewrite: MenuPage.jsx — all screens in one component tree, API-driven,
  lang toggle (EN/GR) persisted to localStorage, scroll-spy category bar
- Rewrite: OrderConfirm.jsx — design-system styling, brand colors
- Update: App.jsx — remove /order route (cart flow is now a bottom sheet)
- Update: tailwind.config.js — font families, brand tokens, animations
- Update: index.html — Google Fonts for Bricolage Grotesque + Hanken Grotesk
- Delete: CartPage, ProductModal, ProductCard, CategoryNav, CartButton

Cart checkout POSTs to real submitOrder API and redirects to /confirm/:ref
for live order status polling. Restaurant info falls back to hardcoded
placeholder until backend includes it in the fetchMenu response (see
REWORK_REVISIT.md).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

connect_frontend/menu-app/tailwind.config.js

@@ -3,7 +3,49 @@ export default {
   content: ['./index.html', './src/**/*.{js,jsx}'],
   theme: {
     extend: {
-      fontFamily: { sans: ['Geist', 'system-ui', 'sans-serif'] },
+      fontFamily: {
+        display: ['Bricolage Grotesque', 'serif'],
+        sans: ['Hanken Grotesk', 'system-ui', 'sans-serif'],
+      },
+      colors: {
+        brand: {
+          dark: '#2d3b2d',
+          hover: '#26331f',
+        },
+        cream: '#faf7f0',
+        card: '#fcfbf7',
+        gold: '#c9a24b',
+        terracotta: '#c2602f',
+        sage: '#9caf88',
+        success: '#3f7d4e',
+      },
+      borderRadius: {
+        card: '20px',
+        section: '22px',
+        sheet: '24px',
+      },
+      boxShadow: {
+        card: '0 5px 16px -10px rgba(45,42,31,0.45)',
+        'card-hover': '0 10px 24px -12px rgba(45,42,31,0.5)',
+        cart: '0 12px 28px -8px rgba(45,59,45,0.55)',
+      },
+      keyframes: {
+        fade: { from: { opacity: 0 }, to: { opacity: 1 } },
+        slideup: {
+          from: { transform: 'translateY(100%)' },
+          to: { transform: 'translateY(0)' },
+        },
+        pop: {
+          '0%': { transform: 'scale(1)' },
+          '50%': { transform: 'scale(1.06)' },
+          '100%': { transform: 'scale(1)' },
+        },
+      },
+      animation: {
+        fade: 'fade 0.2s ease',
+        slideup: 'slideup 0.28s cubic-bezier(0.22,1,0.36,1)',
+        pop: 'pop 0.32s ease',
+      },
     },
   },
   plugins: [],