File size: 28,791 Bytes
4805965
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
745d5ee
4805965
745d5ee
4805965
 
 
9fd863b
4805965
 
 
9fd863b
4805965
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
260257a
8215f91
9fd863b
4805965
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
260257a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
71c58cf
c956205
260257a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
54eb6b6
c956205
260257a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
54eb6b6
c956205
260257a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
4805965
 
260257a
4805965
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
ea694b1
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
4805965
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Synthify.AI - AI Receptionists for Local Businesses</title>
    <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
    <script src="https://cdn.tailwindcss.com"></script>
    <script src="https://unpkg.com/feather-icons"></script>
    <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
    <style>
        .hero-gradient {
            background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 50%, #bae6fd 100%);
        }
        .feature-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
        }
        .testimonial-card {
            background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
        }
    </style>
</head>
<body class="font-sans antialiased text-gray-800">
    <!-- Navigation -->
    <nav class="bg-white shadow-sm sticky top-0 z-50">
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div class="flex justify-between h-16">
                <div class="flex items-center">
                    <div class="flex-shrink-0 flex items-center">
                        <img src="https://huggingface.co/spaces/Synthify-ai/undefined/resolve/main/images/synthify%20logo%202.png" class="h-8 w-8" alt="Synthify.AI Logo">
                        <span class="ml-2 text-xl font-bold text-gray-900">Synthify.AI</span>
</div>
                </div>
                <div class="hidden md:ml-6 md:flex md:items-center md:space-x-8">
                    <a href="#how-it-works" class="text-gray-700 hover:text-blue-600 px-3 py-2 text-sm font-medium">How It Works</a>
                    <a href="#pricing" class="text-gray-700 hover:text-blue-600 px-3 py-2 text-sm font-medium">Pricing</a>
                    <a href="#industries" class="text-gray-700 hover:text-blue-600 px-3 py-2 text-sm font-medium">Industries</a>
                    <a href="#results" class="text-gray-700 hover:text-blue-600 px-3 py-2 text-sm font-medium">Results</a>
                    <a href="#contact" class="text-gray-700 hover:text-blue-600 px-3 py-2 text-sm font-medium">Contact</a>
<button class="ml-8 inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
                        Book a Demo
                    </button>
                </div>
                <div class="-mr-2 flex items-center md:hidden">
                    <button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-blue-500" aria-controls="mobile-menu" aria-expanded="false">
                        <i data-feather="menu"></i>
                    </button>
                </div>
            </div>
        </div>
    </nav>

    <!-- Hero Section -->
    <div class="hero-gradient">
        <div class="max-w-7xl mx-auto py-16 px-4 sm:py-24 sm:px-6 lg:px-8">
            <div class="text-center">
                <h1 class="text-4xl font-extrabold tracking-tight text-gray-900 sm:text-5xl md:text-6xl">
                    <span class="block">AI Receptionists That Never</span>
                    <span class="block text-blue-600">Sleep, Call In Sick, or Make Mistakes</span>
                </h1>
                <p class="mt-3 max-w-md mx-auto text-base text-gray-600 sm:text-lg md:mt-5 md:text-xl md:max-w-3xl">
                    Synthify.AI handles calls, books appointments, and manages messages - saving your staff hours every day while improving customer experience.
                </p>
                <div class="mt-5 max-w-md mx-auto sm:flex sm:justify-center md:mt-8">
                    <div class="rounded-md shadow">
                        <a href="#contact" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-white bg-blue-600 hover:bg-blue-700 md:py-4 md:text-lg md:px-10">
                            Get Started
                        </a>
                    </div>
                    <div class="mt-3 rounded-md shadow sm:mt-0 sm:ml-3">
                        <a href="#how-it-works" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-blue-600 bg-white hover:bg-gray-50 md:py-4 md:text-lg md:px-10">
                            How It Works
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- How It Works -->
    <div id="how-it-works" class="py-12 bg-white">
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div class="lg:text-center">
                <h2 class="text-base text-blue-600 font-semibold tracking-wide uppercase">Process</h2>
                <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
                    Simple Setup, Powerful Results
                </p>
                <p class="mt-4 max-w-2xl text-xl text-gray-600 lg:mx-auto">
                    Get your AI receptionist up and running in days, not months.
                </p>
            </div>

            <div class="mt-10">
                <div class="space-y-10 md:space-y-0 md:grid md:grid-cols-3 md:gap-x-8 md:gap-y-10">
                    <!-- Step 1 -->
                    <div class="feature-card relative transition-all duration-300 ease-in-out">
                        <div class="absolute flex items-center justify-center h-12 w-12 rounded-md bg-blue-500 text-white">
                            <span class="text-xl font-bold">1</span>
                        </div>
                        <div class="ml-16">
                            <h3 class="text-lg leading-6 font-medium text-gray-900">Setup</h3>
                            <p class="mt-2 text-base text-gray-600">
                                We learn your business specifics, hours, services, and appointment types in a quick onboarding call.
                            </p>
                        </div>
                    </div>

                    <!-- Step 2 -->
                    <div class="feature-card relative transition-all duration-300 ease-in-out">
                        <div class="absolute flex items-center justify-center h-12 w-12 rounded-md bg-blue-500 text-white">
                            <span class="text-xl font-bold">2</span>
                        </div>
                        <div class="ml-16">
                            <h3 class="text-lg leading-6 font-medium text-gray-900">Integration</h3>
                            <p class="mt-2 text-base text-gray-600">
                                We connect with your phone system, calendar, and CRM - no technical work required on your end.
                            </p>
                        </div>
                    </div>

                    <!-- Step 3 -->
                    <div class="feature-card relative transition-all duration-300 ease-in-out">
                        <div class="absolute flex items-center justify-center h-12 w-12 rounded-md bg-blue-500 text-white">
                            <span class="text-xl font-bold">3</span>
                        </div>
                        <div class="ml-16">
                            <h3 class="text-lg leading-6 font-medium text-gray-900">Live Agent</h3>
                            <p class="mt-2 text-base text-gray-600">
                                Your AI receptionist goes live, handling calls 24/7 with human-like conversations tailored to your business.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
<!-- Industries -->
<div id="industries" class="py-12 bg-gray-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div class="lg:text-center">
                <h2 class="text-base text-blue-600 font-semibold tracking-wide uppercase">Industries</h2>
                <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
                    Who We Help
                </p>
                <p class="mt-4 max-w-2xl text-xl text-gray-600 lg:mx-auto">
                    Local service businesses that rely on phone calls to drive revenue.
                </p>
            </div>

            <div class="mt-10">
                <div class="grid gap-10 md:grid-cols-3">
                    <!-- Dentists -->
                    <div class="bg-white overflow-hidden shadow rounded-lg">
                        <div class="px-4 py-5 sm:p-6">
                            <div class="flex items-center">
                                <div class="flex-shrink-0 bg-blue-500 rounded-md p-3">
                                    <i data-feather="activity" class="h-6 w-6 text-white"></i>
                                </div>
                                <div class="ml-5 w-0 flex-1">
                                    <h3 class="text-lg font-medium text-gray-900">Dental Clinics</h3>
                                </div>
                            </div>
                            <div class="mt-4">
                                <p class="text-base text-gray-600">
                                    Never miss another new patient call. Your AI receptionist books appointments, answers FAQs, and follows up with patients automatically.
                                </p>
                            </div>
                        </div>
                    </div>

                    <!-- Pharmacies -->
                    <div class="bg-white overflow-hidden shadow rounded-lg">
                        <div class="px-4 py-5 sm:p-6">
                            <div class="flex items-center">
                                <div class="flex-shrink-0 bg-blue-500 rounded-md p-3">
                                    <i data-feather="plus-circle" class="h-6 w-6 text-white"></i>
                                </div>
                                <div class="ml-5 w-0 flex-1">
                                    <h3 class="text-lg font-medium text-gray-900">Pharmacies</h3>
                                </div>
                            </div>
                            <div class="mt-4">
                                <p class="text-base text-gray-600">
                                    Handle prescription refills, medication questions, and pickup times without adding staff during busy hours.
                                </p>
                            </div>
                        </div>
                    </div>

                    <!-- Service Businesses -->
                    <div class="bg-white overflow-hidden shadow rounded-lg">
                        <div class="px-4 py-5 sm:p-6">
                            <div class="flex items-center">
                                <div class="flex-shrink-0 bg-blue-500 rounded-md p-3">
                                    <i data-feather="scissors" class="h-6 w-6 text-white"></i>
                                </div>
                                <div class="ml-5 w-0 flex-1">
                                    <h3 class="text-lg font-medium text-gray-900">Local Services</h3>
                                </div>
                            </div>
                            <div class="mt-4">
                                <p class="text-base text-gray-600">
                                    Salons, repair shops, contractors - any business that books appointments by phone can benefit from an always-available AI receptionist.
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Results -->
    <div id="results" class="py-12 bg-white">
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div class="lg:text-center">
                <h2 class="text-base text-blue-600 font-semibold tracking-wide uppercase">Results</h2>
                <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
                    Measurable Impact
                </p>
                <p class="mt-4 max-w-2xl text-xl text-gray-600 lg:mx-auto">
                    What our clients experience after implementing Synthify.AI
                </p>
            </div>

            <div class="mt-10 grid gap-10 lg:grid-cols-3">
                <!-- Stat 1 -->
                <div class="bg-white rounded-lg p-6 text-center">
                    <div class="text-5xl font-bold text-blue-600">80%</div>
                    <div class="mt-2 text-lg font-medium text-gray-900">Reduction in Missed Calls</div>
                    <p class="mt-2 text-gray-600">
                        Calls are answered instantly, day or night, even during lunch breaks and holidays.
                    </p>
                </div>

                <!-- Stat 2 -->
                <div class="bg-white rounded-lg p-6 text-center">
                    <div class="text-5xl font-bold text-blue-600">15+</div>
                    <div class="mt-2 text-lg font-medium text-gray-900">Hours Saved Weekly</div>
                    <p class="mt-2 text-gray-600">
                        Staff spend less time on the phone and more time serving customers in person.
                    </p>
                </div>

                <!-- Stat 3 -->
                <div class="bg-white rounded-lg p-6 text-center">
                    <div class="text-5xl font-bold text-blue-600">30%</div>
                    <div class="mt-2 text-lg font-medium text-gray-900">More Appointments Booked</div>
                    <p class="mt-2 text-gray-600">
                        Our AI never forgets to follow up or ask for the appointment, increasing conversions.
                    </p>
                </div>
            </div>

            <!-- Testimonials -->
            <div class="mt-16">
                <h3 class="text-2xl font-bold text-center text-gray-900">What Our Clients Say</h3>
                <div class="mt-8 grid gap-8 md:grid-cols-2 lg:grid-cols-3">
                    <!-- Testimonial 1 -->
                    <div class="testimonial-card p-6 rounded-lg">
                        <div class="flex items-center">
                            <img class="h-12 w-12 rounded-full" src="http://static.photos/medical/200x200/1" alt="Dr. Sarah Johnson">
                            <div class="ml-4">
                                <h4 class="text-lg font-medium">Dr. Sarah Johnson</h4>
                                <p class="text-gray-600">Dental Clinic Owner</p>
                            </div>
                        </div>
                        <div class="mt-4">
                            <p class="text-gray-700 italic">
                                "Synthify.AI has transformed our practice. We went from missing 30% of new patient calls to booking every single one. The AI sounds so natural that patients often don't realize they're not talking to a human."
                            </p>
                        </div>
                    </div>

                    <!-- Testimonial 2 -->
                    <div class="testimonial-card p-6 rounded-lg">
                        <div class="flex items-center">
                            <img class="h-12 w-12 rounded-full" src="http://static.photos/retail/200x200/2" alt="Mike Thompson">
                            <div class="ml-4">
                                <h4 class="text-lg font-medium">Mike Thompson</h4>
                                <p class="text-gray-600">Pharmacy Manager</p>
                            </div>
                        </div>
                        <div class="mt-4">
                            <p class="text-gray-700 italic">
                                "Our staff was overwhelmed with phone calls about refills and hours. Now Synthify handles 80% of these calls automatically, freeing up our pharmacists to focus on patient care."
                            </p>
                        </div>
                    </div>

                    <!-- Testimonial 3 -->
                    <div class="testimonial-card p-6 rounded-lg">
                        <div class="flex items-center">
                            <img class="h-12 w-12 rounded-full" src="http://static.photos/workspace/200x200/3" alt="Lisa Chen">
                            <div class="ml-4">
                                <h4 class="text-lg font-medium">Lisa Chen</h4>
                                <p class="text-gray-600">Salon Owner</p>
                            </div>
                        </div>
                        <div class="mt-4">
                            <p class="text-gray-700 italic">
                                "As a small business, we couldn't afford a full-time receptionist. Synthify gives us professional call handling at a fraction of the cost. Our no-show rate dropped by 40% thanks to the automated reminders."
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Pricing -->
    <div id="pricing" class="py-12 bg-white">
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
            <div class="lg:text-center">
                <h2 class="text-base text-blue-600 font-semibold tracking-wide uppercase">Pricing</h2>
                <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
                    Choose Your Plan
                </p>
                <p class="mt-4 max-w-2xl text-xl text-gray-600 lg:mx-auto">
                    Simple, transparent pricing with no hidden fees.
                </p>
            </div>

            <div class="mt-10 grid gap-8 md:grid-cols-3">
                <!-- Starter Plan -->
                <div class="bg-white rounded-lg shadow-lg overflow-hidden border border-gray-200">
                    <div class="px-6 py-8">
                        <h3 class="text-2xl font-bold text-center text-gray-900">Starter</h3>
                        <div class="mt-4 text-center">
                            <span class="text-4xl font-bold text-gray-900">£449</span>
                            <span class="text-lg font-medium text-gray-600">/month</span>
                        </div>
                        <p class="mt-2 text-center text-gray-600">+ £799 setup fee</p>
<ul class="mt-6 space-y-4">
<li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Up to 200 calls or messages</span>
                            </li>
                            <li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Basic call routing</span>
                            </li>
                            <li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Standard business hours</span>
                            </li>
                            <li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Email support</span>
                            </li>
                        </ul>
                    </div>
                    <div class="px-6 pt-4 pb-8 bg-gray-50 text-center">
                        <a href="#contact" class="w-full inline-flex justify-center items-center px-4 py-3 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700">
                            Book a Demo
                        </a>
                    </div>
                </div>

                <!-- Growth Plan -->
                <div class="bg-white rounded-lg shadow-lg overflow-hidden border-2 border-blue-500 transform scale-105">
                    <div class="px-6 py-8">
                        <div class="absolute top-0 right-0 bg-blue-500 text-white px-3 py-1 text-xs font-bold uppercase">Popular</div>
                        <h3 class="text-2xl font-bold text-center text-gray-900">Growth</h3>
                        <div class="mt-4 text-center">
                            <span class="text-4xl font-bold text-gray-900">£699</span>
                            <span class="text-lg font-medium text-gray-600">/month</span>
                        </div>
                        <p class="mt-2 text-center text-gray-600">+ £1,099 setup fee</p>
<ul class="mt-6 space-y-4">
<li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Up to 600 calls or messages</span>
                            </li>
                            <li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Custom voice and call flow</span>
                            </li>
                            <li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Calendar & CRM integration</span>
                            </li>
                            <li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">After-hours handling</span>
                            </li>
                            <li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Monthly performance report</span>
                            </li>
                        </ul>
                    </div>
                    <div class="px-6 pt-4 pb-8 bg-gray-50 text-center">
                        <a href="#contact" class="w-full inline-flex justify-center items-center px-4 py-3 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700">
                            Book a Demo
                        </a>
                    </div>
                </div>

                <!-- Pro Plan -->
                <div class="bg-white rounded-lg shadow-lg overflow-hidden border border-gray-200">
                    <div class="px-6 py-8">
                        <h3 class="text-2xl font-bold text-center text-gray-900">Pro</h3>
                        <div class="mt-4 text-center">
                            <span class="text-4xl font-bold text-gray-900">£999</span>
                            <span class="text-lg font-medium text-gray-600">/month</span>
                        </div>
                        <p class="mt-2 text-center text-gray-600">+ £1,599 setup fee</p>
<ul class="mt-6 space-y-4">
<li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Unlimited calls and messages</span>
                            </li>
                            <li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Advanced CRM integrations</span>
                            </li>
                            <li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">WhatsApp & SMS support</span>
                            </li>
                            <li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Priority support</span>
                            </li>
                            <li class="flex items-start">
                                <i data-feather="check" class="h-5 w-5 text-green-500"></i>
                                <span class="ml-3 text-gray-700">Dedicated account manager</span>
                            </li>
                        </ul>
                    </div>
                    <div class="px-6 pt-4 pb-8 bg-gray-50 text-center">
                        <a href="#contact" class="w-full inline-flex justify-center items-center px-4 py-3 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700">
                            Book a Demo
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- CTA Section -->
<div class="bg-blue-700">
        <div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:py-16 lg:px-8 lg:flex lg:items-center lg:justify-between">
            <h2 class="text-3xl font-extrabold tracking-tight text-white sm:text-4xl">
                <span class="block">Ready to save time and grow your business?</span>
                <span class="block text-blue-200">Get started with Synthify.AI today.</span>
            </h2>
            <div class="mt-8 flex lg:mt-0 lg:flex-shrink-0">
                <div class="inline-flex rounded-md shadow">
                    <a href="#contact" class="inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-blue-600 bg-white hover:bg-blue-50">
                        Book a Demo
                    </a>
                </div>
                <div class="ml-3 inline-flex rounded-md shadow">
                    <a href="#contact" class="inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-white bg-blue-600 bg-opacity-60 hover:bg-opacity-70">
                        Contact Sales
                    </a>
                </div>
            </div>
        </div>
    </div>
    <!-- Contact Form -->
    <div id="contact" class="bg-gray-50 py-12 px-4 sm:px-6 lg:px-8">
    </div>

    <!-- Legal Footer -->
    <footer class="bg-gray-900 text-white py-12 px-4 sm:px-6 lg:px-8">
        <div class="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-4 gap-8">
            <div class="md:col-span-2">
                <h3 class="text-lg font-bold mb-4">Synthify.AI</h3>
                <p class="text-gray-400">AI receptionists for local businesses that never sleep, call in sick, or make mistakes.</p>
            </div>
            <div>
                <h4 class="text-lg font-bold mb-4">Contact</h4>
                <address class="text-gray-400 not-italic">
                    <p>123 Business Street</p>
                    <p>London, UK</p>
                    <p class="mt-2">hello@synthify.ai</p>
                    <p>+44 123 456 7890</p>
                </address>
            </div>
            <div>
                <h4 class="text-lg font-bold mb-4">Legal</h4>
                <ul class="text-gray-400 space-y-2">
                    <li><a href="#" class="hover:text-white">Terms of Service</a></li>
                    <li><a href="#" class="hover:text-white">Privacy Policy</a></li>
                    <li><a href="#" class="hover:text-white">Cookie Policy</a></li>
                    <li><a href="#" class="hover:text-white">GDPR Compliance</a></li>
                </ul>
            </div>
        </div>
        <div class="max-w-7xl mx-auto mt-8 pt-8 border-t border-gray-800 text-center text-gray-500 text-sm">
            <p>© 2023 Synthify.AI. All rights reserved.</p>
            <p class="mt-2">Synthify.AI is a registered trademark.</p>
        </div>
    </footer>
</body>
</html>