fix(website): phase 2 & 3 visual audit — a11y, UX, SEO, perf, playground

.trivyignore

@@ -0,0 +1,10 @@
+# Trivy vulnerability ignore file
+# Format: <advisory-id> [expiry-date] [comment]
+# See: https://aquasecurity.github.io/trivy/latest/docs/configuration/filtering/#trivyignore
+
+# GHSA-6g7g-w4f8-9c9x — buger/jsonparser v1.1.1
+# Severity: MEDIUM | No fixed version available (latest is v1.1.1, released 2021-01-08)
+# Transitive dependency: mark3labs/mcp-go → invopop/jsonschema → wk8/go-ordered-map → buger/jsonparser
+# Not called directly by any GoSQLX code. Risk is scoped to MCP JSON schema generation.
+# Re-evaluate when buger/jsonparser releases a patched version or when mcp-go updates its dependency.
+GHSA-6g7g-w4f8-9c9x

website/package.json

@@ -24,7 +24,7 @@
     "framer-motion": "^12.36.0",
     "fuse.js": "^7.1.0",
     "gray-matter": "^4.0.3",
-    "next": "16.1.6",
+    "next": "16.1.7",
     "next-mdx-remote": "^6.0.0",
     "react": "19.2.3",
     "react-dom": "19.2.3",

website/src/app/benchmarks/BenchmarksContent.tsx

@@ -132,7 +132,7 @@ export function BenchmarksContent() {
                     </tr>
                   </thead>
                   <tbody>
-                    <tr className="border-b border-white/[0.04] transition-colors bg-indigo-500/5 border-l-2 border-l-indigo-500">
+                    <tr className="border-b border-white/[0.04] transition-colors bg-indigo-500/10 border-l-2 border-l-indigo-500">
                       <td className="px-6 py-4 text-white font-medium">
                         GoSQLX{' '}
                         <span className="ml-2 inline-block rounded-full bg-indigo-500/20 px-2 py-0.5 text-xs font-medium text-indigo-300">
@@ -184,7 +184,7 @@ export function BenchmarksContent() {
       </section>
 
       {/* Methodology */}
-      <section className="section-padding pb-24">
+      <section className="section-padding pb-8">
         <div className="container-width max-w-2xl">
           <FadeIn>
             <h2 className="text-2xl font-bold text-white mb-6">Methodology</h2>

website/src/app/blog/page.tsx

@@ -4,7 +4,15 @@ import { BlogList } from './BlogList';
 
 export const metadata: Metadata = {
   title: 'Changelog',
-  description: 'GoSQLX changelog. Track new features, improvements, and bug fixes across all versions.',
+  description: 'GoSQLX changelog — new features, improvements, and bug fixes across all versions of the SQL parsing SDK.',
+  alternates: {
+    canonical: '/blog/',
+  },
+  openGraph: {
+    title: 'GoSQLX Changelog',
+    description: 'New features, improvements, and bug fixes across all GoSQLX versions.',
+    url: '/blog/',
+  },
 };
 
 export default function BlogPage() {

website/src/app/docs/[...slug]/page.tsx

@@ -105,18 +105,22 @@ export default async function DocPage({ params }: PageProps) {
       {/* Main content */}
       <main className="min-w-0 flex-1 px-6 py-10 lg:px-12">
         {/* Breadcrumbs */}
-        <nav className="mb-6 flex items-center gap-2 text-sm text-zinc-500">
-          <Link href="/docs" className="hover:text-white transition-colors">
-            Docs
-          </Link>
-          {categoryItem && (
-            <>
-              <span>/</span>
-              <span>{categoryItem.category}</span>
-            </>
-          )}
-          <span>/</span>
-          <span className="text-zinc-300">{doc.title}</span>
+        <nav aria-label="Breadcrumb" className="mb-6 text-sm text-zinc-500">
+          <ol className="flex items-center gap-2">
+            <li>
+              <Link href="/docs" className="hover:text-white transition-colors">
+                Docs
+              </Link>
+            </li>
+            {categoryItem && (
+              <>
+                <li aria-hidden="true">/</li>
+                <li>{categoryItem.category}</li>
+              </>
+            )}
+            <li aria-hidden="true">/</li>
+            <li className="text-zinc-300">{doc.title}</li>
+          </ol>
         </nav>
 
         {/* Content */}

website/src/app/globals.css

@@ -39,6 +39,33 @@ body {
   box-shadow: 0 0 30px rgba(99, 102, 241, 0.05);
 }
 
+/* Layout utilities */
+.section-padding {
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+
+@media (min-width: 640px) {
+  .section-padding {
+    padding-left: 1.5rem;
+    padding-right: 1.5rem;
+  }
+}
+
+@media (min-width: 1024px) {
+  .section-padding {
+    padding-left: 2rem;
+    padding-right: 2rem;
+  }
+}
+
+.container-width {
+  width: 100%;
+  max-width: 80rem;
+  margin-left: auto;
+  margin-right: auto;
+}
+
 /* Scrollbar */
 ::-webkit-scrollbar { width: 6px; height: 6px; }
 ::-webkit-scrollbar-track { background: transparent; }
@@ -53,3 +80,13 @@ body {
   --tw-prose-code: #fafafa;
   --tw-prose-pre-bg: #18181b;
 }
+
+/* Respect prefers-reduced-motion for all animations */
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+    scroll-behavior: auto !important;
+  }
+}