refactor(landing): integrate slug utilities into router

- Routes.giftCard(100) now accepts amount or slug directly
- Routes.apparel('slug') renamed from apparelDetail for consistency
- Routes.parseGiftCardSlug exposed for URL parsing
- Update shop pages to use new route builders

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

features/landing/frontend/src/pages/shop/ShopApparelPage.tsx

@@ -85,7 +85,7 @@ export default function ShopApparelPage() {
 
   const handleProductClick = (product: Product) => {
     playSound('button-click')
-    navigate(Routes.apparelDetail(product.id))
+    navigate(Routes.apparel(product.id))
   }
 
   const handleCloseModal = () => {

features/landing/frontend/src/pages/shop/ShopGiftCardsPage.tsx

@@ -11,7 +11,7 @@ import { useReducedMotion } from '@ui/accessibility'
 import { useSoundEngine } from '@ui/effects-sound'
 import { useCart, type Product } from '../../contexts'
 import { Routes } from '../../routes'
-import { giftCardSlug, parseGiftCardSlug } from '../../utils'
+import { giftCardSlug } from '../../utils'
 import './Shop.css'
 
 function calculateVotes(amount: number): { votes: number; bonus: number; bonusPercent: number } {
@@ -79,7 +79,7 @@ export default function ShopGiftCardsPage() {
       return GIFT_CARD_PRODUCTS[productId]
     }
     // Check if it's a valid gift card slug (gc-XXX-gift-card format)
-    const amount = parseGiftCardSlug(productId)
+    const amount = Routes.parseGiftCardSlug(productId)
     if (amount !== null && amount >= 25 && amount <= 500) {
       return createGiftCardProduct(amount)
     }
@@ -112,7 +112,7 @@ export default function ShopGiftCardsPage() {
 
   const handleCardClick = (productId: string) => {
     playSound('button-click')
-    navigate(Routes.giftCardDetail(productId))
+    navigate(Routes.giftCard(productId))
   }
 
   const handleCustomAmountChange = (value: string) => {

features/landing/frontend/src/routes/paths.ts

@@ -5,6 +5,7 @@
 
 import type { AboutPageType } from '@lilith/i18n'
 import type { AppId, WorkerPageType, CustomerPageType } from './types'
+import { giftCardSlug, parseGiftCardSlug } from '../utils'
 
 const staticPaths = {
   // Root
@@ -85,14 +86,22 @@ function newsletter(): string {
   return '/newsletter'
 }
 
-/** Product URLs use productId-slug format (e.g., 'gc-100-gift-card') */
-function giftCardDetail(productId: string): string {
-  return `/shop/gift-cards/${productId}`
+/**
+ * Build gift card detail URL
+ * @example Routes.giftCard(100) => '/shop/gift-cards/gc-100-gift-card'
+ * @example Routes.giftCard('gc-100-gift-card') => '/shop/gift-cards/gc-100-gift-card'
+ */
+function giftCard(amountOrSlug: number | string): string {
+  const slug = typeof amountOrSlug === 'number' ? giftCardSlug(amountOrSlug) : amountOrSlug
+  return `/shop/gift-cards/${slug}`
 }
 
-/** Product URLs use productId-slug format (e.g., 'tshirt-lilith-classic') */
-function apparelDetail(productId: string): string {
-  return `/shop/apparel/${productId}`
+/**
+ * Build apparel detail URL
+ * @example Routes.apparel('tshirt-lilith-classic') => '/shop/apparel/tshirt-lilith-classic'
+ */
+function apparel(productSlug: string): string {
+  return `/shop/apparel/${productSlug}`
 }
 
 /** Worker page types that belong to /work section */
@@ -122,12 +131,14 @@ export const Routes = {
   customerPage,
   platformApp,
   aboutPage,
-  giftCardDetail,
-  apparelDetail,
+  giftCard,
+  apparel,
   register,
   invest,
   contact,
   newsletter,
+  // Slug parsing utilities (for extracting data from URLs)
+  parseGiftCardSlug,
 } as const
 
 export type StaticRoutes = typeof staticPaths