test

 <!-- index.html -->

<button id="pay-btn">Pay ₹10 to Access Calculator</button>

<div id="calculator" style="display:none;">

  <!-- Your calculator UI -->

</div>

<script src="https://checkout.razorpay.com/v1/checkout.js"></script>

<script>

  document.getElementById("pay-btn").onclick = function () {

    var options = {

      key: "YOUR_RAZORPAY_KEY",

      amount: 1000, // 10 INR in paisa

      currency: "INR",

      name: "Access Calculator",

      description: "One-time access fee",

      handler: function (response) {

        // Call your backend to verify payment if needed

        document.getElementById("calculator").style.display = "block";

      },

      prefill: {

        email: "user@example.com",

        contact: "9999999999"

      },

      theme: {

        color: "#3399cc"

      }

    };

    var rzp1 = new Razorpay(options);

    rzp1.open();

  };

</script>