Update contact page to clarify how to get support

Signed-off-by: Alex Ellis (OpenFaaS Ltd) <alexellis2@gmail.com>

Author: alexellis

contact.html

@@ -3,17 +3,65 @@
 ---
 
 <div class="bg-white py-16 px-4 overflow-hidden sm:px-6 lg:px-8 lg:py-24">
-    <div class="relative max-w-3xl mx-auto">
-        <div class="texyarn add @tailwindcss/uit-center">
+    <div class="relative max-w-5xl mx-auto">
+        <div class="text-center">
             <h2 class="text-3xl leading-9 font-extrabold tracking-tight text-gray-900 sm:text-4xl sm:leading-10">
                 Contact us
             </h2>
             <p class="mt-4 text-lg leading-6 text-gray-500">
-                There are a myriad of ways to use inlets for network automation and connectivity. Reach out to us via the form below to talk to our team.
+                Choose the right route for your enquiry so we can respond quickly.
+            </p>
+            <p class="mt-3 text-base leading-6 text-gray-500">
+                Inlets is a product developed by OpenFaaS Ltd.
+            </p>
+        </div>
+
+        <div class="mt-10 rounded-lg border border-yellow-200 bg-yellow-50 p-5">
+            <h3 class="text-base leading-6 font-semibold text-yellow-900">
+                The contact form is not for support requests
+            </h3>
+            <p class="mt-2 text-sm leading-5 text-yellow-800">
+                If you use the form for support or billing questions, you will be asked to send an email as directed below.
             </p>
         </div>
-        <div class="mt-12">
-           <a class="underline inlets-blue-900" href="https://forms.gle/YpbcKgMEnKeMCZkV6">Send your details</a>
+
+        <div class="mt-8 grid gap-6 sm:grid-cols-2">
+            <div class="rounded-lg border border-indigo-200 bg-indigo-50 p-6">
+                <p class="text-sm leading-5 font-semibold uppercase tracking-wide text-indigo-700">
+                    Support and billing
+                </p>
+                <h3 class="text-lg leading-6 font-semibold text-gray-900">
+                    Existing inlets customers
+                </h3>
+                <p class="mt-3 text-base leading-6 text-gray-600">
+                    If you already have an inlets license, please email support for technical help, license questions, billing, renewals, or account changes.
+                </p>
+                <a class="mt-5 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700" href="mailto:support@openfaas.com">
+                    Email support@openfaas.com
+                </a>
+            </div>
+
+            <div class="rounded-lg border border-gray-200 bg-white p-6">
+                <p class="text-sm leading-5 font-semibold uppercase tracking-wide text-gray-500">
+                    Before you buy
+                </p>
+                <h3 class="text-lg leading-6 font-semibold text-gray-900">
+                    Pre-sales enquiries
+                </h3>
+                <p class="mt-3 text-base leading-6 text-gray-600">
+                    If you are evaluating inlets, use the form for pricing, architecture, trial, procurement, or fit questions.
+                </p>
+                <div class="mt-4 rounded-md bg-gray-50 p-4 text-sm leading-5 text-gray-600">
+                    <p class="font-medium text-gray-900">How you'll hear from us</p>
+                    <ul class="mt-2 list-disc pl-5">
+                        <li>Replies may come from @openfaas.com or @inlets.dev.</li>
+                        <li>Check spam or quarantine if you do not see a response within 1-2 working days.</li>
+                    </ul>
+                </div>
+                <a class="mt-5 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700" href="https://forms.gle/YpbcKgMEnKeMCZkV6">
+                    Open pre-sales form
+                </a>
+            </div>
         </div>
     </div>
 </div>