Add Navbar component with TigerGraph\u00d7Claude branding

web/src/components/Navbar.tsx

@@ -0,0 +1,57 @@
+"use client";
+
+import { useState } from "react";
+
+export function Navbar() {
+  const [mobileOpen, setMobileOpen] = useState(false);
+
+  return (
+    <nav className="navbar">
+      {/* Logo */}
+      <div className="flex items-center gap-3">
+        {/* Tiger spike mark */}
+        <svg width="28" height="28" viewBox="0 0 28 28" fill="none">
+          <circle cx="14" cy="14" r="13" stroke="#FF6B00" strokeWidth="2" />
+          <path d="M14 4L14 24M4 14L24 14M7 7L21 21M21 7L7 21" stroke="#FF6B00" strokeWidth="1.5" strokeLinecap="round" />
+        </svg>
+        <span className="title-lg" style={{ color: "#002B49" }}>
+          Graph<span style={{ color: "#FF6B00" }}>RAG</span>
+        </span>
+        <span className="badge-outline text-xs hidden sm:inline-flex">Hackathon</span>
+      </div>
+
+      {/* Desktop Nav */}
+      <div className="hidden md:flex items-center gap-6">
+        <a href="#live" className="body-sm hover:text-tiger-orange transition-colors" style={{ color: "#6c6a64" }}>Live Compare</a>
+        <a href="#benchmark" className="body-sm hover:text-tiger-orange transition-colors" style={{ color: "#6c6a64" }}>Benchmark</a>
+        <a href="#cost" className="body-sm hover:text-tiger-orange transition-colors" style={{ color: "#6c6a64" }}>Cost Analysis</a>
+        <a href="#graph" className="body-sm hover:text-tiger-orange transition-colors" style={{ color: "#6c6a64" }}>Graph Explorer</a>
+      </div>
+
+      {/* CTA */}
+      <div className="flex items-center gap-3">
+        <span className="caption hidden lg:block" style={{ color: "#6c6a64" }}>
+          Powered by TigerGraph + Claude
+        </span>
+        <button className="btn btn-primary btn-sm">
+          Try Demo
+        </button>
+      </div>
+
+      {/* Mobile hamburger */}
+      <button
+        className="btn-ghost md:hidden"
+        onClick={() => setMobileOpen(!mobileOpen)}
+        aria-label="Toggle menu"
+      >
+        <svg width="20" height="20" viewBox="0 0 20 20" fill="currentColor">
+          {mobileOpen ? (
+            <path d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" />
+          ) : (
+            <path d="M3 5h14M3 10h14M3 15h14" stroke="currentColor" strokeWidth="2" strokeLinecap="round" fill="none" />
+          )}
+        </svg>
+      </button>
+    </nav>
+  );
+}