Update hero title, add Utilities and Documentation to navbar, fix siteConfig name

- Hero title: The Developer Toolkit for Polkadot
- Navbar: add Utilities and Documentation links (desktop + mobile)
- Fix siteConfig.name to short Relaycode for navbar display
- Move full SEO title to constructMetadata default

Author: itsyogesh

components/layout/main-nav.tsx

@@ -58,6 +58,24 @@ export function MainNav({ items, children }: MainNavProps) {
         >
           Studio
         </Link>
+        <Link
+          href="/tools"
+          className={cn(
+            "flex items-center font-heading text-xl font-semibold transition-colors hover:text-foreground/80 sm:text-sm",
+            pathname?.startsWith("/tools") ? "text-foreground" : "text-foreground/60"
+          )}
+        >
+          Utilities
+        </Link>
+        <Link
+          href="/docs"
+          className={cn(
+            "flex items-center font-heading text-xl font-semibold transition-colors hover:text-foreground/80 sm:text-sm",
+            pathname?.startsWith("/docs") ? "text-foreground" : "text-foreground/60"
+          )}
+        >
+          Documentation
+        </Link>
         {items?.map((item, index) => (
           <Link
             key={index}
@@ -109,6 +127,20 @@ export function MainNav({ items, children }: MainNavProps) {
               >
                 Studio
               </Link>
+              <Link
+                href="/tools"
+                onClick={() => setOpen(false)}
+                className="flex w-full items-center rounded-md px-3 py-2 text-sm font-medium hover:bg-accent"
+              >
+                Utilities
+              </Link>
+              <Link
+                href="/docs"
+                onClick={() => setOpen(false)}
+                className="flex w-full items-center rounded-md px-3 py-2 text-sm font-medium hover:bg-accent"
+              >
+                Documentation
+              </Link>
               {(items ?? []).map((item, index) => (
                 <Link
                   key={index}

components/sections/hero-section.tsx

@@ -38,7 +38,7 @@ export function HeroSection() {
 
             {/* Main content */}
             <h1 className="text-4xl font-semibold tracking-tight font-heading sm:text-6xl bg-clip-text text-transparent bg-gradient-to-r from-[#FF2670] to-[#7916F3] pb-4">
-              <Balancer>Polkadot Extrinsics, Simplified</Balancer>
+              <Balancer>The Developer Toolkit for Polkadot</Balancer>
             </h1>
             <p className="mt-4 text-md sm:text-lg leading-8 text-muted-foreground max-w-2xl">
               <Balancer>

config/site.ts

@@ -4,7 +4,7 @@ import { env } from "@/env.mjs";
 const site_url = env.NEXT_PUBLIC_APP_URL;
 
 export const siteConfig: SiteConfig = {
-  name: "Relaycode — The Developer Toolkit for Polkadot",
+  name: "Relaycode",
   description:
     "Build extrinsics, write smart contracts, and interact with Substrate chains. Browser-based tools for the Polkadot ecosystem.",
   url: site_url,

lib/utils.ts

@@ -10,7 +10,7 @@ export function cn(...inputs: ClassValue[]) {
 }
 
 export function constructMetadata({
-  title = siteConfig.name,
+  title = "Relaycode - The Developer Toolkit for Polkadot",
   description = siteConfig.description,
   image = siteConfig.ogImage,
   icons = "/favicon.ico",