From 45e21724176e80a5b1930a5512a695b02e476392 Mon Sep 17 00:00:00 2001
From: justin <justin@liquidator.optimal-reality.com>
Date: Mon, 18 May 2026 20:57:06 -0500
Subject: [PATCH] Fix checkout page UX: card first, shorter legal, trust
 signals, help link
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Card payment now default (was ACH — lower trust barrier for new customers)
- Removed +3% surcharge labels (reduces friction)
- Shortened authorization text to one line (was intimidating paragraph)
- Added trust signals below button: 256-bit SSL, Powered by Stripe, PCI compliant
- Added "Questions?" help box with phone + email below checkout
- Button text: "Continue to Secure Payment" with green glow shadow

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 site/public/order/fcc-compliance/index.html | 22 ++++++++++++++-------
 1 file changed, 15 insertions(+), 7 deletions(-)

diff --git a/site/public/order/fcc-compliance/index.html b/site/public/order/fcc-compliance/index.html
index 9bad977..e715bf0 100644
--- a/site/public/order/fcc-compliance/index.html
+++ b/site/public/order/fcc-compliance/index.html
@@ -373,19 +373,27 @@ function renderServices() {
             '<input type="email" id="pw-email" required placeholder="jane@company.com" class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg outline-none"></div>' +
           '<div><label class="block text-xs font-medium text-gray-600 mb-1">Phone</label>' +
             '<input type="tel" id="pw-phone" placeholder="(555) 123-4567" class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg outline-none"></div>' +
-          '<div><label class="block text-xs font-medium text-gray-600 mb-1">Referral code</label>' +
+          '<div><label class="block text-xs font-medium text-gray-600 mb-1">Referral / discount code</label>' +
             '<input type="text" id="pw-promo" placeholder="Optional" class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg outline-none uppercase"></div>' +
         '</div>' +
         '<h4 class="text-sm font-semibold text-gray-900">Payment Method</h4>' +
         '<div class="space-y-2">' +
-          '<label class="flex items-center gap-3 p-3 rounded-lg border border-gray-200 cursor-pointer hover:border-pw-400 has-[:checked]:border-pw-500 has-[:checked]:bg-pw-50"><input type="radio" name="pw_pay" value="ach" checked><span class="text-sm font-medium text-gray-800">ACH Bank Transfer</span><span class="ml-auto text-xs text-green-600 font-medium">Recommended — No fee</span></label>' +
-          '<label class="flex items-center gap-3 p-3 rounded-lg border border-gray-200 cursor-pointer hover:border-pw-400 has-[:checked]:border-pw-500 has-[:checked]:bg-pw-50"><input type="radio" name="pw_pay" value="card"><span class="text-sm font-medium text-gray-800">Credit / Debit Card</span><span class="ml-auto text-xs text-gray-400">+3%</span></label>' +
-          '<label class="flex items-center gap-3 p-3 rounded-lg border border-gray-200 cursor-pointer hover:border-pw-400 has-[:checked]:border-pw-500 has-[:checked]:bg-pw-50"><input type="radio" name="pw_pay" value="paypal"><span class="text-sm font-medium text-gray-800">PayPal</span><span class="ml-auto text-xs text-gray-400">+3%</span></label>' +
-          '<label class="flex items-center gap-3 p-3 rounded-lg border border-gray-200 cursor-pointer hover:border-pw-400 has-[:checked]:border-pw-500 has-[:checked]:bg-pw-50"><input type="radio" name="pw_pay" value="crypto"><span class="text-sm font-medium text-gray-800">Cryptocurrency</span><span class="ml-auto text-xs text-gray-400">No fee</span></label>' +
+          '<label class="flex items-center gap-3 p-3 rounded-lg border border-gray-200 cursor-pointer hover:border-pw-400 has-[:checked]:border-pw-500 has-[:checked]:bg-pw-50"><input type="radio" name="pw_pay" value="card" checked><span class="text-sm font-medium text-gray-800">Credit / Debit Card</span><span class="ml-auto text-xs text-gray-400">Visa, MC, Amex, Discover</span></label>' +
+          '<label class="flex items-center gap-3 p-3 rounded-lg border border-gray-200 cursor-pointer hover:border-pw-400 has-[:checked]:border-pw-500 has-[:checked]:bg-pw-50"><input type="radio" name="pw_pay" value="ach"><span class="text-sm font-medium text-gray-800">ACH Bank Transfer</span><span class="ml-auto text-xs text-green-600 font-medium">No processing fee</span></label>' +
+          '<label class="flex items-center gap-3 p-3 rounded-lg border border-gray-200 cursor-pointer hover:border-pw-400 has-[:checked]:border-pw-500 has-[:checked]:bg-pw-50"><input type="radio" name="pw_pay" value="paypal"><span class="text-sm font-medium text-gray-800">PayPal</span></label>' +
+          '<label class="flex items-center gap-3 p-3 rounded-lg border border-gray-200 cursor-pointer hover:border-pw-400 has-[:checked]:border-pw-500 has-[:checked]:bg-pw-50"><input type="radio" name="pw_pay" value="crypto"><span class="text-sm font-medium text-gray-800">Cryptocurrency</span><span class="ml-auto text-xs text-gray-400">BTC, ETH, USDC</span></label>' +
+        '</div>' +
+        '<label class="flex items-start gap-2 p-3 mt-2 rounded-lg border border-gray-200 cursor-pointer text-xs text-gray-600 leading-relaxed"><input type="checkbox" id="pw-engage" required class="mt-0.5 rounded border-gray-300 text-pw-600 focus:ring-pw-500"><span>I authorize Performance West to prepare and file on my behalf. <a href="/terms" target="_blank" class="text-pw-600 underline">Terms</a></span></label>' +
+        '<button type="submit" id="pw-submit" class="w-full py-3.5 rounded-lg bg-green-600 text-white font-bold text-base hover:bg-green-700 transition-colors disabled:bg-gray-400 disabled:cursor-not-allowed shadow-lg" style="box-shadow:0 4px 14px rgba(22,163,74,0.4)">Continue to Secure Payment \u2192</button>' +
+        '<div class="flex items-center justify-center gap-4 mt-2 text-xs text-gray-400">' +
+          '<span class="flex items-center gap-1"><svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/></svg> 256-bit SSL</span>' +
+          '<span>\u2022 Powered by Stripe</span>' +
+          '<span>\u2022 PCI compliant</span>' +
         '</div>' +
-        '<label class="flex items-start gap-2 p-3 mt-3 rounded-lg border border-gray-200 cursor-pointer text-xs text-gray-600 leading-relaxed"><input type="checkbox" id="pw-engage" required class="mt-0.5 rounded border-gray-300 text-pw-600 focus:ring-pw-500"><span>I authorize Performance West Inc. to prepare and submit regulatory filings on my behalf as described above. I understand Performance West provides compliance consulting services, not legal advice or legal representation. I confirm the information I provide is accurate to the best of my knowledge. <a href="/terms" target="_blank" class="text-pw-600 underline">Terms of Service</a></span></label>' +
-        '<button type="submit" id="pw-submit" class="w-full py-3 rounded-lg bg-green-600 text-white font-bold text-base hover:bg-green-700 transition-colors disabled:bg-gray-400 disabled:cursor-not-allowed">Continue to Payment</button>' +
         '<p id="pw-err" class="text-sm text-red-700 mt-1" hidden></p>' +
+        '<div style="margin-top:12px;padding:12px 16px;background:#f0f4f8;border-radius:8px;text-align:center;">' +
+          '<p style="font-size:12px;color:#475569;margin:0;">Questions before ordering? Call <strong>(888) 411-0383</strong> or <a href="mailto:info@performancewest.net" style="color:#1e3a5f;text-decoration:underline;">email us</a></p>' +
+        '</div>' +
       '</form>';
     listEl.appendChild(actions);