diff --git a/next.config.ts b/next.config.ts
index f8c2c9e..cd27f06 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -159,6 +159,15 @@ const nextConfig: NextConfig = {
       fullUrl: process.env.NODE_ENV === "development",
     },
   },
+
+  // Allow cross-origin requests to dev resources (HMR, dev manifest, etc.)
+  // from non-localhost hosts (e.g. LAN IPs, dev tunnels). Read from
+  // `NEXT_ALLOWED_DEV_ORIGINS` as a comma-separated list. Empty in production.
+  allowedDevOrigins: process.env.NEXT_ALLOWED_DEV_ORIGINS
+    ? process.env.NEXT_ALLOWED_DEV_ORIGINS.split(",")
+        .map((s) => s.trim())
+        .filter(Boolean)
+    : [],
 };
 
 export default nextConfig;
\ No newline at end of file
diff --git a/src/app/indian-river-direct/stops/[slug]/error.tsx b/src/app/indian-river-direct/stops/[slug]/error.tsx
deleted file mode 100644
index 5114744..0000000
--- a/src/app/indian-river-direct/stops/[slug]/error.tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-"use client";
-
-import Link from "next/link";
-import { m as motion } from "framer-motion";
-
-export default function ErrorPage({
-  error,
-  reset,
-}: {
-  error: Error & { digest?: string };
-  reset: () => void;
-}) {
-  return (
-    <div className="min-h-screen bg-gradient-to-br from-blue-600 via-blue-700 to-blue-900 flex items-center justify-center p-6">
-      <motion.div
-        initial={{ opacity: 0, y: 20 }}
-        animate={{ opacity: 1, y: 0 }}
-        transition={{ duration: 0.5 }}
-        className="max-w-lg w-full text-center relative"
-      >
-        <div className="absolute inset-0 opacity-20 pointer-events-none">
-          <div className="absolute top-0 right-0 w-40 h-40 bg-white rounded-full -translate-y-1/2 translate-x-1/4" />
-          <div className="absolute bottom-0 left-0 w-32 h-32 bg-white rounded-full translate-y-1/2 -translate-x-1/4" />
-        </div>
-
-        <motion.div
-          initial={{ scale: 0.95, opacity: 0  }}
-          animate={{ scale: 1 }}
-          transition={{ delay: 0.2, type: "spring", stiffness: 200 }}
-          className="relative inline-flex h-24 w-24 items-center justify-center rounded-full bg-white/20 backdrop-blur-sm mb-8"
-        >
-          <svg className="h-12 w-12 text-white" fill="none" viewBox="0 0 24 24" strokeWidth={1.5}>
-            <path strokeLinecap="round" strokeLinejoin="round" d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z" />
-          </svg>
-        </motion.div>
-
-        <h1 className="text-4xl font-black text-white mb-4">Stop Not Available</h1>
-        <p className="text-blue-100 mb-8 leading-relaxed">
-          We couldn&apos;t load this stop. Please try again.
-        </p>
-
-        {process.env.NODE_ENV === "development" && (
-          <div className="mb-8 rounded-2xl bg-white/10 border border-white/20 p-5 text-left backdrop-blur-sm">
-            <p className="text-xs font-semibold uppercase tracking-wider text-blue-200 mb-2">Error Details</p>
-            <p className="text-sm text-white/80 font-mono leading-relaxed break-all">{error.message}</p>
-          </div>
-        )}
-
-        <div className="relative flex flex-col sm:flex-row gap-4 justify-center">
-          <button type="button"
-            onClick={reset}
-            className="rounded-2xl bg-white text-blue-700 hover:bg-blue-50 px-8 py-4 text-sm font-bold transition-all hover:shadow-xl hover:-translate-y-0.5 active:scale-95 shadow-lg"
-          >
-            Try Again
-          </button>
-          <Link
-            href="/indian-river-direct"
-            className="rounded-2xl bg-blue-700/50 backdrop-blur-sm border border-white/30 text-white hover:bg-blue-600/80 px-8 py-4 text-sm font-bold transition-all hover:-translate-y-0.5 active:scale-95"
-          >
-            Back to Homepage
-          </Link>
-        </div>
-      </motion.div>
-    </div>
-  );
-}
\ No newline at end of file
diff --git a/src/app/indian-river-direct/stops/[slug]/loading.tsx b/src/app/indian-river-direct/stops/[slug]/loading.tsx
deleted file mode 100644
index 11609c9..0000000
--- a/src/app/indian-river-direct/stops/[slug]/loading.tsx
+++ /dev/null
@@ -1,6 +0,0 @@
-import { LoadingFade } from "@/components/transitions/LoadingFade";
-
-/** Subtle navigation indicator — see LoadingFade for rationale. */
-export default function Loading() {
-  return <LoadingFade />;
-}
diff --git a/src/app/indian-river-direct/stops/[slug]/page.tsx b/src/app/indian-river-direct/stops/[slug]/page.tsx
deleted file mode 100644
index 78276e3..0000000
--- a/src/app/indian-river-direct/stops/[slug]/page.tsx
+++ /dev/null
@@ -1,276 +0,0 @@
-"use client";
-
-import { useEffect, useState } from "react";
-import { useParams } from "next/navigation";
-import Link from "next/link";
-import { m as motion } from "framer-motion";
-import ProductCard from "@/components/storefront/ProductCard";
-import StopSetEffect from "@/components/storefront/StopSetEffect";
-import StorefrontHeader from "@/components/storefront/StorefrontHeader";
-import StorefrontFooter from "@/components/storefront/StorefrontFooter";
-import LayoutContainer from "@/components/layout/LayoutContainer";
-import { supabase } from "@/lib/supabase";
-import { formatDate } from "@/lib/format-date";
-
-type Product = {
-  id: string;
-  name: string;
-  description: string | null;
-  price: number;
-  type: string;
-  image_url: string | null;
-  brand_id: string;
-  is_taxable?: boolean;
-  pickup_type?: "scheduled_stop" | "shed";
-};
-
-type Stop = {
-  id: string;
-  city: string;
-  state: string;
-  date: string;
-  time: string;
-  location: string;
-  brand_id: string;
-};
-
-export default function StopPage() {
-  const params = useParams();
-  const slug = params.slug as string;
-
-  const [stop, setStop] = useState<{
-    id: string;
-    city: string;
-    state: string;
-    date: string;
-    time: string;
-    location: string;
-    brand_id: string;
-  } | null>(null);
-  const [products, setProducts] = useState<Product[]>([]);
-  const [brandSlug, setBrandSlug] = useState("indian-river-direct");
-  const [brandAccent, setBrandAccent] = useState<"green" | "orange" | "blue">("blue");
-
-  useEffect(() => {
-    async function load() {
-      const { data: stopData } = await supabase
-        .from("stops")
-        .select("*")
-        .eq("slug", slug)
-        .eq("active", true)
-        .single() as unknown as { data: Stop | null };
-
-      if (!stopData) return;
-
-      setStop(stopData);
-      const isIndian = slug.includes("indian");
-      setBrandSlug(isIndian ? "indian-river-direct" : "tuxedo");
-      setBrandAccent(isIndian ? "blue" : "green");
-
-      const { data: productsData } = await supabase
-        .from("products")
-        .select("*")
-        .eq("brand_id", stopData.brand_id)
-        .eq("active", true) as unknown as { data: Product[] | null };
-      setProducts(productsData ?? []);
-    }
-    load();
-  }, [slug]);
-
-  if (!stop) {
-    return (
-      <div className="min-h-screen bg-stone-50">
-        <StorefrontHeader brandName="Indian River Direct" brandSlug="indian-river-direct" brandAccent="blue" />
-        <main className="px-6 py-20">
-          <LayoutContainer>
-            <div className="max-w-5xl mx-auto">
-              <div className="animate-pulse space-y-4">
-                <div className="h-4 w-32 bg-stone-200 rounded" />
-                <div className="h-16 w-64 bg-stone-200 rounded" />
-              </div>
-            </div>
-          </LayoutContainer>
-        </main>
-      </div>
-    );
-  }
-
-  const isBlue = brandAccent === "blue";
-  const brandLabel = isBlue ? "Indian River Direct" : "Tuxedo Corn";
-
-  return (
-    <div className="min-h-screen bg-stone-50/80 backdrop-blur-xl">
-      <StorefrontHeader
-        brandName={brandLabel}
-        brandSlug={brandSlug}
-        brandAccent={brandAccent}
-      />
-
-      <main className="px-6 py-16 md:py-20">
-        <LayoutContainer>
-          <div className="max-w-5xl mx-auto">
-
-            {/* Back navigation */}
-            <motion.div
-              initial={{ opacity: 0, x: -20 }}
-              animate={{ opacity: 1, x: 0 }}
-              transition={{ duration: 0.4 }}
-              className="mb-10 flex items-center gap-2"
-            >
-              <Link
-                href={`/${brandSlug}#stops`}
-                className="flex items-center gap-2 text-sm font-medium text-stone-500 hover:text-stone-800 transition-colors group"
-              >
-                <svg
-                  className="h-4 w-4 transition-transform duration-200 group-hover:-translate-x-1"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                  stroke="currentColor"
-                  strokeWidth={2}
-                >
-                  <path strokeLinecap="round" strokeLinejoin="round" d="M10.5 19.5L3 12m0 0l7.5-7.5M3 12h18" />
-                </svg>
-                All Stops
-              </Link>
-              <span className="text-stone-300">/</span>
-              <span className="text-sm text-stone-700 font-medium">{stop.city}, {stop.state}</span>
-            </motion.div>
-
-            {/* Stop header with animation */}
-            <motion.div
-              initial={{ opacity: 0, y: 20 }}
-              animate={{ opacity: 1, y: 0 }}
-              transition={{ duration: 0.6, ease: [0.22, 0.61, 0.36, 1] }}
-              className="backdrop-blur-sm bg-white/60 border border-white/50 rounded-3xl p-8 mb-12"
-            >
-              <p className="text-[11px] font-semibold uppercase tracking-widest text-blue-600 mb-4">
-                {isBlue ? "Indian River Direct" : "Tuxedo Corn"}
-              </p>
-              <h1 className="text-5xl md:text-7xl font-black tracking-tight text-stone-950 leading-[1.0]">
-                {stop.city},<br className="hidden md:block" /> {stop.state}
-              </h1>
-              <p className="mt-5 max-w-xl text-lg text-stone-500 leading-relaxed">
-                {isBlue
-                  ? "Order fresh Florida citrus for pickup at this stop."
-                  : "Order fresh Olathe Sweet™ sweet corn for pickup at this stop."}
-              </p>
-              <div className="mt-6 h-px w-12 bg-blue-600" />
-            </motion.div>
-
-            {/* Stop info */}
-            <motion.div
-              initial={{ opacity: 0, y: 20 }}
-              animate={{ opacity: 1, y: 0 }}
-              transition={{ duration: 0.6, delay: 0.1, ease: [0.22, 0.61, 0.36, 1] }}
-              className="backdrop-blur-md bg-white/80 border border-white/50 rounded-3xl p-8 mb-14 shadow-xl shadow-stone-200/50"
-            >
-              <div className="grid gap-4 md:grid-cols-3">
-                {/* Date */}
-                <motion.div
-                  initial={{ opacity: 0, y: 10 }}
-                  animate={{ opacity: 1, y: 0 }}
-                  transition={{ duration: 0.4, delay: 0.2 }}
-                  className="flex items-start gap-4 py-4 px-5 rounded-2xl bg-stone-50"
-                >
-                  <div className={`flex-shrink-0 w-10 h-10 rounded-xl flex items-center justify-center ${isBlue ? "bg-blue-50" : "bg-emerald-50"}`}>
-                    <svg className={`h-5 w-5 ${isBlue ? "text-blue-500" : "text-emerald-600"}`} fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
-                      <path strokeLinecap="round" strokeLinejoin="round" d="M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 012.25-2.25h13.5A2.25 2.25 0 0121 7.5v11.25m-18 0A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75m-18 0v-7.5A2.25 2.25 0 015.25 9h13.5A2.25 2.25 0 0121 11.25v7.5" />
-                    </svg>
-                  </div>
-                  <div>
-                    <p className="text-xs font-semibold uppercase tracking-wider text-stone-400 mb-1">Date</p>
-                    <p className="font-bold text-stone-950">{formatDate(stop.date)}</p>
-                  </div>
-                </motion.div>
-                {/* Time */}
-                <motion.div
-                  initial={{ opacity: 0, y: 10 }}
-                  animate={{ opacity: 1, y: 0 }}
-                  transition={{ duration: 0.4, delay: 0.3 }}
-                  className="flex items-start gap-4 py-4 px-5 rounded-2xl bg-stone-50"
-                >
-                  <div className={`flex-shrink-0 w-10 h-10 rounded-xl flex items-center justify-center ${isBlue ? "bg-blue-50" : "bg-emerald-50"}`}>
-                    <svg className={`h-5 w-5 ${isBlue ? "text-blue-500" : "text-emerald-600"}`} fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
-                      <path strokeLinecap="round" strokeLinejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
-                    </svg>
-                  </div>
-                  <div>
-                    <p className="text-xs font-semibold uppercase tracking-wider text-stone-400 mb-1">Time</p>
-                    <p className="font-bold text-stone-950">{stop.time}</p>
-                  </div>
-                </motion.div>
-                {/* Location */}
-                <motion.div
-                  initial={{ opacity: 0, y: 10 }}
-                  animate={{ opacity: 1, y: 0 }}
-                  transition={{ duration: 0.4, delay: 0.4 }}
-                  className="flex items-start gap-4 py-4 px-5 rounded-2xl bg-stone-50"
-                >
-                  <div className={`flex-shrink-0 w-10 h-10 rounded-xl flex items-center justify-center ${isBlue ? "bg-blue-50" : "bg-emerald-50"}`}>
-                    <svg className={`h-5 w-5 ${isBlue ? "text-blue-500" : "text-emerald-600"}`} fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
-                      <path strokeLinecap="round" strokeLinejoin="round" d="M15 10.5a3 3 0 11-6 0 3 3 0 016 0z" />
-                      <path strokeLinecap="round" strokeLinejoin="round" d="M19.5 10.5c0 7.142-7.5 11.25-7.5 11.25S4.5 17.642 4.5 10.5a7.5 7.5 0 1115 0z" />
-                    </svg>
-                  </div>
-                  <div>
-                    <p className="text-xs font-semibold uppercase tracking-wider text-stone-400 mb-1">Location</p>
-                    <p className="font-bold text-stone-950 leading-tight">{stop.location}</p>
-                  </div>
-                </motion.div>
-              </div>
-            </motion.div>
-
-            {/* Available Products — editorial header */}
-            <motion.section
-              initial={{ opacity: 0, y: 20 }}
-              animate={{ opacity: 1, y: 0 }}
-              transition={{ duration: 0.6, delay: 0.2, ease: [0.22, 0.61, 0.36, 1] }}
-            >
-              <div className="mb-10">
-                <p className="text-[11px] font-semibold uppercase tracking-widest text-blue-600 mb-4">Farm-Direct</p>
-                <h2 className="text-4xl md:text-5xl font-black tracking-tight text-stone-950 leading-tight">
-                  Available Products
-                </h2>
-                <div className="mt-5 h-px w-12 bg-blue-600" />
-                <p className="mt-5 text-base text-stone-500 leading-relaxed">
-                  Preorder for pickup — add items below and we will have them ready at the stop.
-                </p>
-              </div>
-              {products.length === 0 ? (
-                <div className="backdrop-blur-sm bg-white/70 border border-white/50 rounded-3xl p-12 text-center shadow-lg">
-                  <p className="text-stone-500">No products available for this stop.</p>
-                </div>
-              ) : (
-                <div className="grid gap-8 md:grid-cols-3">
-                  {products.map((product) => (
-                    <ProductCard
-                      key={product.id}
-                      id={product.id}
-                      name={product.name}
-                      description={product.description}
-                      price={`$${product.price}`}
-                      type={product.type}
-                      imageUrl={product.image_url}
-                      brandSlug={brandSlug}
-                      brandName={brandLabel}
-                      brandId={product.brand_id}
-                      brandAccent={brandAccent}
-                      is_taxable={product.is_taxable}
-                      pickup_type={product.pickup_type}
-                    />
-                  ))}
-                </div>
-              )}
-            </motion.section>
-          </div>
-        </LayoutContainer>
-      </main>
-
-      <StorefrontFooter
-        brandName={brandLabel}
-        brandSlug={brandSlug}
-        brandAccent={brandAccent}
-      />
-    </div>
-  );
-}
\ No newline at end of file
diff --git a/src/app/tuxedo/stops/[slug]/error.tsx b/src/app/tuxedo/stops/[slug]/error.tsx
deleted file mode 100644
index 635ffda..0000000
--- a/src/app/tuxedo/stops/[slug]/error.tsx
+++ /dev/null
@@ -1,61 +0,0 @@
-"use client";
-
-import Link from "next/link";
-import { m as motion } from "framer-motion";
-
-export default function ErrorPage({
-  error,
-  reset,
-}: {
-  error: Error & { digest?: string };
-  reset: () => void;
-}) {
-  return (
-    <div className="min-h-screen bg-gradient-to-br from-stone-950 via-stone-900 to-emerald-950 flex items-center justify-center p-6">
-      <motion.div
-        initial={{ opacity: 0, y: 20 }}
-        animate={{ opacity: 1, y: 0 }}
-        transition={{ duration: 0.5 }}
-        className="max-w-lg w-full text-center"
-      >
-        <motion.div
-          initial={{ scale: 0.95, opacity: 0  }}
-          animate={{ scale: 1 }}
-          transition={{ delay: 0.2, type: "spring", stiffness: 200 }}
-          className="inline-flex h-24 w-24 items-center justify-center rounded-full bg-emerald-900/40 mb-8"
-        >
-          <svg className="h-12 w-12 text-emerald-400" fill="none" viewBox="0 0 24 24" strokeWidth={1.5}>
-            <path strokeLinecap="round" strokeLinejoin="round" d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z" />
-          </svg>
-        </motion.div>
-
-        <h1 className="text-4xl font-black text-white mb-4">Stop Not Available</h1>
-        <p className="text-stone-400 mb-8 leading-relaxed">
-          We couldn&apos;t load this stop. Please try again.
-        </p>
-
-        {process.env.NODE_ENV === "development" && (
-          <div className="mb-8 rounded-2xl bg-white/5 border border-white/10 p-5 text-left">
-            <p className="text-xs font-semibold uppercase tracking-wider text-stone-500 mb-2">Error Details</p>
-            <p className="text-sm text-emerald-400/80 font-mono leading-relaxed break-all">{error.message}</p>
-          </div>
-        )}
-
-        <div className="flex flex-col sm:flex-row gap-4 justify-center">
-          <button type="button"
-            onClick={reset}
-            className="rounded-2xl bg-emerald-600 hover:bg-emerald-500 px-8 py-4 text-sm font-bold text-white transition-all hover:shadow-lg hover:shadow-emerald-900/30 hover:-translate-y-0.5 active:scale-95"
-          >
-            Try Again
-          </button>
-          <Link
-            href="/tuxedo"
-            className="rounded-2xl bg-white/10 hover:bg-white/20 border border-white/20 px-8 py-4 text-sm font-bold text-white transition-all hover:-translate-y-0.5 active:scale-95"
-          >
-            Back to Homepage
-          </Link>
-        </div>
-      </motion.div>
-    </div>
-  );
-}
\ No newline at end of file
diff --git a/src/app/tuxedo/stops/[slug]/loading.tsx b/src/app/tuxedo/stops/[slug]/loading.tsx
deleted file mode 100644
index 11609c9..0000000
--- a/src/app/tuxedo/stops/[slug]/loading.tsx
+++ /dev/null
@@ -1,6 +0,0 @@
-import { LoadingFade } from "@/components/transitions/LoadingFade";
-
-/** Subtle navigation indicator — see LoadingFade for rationale. */
-export default function Loading() {
-  return <LoadingFade />;
-}
diff --git a/src/app/tuxedo/stops/[slug]/page.tsx b/src/app/tuxedo/stops/[slug]/page.tsx
deleted file mode 100644
index d3fbdb9..0000000
--- a/src/app/tuxedo/stops/[slug]/page.tsx
+++ /dev/null
@@ -1,235 +0,0 @@
-"use client";
-
-import { useEffect, useState } from "react";
-import { useParams } from "next/navigation";
-import Link from "next/link";
-import ProductCard from "@/components/storefront/ProductCard";
-import StopSetEffect from "@/components/storefront/StopSetEffect";
-import StorefrontHeader from "@/components/storefront/StorefrontHeader";
-import StorefrontFooter from "@/components/storefront/StorefrontFooter";
-import LayoutContainer from "@/components/layout/LayoutContainer";
-import { supabase } from "@/lib/supabase";
-import { formatDate } from "@/lib/format-date";
-
-type Product = {
-  id: string;
-  name: string;
-  description: string | null;
-  price: number;
-  type: string;
-  image_url: string | null;
-  brand_id: string;
-  is_taxable?: boolean;
-  pickup_type?: "scheduled_stop" | "shed";
-};
-
-type Stop = {
-  id: string;
-  city: string;
-  state: string;
-  date: string;
-  time: string;
-  location: string;
-  brand_id: string;
-};
-
-export default function StopPage() {
-  const params = useParams();
-  const slug = params.slug as string;
-
-  const [stop, setStop] = useState<{
-    id: string;
-    city: string;
-    state: string;
-    date: string;
-    time: string;
-    location: string;
-    brand_id: string;
-  } | null>(null);
-  const [products, setProducts] = useState<Product[]>([]);
-  const [brandSlug, setBrandSlug] = useState("tuxedo");
-  const [brandAccent, setBrandAccent] = useState<"green" | "orange" | "blue">("green");
-
-  useEffect(() => {
-    async function load() {
-      const { data: stopData } = await supabase
-        .from("stops")
-        .select("*")
-        .eq("slug", slug)
-        .eq("active", true)
-        .single() as unknown as { data: Stop | null };
-
-      if (!stopData) return;
-
-      setStop(stopData);
-      const isIndian = slug.includes("indian");
-      setBrandSlug(isIndian ? "indian-river-direct" : "tuxedo");
-      setBrandAccent(isIndian ? "blue" : "green");
-
-      const { data: productsData } = await supabase
-        .from("products")
-        .select("*")
-        .eq("brand_id", stopData.brand_id)
-        .eq("active", true) as unknown as { data: Product[] | null };
-      setProducts(productsData ?? []);
-    }
-    load();
-  }, [slug]);
-
-  if (!stop) {
-    return (
-      <div className="min-h-screen bg-stone-50">
-        <StorefrontHeader brandName="Tuxedo Corn" brandSlug="tuxedo" brandAccent="green" />
-        <main className="py-20">
-          <LayoutContainer>
-            <div className="max-w-5xl mx-auto text-center">
-              <h1 className="text-5xl font-black tracking-tight text-stone-950">Stop Not Found</h1>
-            </div>
-          </LayoutContainer>
-        </main>
-      </div>
-    );
-  }
-
-  const isBlue = brandAccent === "blue";
-  const brandLabel = isBlue ? "Indian River Direct" : "Tuxedo Corn";
-
-  return (
-    <div className="min-h-screen bg-stone-50">
-      <StorefrontHeader
-        brandName={brandLabel}
-        brandSlug={brandSlug}
-        brandAccent={brandAccent}
-      />
-
-      <main className="py-16 md:py-20">
-        <LayoutContainer>
-          <div className="max-w-5xl mx-auto">
-
-            {/* Back navigation */}
-            <div className="mb-10 flex items-center gap-2">
-              <Link
-                href={`/${brandSlug}#stops`}
-                className="flex items-center gap-2 text-sm font-medium text-stone-500 hover:text-stone-800 transition-colors group"
-              >
-                <svg
-                  className="h-4 w-4 transition-transform duration-200 group-hover:-translate-x-1"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                  stroke="currentColor"
-                  strokeWidth={2}
-                >
-                  <path strokeLinecap="round" strokeLinejoin="round" d="M10.5 19.5L3 12m0 0l7.5-7.5M3 12h18" />
-                </svg>
-                All Stops
-              </Link>
-              <span className="text-stone-300">/</span>
-              <span className="text-sm text-stone-700 font-medium">{stop.city}, {stop.state}</span>
-            </div>
-
-            {/* Stop header */}
-            <div className="mb-12">
-              <p className="text-[11px] font-semibold uppercase tracking-widest text-emerald-600 mb-4">
-                {brandLabel}
-              </p>
-              <h1 className="text-5xl md:text-7xl font-black tracking-tight text-stone-950 leading-[1.0]">
-                {stop.city},<br className="hidden md:block" /> {stop.state}
-              </h1>
-              <p className="mt-5 max-w-xl text-lg text-stone-500 leading-relaxed">
-                {isBlue
-                  ? "Order fresh Florida citrus for pickup at this stop."
-                  : "Order fresh Olathe Sweet&trade; sweet corn for pickup at this stop."}
-              </p>
-              <div className="mt-6 h-px w-12 bg-emerald-600" />
-            </div>
-
-            {/* Stop info */}
-            <div className="rounded-3xl bg-white p-8 mb-14 shadow-sm ring-1 ring-stone-200/60 transition-all duration-300 hover:shadow-xl hover:ring-stone-300/60">
-              <div className="grid gap-4 md:grid-cols-3">
-                <div className="flex items-start gap-4 py-4 px-5 rounded-2xl bg-stone-50">
-                  <div className={`flex-shrink-0 w-10 h-10 rounded-xl flex items-center justify-center ${isBlue ? "bg-blue-50" : "bg-emerald-50"}`}>
-                    <svg className={`h-5 w-5 ${isBlue ? "text-blue-500" : "text-emerald-600"}`} fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
-                      <path strokeLinecap="round" strokeLinejoin="round" d="M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 012.25-2.25h13.5A2.25 2.25 0 0121 7.5v11.25m-18 0A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75m-18 0v-7.5A2.25 2.25 0 015.25 9h13.5A2.25 2.25 0 0121 11.25v7.5" />
-                    </svg>
-                  </div>
-                  <div>
-                    <p className="text-xs font-semibold uppercase tracking-wider text-stone-400 mb-1">Date</p>
-                    <p className="font-bold text-stone-950">{formatDate(stop.date)}</p>
-                  </div>
-                </div>
-                <div className="flex items-start gap-4 py-4 px-5 rounded-2xl bg-stone-50">
-                  <div className={`flex-shrink-0 w-10 h-10 rounded-xl flex items-center justify-center ${isBlue ? "bg-blue-50" : "bg-emerald-50"}`}>
-                    <svg className={`h-5 w-5 ${isBlue ? "text-blue-500" : "text-emerald-600"}`} fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
-                      <path strokeLinecap="round" strokeLinejoin="round" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
-                    </svg>
-                  </div>
-                  <div>
-                    <p className="text-xs font-semibold uppercase tracking-wider text-stone-400 mb-1">Time</p>
-                    <p className="font-bold text-stone-950">{stop.time}</p>
-                  </div>
-                </div>
-                <div className="flex items-start gap-4 py-4 px-5 rounded-2xl bg-stone-50">
-                  <div className={`flex-shrink-0 w-10 h-10 rounded-xl flex items-center justify-center ${isBlue ? "bg-blue-50" : "bg-emerald-50"}`}>
-                    <svg className={`h-5 w-5 ${isBlue ? "text-blue-500" : "text-emerald-600"}`} fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
-                      <path strokeLinecap="round" strokeLinejoin="round" d="M15 10.5a3 3 0 11-6 0 3 3 0 016 0z" />
-                      <path strokeLinecap="round" strokeLinejoin="round" d="M19.5 10.5c0 7.142-7.5 11.25-7.5 11.25S4.5 17.642 4.5 10.5a7.5 7.5 0 1115 0z" />
-                    </svg>
-                  </div>
-                  <div>
-                    <p className="text-xs font-semibold uppercase tracking-wider text-stone-400 mb-1">Location</p>
-                    <p className="font-bold text-stone-950 leading-tight">{stop.location}</p>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            {/* Available Products — editorial header */}
-            <section>
-              <div className="mb-10">
-                <p className="text-[11px] font-semibold uppercase tracking-widest text-emerald-600 mb-4">Farm-Direct</p>
-                <h2 className="text-4xl md:text-5xl font-black tracking-tight text-stone-950 leading-tight">
-                  Available Products
-                </h2>
-                <div className="mt-5 h-px w-12 bg-emerald-600" />
-                <p className="mt-5 text-base text-stone-500 leading-relaxed">
-                  Preorder for pickup — add items below and we will have them ready at the stop.
-                </p>
-              </div>
-              {products.length === 0 ? (
-                <div className="rounded-3xl bg-white p-12 text-center shadow-sm ring-1 ring-stone-200/60">
-                  <p className="text-stone-500">No products available for this stop.</p>
-                </div>
-              ) : (
-                <div className="grid gap-8 md:grid-cols-3">
-                  {products.map((product) => (
-                    <ProductCard
-                      key={product.id}
-                      id={product.id}
-                      name={product.name}
-                      description={product.description}
-                      price={`$${product.price}`}
-                      type={product.type}
-                      imageUrl={product.image_url}
-                      brandSlug={brandSlug}
-                      brandName={brandLabel}
-                      brandId={product.brand_id}
-                      brandAccent={brandAccent}
-                      is_taxable={product.is_taxable}
-                      pickup_type={product.pickup_type}
-                    />
-                  ))}
-                </div>
-              )}
-            </section>
-          </div>
-        </LayoutContainer>
-      </main>
-
-      <StorefrontFooter
-        brandName={brandLabel}
-        brandSlug={brandSlug}
-        brandAccent={brandAccent}
-      />
-    </div>
-  );
-}
\ No newline at end of file