import { AieroButton } from "@/components/shared/AieroButton";
import { PageContainer } from "@/components/shared/PageContainer";

/**
 * PreFooterCTA — "It's blow your mind! Meet Neural Networks" banner.
 *
 * Shared across: Home, About, Services, Contacts.
 *
 * Structure (from reference):
 *   - Dark grey rounded card
 *   - Large teal gradient heading
 *   - "Get a Quote" button with arrow
 */
export function PreFooterCTA() {
  return (
    <section className="px-5 pb-5">
      <div className="overflow-hidden rounded-[25px] bg-aiero-card-dark">
        <PageContainer className="flex flex-col items-center gap-8 py-16 text-center md:flex-row md:justify-between md:py-20 md:text-left lg:py-24">
          {/* Heading */}
          <h2
            className="max-w-[700px]"
            style={{
              fontFamily: "var(--font-sora)",
              fontSize: "clamp(28px, 3.5vw, 48px)",
              fontWeight: 700,
              lineHeight: 1.15,
            }}
          >
            <span className="text-white">{"It's blow your mind! "}</span>
            <span className="gradient-text-purple">Meet Neural Networks</span>
          </h2>

          {/* CTA */}
          <AieroButton
            href="/contacts"
            variant="gradient-border"
            className="shrink-0 rounded-full px-8 py-4 text-base font-semibold text-white"
          >
            Get a Quote
          </AieroButton>
        </PageContainer>
      </div>
    </section>
  );
}