feat(tenant): Add public-facing landing page for business subdomains

- New TenantLandingPage component with 'Coming Soon' message
- Shows business name derived from subdomain
- Has 'Sign In' button that goes to /login
- 'Powered by SmoothSchedule' footer
- Will be customizable later for each tenant

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

frontend/src/App.tsx

@@ -61,6 +61,7 @@ const VerifyEmail = React.lazy(() => import('./pages/VerifyEmail'));
 const EmailVerificationRequired = React.lazy(() => import('./pages/EmailVerificationRequired'));
 const AcceptInvitePage = React.lazy(() => import('./pages/AcceptInvitePage'));
 const TenantOnboardPage = React.lazy(() => import('./pages/TenantOnboardPage'));
+const TenantLandingPage = React.lazy(() => import('./pages/TenantLandingPage'));
 const Tickets = React.lazy(() => import('./pages/Tickets')); // Import Tickets page
 const HelpGuide = React.lazy(() => import('./pages/HelpGuide')); // Import Platform Guide page
 const HelpTicketing = React.lazy(() => import('./pages/HelpTicketing')); // Import Help page for ticketing
@@ -287,29 +288,40 @@ const AppContent: React.FC = () => {
     );
   }
 
-  // Not authenticated - redirect to root domain for login if on subdomain
+  // Not authenticated - show appropriate page based on subdomain
   if (!user) {
-    // If on a subdomain, redirect to root domain login page
     const currentHostname = window.location.hostname;
     const hostnameParts = currentHostname.split('.');
     const baseDomain = hostnameParts.length >= 2
       ? hostnameParts.slice(-2).join('.')
       : currentHostname;
     const isRootDomainForUnauthUser = currentHostname === baseDomain || currentHostname === 'localhost';
+    const isPlatformSubdomain = hostnameParts[0] === 'platform';
+    const currentSubdomain = hostnameParts[0];
 
-    // Don't redirect for certain public paths that should work on any subdomain
+    // Check if we're on a business subdomain (not root, not platform, not api)
-    const publicPaths = ['/accept-invite', '/verify-email', '/tenant-onboard'];
+    const isBusinessSubdomain = !isRootDomainForUnauthUser && !isPlatformSubdomain && currentSubdomain !== 'api';
-    const currentPath = window.location.pathname;
-    const isPublicPath = publicPaths.some(path => currentPath.startsWith(path));
 
-    if (!isRootDomainForUnauthUser && !isPublicPath) {
+    // For business subdomains, show the tenant landing page with login option
-      // Redirect to root domain login (preserve port)
+    if (isBusinessSubdomain) {
-      const protocol = window.location.protocol;
+      return (
-      const port = window.location.port ? `:${window.location.port}` : '';
+        <Suspense fallback={<LoadingScreen />}>
-      window.location.href = `${protocol}//${baseDomain}${port}/login`;
+          <Routes>
-      return <LoadingScreen />;
+            <Route path="/" element={<TenantLandingPage subdomain={currentSubdomain} />} />
+            <Route path="/login" element={<LoginPage />} />
+            <Route path="/mfa-verify" element={<MFAVerifyPage />} />
+            <Route path="/oauth/callback/:provider" element={<OAuthCallback />} />
+            <Route path="/verify-email" element={<VerifyEmail />} />
+            <Route path="/accept-invite" element={<AcceptInvitePage />} />
+            <Route path="/accept-invite/:token" element={<AcceptInvitePage />} />
+            <Route path="/tenant-onboard" element={<TenantOnboardPage />} />
+            <Route path="*" element={<Navigate to="/" replace />} />
+          </Routes>
+        </Suspense>
+      );
     }
 
+    // For root domain or platform subdomain, show marketing site / login
     return (
       <Suspense fallback={<LoadingScreen />}>
         <Routes>

frontend/src/pages/TenantLandingPage.tsx

@@ -0,0 +1,96 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+import { Calendar, Clock, ArrowRight, Building2 } from 'lucide-react';
+
+interface TenantLandingPageProps {
+  subdomain: string;
+}
+
+const TenantLandingPage: React.FC<TenantLandingPageProps> = ({ subdomain }) => {
+  // Format subdomain for display (capitalize first letter, replace hyphens with spaces)
+  const displayName = subdomain
+    .split('-')
+    .map(word => word.charAt(0).toUpperCase() + word.slice(1))
+    .join(' ');
+
+  return (
+    <div className="min-h-screen bg-gradient-to-br from-indigo-50 via-white to-purple-50 dark:from-gray-900 dark:via-gray-800 dark:to-indigo-900">
+      {/* Header */}
+      <header className="absolute top-0 left-0 right-0 z-10">
+        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
+          <div className="flex items-center justify-between">
+            <div className="flex items-center gap-3">
+              <div className="w-10 h-10 bg-indigo-600 rounded-lg flex items-center justify-center">
+                <Building2 className="w-6 h-6 text-white" />
+              </div>
+              <span className="text-xl font-bold text-gray-900 dark:text-white">
+                {displayName}
+              </span>
+            </div>
+            <Link
+              to="/login"
+              className="inline-flex items-center gap-2 px-5 py-2.5 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 transition-colors font-medium"
+            >
+              Sign In
+              <ArrowRight className="w-4 h-4" />
+            </Link>
+          </div>
+        </div>
+      </header>
+
+      {/* Main Content */}
+      <main className="flex items-center justify-center min-h-screen px-4">
+        <div className="text-center max-w-2xl mx-auto">
+          {/* Icon */}
+          <div className="mb-8">
+            <div className="inline-flex items-center justify-center w-24 h-24 bg-indigo-100 dark:bg-indigo-900/30 rounded-full">
+              <Calendar className="w-12 h-12 text-indigo-600 dark:text-indigo-400" />
+            </div>
+          </div>
+
+          {/* Title */}
+          <h1 className="text-4xl sm:text-5xl font-bold text-gray-900 dark:text-white mb-4">
+            {displayName}
+          </h1>
+
+          {/* Coming Soon Badge */}
+          <div className="inline-flex items-center gap-2 px-4 py-2 bg-amber-100 dark:bg-amber-900/30 text-amber-700 dark:text-amber-400 rounded-full mb-6">
+            <Clock className="w-4 h-4" />
+            <span className="text-sm font-medium">Coming Soon</span>
+          </div>
+
+          {/* Description */}
+          <p className="text-lg text-gray-600 dark:text-gray-400 mb-8 max-w-md mx-auto">
+            We're setting up our online booking system. Check back soon to schedule your appointment!
+          </p>
+
+          {/* CTA Buttons */}
+          <div className="flex flex-col sm:flex-row items-center justify-center gap-4">
+            <Link
+              to="/login"
+              className="inline-flex items-center gap-2 px-6 py-3 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 transition-colors font-medium shadow-lg shadow-indigo-500/25"
+            >
+              Staff Login
+              <ArrowRight className="w-4 h-4" />
+            </Link>
+          </div>
+
+          {/* Powered by */}
+          <p className="mt-12 text-sm text-gray-500 dark:text-gray-500">
+            Powered by{' '}
+            <a
+              href="https://smoothschedule.com"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="text-indigo-600 dark:text-indigo-400 hover:underline"
+            >
+              SmoothSchedule
+            </a>
+          </p>
+        </div>
+      </main>
+    </div>
+  );
+};
+
+export default TenantLandingPage;