Add Container component and fix radius/maxWidth theming

- Drop buttonRadius prop; button now uses --radius via rounded-md
- Inject @theme radius mappings into ThemeProvider so rounded-* utilities
  pick up --radius inside the Tailwind CDN iframe
- Add shared Container that consumes --container-max-width set from the
  global maxWidth prop, replacing ad-hoc "container mx-auto max-w-7xl px-6"
  wrappers across commerce, landing, footer, navigation, and others
- Simplify maxWidth options to Small/Medium/Large/X-Large/Full bleed and
  shift the scale up so Large (1280px) matches the previous default

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

components/navigation/navigation.tsx

@@ -3,6 +3,7 @@ import { useState } from "react";
 import { Link } from "react-router";
 import { useShopifyCart } from "@/hooks/use-shopify-cart";
 import { Sheet, SheetContent, SheetHeader, SheetTitle } from "@/components/ui/sheet";
+import { Container } from "@/components/layout/Container";
 import { cn } from "@/lib/utils";
 
 export type NavigationProps = {
@@ -49,7 +50,7 @@ export function Navigation({
           toneClass[tone],
         )}
       >
-        <div className="container mx-auto flex h-16 max-w-7xl items-center justify-between px-6 md:h-20">
+        <Container className="flex h-16 items-center justify-between md:h-20">
           <Link
             to="/"
             className="inline-flex items-center font-semibold tracking-tight"
@@ -110,7 +111,7 @@ export function Navigation({
               <MenuIcon size={20} strokeWidth={1.5} />
             </button>
           </div>
-        </div>
+        </Container>
       </header>
       </div>