Upgrade Next.js to 16.3.6

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

app/globals.css

@@ -169,7 +169,7 @@
     background-size: 64px 100%;
   }
   html {
-    @apply font-sans;
+    @apply scroll-pt-20 font-sans;
   }
 }
 

app/layout.tsx

@@ -2,6 +2,7 @@ import type { Metadata } from "next";
 import { Geist, Geist_Mono } from "next/font/google";
 
 import { ThemeProvider } from "@/components/layout/theme-provider";
+import { siteConfig } from "@/lib/site";
 import "./globals.css";
 
 const geistSans = Geist({
@@ -14,47 +15,9 @@ const geistMono = Geist_Mono({
   subsets: ["latin"],
 });
 
-const siteName = "Vertex — The Unified AI Gateway";
-const siteDescription =
-  "Route, optimize, and observe every AI model request through one OpenAI-compatible API.";
-
-// Absolute origin behind `metadataBase`, so Open Graph images resolve to full
-// URLs. Vercel injects VERCEL_PROJECT_PRODUCTION_URL on deployed builds.
-const siteUrl =
-  process.env.NEXT_PUBLIC_SITE_URL ??
-  (process.env.VERCEL_PROJECT_PRODUCTION_URL
-    ? `https://${process.env.VERCEL_PROJECT_PRODUCTION_URL}`
-    : "http://localhost:3000");
-
-// Routes only set their own `title`; the template appends the site name.
 export const metadata: Metadata = {
-  metadataBase: new URL(siteUrl),
+  title: siteConfig.name,
-  title: {
+  description: siteConfig.description,
-    default: siteName,
-    template: `%s — ${siteName}`,
-  },
-  description: siteDescription,
-  openGraph: {
-    type: "website",
-    siteName,
-    title: siteName,
-    description: siteDescription,
-    url: "/",
-    images: [
-      {
-        url: "/og.png",
-        width: 1732,
-        height: 908,
-        alt: "Vertex — One API for every AI model",
-      },
-    ],
-  },
-  twitter: {
-    card: "summary_large_image",
-    title: siteName,
-    description: siteDescription,
-    images: ["/og.png"],
-  },
 };
 
 export default function RootLayout({

app/page.tsx

@@ -11,7 +11,7 @@ import { TestimonialsSection } from "@/components/sections/testimonials-section"
 
 export default function Home() {
   return (
-    <div className="min-h-screen bg-background text-foreground selection:bg-blue-600 selection:text-white">
+    <div className="min-h-screen overflow-x-clip bg-background text-foreground selection:bg-blue-600 selection:text-white">
       <SiteHeader />
       <main id="top" className="mx-auto max-w-[1280px] border-x">
         <HeroSection />
@@ -22,8 +22,8 @@ export default function Home() {
         <PricingSection />
         <TestimonialsSection />
         <CtaSection />
-        <SiteFooter />
       </main>
+      <SiteFooter />
     </div>
   )
 }

components.json

@@ -10,7 +10,7 @@
     "cssVariables": true,
     "prefix": ""
   },
-  "iconLibrary": "lucide",
+  "iconLibrary": "remixicon",
   "rtl": false,
   "menuColor": "default",
   "menuAccent": "subtle",

components/layout/mobile-navigation.tsx

@@ -0,0 +1,117 @@
+"use client"
+
+import { useEffect, useRef, useState } from "react"
+import { RiCloseLine, RiMenuLine } from "@remixicon/react"
+
+import { Brand } from "@/components/shared/brand"
+import {
+  Sheet,
+  SheetClose,
+  SheetContent,
+  SheetDescription,
+  SheetTitle,
+  SheetTrigger,
+} from "@/components/ui/sheet"
+
+type NavigationItem = {
+  label: string
+  href: string
+  description: string
+}
+
+export function MobileNavigation({ items }: { items: NavigationItem[] }) {
+  const [open, setOpen] = useState(false)
+  const navigating = useRef(false)
+
+  useEffect(() => {
+    const desktop = window.matchMedia("(min-width: 768px)")
+    const closeOnDesktop = () => {
+      if (desktop.matches) setOpen(false)
+    }
+
+    desktop.addEventListener("change", closeOnDesktop)
+    return () => desktop.removeEventListener("change", closeOnDesktop)
+  }, [])
+
+  return (
+    <Sheet open={open} onOpenChange={setOpen}>
+      <SheetTrigger asChild>
+        <button
+          type="button"
+          aria-label="Open navigation menu"
+          className="inline-flex size-11 items-center justify-center rounded-sm bg-background/80 text-foreground transition-colors hover:bg-blue-600/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring md:hidden"
+        >
+          <RiMenuLine className="size-5" aria-hidden="true" />
+        </button>
+      </SheetTrigger>
+
+      <SheetContent
+        side="top"
+        showCloseButton={false}
+        overlayClassName="z-[60] bg-black/45 duration-300 supports-backdrop-filter:backdrop-blur-md md:hidden"
+        className="z-[61] max-h-dvh w-full gap-0 overflow-hidden rounded-none bg-background text-foreground outline-none duration-300 data-[side=top]:data-open:slide-in-from-top data-[side=top]:data-closed:slide-out-to-top md:hidden"
+        onCloseAutoFocus={(event) => {
+          // Let the anchor move focus to its section without the trigger
+          // interrupting the page's smooth scroll when the sheet closes.
+          if (navigating.current) event.preventDefault()
+          navigating.current = false
+        }}
+      >
+        <div className="flex shrink-0 items-center justify-between border-b bg-linear-to-r from-blue-600/10 via-blue-600/5 to-transparent px-5 py-3">
+          <Brand />
+          <SheetClose asChild>
+            <button
+              type="button"
+              aria-label="Close navigation menu"
+              className="inline-flex size-11 items-center justify-center rounded-sm bg-background/70 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+            >
+              <RiCloseLine className="size-5" aria-hidden="true" />
+            </button>
+          </SheetClose>
+        </div>
+
+        <div className="min-h-0 overflow-y-auto overscroll-contain p-3">
+          <SheetTitle className="px-3 pb-2 pt-3 font-mono text-[10px] font-medium tracking-[0.18em] text-muted-foreground uppercase">
+            Explore Vertex
+          </SheetTitle>
+          <SheetDescription className="sr-only">
+            Explore our products, models, features, pricing, and developer documentation.
+          </SheetDescription>
+          <nav aria-label="Mobile navigation">
+            <ul className="space-y-1">
+              {items.map(({ label, href, description }) => (
+                <li key={label}>
+                  <SheetClose asChild>
+                    <a
+                      href={href}
+                      onClick={() => { navigating.current = true }}
+                      className="flex items-center rounded-xl px-3 py-3 transition-colors hover:bg-blue-600/8 focus-visible:bg-blue-600/8 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring"
+                    >
+                      <span className="min-w-0">
+                        <span className="block text-xl font-medium tracking-tight">{label}</span>
+                        <span className="mt-0.5 block text-xs leading-5 text-muted-foreground">{description}</span>
+                      </span>
+                    </a>
+                  </SheetClose>
+                </li>
+              ))}
+            </ul>
+          </nav>
+        </div>
+
+        <div className="shrink-0 border-t bg-muted/35 p-5">
+          <p className="mb-3 text-xs text-muted-foreground">One API. Every AI model.</p>
+          <SheetClose asChild>
+            <a
+              href="#pricing"
+              onClick={() => { navigating.current = true }}
+              className="flex h-12 items-center justify-center rounded-lg bg-blue-600 px-4 text-sm font-medium text-white shadow-[0_6px_24px_rgba(23,61,166,.2)] transition-colors hover:bg-blue-500 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background"
+            >
+              Get started
+            </a>
+          </SheetClose>
+        </div>
+      </SheetContent>
+    </Sheet>
+  )
+}

components/layout/site-footer.tsx

@@ -1,8 +1,11 @@
+import { RiGithubFill, RiTwitterXFill } from "@remixicon/react"
+
 import { Brand } from "@/components/shared/brand"
+import { Button } from "@/components/ui/button"
 
 export function SiteFooter() {
   return (
-    <footer className="px-6 py-10 sm:px-10">
+    <footer className="mx-auto max-w-[1280px] border-x px-6 py-10 sm:px-10">
       <div className="flex flex-col gap-8 sm:flex-row sm:items-center sm:justify-between">
         <div>
           <Brand />
@@ -18,8 +21,20 @@ export function SiteFooter() {
           <a className="hover:text-foreground" href="#top">Privacy</a>
         </div>
       </div>
-      <div className="mt-10 text-[11px] text-muted-foreground">
+      <div className="mt-10 flex flex-wrap items-center justify-between gap-4 text-[11px] text-muted-foreground">
         <span>© 2026 Vertex, Inc. All rights reserved.</span>
+        <div className="flex items-center gap-2">
+          <Button asChild variant="ghost" size="icon">
+            <a href="https://github.com" aria-label="GitHub">
+              <RiGithubFill className="size-4" aria-hidden="true" />
+            </a>
+          </Button>
+          <Button asChild variant="ghost" size="icon">
+            <a href="https://x.com" aria-label="X (Twitter)">
+              <RiTwitterXFill className="size-4" aria-hidden="true" />
+            </a>
+          </Button>
+        </div>
       </div>
     </footer>
   )

components/layout/site-header.tsx

@@ -1,30 +1,35 @@
-import { ChevronDown, ChevronRight } from "lucide-react"
+import { RiArrowDownSLine, RiArrowRightSLine } from "@remixicon/react"
 
+import { MobileNavigation } from "@/components/layout/mobile-navigation"
 import { ThemeToggle } from "@/components/layout/theme-toggle"
 import { Brand } from "@/components/shared/brand"
+import { FrameCrosses } from "@/components/shared/frame-crosses"
+
+const navigationItems = [
+  { label: "Products", href: "#features", description: "One gateway for your AI stack" },
+  { label: "Models", href: "#models", description: "Explore the models you can build with" },
+  { label: "Features", href: "#features", description: "Routing, insights, and reliability" },
+  { label: "Pricing", href: "#pricing", description: "Start free. Scale at your pace." },
+  { label: "Docs", href: "#developers", description: "Your first request starts here" },
+]
 
 export function SiteHeader() {
   return (
     <header className="sticky top-0 z-50 w-full border-b bg-background/86 backdrop-blur-xl supports-[backdrop-filter]:bg-background/74">
-      <div className="mx-auto flex h-16 max-w-[1280px] items-center justify-between px-5 sm:px-8">
+      <div className="relative mx-auto flex h-16 max-w-[1280px] items-center justify-between border-x px-5 sm:px-8">
+        <FrameCrosses edges="bottom" />
         <a href="#top" aria-label="Vertex home">
           <Brand />
         </a>
         <nav aria-label="Main navigation" className="hidden items-center gap-8 md:flex lg:gap-10">
-          {[
+          {navigationItems.map(({ label, href }) => (
-            ["Products", "#features"],
-            ["Models", "#models"],
-            ["Features", "#features"],
-            ["Pricing", "#pricing"],
-            ["Docs", "#developers"],
-          ].map(([label, href]) => (
             <a
               key={label}
               href={href}
               className="inline-flex items-center gap-1 text-xs font-medium text-muted-foreground transition-colors hover:text-foreground"
             >
               {label}
-              {label === "Products" && <ChevronDown className="size-3" />}
+              {label === "Products" && <RiArrowDownSLine className="size-3" />}
             </a>
           ))}
         </nav>
@@ -34,8 +39,9 @@ export function SiteHeader() {
             href="#pricing"
             className="hidden h-9 items-center gap-1.5 rounded-sm bg-blue-600 px-4 text-xs font-medium text-white shadow-[0_6px_24px_rgba(23,61,166,.28)] transition hover:bg-blue-500 sm:inline-flex"
           >
-            Get started <ChevronRight className="size-3.5" />
+            Get started <RiArrowRightSLine className="size-3.5" />
           </a>
+          <MobileNavigation items={navigationItems} />
         </div>
       </div>
     </header>

components/layout/theme-toggle.tsx

@@ -1,9 +1,11 @@
 "use client"
 
-import { Moon, Sun } from "lucide-react"
+import { RiMoonLine, RiSunLine } from "@remixicon/react"
 import { useTheme } from "next-themes"
 import { useSyncExternalStore } from "react"
 
+import { Button } from "@/components/ui/button"
+
 const emptySubscribe = () => () => {}
 
 export function ThemeToggle() {
@@ -13,17 +15,19 @@ export function ThemeToggle() {
   const isDark = mounted && resolvedTheme === "dark"
 
   return (
-    <button
+    <Button
       type="button"
+      variant="ghost"
+      size="icon-lg"
       aria-label={mounted ? `Switch to ${isDark ? "light" : "dark"} theme` : "Toggle theme"}
-      className="inline-flex size-9 items-center justify-center rounded-sm border bg-background/80 text-muted-foreground transition-colors hover:border-foreground/20 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/60"
+      className="text-muted-foreground"
       onClick={() => setTheme(isDark ? "light" : "dark")}
     >
       {mounted ? (
-        isDark ? <Sun className="size-4" /> : <Moon className="size-4" />
+        isDark ? <RiSunLine className="size-4" /> : <RiMoonLine className="size-4" />
       ) : (
         <span className="size-4" aria-hidden="true" />
       )}
-    </button>
+    </Button>
   )
 }

components/sections/developers-section.tsx

@@ -1,4 +1,4 @@
-import { Code2, Gauge, Workflow } from "lucide-react"
+import { RiCodeSSlashLine, RiSpeedUpLine, RiFlowChart } from "@remixicon/react"
 
 import { SectionHeading } from "@/components/shared/section-heading"
 import { cn } from "@/lib/utils"
@@ -14,17 +14,17 @@ export function DevelopersSection() {
       <div className="grid md:grid-cols-3">
         {[
           {
-            icon: Code2,
+            icon: RiCodeSSlashLine,
             title: "Change one base URL",
             text: "Keep your existing OpenAI-compatible SDK, payloads, and streaming logic.",
           },
           {
-            icon: Workflow,
+            icon: RiFlowChart,
             title: "Set a routing policy",
             text: "Choose a model directly or let Vertex optimize for cost, quality, or latency.",
           },
           {
-            icon: Gauge,
+            icon: RiSpeedUpLine,
             title: "Observe every request",
             text: "Trace performance and spend across models, applications, and environments.",
           },

components/sections/features-section.tsx

@@ -15,8 +15,8 @@ export function FeaturesSection() {
         description="Everything you need to move quickly across models without giving up reliability, control, or visibility."
       />
 
-      <div className="grid lg:grid-cols-12">
+      <div className="grid grid-cols-1 lg:grid-cols-12">
-        <article className="flex min-h-[520px] flex-col border-b lg:col-span-7 lg:border-r">
+        <article className="flex min-h-[520px] min-w-0 flex-col border-b lg:col-span-7 lg:border-r">
           <ApiTerminal />
           <FeatureCopy
             title="One compatible endpoint"
@@ -24,7 +24,7 @@ export function FeaturesSection() {
           />
         </article>
 
-        <article className="flex min-h-[520px] flex-col border-b lg:col-span-5">
+        <article className="flex min-h-[520px] min-w-0 flex-col border-b lg:col-span-5">
           <IntegrationOrbit />
           <FeatureCopy
             title="Seamless integrations"
@@ -32,7 +32,7 @@ export function FeaturesSection() {
           />
         </article>
 
-        <article className="flex min-h-[430px] flex-col border-b lg:col-span-4 lg:border-b-0 lg:border-r">
+        <article className="flex min-h-[430px] min-w-0 flex-col border-b lg:col-span-4 lg:border-b-0 lg:border-r">
           <RoutingActivity />
           <FeatureCopy
             title="Automatic failover"
@@ -40,8 +40,8 @@ export function FeaturesSection() {
           />
         </article>
 
-        <article className="flex min-h-[430px] flex-col border-b lg:col-span-4 lg:border-b-0 lg:border-r">
+        <article className="flex min-h-[430px] min-w-0 flex-col border-b lg:col-span-4 lg:border-b-0 lg:border-r">
-          <div className="relative h-[360px] shrink-0 overflow-hidden bg-background">
+          <div className="relative h-[360px] w-full min-w-0 shrink-0 overflow-hidden bg-background">
             <UsageChart />
           </div>
           <FeatureCopy
@@ -50,7 +50,7 @@ export function FeaturesSection() {
           />
         </article>
 
-        <article className="flex min-h-[430px] flex-col lg:col-span-4">
+        <article className="flex min-h-[430px] min-w-0 flex-col lg:col-span-4">
           <GlobalGlobe />
           <FeatureCopy
             title="Global inference gateway"

components/sections/features/global-globe.tsx

@@ -1,8 +1,11 @@
 "use client"
 
+import { type COBEOptions } from "cobe"
+import { useTheme } from "next-themes"
+
 import { Globe } from "@/components/ui/globe"
 
-const globeConfig = {
+const darkGlobeConfig: COBEOptions = {
   width: 800,
   height: 800,
   onRender: () => {},
@@ -28,13 +31,25 @@ const globeConfig = {
   ],
 }
 
+const lightGlobeConfig: COBEOptions = {
+  ...darkGlobeConfig,
+  dark: 0,
+  diffuse: 0.4,
+  mapBrightness: 1.2,
+  baseColor: [0.9, 0.94, 1],
+  markerColor: [0.09, 0.24, 0.65],
+  glowColor: [0.85, 0.9, 1],
+}
+
 export function GlobalGlobe() {
+  const { resolvedTheme } = useTheme()
+
   return (
     <div className="relative h-[360px] shrink-0 overflow-hidden bg-background">
-      <Globe className="top-6 max-w-[360px]" config={globeConfig} />
+      <Globe
-      <div className="absolute left-5 top-5 flex items-center gap-2 rounded-full border bg-background/85 px-3 py-1.5 font-mono text-[10px] shadow-sm backdrop-blur">
+        className="top-6 max-w-[360px]"
-        <span className="size-1.5 animate-pulse rounded-full bg-emerald-500" /> 8 regions online
+        config={resolvedTheme === "light" ? lightGlobeConfig : darkGlobeConfig}
-      </div>
+      />
     </div>
   )
 }

components/sections/features/routing-activity.tsx

@@ -1,37 +1,37 @@
 "use client"
 
-import { Activity, CircleCheck, Route, ShieldCheck, Zap } from "lucide-react"
+import { RiPulseLine, RiCheckboxCircleLine, RiRouteLine, RiShieldCheckLine, RiFlashlightLine } from "@remixicon/react"
 
 import { AnimatedList } from "@/components/ui/animated-list"
 import { cn } from "@/lib/utils"
 
 const routingEvents = [
   {
-    icon: <Route className="size-4" />,
+    icon: <RiRouteLine className="size-4" />,
     title: "Routed to Claude Sonnet",
     meta: "342ms · 8.2k tokens",
     accent: "bg-blue-600/15 text-blue-600 dark:text-blue-400",
   },
   {
-    icon: <Zap className="size-4" />,
+    icon: <RiFlashlightLine className="size-4" />,
     title: "Prompt cache hit",
     meta: "Saved $0.018 · 42ms",
     accent: "bg-amber-500/15 text-amber-500",
   },
   {
-    icon: <Activity className="size-4" />,
+    icon: <RiPulseLine className="size-4" />,
     title: "Latency policy applied",
     meta: "Gemini Flash · 118ms",
     accent: "bg-blue-500/15 text-blue-500",
   },
   {
-    icon: <CircleCheck className="size-4" />,
+    icon: <RiCheckboxCircleLine className="size-4" />,
     title: "Fallback completed",
     meta: "OpenAI → Mistral · 621ms",
     accent: "bg-emerald-500/15 text-emerald-500",
   },
   {
-    icon: <ShieldCheck className="size-4" />,
+    icon: <RiShieldCheckLine className="size-4" />,
     title: "Guardrail passed",
     meta: "No sensitive data detected",
     accent: "bg-cyan-500/15 text-cyan-500",

components/sections/features/usage-chart.tsx

@@ -62,7 +62,7 @@ export function UsageChart() {
   const fillId = useId()
 
   return (
-    <ChartContainer config={chartConfig} className="h-full min-h-[270px] w-full aspect-auto">
+    <ChartContainer config={chartConfig} className="h-full min-h-[270px] w-full min-w-0 aspect-auto">
       <AreaChart
         accessibilityLayer
         aria-label="Example model usage: requests increase from 2,350 to 5,680 over the day. Use the arrow keys to explore."

components/sections/hero-section.tsx

@@ -1,15 +1,15 @@
-import { ArrowRight } from "lucide-react"
+import { RiArrowRightLine } from "@remixicon/react"
 
 import { FrameCrosses } from "@/components/shared/frame-crosses"
 
 export function HeroSection() {
   return (
     <section className="hero-gradient relative border-b px-6 pb-14 pt-24 text-center sm:px-10 sm:pb-20 sm:pt-28 lg:pt-32">
-      <FrameCrosses />
+      <FrameCrosses edges="bottom" />
       <div className="relative z-10 mx-auto max-w-4xl">
         <a
           href="#features"
-          className="mb-7 inline-flex items-center justify-center rounded-full border border-blue-600/15 bg-gradient-to-br from-white/80 via-blue-600/10 to-blue-600/20 px-5 py-2 text-xs font-medium text-foreground shadow-[inset_0_1px_0_rgba(255,255,255,.6),0_4px_20px_rgba(23,61,166,.1)] backdrop-blur-xl transition-colors hover:border-blue-600/35 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background dark:border-white/15 dark:from-white/10 dark:via-blue-600/15 dark:to-blue-600/30 dark:shadow-[inset_0_1px_0_rgba(255,255,255,.12),0_4px_20px_rgba(23,61,166,.15)] dark:hover:border-white/30"
+          className="mb-7 inline-flex items-center justify-center rounded-full border border-blue-600/25 bg-clip-padding bg-gradient-to-br from-white/80 via-blue-600/10 to-blue-600/20 px-5 py-2 text-xs font-medium text-foreground shadow-[inset_0_1px_0_rgba(255,255,255,.6),0_4px_20px_rgba(23,61,166,.1)] backdrop-blur-xl transition-colors hover:border-blue-600/35 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background dark:border-white/15 dark:from-white/10 dark:via-blue-600/15 dark:to-blue-600/30 dark:shadow-[inset_0_1px_0_rgba(255,255,255,.12),0_4px_20px_rgba(23,61,166,.15)] dark:hover:border-white/30"
         >
           The unified AI gateway
         </a>
@@ -25,7 +25,7 @@ export function HeroSection() {
             href="#pricing"
             className="inline-flex h-11 w-full items-center justify-center gap-2 rounded-sm bg-blue-600 px-6 text-sm font-medium text-white shadow-[0_10px_32px_rgba(23,61,166,.32)] transition hover:-translate-y-0.5 hover:bg-blue-500 sm:w-auto"
           >
-            Get your API key <ArrowRight className="size-4" />
+            Get your API key <RiArrowRightLine className="size-4" />
           </a>
           <a
             href="#models"

components/sections/pricing-section.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import { useState } from "react"
-import { Check } from "lucide-react"
+import { RiCheckLine } from "@remixicon/react"
 
 import { SectionHeading } from "@/components/shared/section-heading"
 import { cn } from "@/lib/utils"
@@ -94,7 +94,7 @@ export function PricingSection() {
               <ul className="mt-7 space-y-3">
                 {plan.features.map((feature) => (
                   <li key={feature} className="flex items-start gap-2.5 text-sm text-muted-foreground">
-                    <Check className="mt-0.5 size-4 shrink-0 text-blue-600 dark:text-blue-400" />
+                    <RiCheckLine className="mt-0.5 size-4 shrink-0 text-blue-600 dark:text-blue-400" />
                     {feature}
                   </li>
                 ))}

components/sections/reliability-section.tsx

@@ -1,4 +1,4 @@
-import { LockKeyhole } from "lucide-react"
+import { RiLock2Line } from "@remixicon/react"
 
 import { Ripple } from "@/components/ui/ripple"
 import { cn } from "@/lib/utils"
@@ -9,7 +9,7 @@ export function ReliabilitySection() {
       <Ripple className="opacity-40" mainCircleSize={180} numCircles={9} />
       <div className="relative z-10 mx-auto max-w-3xl">
         <div className="mx-auto flex size-12 items-center justify-center rounded-2xl border bg-background shadow-sm">
-          <LockKeyhole className="size-5 text-blue-600" />
+          <RiLock2Line className="size-5 text-blue-600" />
         </div>
         <h2 className="mt-6 text-balance text-3xl font-medium tracking-[-0.045em] sm:text-4xl">
           Reliability built into every request.

components/shared/frame-crosses.tsx

@@ -1,10 +1,22 @@
-export function FrameCrosses() {
+export function FrameCrosses({
+  edges = "all",
+}: {
+  edges?: "all" | "top" | "bottom"
+}) {
   return (
     <>
-      <span className="frame-cross left-0 top-0" aria-hidden="true" />
+      {edges !== "bottom" && (
-      <span className="frame-cross right-0 top-0" aria-hidden="true" />
+        <>
-      <span className="frame-cross bottom-0 left-0" aria-hidden="true" />
+          <span className="frame-cross left-0 top-0" aria-hidden="true" />
-      <span className="frame-cross bottom-0 right-0" aria-hidden="true" />
+          <span className="frame-cross right-0 top-0" aria-hidden="true" />
+        </>
+      )}
+      {edges !== "top" && (
+        <>
+          <span className="frame-cross bottom-0 left-0" aria-hidden="true" />
+          <span className="frame-cross bottom-0 right-0" aria-hidden="true" />
+        </>
+      )}
     </>
   )
 }

components/ui/accordion.tsx

@@ -4,7 +4,7 @@ import * as React from "react"
 import { Accordion as AccordionPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"
-import { ChevronDownIcon, ChevronUpIcon } from "lucide-react"
+import { RiArrowDownSLine, RiArrowUpSLine } from "@remixicon/react"
 
 function Accordion({
   className,
@@ -48,8 +48,8 @@ function AccordionTrigger({
         {...props}
       >
         {children}
-        <ChevronDownIcon data-slot="accordion-trigger-icon" className="pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" />
+        <RiArrowDownSLine data-slot="accordion-trigger-icon" className="pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" />
-        <ChevronUpIcon data-slot="accordion-trigger-icon" className="pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" />
+        <RiArrowUpSLine data-slot="accordion-trigger-icon" className="pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" />
       </AccordionPrimitive.Trigger>
     </AccordionPrimitive.Header>
   )

components/ui/breadcrumb.tsx

@@ -2,7 +2,7 @@ import * as React from "react"
 import { Slot } from "radix-ui"
 
 import { cn } from "@/lib/utils"
-import { ChevronRightIcon, MoreHorizontalIcon } from "lucide-react"
+import { RiArrowRightSLine, RiMoreLine } from "@remixicon/react"
 
 function Breadcrumb({ className, ...props }: React.ComponentProps<"nav">) {
   return (
@@ -83,7 +83,7 @@ function BreadcrumbSeparator({
       {...props}
     >
       {children ?? (
-        <ChevronRightIcon />
+        <RiArrowRightSLine />
       )}
     </li>
   )
@@ -104,7 +104,7 @@ function BreadcrumbEllipsis({
       )}
       {...props}
     >
-      <MoreHorizontalIcon
+      <RiMoreLine
       />
       <span className="sr-only">More</span>
     </span>

components/ui/calendar.tsx

@@ -10,7 +10,7 @@ import {
 
 import { cn } from "@/lib/utils"
 import { Button, buttonVariants } from "@/components/ui/button"
-import { ChevronLeftIcon, ChevronRightIcon, ChevronDownIcon } from "lucide-react"
+import { RiArrowLeftSLine, RiArrowRightSLine, RiArrowDownSLine } from "@remixicon/react"
 
 function Calendar({
   className,
@@ -147,18 +147,18 @@ function Calendar({
         Chevron: ({ className, orientation, ...props }) => {
           if (orientation === "left") {
             return (
-              <ChevronLeftIcon className={cn("size-4", className)} {...props} />
+              <RiArrowLeftSLine className={cn("size-4", className)} {...props} />
             )
           }
 
           if (orientation === "right") {
             return (
-              <ChevronRightIcon className={cn("size-4", className)} {...props} />
+              <RiArrowRightSLine className={cn("size-4", className)} {...props} />
             )
           }
 
           return (
-            <ChevronDownIcon className={cn("size-4", className)} {...props} />
+            <RiArrowDownSLine className={cn("size-4", className)} {...props} />
           )
         },
         DayButton: ({ ...props }) => (

components/ui/carousel.tsx

@@ -7,7 +7,7 @@ import useEmblaCarousel, {
 
 import { cn } from "@/lib/utils"
 import { Button } from "@/components/ui/button"
-import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react"
+import { RiArrowLeftSLine, RiArrowRightSLine } from "@remixicon/react"
 
 type CarouselApi = UseEmblaCarouselType[1]
 type UseCarouselParameters = Parameters<typeof useEmblaCarousel>
@@ -202,7 +202,7 @@ function CarouselPrevious({
       onClick={scrollPrev}
       {...props}
     >
-      <ChevronLeftIcon />
+      <RiArrowLeftSLine />
       <span className="sr-only">Previous slide</span>
     </Button>
   )
@@ -232,7 +232,7 @@ function CarouselNext({
       onClick={scrollNext}
       {...props}
     >
-      <ChevronRightIcon />
+      <RiArrowRightSLine />
       <span className="sr-only">Next slide</span>
     </Button>
   )

components/ui/checkbox.tsx

@@ -4,7 +4,7 @@ import * as React from "react"
 import { Checkbox as CheckboxPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"
-import { CheckIcon } from "lucide-react"
+import { RiCheckLine } from "@remixicon/react"
 
 function Checkbox({
   className,
@@ -23,7 +23,7 @@ function Checkbox({
         data-slot="checkbox-indicator"
         className="grid place-content-center text-current transition-none [&>svg]:size-3.5"
       >
-        <CheckIcon
+        <RiCheckLine
         />
       </CheckboxPrimitive.Indicator>
     </CheckboxPrimitive.Root>

components/ui/combobox.tsx

@@ -11,7 +11,7 @@ import {
   InputGroupButton,
   InputGroupInput,
 } from "@/components/ui/input-group"
-import { ChevronDownIcon, XIcon, CheckIcon } from "lucide-react"
+import { RiArrowDownSLine, RiCloseLine, RiCheckLine } from "@remixicon/react"
 
 const Combobox = ComboboxPrimitive.Root
 
@@ -31,7 +31,7 @@ function ComboboxTrigger({
       {...props}
     >
       {children}
-      <ChevronDownIcon className="pointer-events-none size-4 text-muted-foreground" />
+      <RiArrowDownSLine className="pointer-events-none size-4 text-muted-foreground" />
     </ComboboxPrimitive.Trigger>
   )
 }
@@ -44,7 +44,7 @@ function ComboboxClear({ className, ...props }: ComboboxPrimitive.Clear.Props) {
       className={cn(className)}
       {...props}
     >
-      <XIcon className="pointer-events-none" />
+      <RiCloseLine className="pointer-events-none" />
     </ComboboxPrimitive.Clear>
   )
 }
@@ -153,7 +153,7 @@ function ComboboxItem({
           <span className="pointer-events-none absolute right-2 flex size-4 items-center justify-center" />
         }
       >
-        <CheckIcon className="pointer-events-none" />
+        <RiCheckLine className="pointer-events-none" />
       </ComboboxPrimitive.ItemIndicator>
     </ComboboxPrimitive.Item>
   )
@@ -255,7 +255,7 @@ function ComboboxChip({
           className="-ml-1 opacity-50 hover:opacity-100"
           data-slot="combobox-chip-remove"
         >
-          <XIcon className="pointer-events-none" />
+          <RiCloseLine className="pointer-events-none" />
         </ComboboxPrimitive.ChipRemove>
       )}
     </ComboboxPrimitive.Chip>

components/ui/command.tsx

@@ -15,7 +15,7 @@ import {
   InputGroup,
   InputGroupAddon,
 } from "@/components/ui/input-group"
-import { SearchIcon, CheckIcon } from "lucide-react"
+import { RiSearchLine, RiCheckLine } from "@remixicon/react"
 
 function Command({
   className,
@@ -81,7 +81,7 @@ function CommandInput({
           {...props}
         />
         <InputGroupAddon>
-          <SearchIcon className="size-4 shrink-0 opacity-50" />
+          <RiSearchLine className="size-4 shrink-0 opacity-50" />
         </InputGroupAddon>
       </InputGroup>
     </div>
@@ -161,7 +161,7 @@ function CommandItem({
       {...props}
     >
       {children}
-      <CheckIcon className="ml-auto opacity-0 group-has-data-[slot=command-shortcut]/command-item:hidden group-data-[checked=true]/command-item:opacity-100" />
+      <RiCheckLine className="ml-auto opacity-0 group-has-data-[slot=command-shortcut]/command-item:hidden group-data-[checked=true]/command-item:opacity-100" />
     </CommandPrimitive.Item>
   )
 }

components/ui/context-menu.tsx

@@ -4,7 +4,7 @@ import * as React from "react"
 import { ContextMenu as ContextMenuPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"
-import { ChevronRightIcon, CheckIcon } from "lucide-react"
+import { RiArrowRightSLine, RiCheckLine } from "@remixicon/react"
 
 function ContextMenu({
   ...props
@@ -117,7 +117,7 @@ function ContextMenuSubTrigger({
       {...props}
     >
       {children}
-      <ChevronRightIcon className="ml-auto" />
+      <RiArrowRightSLine className="ml-auto" />
     </ContextMenuPrimitive.SubTrigger>
   )
 }
@@ -157,7 +157,7 @@ function ContextMenuCheckboxItem({
     >
       <span className="pointer-events-none absolute right-2">
         <ContextMenuPrimitive.ItemIndicator>
-          <CheckIcon
+          <RiCheckLine
           />
         </ContextMenuPrimitive.ItemIndicator>
       </span>
@@ -186,7 +186,7 @@ function ContextMenuRadioItem({
     >
       <span className="pointer-events-none absolute right-2">
         <ContextMenuPrimitive.ItemIndicator>
-          <CheckIcon
+          <RiCheckLine
           />
         </ContextMenuPrimitive.ItemIndicator>
       </span>

components/ui/dialog.tsx

@@ -5,7 +5,7 @@ import { Dialog as DialogPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"
 import { Button } from "@/components/ui/button"
-import { XIcon } from "lucide-react"
+import { RiCloseLine } from "@remixicon/react"
 
 function Dialog({
   ...props
@@ -89,7 +89,7 @@ function DialogContent({
               className="absolute top-2 right-2"
               size="icon-sm"
             >
-              <XIcon
+              <RiCloseLine
               />
               <span className="sr-only">Close</span>
             </Button>

components/ui/dropdown-menu.tsx

@@ -4,7 +4,7 @@ import * as React from "react"
 import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"
-import { CheckIcon, ChevronRightIcon } from "lucide-react"
+import { RiCheckLine, RiArrowRightSLine } from "@remixicon/react"
 
 function DropdownMenu({
   ...props
@@ -106,7 +106,7 @@ function DropdownMenuCheckboxItem({
         data-slot="dropdown-menu-checkbox-item-indicator"
       >
         <DropdownMenuPrimitive.ItemIndicator>
-          <CheckIcon
+          <RiCheckLine
           />
         </DropdownMenuPrimitive.ItemIndicator>
       </span>
@@ -149,7 +149,7 @@ function DropdownMenuRadioItem({
         data-slot="dropdown-menu-radio-item-indicator"
       >
         <DropdownMenuPrimitive.ItemIndicator>
-          <CheckIcon
+          <RiCheckLine
           />
         </DropdownMenuPrimitive.ItemIndicator>
       </span>
@@ -232,7 +232,7 @@ function DropdownMenuSubTrigger({
       {...props}
     >
       {children}
-      <ChevronRightIcon className="ml-auto" />
+      <RiArrowRightSLine className="ml-auto" />
     </DropdownMenuPrimitive.SubTrigger>
   )
 }

components/ui/input-otp.tsx

@@ -4,7 +4,7 @@ import * as React from "react"
 import { OTPInput, OTPInputContext } from "input-otp"
 
 import { cn } from "@/lib/utils"
-import { MinusIcon } from "lucide-react"
+import { RiSubtractLine } from "@remixicon/react"
 
 function InputOTP({
   className,
@@ -78,7 +78,7 @@ function InputOTPSeparator({ ...props }: React.ComponentProps<"div">) {
       role="separator"
       {...props}
     >
-      <MinusIcon
+      <RiSubtractLine
       />
     </div>
   )

components/ui/menubar.tsx

@@ -4,7 +4,7 @@ import * as React from "react"
 import { Menubar as MenubarPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"
-import { CheckIcon, ChevronRightIcon } from "lucide-react"
+import { RiCheckLine, RiArrowRightSLine } from "@remixicon/react"
 
 function Menubar({
   className,
@@ -130,7 +130,7 @@ function MenubarCheckboxItem({
     >
       <span className="pointer-events-none absolute left-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4">
         <MenubarPrimitive.ItemIndicator>
-          <CheckIcon
+          <RiCheckLine
           />
         </MenubarPrimitive.ItemIndicator>
       </span>
@@ -159,7 +159,7 @@ function MenubarRadioItem({
     >
       <span className="pointer-events-none absolute left-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4">
         <MenubarPrimitive.ItemIndicator>
-          <CheckIcon
+          <RiCheckLine
           />
         </MenubarPrimitive.ItemIndicator>
       </span>
@@ -242,7 +242,7 @@ function MenubarSubTrigger({
       {...props}
     >
       {children}
-      <ChevronRightIcon className="ml-auto size-4" />
+      <RiArrowRightSLine className="ml-auto size-4" />
     </MenubarPrimitive.SubTrigger>
   )
 }

components/ui/message-scroller.tsx

@@ -10,7 +10,7 @@ import {
 
 import { cn } from "@/lib/utils"
 import { Button } from "@/components/ui/button"
-import { ArrowDownIcon } from "lucide-react"
+import { RiArrowDownLine } from "@remixicon/react"
 
 function MessageScrollerProvider(
   props: React.ComponentProps<typeof MessageScrollerPrimitive.Provider>
@@ -107,7 +107,7 @@ function MessageScrollerButton({
     >
       {children ?? (
         <>
-          <ArrowDownIcon
+          <RiArrowDownLine
           />
           <span className="sr-only">
             {direction === "end" ? "Scroll to end" : "Scroll to start"}

components/ui/native-select.tsx

@@ -1,7 +1,7 @@
 import * as React from "react"
 
 import { cn } from "@/lib/utils"
-import { ChevronDownIcon } from "lucide-react"
+import { RiArrowDownSLine } from "@remixicon/react"
 
 type NativeSelectProps = Omit<React.ComponentProps<"select">, "size"> & {
   size?: "sm" | "default"
@@ -27,7 +27,7 @@ function NativeSelect({
         className="h-8 w-full min-w-0 appearance-none rounded-lg border border-input bg-transparent py-1 pr-8 pl-2.5 text-sm transition-colors outline-none select-none selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-[size=sm]:py-0.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40"
         {...props}
       />
-      <ChevronDownIcon className="pointer-events-none absolute top-1/2 right-2.5 size-4 -translate-y-1/2 text-muted-foreground select-none" aria-hidden="true" data-slot="native-select-icon" />
+      <RiArrowDownSLine className="pointer-events-none absolute top-1/2 right-2.5 size-4 -translate-y-1/2 text-muted-foreground select-none" aria-hidden="true" data-slot="native-select-icon" />
     </div>
   )
 }

components/ui/navigation-menu.tsx

@@ -3,7 +3,7 @@ import { cva } from "class-variance-authority"
 import { NavigationMenu as NavigationMenuPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"
-import { ChevronDownIcon } from "lucide-react"
+import { RiArrowDownSLine } from "@remixicon/react"
 
 function NavigationMenu({
   className,
@@ -74,7 +74,7 @@ function NavigationMenuTrigger({
       {...props}
     >
       {children}{" "}
-      <ChevronDownIcon className="relative top-px ml-1 size-3 transition duration-300 group-data-popup-open/navigation-menu-trigger:rotate-180 group-data-open/navigation-menu-trigger:rotate-180" aria-hidden="true" />
+      <RiArrowDownSLine className="relative top-px ml-1 size-3 transition duration-300 group-data-popup-open/navigation-menu-trigger:rotate-180 group-data-open/navigation-menu-trigger:rotate-180" aria-hidden="true" />
     </NavigationMenuPrimitive.Trigger>
   )
 }

components/ui/pagination.tsx

@@ -2,7 +2,7 @@ import * as React from "react"
 
 import { cn } from "@/lib/utils"
 import { Button } from "@/components/ui/button"
-import { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from "lucide-react"
+import { RiArrowLeftSLine, RiArrowRightSLine, RiMoreLine } from "@remixicon/react"
 
 function Pagination({ className, ...props }: React.ComponentProps<"nav">) {
   return (
@@ -73,7 +73,7 @@ function PaginationPrevious({
       className={cn("pl-1.5!", className)}
       {...props}
     >
-      <ChevronLeftIcon data-icon="inline-start" />
+      <RiArrowLeftSLine data-icon="inline-start" />
       <span className="hidden sm:block">{text}</span>
     </PaginationLink>
   )
@@ -92,7 +92,7 @@ function PaginationNext({
       {...props}
     >
       <span className="hidden sm:block">{text}</span>
-      <ChevronRightIcon data-icon="inline-end" />
+      <RiArrowRightSLine data-icon="inline-end" />
     </PaginationLink>
   )
 }
@@ -111,7 +111,7 @@ function PaginationEllipsis({
       )}
       {...props}
     >
-      <MoreHorizontalIcon
+      <RiMoreLine
       />
       <span className="sr-only">More pages</span>
     </span>

components/ui/select.tsx

@@ -4,7 +4,7 @@ import * as React from "react"
 import { Select as SelectPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"
-import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from "lucide-react"
+import { RiArrowDownSLine, RiCheckLine, RiArrowUpSLine } from "@remixicon/react"
 
 function Select({
   ...props
@@ -51,7 +51,7 @@ function SelectTrigger({
     >
       {children}
       <SelectPrimitive.Icon asChild>
-        <ChevronDownIcon className="pointer-events-none size-4 text-muted-foreground" />
+        <RiArrowDownSLine className="pointer-events-none size-4 text-muted-foreground" />
       </SelectPrimitive.Icon>
     </SelectPrimitive.Trigger>
   )
@@ -119,7 +119,7 @@ function SelectItem({
     >
       <span className="pointer-events-none absolute right-2 flex size-4 items-center justify-center">
         <SelectPrimitive.ItemIndicator>
-          <CheckIcon className="pointer-events-none" />
+          <RiCheckLine className="pointer-events-none" />
         </SelectPrimitive.ItemIndicator>
       </span>
       <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
@@ -153,7 +153,7 @@ function SelectScrollUpButton({
       )}
       {...props}
     >
-      <ChevronUpIcon
+      <RiArrowUpSLine
       />
     </SelectPrimitive.ScrollUpButton>
   )
@@ -172,7 +172,7 @@ function SelectScrollDownButton({
       )}
       {...props}
     >
-      <ChevronDownIcon
+      <RiArrowDownSLine
       />
     </SelectPrimitive.ScrollDownButton>
   )

components/ui/sheet.tsx

@@ -5,7 +5,8 @@ import { Dialog as SheetPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"
 import { Button } from "@/components/ui/button"
-import { XIcon } from "lucide-react"
+import { DialogPortal } from "@/components/ui/dialog"
+import { RiCloseLine } from "@remixicon/react"
 
 function Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {
   return <SheetPrimitive.Root data-slot="sheet" {...props} />
@@ -26,7 +27,7 @@ function SheetClose({
 function SheetPortal({
   ...props
 }: React.ComponentProps<typeof SheetPrimitive.Portal>) {
-  return <SheetPrimitive.Portal data-slot="sheet-portal" {...props} />
+  return <DialogPortal data-slot="sheet-portal" {...props} />
 }
 
 function SheetOverlay({
@@ -50,14 +51,16 @@ function SheetContent({
   children,
   side = "right",
   showCloseButton = true,
+  overlayClassName,
   ...props
 }: React.ComponentProps<typeof SheetPrimitive.Content> & {
   side?: "top" | "right" | "bottom" | "left"
   showCloseButton?: boolean
+  overlayClassName?: string
 }) {
   return (
     <SheetPortal>
-      <SheetOverlay />
+      <SheetOverlay className={overlayClassName} />
       <SheetPrimitive.Content
         data-slot="sheet-content"
         data-side={side}
@@ -75,7 +78,7 @@ function SheetContent({
               className="absolute top-3 right-3"
               size="icon-sm"
             >
-              <XIcon
+              <RiCloseLine
               />
               <span className="sr-only">Close</span>
             </Button>

components/ui/sidebar.tsx

@@ -22,7 +22,7 @@ import {
   TooltipContent,
   TooltipTrigger,
 } from "@/components/ui/tooltip"
-import { PanelLeftIcon } from "lucide-react"
+import { RiSideBarLine } from "@remixicon/react"
 
 const SIDEBAR_COOKIE_NAME = "sidebar_state"
 const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7
@@ -270,7 +270,7 @@ function SidebarTrigger({
       }}
       {...props}
     >
-      <PanelLeftIcon />
+      <RiSideBarLine />
       <span className="sr-only">Toggle Sidebar</span>
     </Button>
   )

components/ui/sonner.tsx

@@ -2,7 +2,7 @@
 
 import { useTheme } from "next-themes"
 import { Toaster as Sonner, type ToasterProps } from "sonner"
-import { CircleCheckIcon, InfoIcon, TriangleAlertIcon, OctagonXIcon, Loader2Icon } from "lucide-react"
+import { RiCheckboxCircleLine, RiInformationLine, RiAlertLine, RiCloseCircleLine, RiLoader4Line } from "@remixicon/react"
 
 const Toaster = ({ ...props }: ToasterProps) => {
   const { theme = "system" } = useTheme()
@@ -13,19 +13,19 @@ const Toaster = ({ ...props }: ToasterProps) => {
       className="toaster group"
       icons={{
         success: (
-          <CircleCheckIcon className="size-4" />
+          <RiCheckboxCircleLine className="size-4" />
         ),
         info: (
-          <InfoIcon className="size-4" />
+          <RiInformationLine className="size-4" />
         ),
         warning: (
-          <TriangleAlertIcon className="size-4" />
+          <RiAlertLine className="size-4" />
         ),
         error: (
-          <OctagonXIcon className="size-4" />
+          <RiCloseCircleLine className="size-4" />
         ),
         loading: (
-          <Loader2Icon className="size-4 animate-spin" />
+          <RiLoader4Line className="size-4 animate-spin" />
         ),
       }}
       style={

components/ui/spinner.tsx

@@ -1,9 +1,9 @@
 import { cn } from "@/lib/utils"
-import { Loader2Icon } from "lucide-react"
+import { RiLoader4Line } from "@remixicon/react"
 
-function Spinner({ className, ...props }: React.ComponentProps<"svg">) {
+function Spinner({ className, ...props }: React.ComponentProps<typeof RiLoader4Line>) {
   return (
-    <Loader2Icon data-slot="spinner" role="status" aria-label="Loading" className={cn("size-4 animate-spin", className)} {...props} />
+    <RiLoader4Line data-slot="spinner" role="status" aria-label="Loading" className={cn("size-4 animate-spin", className)} {...props} />
   )
 }
 

lib/site.ts

@@ -0,0 +1,6 @@
+export const siteConfig = {
+  name: "Vertex — The Unified AI Gateway",
+  url: "http://localhost:3000",
+  description:
+    "Route, optimize, and observe every AI model request through one OpenAI-compatible API.",
+};

package.json

@@ -10,7 +10,8 @@
   },
   "dependencies": {
     "@base-ui/react": "^1.6.0",
-    "@next/swc-wasm-web": "16.2.10",
+    "@next/swc-wasm-web": "16.3.6",
+    "@remixicon/react": "^4.9.0",
     "@shadcn/react": "^0.1.0",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
@@ -18,9 +19,8 @@
     "cobe": "^0.6.4",
     "embla-carousel-react": "^8.6.0",
     "input-otp": "^1.4.2",
-    "lucide-react": "^1.22.0",
     "motion": "^13.3.0",
-    "next": "16.2.10",
+    "next": "16.3.6",
     "next-themes": "^0.4.6",
     "radix-ui": "^1.6.0",
     "react": "19.2.4",
@@ -42,7 +42,7 @@
     "@types/react-dom": "^19",
     "@types/react-is": "^19",
     "eslint": "^9",
-    "eslint-config-next": "16.2.9",
+    "eslint-config-next": "16.3.6",
     "tailwindcss": "^4",
     "typescript": "^5"
   },

public/logo.svg

@@ -1,3 +1,8 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="-3 3 24 24" fill="currentColor" fill-rule="evenodd">
-  <path transform="rotate(45 12 12)" d="M13.236 2.377 2.751 20.493H0L11.863 0l1.373 2.377Zm3.554 6.156-9.606 11.96H4.13L15.511 6.32l1.279 2.212Zm6.908 11.96H14.05l8.406-2.151 1.242 2.15Zm-3.42-5.922-7.843 5.92H8.482l10.597-7.997 1.2 2.077Z"/>
+  <g transform="rotate(45 12 12)">
+    <path d="M13.236 2.377 2.751 20.493H0L11.863 0l1.373 2.377Z"/>
+    <path d="M16.790 8.533 7.184 20.493H4.130L15.511 6.320l1.279 2.212Z"/>
+  </g>
+  <path d="M4.070494 16.081410 L16.928016 16.338560 L16.341956 18.526839 L6.315392 18.326308 Z"/>
+  <path d="M7.444111 19.455027 L15.518911 21.600000 L14.266277 26.277193 Z"/>
 </svg>

yarn.lock

@@ -447,7 +447,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@emnapi/runtime@npm:^1.10.0, @emnapi/runtime@npm:^1.7.0":
+"@emnapi/runtime@npm:^1.10.0":
   version: 1.11.1
   resolution: "@emnapi/runtime@npm:1.11.1"
   dependencies:
@@ -456,6 +456,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@emnapi/runtime@npm:^1.11.3":
+  version: 1.11.3
+  resolution: "@emnapi/runtime@npm:1.11.3"
+  dependencies:
+    tslib: "npm:^2.4.0"
+  checksum: 10c0/a00f1020fefb9d4145c367f93a9fddb383a00da8ffd7871e20b19659890379b83aeecb9f84d7d0eda5456343f4a09eb05b0acb5153b0d3d889539dedb1ed87c3
+  languageName: node
+  linkType: hard
+
 "@emnapi/wasi-threads@npm:1.2.1":
   version: 1.2.1
   resolution: "@emnapi/wasi-threads@npm:1.2.1"
@@ -474,7 +483,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@eslint-community/eslint-utils@npm:^4.8.0, @eslint-community/eslint-utils@npm:^4.9.1":
+"@eslint-community/eslint-utils@npm:4.9.1, @eslint-community/eslint-utils@npm:^4.8.0, @eslint-community/eslint-utils@npm:^4.9.1":
   version: 4.9.1
   resolution: "@eslint-community/eslint-utils@npm:4.9.1"
   dependencies:
@@ -650,18 +659,18 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@img/colour@npm:^1.0.0":
+"@img/colour@npm:^1.1.0":
   version: 1.1.0
   resolution: "@img/colour@npm:1.1.0"
   checksum: 10c0/2ebea2c0bbaee73b99badcefa04e1e71d83f36e5369337d3121dca841f4569533c4e2faddda6d62dd247f0d5cca143711f9446c59bcce81e427ba433a7a94a17
   languageName: node
   linkType: hard
 
-"@img/sharp-darwin-arm64@npm:0.34.5":
+"@img/sharp-darwin-arm64@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-darwin-arm64@npm:0.34.5"
+  resolution: "@img/sharp-darwin-arm64@npm:0.35.4"
   dependencies:
-    "@img/sharp-libvips-darwin-arm64": "npm:1.2.4"
+    "@img/sharp-libvips-darwin-arm64": "npm:1.3.3"
   dependenciesMeta:
     "@img/sharp-libvips-darwin-arm64":
       optional: true
@@ -669,11 +678,11 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@img/sharp-darwin-x64@npm:0.34.5":
+"@img/sharp-darwin-x64@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-darwin-x64@npm:0.34.5"
+  resolution: "@img/sharp-darwin-x64@npm:0.35.4"
   dependencies:
-    "@img/sharp-libvips-darwin-x64": "npm:1.2.4"
+    "@img/sharp-libvips-darwin-x64": "npm:1.3.3"
   dependenciesMeta:
     "@img/sharp-libvips-darwin-x64":
       optional: true
@@ -681,81 +690,90 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@img/sharp-libvips-darwin-arm64@npm:1.2.4":
+"@img/sharp-freebsd-wasm32@npm:0.35.4":
-  version: 1.2.4
+  version: 0.35.4
-  resolution: "@img/sharp-libvips-darwin-arm64@npm:1.2.4"
+  resolution: "@img/sharp-freebsd-wasm32@npm:0.35.4"
+  dependencies:
+    "@img/sharp-wasm32": "npm:0.35.4"
+  conditions: os=freebsd
+  languageName: node
+  linkType: hard
+
+"@img/sharp-libvips-darwin-arm64@npm:1.3.3":
+  version: 1.3.3
+  resolution: "@img/sharp-libvips-darwin-arm64@npm:1.3.3"
   conditions: os=darwin & cpu=arm64
   languageName: node
   linkType: hard
 
-"@img/sharp-libvips-darwin-x64@npm:1.2.4":
+"@img/sharp-libvips-darwin-x64@npm:1.3.3":
-  version: 1.2.4
+  version: 1.3.3
-  resolution: "@img/sharp-libvips-darwin-x64@npm:1.2.4"
+  resolution: "@img/sharp-libvips-darwin-x64@npm:1.3.3"
   conditions: os=darwin & cpu=x64
   languageName: node
   linkType: hard
 
-"@img/sharp-libvips-linux-arm64@npm:1.2.4":
+"@img/sharp-libvips-linux-arm64@npm:1.3.3":
-  version: 1.2.4
+  version: 1.3.3
-  resolution: "@img/sharp-libvips-linux-arm64@npm:1.2.4"
+  resolution: "@img/sharp-libvips-linux-arm64@npm:1.3.3"
   conditions: os=linux & cpu=arm64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@img/sharp-libvips-linux-arm@npm:1.2.4":
+"@img/sharp-libvips-linux-arm@npm:1.3.3":
-  version: 1.2.4
+  version: 1.3.3
-  resolution: "@img/sharp-libvips-linux-arm@npm:1.2.4"
+  resolution: "@img/sharp-libvips-linux-arm@npm:1.3.3"
   conditions: os=linux & cpu=arm & libc=glibc
   languageName: node
   linkType: hard
 
-"@img/sharp-libvips-linux-ppc64@npm:1.2.4":
+"@img/sharp-libvips-linux-ppc64@npm:1.3.3":
-  version: 1.2.4
+  version: 1.3.3
-  resolution: "@img/sharp-libvips-linux-ppc64@npm:1.2.4"
+  resolution: "@img/sharp-libvips-linux-ppc64@npm:1.3.3"
   conditions: os=linux & cpu=ppc64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@img/sharp-libvips-linux-riscv64@npm:1.2.4":
+"@img/sharp-libvips-linux-riscv64@npm:1.3.3":
-  version: 1.2.4
+  version: 1.3.3
-  resolution: "@img/sharp-libvips-linux-riscv64@npm:1.2.4"
+  resolution: "@img/sharp-libvips-linux-riscv64@npm:1.3.3"
   conditions: os=linux & cpu=riscv64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@img/sharp-libvips-linux-s390x@npm:1.2.4":
+"@img/sharp-libvips-linux-s390x@npm:1.3.3":
-  version: 1.2.4
+  version: 1.3.3
-  resolution: "@img/sharp-libvips-linux-s390x@npm:1.2.4"
+  resolution: "@img/sharp-libvips-linux-s390x@npm:1.3.3"
   conditions: os=linux & cpu=s390x & libc=glibc
   languageName: node
   linkType: hard
 
-"@img/sharp-libvips-linux-x64@npm:1.2.4":
+"@img/sharp-libvips-linux-x64@npm:1.3.3":
-  version: 1.2.4
+  version: 1.3.3
-  resolution: "@img/sharp-libvips-linux-x64@npm:1.2.4"
+  resolution: "@img/sharp-libvips-linux-x64@npm:1.3.3"
   conditions: os=linux & cpu=x64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@img/sharp-libvips-linuxmusl-arm64@npm:1.2.4":
+"@img/sharp-libvips-linuxmusl-arm64@npm:1.3.3":
-  version: 1.2.4
+  version: 1.3.3
-  resolution: "@img/sharp-libvips-linuxmusl-arm64@npm:1.2.4"
+  resolution: "@img/sharp-libvips-linuxmusl-arm64@npm:1.3.3"
   conditions: os=linux & cpu=arm64 & libc=musl
   languageName: node
   linkType: hard
 
-"@img/sharp-libvips-linuxmusl-x64@npm:1.2.4":
+"@img/sharp-libvips-linuxmusl-x64@npm:1.3.3":
-  version: 1.2.4
+  version: 1.3.3
-  resolution: "@img/sharp-libvips-linuxmusl-x64@npm:1.2.4"
+  resolution: "@img/sharp-libvips-linuxmusl-x64@npm:1.3.3"
   conditions: os=linux & cpu=x64 & libc=musl
   languageName: node
   linkType: hard
 
-"@img/sharp-linux-arm64@npm:0.34.5":
+"@img/sharp-linux-arm64@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-linux-arm64@npm:0.34.5"
+  resolution: "@img/sharp-linux-arm64@npm:0.35.4"
   dependencies:
-    "@img/sharp-libvips-linux-arm64": "npm:1.2.4"
+    "@img/sharp-libvips-linux-arm64": "npm:1.3.3"
   dependenciesMeta:
     "@img/sharp-libvips-linux-arm64":
       optional: true
@@ -763,11 +781,11 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@img/sharp-linux-arm@npm:0.34.5":
+"@img/sharp-linux-arm@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-linux-arm@npm:0.34.5"
+  resolution: "@img/sharp-linux-arm@npm:0.35.4"
   dependencies:
-    "@img/sharp-libvips-linux-arm": "npm:1.2.4"
+    "@img/sharp-libvips-linux-arm": "npm:1.3.3"
   dependenciesMeta:
     "@img/sharp-libvips-linux-arm":
       optional: true
@@ -775,11 +793,11 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@img/sharp-linux-ppc64@npm:0.34.5":
+"@img/sharp-linux-ppc64@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-linux-ppc64@npm:0.34.5"
+  resolution: "@img/sharp-linux-ppc64@npm:0.35.4"
   dependencies:
-    "@img/sharp-libvips-linux-ppc64": "npm:1.2.4"
+    "@img/sharp-libvips-linux-ppc64": "npm:1.3.3"
   dependenciesMeta:
     "@img/sharp-libvips-linux-ppc64":
       optional: true
@@ -787,11 +805,11 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@img/sharp-linux-riscv64@npm:0.34.5":
+"@img/sharp-linux-riscv64@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-linux-riscv64@npm:0.34.5"
+  resolution: "@img/sharp-linux-riscv64@npm:0.35.4"
   dependencies:
-    "@img/sharp-libvips-linux-riscv64": "npm:1.2.4"
+    "@img/sharp-libvips-linux-riscv64": "npm:1.3.3"
   dependenciesMeta:
     "@img/sharp-libvips-linux-riscv64":
       optional: true
@@ -799,11 +817,11 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@img/sharp-linux-s390x@npm:0.34.5":
+"@img/sharp-linux-s390x@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-linux-s390x@npm:0.34.5"
+  resolution: "@img/sharp-linux-s390x@npm:0.35.4"
   dependencies:
-    "@img/sharp-libvips-linux-s390x": "npm:1.2.4"
+    "@img/sharp-libvips-linux-s390x": "npm:1.3.3"
   dependenciesMeta:
     "@img/sharp-libvips-linux-s390x":
       optional: true
@@ -811,11 +829,11 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@img/sharp-linux-x64@npm:0.34.5":
+"@img/sharp-linux-x64@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-linux-x64@npm:0.34.5"
+  resolution: "@img/sharp-linux-x64@npm:0.35.4"
   dependencies:
-    "@img/sharp-libvips-linux-x64": "npm:1.2.4"
+    "@img/sharp-libvips-linux-x64": "npm:1.3.3"
   dependenciesMeta:
     "@img/sharp-libvips-linux-x64":
       optional: true
@@ -823,11 +841,11 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@img/sharp-linuxmusl-arm64@npm:0.34.5":
+"@img/sharp-linuxmusl-arm64@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-linuxmusl-arm64@npm:0.34.5"
+  resolution: "@img/sharp-linuxmusl-arm64@npm:0.35.4"
   dependencies:
-    "@img/sharp-libvips-linuxmusl-arm64": "npm:1.2.4"
+    "@img/sharp-libvips-linuxmusl-arm64": "npm:1.3.3"
   dependenciesMeta:
     "@img/sharp-libvips-linuxmusl-arm64":
       optional: true
@@ -835,11 +853,11 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@img/sharp-linuxmusl-x64@npm:0.34.5":
+"@img/sharp-linuxmusl-x64@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-linuxmusl-x64@npm:0.34.5"
+  resolution: "@img/sharp-linuxmusl-x64@npm:0.35.4"
   dependencies:
-    "@img/sharp-libvips-linuxmusl-x64": "npm:1.2.4"
+    "@img/sharp-libvips-linuxmusl-x64": "npm:1.3.3"
   dependenciesMeta:
     "@img/sharp-libvips-linuxmusl-x64":
       optional: true
@@ -847,32 +865,41 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@img/sharp-wasm32@npm:0.34.5":
+"@img/sharp-wasm32@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-wasm32@npm:0.34.5"
+  resolution: "@img/sharp-wasm32@npm:0.35.4"
   dependencies:
-    "@emnapi/runtime": "npm:^1.7.0"
+    "@emnapi/runtime": "npm:^1.11.3"
+  checksum: 10c0/7f5e394f168eb2f038b8ae4949fb5434085d1db931ede2ae1389479d7a1dbe11e2fc9d58e8e9830bff744ba996256c9e411be1d466dfcbf6e1f4d153b84f25ff
+  languageName: node
+  linkType: hard
+
+"@img/sharp-webcontainers-wasm32@npm:0.35.4":
+  version: 0.35.4
+  resolution: "@img/sharp-webcontainers-wasm32@npm:0.35.4"
+  dependencies:
+    "@img/sharp-wasm32": "npm:0.35.4"
   conditions: cpu=wasm32
   languageName: node
   linkType: hard
 
-"@img/sharp-win32-arm64@npm:0.34.5":
+"@img/sharp-win32-arm64@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-win32-arm64@npm:0.34.5"
+  resolution: "@img/sharp-win32-arm64@npm:0.35.4"
   conditions: os=win32 & cpu=arm64
   languageName: node
   linkType: hard
 
-"@img/sharp-win32-ia32@npm:0.34.5":
+"@img/sharp-win32-ia32@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-win32-ia32@npm:0.34.5"
+  resolution: "@img/sharp-win32-ia32@npm:0.35.4"
   conditions: os=win32 & cpu=ia32
   languageName: node
   linkType: hard
 
-"@img/sharp-win32-x64@npm:0.34.5":
+"@img/sharp-win32-x64@npm:0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "@img/sharp-win32-x64@npm:0.34.5"
+  resolution: "@img/sharp-win32-x64@npm:0.35.4"
   conditions: os=win32 & cpu=x64
   languageName: node
   linkType: hard
@@ -966,81 +993,82 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@next/env@npm:16.2.10":
+"@next/env@npm:16.3.6":
-  version: 16.2.10
+  version: 16.3.6
-  resolution: "@next/env@npm:16.2.10"
+  resolution: "@next/env@npm:16.3.6"
-  checksum: 10c0/712d2aaa313e133c86103772015da2393e1d68092b55ac4c8842d5b7205d2152acf2098eaed5137e39979ad0c26dd951e82bc3ab43c2beb33a4f88498051d574
+  checksum: 10c0/febd44cb159f1d9ecddcde54c6b1ca261274d53745945410bf552f62d405a49029719b1f1e30783dcb08cc2f61d69c00e4340bdcb5472e5519bd86ff6543226c
   languageName: node
   linkType: hard
 
-"@next/eslint-plugin-next@npm:16.2.9":
+"@next/eslint-plugin-next@npm:16.3.6":
-  version: 16.2.9
+  version: 16.3.6
-  resolution: "@next/eslint-plugin-next@npm:16.2.9"
+  resolution: "@next/eslint-plugin-next@npm:16.3.6"
   dependencies:
+    "@eslint-community/eslint-utils": "npm:4.9.1"
     fast-glob: "npm:3.3.1"
-  checksum: 10c0/74501333ce844ec02f2518c98859a42d3db1bcae3e7365a2c0f6691d38621719783d285572a23ca1c3edd2801f9805c073d6e572990e70a11f2e894361774f69
+  checksum: 10c0/f78b03376db616dd12cfd9c511a2d0d4fadea41e72e01d21fac6df50ac29bbaefb14aebb7f2a87215ee9526fea8e78de18e674e483f658c6cd3ee8c38eaf7687
   languageName: node
   linkType: hard
 
-"@next/swc-darwin-arm64@npm:16.2.10":
+"@next/swc-darwin-arm64@npm:16.3.6":
-  version: 16.2.10
+  version: 16.3.6
-  resolution: "@next/swc-darwin-arm64@npm:16.2.10"
+  resolution: "@next/swc-darwin-arm64@npm:16.3.6"
   conditions: os=darwin & cpu=arm64
   languageName: node
   linkType: hard
 
-"@next/swc-darwin-x64@npm:16.2.10":
+"@next/swc-darwin-x64@npm:16.3.6":
-  version: 16.2.10
+  version: 16.3.6
-  resolution: "@next/swc-darwin-x64@npm:16.2.10"
+  resolution: "@next/swc-darwin-x64@npm:16.3.6"
   conditions: os=darwin & cpu=x64
   languageName: node
   linkType: hard
 
-"@next/swc-linux-arm64-gnu@npm:16.2.10":
+"@next/swc-linux-arm64-gnu@npm:16.3.6":
-  version: 16.2.10
+  version: 16.3.6
-  resolution: "@next/swc-linux-arm64-gnu@npm:16.2.10"
+  resolution: "@next/swc-linux-arm64-gnu@npm:16.3.6"
   conditions: os=linux & cpu=arm64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@next/swc-linux-arm64-musl@npm:16.2.10":
+"@next/swc-linux-arm64-musl@npm:16.3.6":
-  version: 16.2.10
+  version: 16.3.6
-  resolution: "@next/swc-linux-arm64-musl@npm:16.2.10"
+  resolution: "@next/swc-linux-arm64-musl@npm:16.3.6"
   conditions: os=linux & cpu=arm64 & libc=musl
   languageName: node
   linkType: hard
 
-"@next/swc-linux-x64-gnu@npm:16.2.10":
+"@next/swc-linux-x64-gnu@npm:16.3.6":
-  version: 16.2.10
+  version: 16.3.6
-  resolution: "@next/swc-linux-x64-gnu@npm:16.2.10"
+  resolution: "@next/swc-linux-x64-gnu@npm:16.3.6"
   conditions: os=linux & cpu=x64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@next/swc-linux-x64-musl@npm:16.2.10":
+"@next/swc-linux-x64-musl@npm:16.3.6":
-  version: 16.2.10
+  version: 16.3.6
-  resolution: "@next/swc-linux-x64-musl@npm:16.2.10"
+  resolution: "@next/swc-linux-x64-musl@npm:16.3.6"
   conditions: os=linux & cpu=x64 & libc=musl
   languageName: node
   linkType: hard
 
-"@next/swc-wasm-web@npm:16.2.10":
+"@next/swc-wasm-web@npm:16.3.6":
-  version: 16.2.10
+  version: 16.3.6
-  resolution: "@next/swc-wasm-web@npm:16.2.10"
+  resolution: "@next/swc-wasm-web@npm:16.3.6"
-  checksum: 10c0/cec051e5e167951f558d00109abd8dc9a9ebacbf3946033add2fa9ba9f2c1775e9f64c32c812cad23dfc6ee00cb1d4f93b4e4416358cd2f124058e53a7ade4ac
+  checksum: 10c0/a7a4937b409842226e287a68f6bdfa048e80707363acb808df7cc619a548df02d4bda9f4e8cd33230a51886c4e607f13aa5c8938fb45de74b11b666be3eef420
   languageName: node
   linkType: hard
 
-"@next/swc-win32-arm64-msvc@npm:16.2.10":
+"@next/swc-win32-arm64-msvc@npm:16.3.6":
-  version: 16.2.10
+  version: 16.3.6
-  resolution: "@next/swc-win32-arm64-msvc@npm:16.2.10"
+  resolution: "@next/swc-win32-arm64-msvc@npm:16.3.6"
   conditions: os=win32 & cpu=arm64
   languageName: node
   linkType: hard
 
-"@next/swc-win32-x64-msvc@npm:16.2.10":
+"@next/swc-win32-x64-msvc@npm:16.3.6":
-  version: 16.2.10
+  version: 16.3.6
-  resolution: "@next/swc-win32-x64-msvc@npm:16.2.10"
+  resolution: "@next/swc-win32-x64-msvc@npm:16.3.6"
   conditions: os=win32 & cpu=x64
   languageName: node
   linkType: hard
@@ -2392,6 +2420,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@remixicon/react@npm:^4.9.0":
+  version: 4.9.0
+  resolution: "@remixicon/react@npm:4.9.0"
+  peerDependencies:
+    react: ">=18.2.0"
+  checksum: 10c0/91bbadb677f45cf8b6687fdf9d273511fddb4e862f1da6c11bc7932acb578bcb26ae5b9e1eb62143a4e916b71797739a36d689866d5b0949f0f0f22c1684cb96
+  languageName: node
+  linkType: hard
+
 "@rtsao/scc@npm:^1.1.0":
   version: 1.1.0
   resolution: "@rtsao/scc@npm:1.1.0"
@@ -2442,12 +2479,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@swc/helpers@npm:0.5.15":
+"@swc/helpers@npm:0.5.23":
-  version: 0.5.15
+  version: 0.5.23
-  resolution: "@swc/helpers@npm:0.5.15"
+  resolution: "@swc/helpers@npm:0.5.23"
   dependencies:
     tslib: "npm:^2.8.0"
-  checksum: 10c0/33002f74f6f885f04c132960835fdfc474186983ea567606db62e86acd0680ca82f34647e8e610f4e1e422d1c16fce729dde22cd3b797ab1fd9061a825dabca4
+  checksum: 10c0/02da7b4df465693933ecd4851cc193ec729c309939c8a84eccae5ec0010aafc3894e713b8ef8d13a6ba401759f0e900c88e2dcfef5872c27bb91e70f73275cce
   languageName: node
   linkType: hard
 
@@ -4401,11 +4438,11 @@ __metadata:
   languageName: node
   linkType: hard
 
-"eslint-config-next@npm:16.2.9":
+"eslint-config-next@npm:16.3.6":
-  version: 16.2.9
+  version: 16.3.6
-  resolution: "eslint-config-next@npm:16.2.9"
+  resolution: "eslint-config-next@npm:16.3.6"
   dependencies:
-    "@next/eslint-plugin-next": "npm:16.2.9"
+    "@next/eslint-plugin-next": "npm:16.3.6"
     eslint-import-resolver-node: "npm:^0.3.6"
     eslint-import-resolver-typescript: "npm:^3.5.2"
     eslint-plugin-import: "npm:^2.32.0"
@@ -4420,7 +4457,7 @@ __metadata:
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 10c0/266764e180cc2aa75fe0c357218a24d7f9ebc28e2d7f6195080ca90052373181605a942be1c14c8018e4302859758f2d28c87200236396bf9d5de1cc1badc2a0
+  checksum: 10c0/59e2efef2398976b034ce21d06d8ac217889888c60814f6dc3b62314cd375b02f85a4fc628826c5f17f0301e7382f27a65db27d6846eac8988eb6019e5dd6dbb
   languageName: node
   linkType: hard
 
@@ -6211,15 +6248,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"lucide-react@npm:^1.22.0":
-  version: 1.22.0
-  resolution: "lucide-react@npm:1.22.0"
-  peerDependencies:
-    react: ^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0
-  checksum: 10c0/6d7066773c2d5f1a3e8f274d4544d2e6fb133f284c843ce89c041c7d2d6e265e5bed48c057724553405bdc4c943547642ceac25c2b807d5efbb1e75d0127de92
-  languageName: node
-  linkType: hard
-
 "magic-string@npm:^0.30.21":
   version: 0.30.21
   resolution: "magic-string@npm:0.30.21"
@@ -6377,7 +6405,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"nanoid@npm:^3.3.12, nanoid@npm:^3.3.6":
+"nanoid@npm:^3.3.12":
   version: 3.3.15
   resolution: "nanoid@npm:3.3.15"
   bin:
@@ -6428,24 +6456,24 @@ __metadata:
   languageName: node
   linkType: hard
 
-"next@npm:16.2.10":
+"next@npm:16.3.6":
-  version: 16.2.10
+  version: 16.3.6
-  resolution: "next@npm:16.2.10"
+  resolution: "next@npm:16.3.6"
   dependencies:
-    "@next/env": "npm:16.2.10"
+    "@next/env": "npm:16.3.6"
-    "@next/swc-darwin-arm64": "npm:16.2.10"
+    "@next/swc-darwin-arm64": "npm:16.3.6"
-    "@next/swc-darwin-x64": "npm:16.2.10"
+    "@next/swc-darwin-x64": "npm:16.3.6"
-    "@next/swc-linux-arm64-gnu": "npm:16.2.10"
+    "@next/swc-linux-arm64-gnu": "npm:16.3.6"
-    "@next/swc-linux-arm64-musl": "npm:16.2.10"
+    "@next/swc-linux-arm64-musl": "npm:16.3.6"
-    "@next/swc-linux-x64-gnu": "npm:16.2.10"
+    "@next/swc-linux-x64-gnu": "npm:16.3.6"
-    "@next/swc-linux-x64-musl": "npm:16.2.10"
+    "@next/swc-linux-x64-musl": "npm:16.3.6"
-    "@next/swc-win32-arm64-msvc": "npm:16.2.10"
+    "@next/swc-win32-arm64-msvc": "npm:16.3.6"
-    "@next/swc-win32-x64-msvc": "npm:16.2.10"
+    "@next/swc-win32-x64-msvc": "npm:16.3.6"
-    "@swc/helpers": "npm:0.5.15"
+    "@swc/helpers": "npm:0.5.23"
     baseline-browser-mapping: "npm:^2.9.19"
     caniuse-lite: "npm:^1.0.30001579"
-    postcss: "npm:8.4.31"
+    postcss: "npm:8.5.23"
-    sharp: "npm:^0.34.5"
+    sharp: "npm:^0.35.4"
     styled-jsx: "npm:5.1.6"
   peerDependencies:
     "@opentelemetry/api": ^1.1.0
@@ -6484,7 +6512,7 @@ __metadata:
       optional: true
   bin:
     next: dist/bin/next
-  checksum: 10c0/e242f60b3caaf05bdf62a9ca85cea774f3081e1e900ac9ffe5b5975ca10584a904cf566873812abf1f25b965ef3de6451e7790e947800616909c2d4ecb54d1b9
+  checksum: 10c0/a67c2f34374d495e9b9cd7a7825404f50713012ee8653dc9cf3f454adba48a2303d3424c70c5a40fe1f421f65e3e10175a17604acb86106242ff65c59e115e56
   languageName: node
   linkType: hard
 
@@ -6493,7 +6521,8 @@ __metadata:
   resolution: "nextjs-vercel@workspace:."
   dependencies:
     "@base-ui/react": "npm:^1.6.0"
-    "@next/swc-wasm-web": "npm:16.2.10"
+    "@next/swc-wasm-web": "npm:16.3.6"
+    "@remixicon/react": "npm:^4.9.0"
     "@shadcn/react": "npm:^0.1.0"
     "@tailwindcss/postcss": "npm:^4"
     "@types/node": "npm:^20"
@@ -6506,11 +6535,10 @@ __metadata:
     cobe: "npm:^0.6.4"
     embla-carousel-react: "npm:^8.6.0"
     eslint: "npm:^9"
-    eslint-config-next: "npm:16.2.9"
+    eslint-config-next: "npm:16.3.6"
     input-otp: "npm:^1.4.2"
-    lucide-react: "npm:^1.22.0"
     motion: "npm:^13.3.0"
-    next: "npm:16.2.10"
+    next: "npm:16.3.6"
     next-themes: "npm:^0.4.6"
     radix-ui: "npm:^1.6.0"
     react: "npm:19.2.4"
@@ -6900,7 +6928,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"picocolors@npm:^1.0.0, picocolors@npm:^1.1.1":
+"picocolors@npm:^1.1.1":
   version: 1.1.1
   resolution: "picocolors@npm:1.1.1"
   checksum: 10c0/e2e3e8170ab9d7c7421969adaa7e1b31434f789afb9b3f115f6b96d91945041ac3ceb02e9ec6fe6510ff036bcc0bf91e69a1772edc0b707e12b19c0f2d6bcf58
@@ -6954,17 +6982,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"postcss@npm:8.4.31":
-  version: 8.4.31
-  resolution: "postcss@npm:8.4.31"
-  dependencies:
-    nanoid: "npm:^3.3.6"
-    picocolors: "npm:^1.0.0"
-    source-map-js: "npm:^1.0.2"
-  checksum: 10c0/748b82e6e5fc34034dcf2ae88ea3d11fd09f69b6c50ecdd3b4a875cfc7cdca435c958b211e2cb52355422ab6fccb7d8f2f2923161d7a1b281029e4a913d59acf
-  languageName: node
-  linkType: hard
-
 "postcss@npm:8.5.15":
   version: 8.5.15
   resolution: "postcss@npm:8.5.15"
@@ -6976,6 +6993,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"postcss@npm:8.5.23":
+  version: 8.5.23
+  resolution: "postcss@npm:8.5.23"
+  dependencies:
+    nanoid: "npm:^3.3.16"
+    picocolors: "npm:^1.1.1"
+    source-map-js: "npm:^1.2.1"
+  checksum: 10c0/ed714e635b330bb42666ecdd0c0b4f30224ded15b0b0052d6bc2b92832f2cf17d1c1141359453f96f0a84f8fbf4c405a74df187f559163b8f31131b2535455aa
+  languageName: node
+  linkType: hard
+
 "postcss@npm:^8.5.6":
   version: 8.5.22
   resolution: "postcss@npm:8.5.22"
@@ -7544,7 +7572,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"semver@npm:^7.3.5, semver@npm:^7.7.1, semver@npm:^7.7.3":
+"semver@npm:^7.3.5, semver@npm:^7.7.1, semver@npm:^7.7.3, semver@npm:^7.8.5":
   version: 7.8.5
   resolution: "semver@npm:7.8.5"
   bin:
@@ -7670,42 +7698,45 @@ __metadata:
   languageName: node
   linkType: hard
 
-"sharp@npm:^0.34.5":
+"sharp@npm:^0.35.4":
-  version: 0.34.5
+  version: 0.35.4
-  resolution: "sharp@npm:0.34.5"
+  resolution: "sharp@npm:0.35.4"
   dependencies:
-    "@img/colour": "npm:^1.0.0"
+    "@img/colour": "npm:^1.1.0"
-    "@img/sharp-darwin-arm64": "npm:0.34.5"
+    "@img/sharp-darwin-arm64": "npm:0.35.4"
-    "@img/sharp-darwin-x64": "npm:0.34.5"
+    "@img/sharp-darwin-x64": "npm:0.35.4"
-    "@img/sharp-libvips-darwin-arm64": "npm:1.2.4"
+    "@img/sharp-freebsd-wasm32": "npm:0.35.4"
-    "@img/sharp-libvips-darwin-x64": "npm:1.2.4"
+    "@img/sharp-libvips-darwin-arm64": "npm:1.3.3"
-    "@img/sharp-libvips-linux-arm": "npm:1.2.4"
+    "@img/sharp-libvips-darwin-x64": "npm:1.3.3"
-    "@img/sharp-libvips-linux-arm64": "npm:1.2.4"
+    "@img/sharp-libvips-linux-arm": "npm:1.3.3"
-    "@img/sharp-libvips-linux-ppc64": "npm:1.2.4"
+    "@img/sharp-libvips-linux-arm64": "npm:1.3.3"
-    "@img/sharp-libvips-linux-riscv64": "npm:1.2.4"
+    "@img/sharp-libvips-linux-ppc64": "npm:1.3.3"
-    "@img/sharp-libvips-linux-s390x": "npm:1.2.4"
+    "@img/sharp-libvips-linux-riscv64": "npm:1.3.3"
-    "@img/sharp-libvips-linux-x64": "npm:1.2.4"
+    "@img/sharp-libvips-linux-s390x": "npm:1.3.3"
-    "@img/sharp-libvips-linuxmusl-arm64": "npm:1.2.4"
+    "@img/sharp-libvips-linux-x64": "npm:1.3.3"
-    "@img/sharp-libvips-linuxmusl-x64": "npm:1.2.4"
+    "@img/sharp-libvips-linuxmusl-arm64": "npm:1.3.3"
-    "@img/sharp-linux-arm": "npm:0.34.5"
+    "@img/sharp-libvips-linuxmusl-x64": "npm:1.3.3"
-    "@img/sharp-linux-arm64": "npm:0.34.5"
+    "@img/sharp-linux-arm": "npm:0.35.4"
-    "@img/sharp-linux-ppc64": "npm:0.34.5"
+    "@img/sharp-linux-arm64": "npm:0.35.4"
-    "@img/sharp-linux-riscv64": "npm:0.34.5"
+    "@img/sharp-linux-ppc64": "npm:0.35.4"
-    "@img/sharp-linux-s390x": "npm:0.34.5"
+    "@img/sharp-linux-riscv64": "npm:0.35.4"
-    "@img/sharp-linux-x64": "npm:0.34.5"
+    "@img/sharp-linux-s390x": "npm:0.35.4"
-    "@img/sharp-linuxmusl-arm64": "npm:0.34.5"
+    "@img/sharp-linux-x64": "npm:0.35.4"
-    "@img/sharp-linuxmusl-x64": "npm:0.34.5"
+    "@img/sharp-linuxmusl-arm64": "npm:0.35.4"
-    "@img/sharp-wasm32": "npm:0.34.5"
+    "@img/sharp-linuxmusl-x64": "npm:0.35.4"
-    "@img/sharp-win32-arm64": "npm:0.34.5"
+    "@img/sharp-webcontainers-wasm32": "npm:0.35.4"
-    "@img/sharp-win32-ia32": "npm:0.34.5"
+    "@img/sharp-win32-arm64": "npm:0.35.4"
-    "@img/sharp-win32-x64": "npm:0.34.5"
+    "@img/sharp-win32-ia32": "npm:0.35.4"
+    "@img/sharp-win32-x64": "npm:0.35.4"
     detect-libc: "npm:^2.1.2"
-    semver: "npm:^7.7.3"
+    semver: "npm:^7.8.5"
   dependenciesMeta:
     "@img/sharp-darwin-arm64":
       optional: true
     "@img/sharp-darwin-x64":
       optional: true
+    "@img/sharp-freebsd-wasm32":
+      optional: true
     "@img/sharp-libvips-darwin-arm64":
       optional: true
     "@img/sharp-libvips-darwin-x64":
@@ -7742,7 +7773,7 @@ __metadata:
       optional: true
     "@img/sharp-linuxmusl-x64":
       optional: true
-    "@img/sharp-wasm32":
+    "@img/sharp-webcontainers-wasm32":
       optional: true
     "@img/sharp-win32-arm64":
       optional: true
@@ -7750,7 +7781,10 @@ __metadata:
       optional: true
     "@img/sharp-win32-x64":
       optional: true
-  checksum: 10c0/fd79e29df0597a7d5704b8461c51f944ead91a5243691697be6e8243b966402beda53ddc6f0a53b96ea3cb8221f0b244aa588114d3ebf8734fb4aefd41ab802f
+  peerDependenciesMeta:
+    "@types/node":
+      optional: true
+  checksum: 10c0/dbcc0909200cbff98e82805c86085b94afbd45f373897a04b21e52e9bbc1671dc64970350dd3cb6b2d0970f3444be7100d728005dc6620e39b599269ed7e15eb
   languageName: node
   linkType: hard
 
@@ -7849,7 +7883,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"source-map-js@npm:^1.0.2, source-map-js@npm:^1.2.1":
+"source-map-js@npm:^1.2.1":
   version: 1.2.1
   resolution: "source-map-js@npm:1.2.1"
   checksum: 10c0/7bda1fc4c197e3c6ff17de1b8b2c20e60af81b63a52cb32ec5a5d67a20a7d42651e2cb34ebe93833c5a2a084377e17455854fee3e21e7925c64a51b6a52b0faf