import Link from "next/link";

import { SITE } from "@/lib/site";

import Icon from "@/components/Icon";

/** Closing navy band, shared on every page (SPEC §0: "end of every page"). */
export default function CtaBand({ withCta = true }: { withCta?: boolean }) {
  return (
    <section className="bg-navy">
      <div className="container-gv flex flex-col items-start gap-10 py-20 lg:flex-row lg:items-center lg:justify-between lg:py-28">
        <div className="max-w-xl">
          <p className="eyebrow eyebrow-dark">{SITE.tagline}</p>
          <h2 className="mt-6 font-display text-3xl font-bold leading-[1.08] tracking-tight text-white sm:text-4xl lg:text-5xl">
            {"Let's work together for a greener tomorrow!"}
          </h2>
          <p className="mt-5 text-base leading-relaxed text-white/65 sm:text-lg">
            From UPS protection to utility-scale solar, GV engineers reliable
            power for {"Malaysia's"} institutions.
          </p>
        </div>
        {withCta ? (
          <Link href="/contact" className="btn btn-dark shrink-0">
            Get in Touch
            <span className="btn-arrow" aria-hidden="true">
              <Icon name="arrow-right" size={14} weight="bold" className="ph" />
            </span>
          </Link>
        ) : null}
      </div>
    </section>
  );
}