Initial Bizone Next.js website

src/components/site-footer.tsx

@@ -0,0 +1,57 @@
+import Link from "next/link";
+import { footerLinks, site } from "@/lib/site";
+
+export function SiteFooter() {
+  return (
+    <footer className="border-t border-[var(--line)] bg-[var(--panel)]">
+      <div className="mx-auto grid max-w-7xl gap-12 px-5 py-16 md:grid-cols-[1.4fr_1fr_1fr] md:px-8">
+        <div className="space-y-5">
+          <div>
+            <p className="font-heading text-2xl font-extrabold tracking-[-0.03em] text-[var(--ink)]">
+              {site.name}
+            </p>
+            <p className="mt-3 max-w-xl text-sm leading-7 text-[var(--muted)]">
+              {site.description}
+            </p>
+          </div>
+          <p className="text-sm font-semibold text-[var(--ink)]">
+            {site.name}, semua bisnis dalam satu tempat.
+          </p>
+        </div>
+
+        <div>
+          <p className="text-sm font-bold uppercase tracking-[0.2em] text-[var(--muted)]">
+            Navigasi
+          </p>
+          <div className="mt-4 flex flex-col gap-3 text-sm text-[var(--ink)]">
+            {footerLinks.map((item) => (
+              <Link key={item.href} href={item.href} className="transition hover:text-[var(--accent)]">
+                {item.label}
+              </Link>
+            ))}
+          </div>
+        </div>
+
+        <div>
+          <p className="text-sm font-bold uppercase tracking-[0.2em] text-[var(--muted)]">
+            Kontak
+          </p>
+          <div className="mt-4 flex flex-col gap-3 text-sm text-[var(--ink)]">
+            <a href={site.domain} target="_blank" rel="noreferrer">
+              bizone.id
+            </a>
+            <a href={`mailto:${site.email}`}>{site.email}</a>
+            <a href={site.whatsappHref} target="_blank" rel="noreferrer">
+              {site.whatsapp}
+            </a>
+            <span>{site.address}</span>
+          </div>
+        </div>
+      </div>
+
+      <div className="border-t border-[var(--line)] px-5 py-5 text-center text-xs text-[var(--muted)] md:px-8">
+        © 2026 {site.company}. All rights reserved.
+      </div>
+    </footer>
+  );
+}