import fortuneLogo from "@/assets/fortune-logo.avif.asset.json";
import { TopoTexture } from "@/components/TopoTexture";

export function Footer() {
  return (
    <footer className="relative isolate overflow-hidden bg-ink text-paper">
      <TopoTexture opacity={0.08} />
      <div className="relative z-10 mx-auto max-w-[1440px] px-6 md:px-12 py-14">
        <div className="rule text-paper mb-10" />
        <div className="flex flex-col md:flex-row md:items-center md:justify-between gap-6">
          <div className="flex items-center gap-6">
            <span className="display text-paper text-2xl">The Private Gem</span>
            <img
              src={fortuneLogo.url}
              alt="Fortune International Realty"
              className="block w-[140px] md:w-[180px] h-auto"
            />
          </div>
          <div className="flex flex-col md:flex-row md:items-center gap-3 md:gap-8">
            <span className="label text-paper/45">
              © {new Date().getFullYear()} Fortune International Realty
            </span>
            <span className="label text-paper/45">
              Offered subject to prior sale, change, or withdrawal.
            </span>
          </div>
        </div>
      </div>
    </footer>
  );
}
