import { Button } from "./ui/button";
import { Link } from "react-router-dom";

const PartnerCTA = () => {
  return (
    <section className="section-dark section-padding">
      <div className="container-narrow text-center">
        <div className="spacing-section">
          <h2 className="text-5xl lg:text-6xl font-light text-[hsl(var(--dark-text))] leading-tight">
            Wachsen Sie <br />
            <span className="text-secondary">mit uns</span>
          </h2>

          <div className="w-16 h-px bg-secondary mx-auto"></div>

          <p className="text-large text-dark-muted leading-relaxed max-w-2xl mx-auto">
            Werden Sie Teil des B2in-Partnernetzwerks und erschließen Sie neue
            Geschäftsmöglichkeiten durch innovative Konnektivitätslösungen.
          </p>

          <div className="grid md:grid-cols-3 gap-8 py-8">
            <div className="text-center space-y-3">
              <div className="text-4xl font-light text-secondary">500+</div>
              <p className="text-dark-muted text-sm">Aktive Partner</p>
            </div>
            <div className="text-center space-y-3">
              <div className="text-4xl font-light text-secondary">98%</div>
              <p className="text-dark-muted text-sm">Zufriedenheitsrate</p>
            </div>
            <div className="text-center space-y-3">
              <div className="text-4xl font-light text-secondary">24/7</div>
              <p className="text-dark-muted text-sm">Partner-Support</p>
            </div>
          </div>

          <div className="spacing-content">
            <Link to="/contact">
              <button className="btn-accent px-12 py-6 rounded-2xl text-lg">
                Werden Sie B2in Partner
              </button>
            </Link>

            <p className="text-dark-muted text-sm">
              Entdecken Sie die Vorteile einer strategischen Partnerschaft mit B2in
            </p>
          </div>
        </div>
      </div>
    </section>
  );
};

export default PartnerCTA;
