diff --git a/src/components/site-header.tsx b/src/components/site-header.tsx
index fb61aeb..620b380 100644
--- a/src/components/site-header.tsx
+++ b/src/components/site-header.tsx
@@ -11,7 +11,7 @@ const navLinks = [
 export function SiteHeader() {
   return (
     <header className="sticky top-6 z-50 mt-6 print:hidden">
-      <div className="mx-auto flex h-16 max-w-6xl items-center justify-between gap-3 px-4">
+      <div className="relative mx-auto flex h-16 max-w-6xl items-center justify-between gap-3 px-4">
         <Link
           href="/"
           className="group flex items-center font-bricolage text-xl"
@@ -31,7 +31,7 @@ export function SiteHeader() {
             </span>
           </span>
         </Link>
-        <nav className="hidden items-center gap-1 rounded-full border border-slate-200 bg-white p-1.5 text-base font-medium text-slate-600 sm:flex">
+        <nav className="absolute left-1/2 hidden -translate-x-1/2 items-center gap-1 rounded-full border border-slate-200 bg-white p-1.5 text-base font-medium text-slate-600 sm:flex">
           {navLinks.map((link) => (
             <Link
               key={link.href}