feat: integrate Tailwind CSS with custom theme and animations

Added Tailwind CSS and tw-animate-css imports to globals.css. Introduced a custom dark variant and an extensive @theme inline block with CSS variables for colors, radii, and animations. Included keyframes for shimmer-slide, spin-around, gradient, shine, and background-position-spin to enable consistent theming and dynamic UI effects across the application.

components/mobile-menu.tsx

@@ -0,0 +1,64 @@
+"use client";
+
+import { Menu } from "lucide-react";
+import { useState } from "react";
+import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet";
+import { Button } from "@/components/ui/button";
+import { Separator } from "@/components/ui/separator";
+import { ThemeToggle } from "./theme-toggle";
+import { LanguageSwitcher } from "./language-switcher";
+import { useTranslations } from "next-intl";
+import Link from "next/link";
+
+interface MobileMenuProps {
+  links: Array<{ href: string; label: string }>;
+}
+
+export function MobileMenu({ links }: MobileMenuProps) {
+  const [open, setOpen] = useState(false);
+  const t = useTranslations("header");
+
+  return (
+    <Sheet open={open} onOpenChange={setOpen}>
+      <SheetTrigger asChild>
+        <Button variant="outline" size="icon" className="md:hidden">
+          <Menu className="h-[1.2rem] w-[1.2rem]" />
+          <span className="sr-only">{t("menu")}</span>
+        </Button>
+      </SheetTrigger>
+      <SheetContent side="right" className="w-[300px] sm:w-[400px]">
+        <div className="flex flex-col space-y-4 mt-4">
+          {/* Navigation Links */}
+          <div className="space-y-2">
+            {links.map(({ href, label }) => (
+              <Link
+                key={href}
+                href={href}
+                className="block px-3 py-2 text-sm font-medium rounded-md hover:bg-accent hover:text-accent-foreground transition-colors"
+                onClick={() => setOpen(false)}
+              >
+                {label}
+              </Link>
+            ))}
+          </div>
+
+          <Separator />
+
+          {/* Theme and Language Controls */}
+          <div className="space-y-4">
+            <div className="flex items-center justify-between">
+              <span className="text-sm font-medium">{t("theme.light")}</span>
+              <ThemeToggle />
+            </div>
+
+            <div className="flex items-center justify-between">
+              <span className="text-sm font-medium">{t("language")}</span>
+              <LanguageSwitcher />
+            </div>
+          </div>
+        </div>
+      </SheetContent>
+    </Sheet>
+  );
+}
+