diff --git a/docker/ss-atlas/templates/pages/landing.html b/docker/ss-atlas/templates/pages/landing.html
index 5331ab4..78502bd 100644
--- a/docker/ss-atlas/templates/pages/landing.html
+++ b/docker/ss-atlas/templates/pages/landing.html
@@ -52,7 +52,15 @@
     .features li { padding: 0.4rem 0; color: var(--muted); font-size: 0.95rem; }
     .features li::before { content: "\2713"; color: var(--accent); font-weight: 700; margin-right: 0.75rem; }
     form { display: flex; flex-direction: column; gap: 0.75rem; }
-    input[type="email"], input[type="text"] {
+    form label {
+      display: block;
+      font-size: 0.875rem;
+      font-weight: 500;
+      color: var(--muted);
+      margin-bottom: -0.25rem;
+    }
+    input[type="email"], input[type="text"], input[type="tel"] {
+      width: 100%;
       background: var(--bg);
       border: 1px solid var(--border);
       border-radius: 8px;
@@ -62,8 +70,8 @@
       outline: none;
       transition: border-color 0.2s;
     }
-    input[type="email"]:focus, input[type="text"]:focus { border-color: var(--accent); }
-    input[type="email"]::placeholder, input[type="text"]::placeholder { color: var(--muted); }
+    input[type="email"]:focus, input[type="text"]:focus, input[type="tel"]:focus { border-color: var(--accent); }
+    input[type="email"]::placeholder, input[type="text"]::placeholder, input[type="tel"]::placeholder { color: var(--muted); }
     button {
       background: var(--accent);
       color: #fff;
@@ -134,12 +142,37 @@
       <ul class="features">
         {{range .Features}}<li>{{.}}</li>{{end}}
       </ul>
-      <form method="POST" action="/subscribe">
-        <input type="email" name="email" placeholder="you@example.com" required>
-        <input type="tel" name="phone" placeholder="+1 555 123 4567" autocomplete="tel" required>
-        <input type="text" name="domain" placeholder="Domain you want to manage (e.g. git.mycompany.com)" autocomplete="off" required>
+      <form method="POST" action="/subscribe" id="subscribe-form">
+        <label for="sub-email">Email</label>
+        <input id="sub-email" type="email" name="email" placeholder="you@example.com" autocomplete="email" required>
+        <label for="sub-phone">Phone <span style="font-weight:400;color:var(--muted)">(10+ digits, any format)</span></label>
+        <input id="sub-phone" type="tel" name="phone" placeholder="e.g. 555 123 4567 or +1 555 123 4567" autocomplete="tel" inputmode="tel" minlength="10" required>
+        <label for="sub-domain">Domain to manage</label>
+        <input id="sub-domain" type="text" name="domain" placeholder="e.g. git.mycompany.com" autocomplete="off" required>
         <button type="submit">Subscribe Now</button>
       </form>
+      <script>
+        (function() {
+          var phone = document.getElementById('sub-phone');
+          if (!phone) return;
+          function digitsOnly(s) { return (s || '').replace(/\D/g, ''); }
+          function formatPhone(digits) {
+            if (digits.length <= 3) return digits;
+            if (digits.length <= 6) return digits.slice(0,3) + ' ' + digits.slice(3);
+            if (digits.length <= 10) return digits.slice(0,3) + ' ' + digits.slice(3,6) + ' ' + digits.slice(6);
+            return digits.slice(0,3) + ' ' + digits.slice(3,6) + ' ' + digits.slice(6,10) + ' ' + digits.slice(10,15);
+          }
+          phone.addEventListener('input', function() {
+            var d = digitsOnly(this.value);
+            if (d.length > 15) d = d.slice(0, 15);
+            var formatted = formatPhone(d);
+            if (this.value !== formatted) {
+              this.value = formatted;
+              this.setSelectionRange(formatted.length, formatted.length);
+            }
+          });
+        })();
+      </script>
       {{else}}
       <h2>Subscribe</h2>
       <p style="color: var(--muted); margin-bottom: 1rem;">Pricing is being configured. Check back soon.</p>