Complete Your Order

You're one step away. Fill in your details and proceed to payment.

Your Details

First Name *

Last Name *

Email Address *

Phone Number *

Business / Company Name

Project Brief (Optional)

Payment Method

Payment Gateway

💳 Card (USD) via Razorpay

🔀 Only INR Supported ( USD coming Soon )

Order Summary

Starter Website Package $179

Up to 5 pages, mobile responsive, 30-day support

Total USD $179

Change package:

Discovery Call ($1) $1 Starter Website Package $179 Business Website Package $417 Enterprise Package $893 Basic Care (Monthly) $36 Pro Care (Monthly) $71 Agency Care (Monthly) $143

Need a custom quote?
Contact us and we'll tailor a package exactly to your requirements.

checkoutBtn.addEventListener('click', async (e) => { e.preventDefault(); const firstName = document.getElementById('field-first')?.value.trim(); const lastName = document.getElementById('field-last')?.value.trim(); const email = document.getElementById('field-email')?.value.trim(); const phone = document.getElementById('field-phone')?.value.trim(); if (!firstName || !email || !phone) { alert('Please fill in your name, email, and phone number.'); return; } const fullName = firstName + (lastName ? ' ' + lastName : ''); const totalUsd = parseFloat(checkoutBtn.getAttribute('data-total-usd')); const planDesc = checkoutBtn.getAttribute('data-plan-name') || 'Website Package'; const displayAmount = '$' + totalUsd + ' USD'; const amountPaise = Math.round(totalUsd * 100); // PayU uses smallest unit checkoutBtn.textContent = 'Creating order...'; checkoutBtn.disabled = true; let order; try { const res = await fetch('api/payu-create-order', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ amount: amountPaise, currency: 'USD', name: fullName, email, phone, desc: planDesc, }), }); order = await res.json(); if (!order.payu_url) throw new Error(order.error || 'PayU order creation failed'); } catch (err) { alert('Could not initiate payment: ' + err.message); checkoutBtn.textContent = 'Proceed to Pay — ' + displayAmount; checkoutBtn.disabled = false; return; } // Submit hidden form to PayU const form = document.createElement('form'); form.method = 'POST'; form.action = order.payu_url; const fields = { key: order.merchant_key, txnid: order.txnid, amount: order.amount, productinfo: order.productinfo, firstname: order.firstname, email: order.email, phone: order.phone, hash: order.hash, surl: order.surl, furl: order.furl, currency: order.currency, }; for (const [k, v] of Object.entries(fields)) { const inp = document.createElement('input'); inp.type = 'hidden'; inp.name = k; inp.value = v; form.appendChild(inp); } document.body.appendChild(form); form.submit(); }); }); if (tag) tag.textContent = cur; // Summary base price document.querySelectorAll('.summary-base').forEach(el => { const inr = parseFloat(el.getAttribute('data-inr')); const usd = parseFloat(el.getAttribute('data-usd')); el.textContent = cur === 'INR' ? '₹' + Math.round(inr).toLocaleString('en-IN') : '$' + usd; }); // Summary total document.querySelectorAll('.checkout-total').forEach(el => { const inr = parseFloat(el.getAttribute('data-inr')); const usd = parseFloat(el.getAttribute('data-usd')); if (inr && usd) { el.textContent = cur === 'INR' ? '₹' + Math.round(inr * 1.18).toLocaleString('en-IN') : '$' + usd; } }); // GST amount span document.querySelectorAll('[data-inr-gst]').forEach(el => { const gst = parseFloat(el.getAttribute('data-inr-gst')); el.textContent = '₹' + Math.round(gst).toLocaleString('en-IN'); }); // Plan switcher prices document.querySelectorAll('[data-inr]').forEach(el => { if (el.classList.contains('checkout-total') || el.classList.contains('summary-base')) return; const inr = parseFloat(el.getAttribute('data-inr')); el.textContent = cur === 'INR' ? '₹' + Math.round(inr).toLocaleString('en-IN') : '$' + Math.round(inr / 84); }); } updateCheckout(); document.addEventListener('click', e => { if (e.target.closest('[data-currency]')) setTimeout(updateCheckout, 50); }); // ── Pay button const checkoutBtn = document.getElementById('checkout-submit'); if (!checkoutBtn) return; checkoutBtn.addEventListener('click', async (e) => { e.preventDefault(); const firstName = document.getElementById('field-first')?.value.trim(); const lastName = document.getElementById('field-last')?.value.trim(); const email = document.getElementById('field-email')?.value.trim(); const phone = document.getElementById('field-phone')?.value.trim(); if (!firstName || !email || !phone) { alert('Please fill in your name, email, and phone number.'); return; } const fullName = firstName + (lastName ? ' ' + lastName : ''); const cur = getCurrency(); const totalInr = parseFloat(checkoutBtn.getAttribute('data-total-inr')); const totalUsd = parseFloat(checkoutBtn.getAttribute('data-total-usd')); const planDesc = checkoutBtn.getAttribute('data-plan-name') || 'Website Package'; const displayAmount = cur === 'INR' ? '₹' + Math.round(totalInr).toLocaleString('en-IN') : '$' + totalUsd + ' USD'; checkoutBtn.textContent = 'Creating order...'; checkoutBtn.disabled = true; // ── Route by currency if (cur === 'INR') { // PayU flow const amount = Math.round(totalInr * 100); // paise let order; try { const res = await fetch('api/payu-create-order', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ amount, currency: 'INR', name: fullName, email, phone, desc: planDesc }), }); order = await res.json(); if (!order.payu_url) throw new Error(order.error || 'PayU order creation failed'); } catch (err) { alert('Could not initiate payment: ' + err.message); checkoutBtn.textContent = 'Proceed to Pay — ' + displayAmount; checkoutBtn.disabled = false; return; } // Submit hidden form to PayU const form = document.createElement('form'); form.method = 'POST'; form.action = order.payu_url; const fields = { key: order.merchant_key, txnid: order.txnid, amount: order.amount, productinfo: order.productinfo, firstname: order.firstname, email: order.email, phone: order.phone, hash: order.hash, surl: order.surl, furl: order.furl, currency: 'INR', }; for (const [k, v] of Object.entries(fields)) { const inp = document.createElement('input'); inp.type = 'hidden'; inp.name = k; inp.value = v; form.appendChild(inp); } document.body.appendChild(form); form.submit(); } else { // Razorpay flow (USD) const amount = Math.round(totalUsd * 100); // cents let order; try { const res = await fetch('api/create-order', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ amount, currency: 'USD' }), }); order = await res.json(); if (!order.order_id) throw new Error(order.error || 'Order creation failed'); } catch (err) { alert('Could not initiate payment: ' + err.message); checkoutBtn.textContent = 'Proceed to Pay — ' + displayAmount; checkoutBtn.disabled = false; return; } const options = { key: order.key_id, amount: order.amount, currency: order.currency, order_id: order.order_id, name: 'Serenity Studios', description: planDesc, image: 'assets/images/logo-dark.png', prefill: { name: fullName, email, contact: phone }, theme: { color: '#833ab4' }, handler: async function (response) { checkoutBtn.textContent = 'Verifying payment...'; try { const vRes = await fetch('api/verify-payment', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ razorpay_payment_id: response.razorpay_payment_id, razorpay_order_id: response.razorpay_order_id, razorpay_signature: response.razorpay_signature, }), }); const result = await vRes.json(); if (result.success) { window.location.href = 'contact?payment=success&ref=' + response.razorpay_payment_id; } else { alert('Payment verification failed. Contact support: ' + response.razorpay_payment_id); } } catch (err) { alert('Verification error. Contact support with ID: ' + response.razorpay_payment_id); } }, modal: { ondismiss: () => { checkoutBtn.textContent = 'Proceed to Pay — ' + displayAmount; checkoutBtn.disabled = false; } } }; const rzp = new Razorpay(options); rzp.on('payment.failed', (r) => { alert('Payment failed: ' + (r.error?.description || 'Unknown error')); checkoutBtn.textContent = 'Proceed to Pay — ' + displayAmount; checkoutBtn.disabled = false; }); rzp.open(); } }); });