export function Guarantee() {
  return (
    <section className="bg-blue-50 py-16 md:py-24">
      <div className="container mx-auto max-w-4xl px-6">
        <div className="bg-white p-8 md:p-12 rounded-lg shadow-2xl border-2 border-blue-600">
          <svg
            className="w-16 h-16 text-blue-600 mb-4 mx-auto"
            xmlns="http://www.w3.org/2000/svg"
            fill="none"
            viewBox="0 0 24 24"
            strokeWidth="1.5"
            stroke="currentColor"
          >
            <path
              strokeLinecap="round"
              strokeLinejoin="round"
              d="M9 12.75L11.25 15 15 9.75M21 12c0 1.268-.63 2.39-1.593 3.068a3.745 3.745 0 01-1.043 3.296 3.745 3.745 0 01-3.296 1.043A3.745 3.745 0 0112 21c-1.268 0-2.39-.63-3.068-1.593a3.745 3.745 0 01-3.296-1.043 3.746 3.746 0 01-1.043-3.296A3.746 3.746 0 013 12c0-1.268.63-2.39 1.593-3.068a3.745 3.745 0 011.043-3.296 3.746 3.746 0 013.296-1.043 3.746 3.746 0 011.043 3.296A3.745 3.745 0 0121 12z"
            />
          </svg>
          <h3 className="text-3xl font-extrabold text-gray-900 text-center mb-4">30-Day Happiness Guarantee</h3>
          <p className="text-center mb-6 text-gray-700 text-lg">
            If, within the first 30 days, you're not happy with how your site looks or performs, we'll fix it fast—or
            give you a full refund.
          </p>
          <div className="flex justify-center">
            <img
              src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Visa-MasterCard-RX80MRSwga1CwkXDv3nXzoFmrPYhX0.jpg"
              alt="Visa and Mastercard accepted"
              className="h-12 w-auto"
            />
          </div>
        </div>
      </div>
    </section>
  )
}
