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.

app/[locale]/layout.tsx

@@ -0,0 +1,48 @@
+import type { Metadata } from "next";
+import { Geist, Geist_Mono, Nunito_Sans } from "next/font/google";
+import { NextIntlClientProvider } from "next-intl";
+import { getMessages } from "next-intl/server";
+import { ThemeProvider } from "@/components/theme-provider";
+import "../globals.css";
+
+const nunitoSans = Nunito_Sans({
+  variable: "--font-nunito-sans",
+  subsets: ["latin"],
+  weight: ["200", "300", "400", "500", "600", "700", "800", "900"],
+});
+
+const geistMono = Geist_Mono({
+  variable: "--font-geist-mono",
+  subsets: ["latin"],
+});
+
+export const metadata: Metadata = {
+  title: "Pagodera Trade",
+  description: "Markeplace servidor pagodera",
+};
+
+export default async function LocaleLayout({
+  children,
+  params,
+}: {
+  children: React.ReactNode;
+  params: Promise<{ locale: string }>;
+}) {
+  const { locale } = await params;
+  const messages = await getMessages();
+
+  return (
+    <html lang={locale} suppressHydrationWarning>
+      <body
+        className={`${nunitoSans.variable} ${geistMono.variable} antialiased`}
+      >
+        <NextIntlClientProvider messages={messages}>
+          <ThemeProvider attribute="class" defaultTheme="dark">
+            {children}
+          </ThemeProvider>
+        </NextIntlClientProvider>
+      </body>
+    </html>
+  );
+}
+

app/[locale]/page.tsx

@@ -0,0 +1,25 @@
+import Header from "@/components/Header";
+import { EscrowBanner } from "@/components/sections/escrow-banner";
+import { EscrowExplanation } from "@/components/sections/escrow-explanation";
+import { HeroSection } from "@/components/sections/hero-section";
+import { HowItWorks } from "@/components/sections/how-it-works";
+import { FeaturedItems } from "@/components/sections/featured-items";
+import { MarketOffers } from "@/components/sections/market-offers";
+import { MarketStats } from "@/components/sections/market-stats";
+
+export default function Home() {
+  return (
+    <div className="min-h-screen">
+      <Header />
+      <EscrowBanner />
+      <main>
+        <HeroSection />
+        <HowItWorks />
+        <FeaturedItems />
+        <MarketOffers />
+        <MarketStats />
+      </main>
+      <EscrowExplanation />
+    </div>
+  );
+}