feat: add pixel font for hotel name, toggle text/logo on click in site header

src/components/site-header.tsx

@@ -1,8 +1,8 @@
 import { getTranslations } from "next-intl/server";
-import Link from "next/link";
 import { auth } from "@/lib/auth";
 import { prisma } from "@/lib/prisma";
 import { siteSettings } from "@/lib/services/site-settings";
+import { SiteHeaderTitle } from "@/components/site-header-title";
 
 export async function SiteHeader() {
   const t = await getTranslations("header");
@@ -44,22 +44,7 @@ export async function SiteHeader() {
 
       {/* Content */}
       <div className="relative flex flex-col items-center justify-center px-4 py-12 min-h-[18rem]">
-        <Link href="/" className="transition-transform duration-300 hover:scale-105 mb-8">
-          {logo ? (
-            <img className="drop-shadow-2xl block" src={logo} alt={hotelName ?? "Hotel"} style={{ maxHeight: 120 }} />
-          ) : (
-            <h1
-              className="text-center font-extrabold tracking-tight leading-none text-white"
-              style={{
-                fontSize: "clamp(2.5rem, 7vw, 4.5rem)",
-                textShadow: "0 2px 20px rgba(0,0,0,0.4), 0 8px 40px rgba(0,0,0,0.2)",
-                letterSpacing: "-0.02em",
-              }}
-            >
-              {hotelName} - Hotel
-            </h1>
-          )}
-        </Link>
+        <SiteHeaderTitle hotelName={hotelName ?? "Atom"} logo={logo ?? ""} />
 
         {/* Online badge */}
         <div