Hugging Face's logo

Spaces:
aimevzulari
/
b-nmbv
Running

App Files Community
aimevzulari commited on
Commit
1d88b49
·
verified ·
1 Parent(s): 2637d55

A clean, minimal yet conversion-optimized landing page for a modern SaaS platform. The hero section presents a 3D animated dashboard mockup with floating UI cards and KPIs, using a soft gradient (blue to violet). Tagline reads: “Scale Smarter, Not Harder.” Call-to-action buttons include “Start Free Trial” and “Schedule a Demo”. Sections include “Features”, “Integrations”, “Pricing”, and “Testimonials”, each with subtle micro-interactions. Footer is compact with logos, FAQs, and live chat bubble. Style: modern tech SaaS, with trust-building design and minimal distractions. - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +717 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: B Nmbv
3
- emoji: 🐠
4
- colorFrom: green
5
- colorTo: green
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: b-nmbv
3
+ emoji: 🐳
4
+ colorFrom: yellow
5
+ colorTo: pink
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,717 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>ScaleFlow | Scale Smarter, Not Harder</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .gradient-bg {
11
+ background: linear-gradient(135deg, #4f46e5 0%, #8b5cf6 100%);
12
+ }
13
+ .dashboard-mockup {
14
+ perspective: 1000px;
15
+ }
16
+ .dashboard-card {
17
+ transform-style: preserve-3d;
18
+ animation: float 8s ease-in-out infinite;
19
+ }
20
+ .kpi-card {
21
+ box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
22
+ transition: all 0.3s ease;
23
+ }
24
+ .kpi-card:hover {
25
+ transform: translateY(-5px);
26
+ }
27
+ .feature-card:hover {
28
+ transform: translateY(-5px);
29
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
30
+ }
31
+ @keyframes float {
32
+ 0% { transform: translateY(0px) rotateY(0deg); }
33
+ 50% { transform: translateY(-20px) rotateY(5deg); }
34
+ 100% { transform: translateY(0px) rotateY(0deg); }
35
+ }
36
+ .testimonial-card {
37
+ transition: all 0.3s ease;
38
+ }
39
+ .testimonial-card:hover {
40
+ transform: scale(1.02);
41
+ }
42
+ .chat-bubble {
43
+ animation: pulse 2s infinite;
44
+ }
45
+ @keyframes pulse {
46
+ 0% { box-shadow: 0 0 0 0 rgba(79, 70, 229, 0.7); }
47
+ 70% { box-shadow: 0 0 0 15px rgba(79, 70, 229, 0); }
48
+ 100% { box-shadow: 0 0 0 0 rgba(79, 70, 229, 0); }
49
+ }
50
+ </style>
51
+ </head>
52
+ <body class="font-sans antialiased text-gray-800">
53
+ <!-- Navigation -->
54
+ <nav class="bg-white shadow-sm fixed w-full z-10">
55
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
56
+ <div class="flex justify-between h-16">
57
+ <div class="flex items-center">
58
+ <div class="flex-shrink-0 flex items-center">
59
+ <svg class="h-8 w-8 text-indigo-600" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
60
+ <path d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
61
+ <path d="M12 8V16" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
62
+ <path d="M8 12H16" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
63
+ </svg>
64
+ <span class="ml-2 text-xl font-bold text-gray-900">ScaleFlow</span>
65
+ </div>
66
+ </div>
67
+ <div class="hidden md:ml-6 md:flex md:items-center md:space-x-8">
68
+ <a href="#features" class="text-gray-500 hover:text-gray-900 px-3 py-2 text-sm font-medium">Features</a>
69
+ <a href="#integrations" class="text-gray-500 hover:text-gray-900 px-3 py-2 text-sm font-medium">Integrations</a>
70
+ <a href="#pricing" class="text-gray-500 hover:text-gray-900 px-3 py-2 text-sm font-medium">Pricing</a>
71
+ <a href="#testimonials" class="text-gray-500 hover:text-gray-900 px-3 py-2 text-sm font-medium">Testimonials</a>
72
+ </div>
73
+ <div class="hidden md:flex items-center space-x-4">
74
+ <a href="#" class="text-gray-500 hover:text-gray-900 px-3 py-2 text-sm font-medium">Log in</a>
75
+ <a href="#" class="bg-indigo-600 text-white px-4 py-2 rounded-md text-sm font-medium hover:bg-indigo-700">Start Free Trial</a>
76
+ </div>
77
+ <div class="-mr-2 flex items-center md:hidden">
78
+ <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-indigo-500" aria-expanded="false" id="mobile-menu-button">
79
+ <span class="sr-only">Open main menu</span>
80
+ <svg class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
81
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
82
+ </svg>
83
+ </button>
84
+ </div>
85
+ </div>
86
+ </div>
87
+
88
+ <!-- Mobile menu -->
89
+ <div class="hidden md:hidden" id="mobile-menu">
90
+ <div class="pt-2 pb-3 space-y-1">
91
+ <a href="#features" class="block px-3 py-2 text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Features</a>
92
+ <a href="#integrations" class="block px-3 py-2 text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Integrations</a>
93
+ <a href="#pricing" class="block px-3 py-2 text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Pricing</a>
94
+ <a href="#testimonials" class="block px-3 py-2 text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Testimonials</a>
95
+ </div>
96
+ <div class="pt-4 pb-3 border-t border-gray-200">
97
+ <div class="flex items-center px-5">
98
+ <div class="flex-shrink-0">
99
+ <svg class="h-10 w-10 rounded-full text-indigo-600" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
100
+ <path d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
101
+ <path d="M12 8V16" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
102
+ <path d="M8 12H16" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
103
+ </svg>
104
+ </div>
105
+ <div class="ml-3">
106
+ <div class="text-base font-medium text-gray-800">Welcome back!</div>
107
+ <div class="text-sm font-medium text-gray-500">Sign in to your account</div>
108
+ </div>
109
+ </div>
110
+ <div class="mt-3 space-y-1 px-2">
111
+ <a href="#" class="block px-3 py-2 text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Log in</a>
112
+ <a href="#" class="block w-full text-center bg-indigo-600 text-white px-4 py-2 rounded-md text-base font-medium hover:bg-indigo-700">Start Free Trial</a>
113
+ </div>
114
+ </div>
115
+ </div>
116
+ </nav>
117
+
118
+ <!-- Hero Section -->
119
+ <div class="pt-24 pb-20 gradient-bg">
120
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
121
+ <div class="lg:grid lg:grid-cols-2 lg:gap-8 items-center">
122
+ <div class="mt-10 sm:mt-12 lg:mt-0">
123
+ <h1 class="text-4xl tracking-tight font-extrabold text-white sm:text-5xl md:text-6xl">
124
+ <span class="block">Scale Smarter,</span>
125
+ <span class="block">Not Harder</span>
126
+ </h1>
127
+ <p class="mt-3 text-base text-indigo-100 sm:mt-5 sm:text-lg sm:max-w-xl sm:mx-auto md:mt-5 md:text-xl lg:mx-0">
128
+ The all-in-one platform to automate, analyze, and accelerate your business growth without the complexity.
129
+ </p>
130
+ <div class="mt-8 sm:flex sm:justify-center lg:justify-start">
131
+ <div class="rounded-md shadow">
132
+ <a href="#" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-indigo-600 bg-white hover:bg-gray-50 md:py-4 md:text-lg md:px-10">
133
+ Start Free Trial
134
+ </a>
135
+ </div>
136
+ <div class="mt-3 rounded-md shadow sm:mt-0 sm:ml-3">
137
+ <a href="#" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-500 bg-opacity-60 hover:bg-opacity-70 md:py-4 md:text-lg md:px-10">
138
+ Schedule a Demo
139
+ </a>
140
+ </div>
141
+ </div>
142
+ <div class="mt-8 flex items-center space-x-4">
143
+ <div class="flex -space-x-2">
144
+ <img class="inline-block h-10 w-10 rounded-full ring-2 ring-white" src="https://images.unsplash.com/photo-1491528323818-fdd1faba62cc?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
145
+ <img class="inline-block h-10 w-10 rounded-full ring-2 ring-white" src="https://images.unsplash.com/photo-1550525811-e5869dd03032?ixlib=rb-1.2.1&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
146
+ <img class="inline-block h-10 w-10 rounded-full ring-2 ring-white" src="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2.25&w=256&h=256&q=80" alt="">
147
+ </div>
148
+ <div class="text-sm text-indigo-100">
149
+ Trusted by <span class="font-bold">5,000+</span> growing businesses
150
+ </div>
151
+ </div>
152
+ </div>
153
+ <div class="dashboard-mockup mt-12 relative sm:max-w-lg sm:mx-auto lg:mt-0 lg:max-w-none lg:mx-0">
154
+ <div class="dashboard-card relative mx-auto w-full rounded-lg shadow-xl overflow-hidden">
155
+ <div class="absolute inset-0 bg-indigo-100 rounded-lg" style="transform: rotate(3deg);"></div>
156
+ <div class="relative bg-white rounded-lg p-4">
157
+ <div class="flex justify-between items-center mb-4">
158
+ <div class="text-sm font-medium text-gray-500">Dashboard</div>
159
+ <div class="flex space-x-2">
160
+ <div class="h-3 w-3 rounded-full bg-red-400"></div>
161
+ <div class="h-3 w-3 rounded-full bg-yellow-400"></div>
162
+ <div class="h-3 w-3 rounded-full bg-green-400"></div>
163
+ </div>
164
+ </div>
165
+ <div class="grid grid-cols-3 gap-4 mb-4">
166
+ <div class="kpi-card bg-indigo-50 rounded-lg p-3">
167
+ <div class="text-xs text-indigo-600 font-medium">Revenue</div>
168
+ <div class="text-xl font-bold text-gray-900">$24,589</div>
169
+ <div class="text-xs text-green-500 flex items-center">
170
+ <svg class="w-3 h-3 mr-1" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
171
+ <path fill-rule="evenodd" d="M5.293 9.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 7.414V15a1 1 0 11-2 0V7.414L6.707 9.707a1 1 0 01-1.414 0z" clip-rule="evenodd"></path>
172
+ </svg>
173
+ 12.5%
174
+ </div>
175
+ </div>
176
+ <div class="kpi-card bg-indigo-50 rounded-lg p-3">
177
+ <div class="text-xs text-indigo-600 font-medium">Users</div>
178
+ <div class="text-xl font-bold text-gray-900">1,842</div>
179
+ <div class="text-xs text-green-500 flex items-center">
180
+ <svg class="w-3 h-3 mr-1" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
181
+ <path fill-rule="evenodd" d="M5.293 9.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 7.414V15a1 1 0 11-2 0V7.414L6.707 9.707a1 1 0 01-1.414 0z" clip-rule="evenodd"></path>
182
+ </svg>
183
+ 8.2%
184
+ </div>
185
+ </div>
186
+ <div class="kpi-card bg-indigo-50 rounded-lg p-3">
187
+ <div class="text-xs text-indigo-600 font-medium">Conversion</div>
188
+ <div class="text-xl font-bold text-gray-900">3.42%</div>
189
+ <div class="text-xs text-red-500 flex items-center">
190
+ <svg class="w-3 h-3 mr-1" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
191
+ <path fill-rule="evenodd" d="M14.707 10.293a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 111.414-1.414L9 12.586V5a1 1 0 012 0v7.586l2.293-2.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
192
+ </svg>
193
+ 1.1%
194
+ </div>
195
+ </div>
196
+ </div>
197
+ <div class="h-48 bg-gray-50 rounded-lg mb-4 flex items-center justify-center">
198
+ <div class="text-gray-400 text-sm">Revenue Chart</div>
199
+ </div>
200
+ <div class="grid grid-cols-2 gap-4">
201
+ <div class="h-20 bg-gray-50 rounded-lg flex items-center justify-center">
202
+ <div class="text-gray-400 text-sm">Recent Activity</div>
203
+ </div>
204
+ <div class="h-20 bg-gray-50 rounded-lg flex items-center justify-center">
205
+ <div class="text-gray-400 text-sm">Top Products</div>
206
+ </div>
207
+ </div>
208
+ </div>
209
+ </div>
210
+ <div class="absolute -bottom-8 -right-8 w-24 h-24 bg-purple-300 rounded-lg opacity-20"></div>
211
+ <div class="absolute -top-8 -left-8 w-20 h-20 bg-blue-300 rounded-lg opacity-20"></div>
212
+ </div>
213
+ </div>
214
+ </div>
215
+ </div>
216
+
217
+ <!-- Logo Cloud -->
218
+ <div class="bg-gray-50 py-12">
219
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
220
+ <p class="text-center text-sm font-semibold uppercase text-gray-500 tracking-wide">
221
+ Trusted by industry leaders
222
+ </p>
223
+ <div class="mt-6 grid grid-cols-2 gap-8 md:grid-cols-6 lg:grid-cols-5">
224
+ <div class="col-span-1 flex justify-center">
225
+ <img class="h-12 opacity-50 hover:opacity-100 transition-opacity" src="https://tailwindui.com/img/logos/tuple-logo-gray-400.svg" alt="Tuple">
226
+ </div>
227
+ <div class="col-span-1 flex justify-center">
228
+ <img class="h-12 opacity-50 hover:opacity-100 transition-opacity" src="https://tailwindui.com/img/logos/mirage-logo-gray-400.svg" alt="Mirage">
229
+ </div>
230
+ <div class="col-span-1 flex justify-center">
231
+ <img class="h-12 opacity-50 hover:opacity-100 transition-opacity" src="https://tailwindui.com/img/logos/statickit-logo-gray-400.svg" alt="StaticKit">
232
+ </div>
233
+ <div class="col-span-1 flex justify-center">
234
+ <img class="h-12 opacity-50 hover:opacity-100 transition-opacity" src="https://tailwindui.com/img/logos/transistor-logo-gray-400.svg" alt="Transistor">
235
+ </div>
236
+ <div class="col-span-1 flex justify-center">
237
+ <img class="h-12 opacity-50 hover:opacity-100 transition-opacity" src="https://tailwindui.com/img/logos/workcation-logo-gray-400.svg" alt="Workcation">
238
+ </div>
239
+ </div>
240
+ </div>
241
+ </div>
242
+
243
+ <!-- Features Section -->
244
+ <div id="features" class="py-16 bg-white">
245
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
246
+ <div class="lg:text-center">
247
+ <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Features</h2>
248
+ <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
249
+ A better way to scale your business
250
+ </p>
251
+ <p class="mt-4 max-w-2xl text-xl text-gray-500 lg:mx-auto">
252
+ Everything you need to automate workflows, understand performance, and make data-driven decisions.
253
+ </p>
254
+ </div>
255
+
256
+ <div class="mt-20">
257
+ <div class="grid grid-cols-1 gap-12 md:grid-cols-2 lg:grid-cols-3">
258
+ <div class="feature-card relative bg-white rounded-lg p-6 shadow-md transition-all duration-300">
259
+ <div class="absolute -top-6 left-6 flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
260
+ <svg class="h-6 w-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
261
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
262
+ </svg>
263
+ </div>
264
+ <h3 class="mt-8 text-lg font-medium text-gray-900">Advanced Analytics</h3>
265
+ <p class="mt-2 text-base text-gray-500">
266
+ Real-time dashboards and custom reports to track KPIs and uncover growth opportunities.
267
+ </p>
268
+ <div class="mt-4">
269
+ <a href="#" class="text-indigo-600 hover:text-indigo-500 text-sm font-medium">Learn more →</a>
270
+ </div>
271
+ </div>
272
+
273
+ <div class="feature-card relative bg-white rounded-lg p-6 shadow-md transition-all duration-300">
274
+ <div class="absolute -top-6 left-6 flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
275
+ <svg class="h-6 w-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
276
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z"></path>
277
+ </svg>
278
+ </div>
279
+ <h3 class="mt-8 text-lg font-medium text-gray-900">Automation Engine</h3>
280
+ <p class="mt-2 text-base text-gray-500">
281
+ Build custom workflows to eliminate manual tasks and focus on what matters most.
282
+ </p>
283
+ <div class="mt-4">
284
+ <a href="#" class="text-indigo-600 hover:text-indigo-500 text-sm font-medium">Learn more →</a>
285
+ </div>
286
+ </div>
287
+
288
+ <div class="feature-card relative bg-white rounded-lg p-6 shadow-md transition-all duration-300">
289
+ <div class="absolute -top-6 left-6 flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
290
+ <svg class="h-6 w-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
291
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 15a4 4 0 004 4h9a5 5 0 10-.1-9.999 5.002 5.002 0 10-9.78 2.096A4.001 4.001 0 003 15z"></path>
292
+ </svg>
293
+ </div>
294
+ <h3 class="mt-8 text-lg font-medium text-gray-900">AI Recommendations</h3>
295
+ <p class="mt-2 text-base text-gray-500">
296
+ Get personalized suggestions to optimize campaigns and improve conversion rates.
297
+ </p>
298
+ <div class="mt-4">
299
+ <a href="#" class="text-indigo-600 hover:text-indigo-500 text-sm font-medium">Learn more →</a>
300
+ </div>
301
+ </div>
302
+
303
+ <div class="feature-card relative bg-white rounded-lg p-6 shadow-md transition-all duration-300">
304
+ <div class="absolute -top-6 left-6 flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
305
+ <svg class="h-6 w-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
306
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
307
+ </svg>
308
+ </div>
309
+ <h3 class="mt-8 text-lg font-medium text-gray-900">Revenue Optimization</h3>
310
+ <p class="mt-2 text-base text-gray-500">
311
+ Identify upsell opportunities and reduce churn with predictive analytics.
312
+ </p>
313
+ <div class="mt-4">
314
+ <a href="#" class="text-indigo-600 hover:text-indigo-500 text-sm font-medium">Learn more →</a>
315
+ </div>
316
+ </div>
317
+
318
+ <div class="feature-card relative bg-white rounded-lg p-6 shadow-md transition-all duration-300">
319
+ <div class="absolute -top-6 left-6 flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
320
+ <svg class="h-6 w-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
321
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"></path>
322
+ </svg>
323
+ </div>
324
+ <h3 class="mt-8 text-lg font-medium text-gray-900">Team Collaboration</h3>
325
+ <p class="mt-2 text-base text-gray-500">
326
+ Share insights and assign tasks without leaving the platform.
327
+ </p>
328
+ <div class="mt-4">
329
+ <a href="#" class="text-indigo-600 hover:text-indigo-500 text-sm font-medium">Learn more →</a>
330
+ </div>
331
+ </div>
332
+
333
+ <div class="feature-card relative bg-white rounded-lg p-6 shadow-md transition-all duration-300">
334
+ <div class="absolute -top-6 left-6 flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
335
+ <svg class="h-6 w-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
336
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"></path>
337
+ </svg>
338
+ </div>
339
+ <h3 class="mt-8 text-lg font-medium text-gray-900">Enterprise Security</h3>
340
+ <p class="mt-2 text-base text-gray-500">
341
+ SOC 2 compliant with role-based access controls and audit logs.
342
+ </p>
343
+ <div class="mt-4">
344
+ <a href="#" class="text-indigo-600 hover:text-indigo-500 text-sm font-medium">Learn more →</a>
345
+ </div>
346
+ </div>
347
+ </div>
348
+ </div>
349
+ </div>
350
+ </div>
351
+
352
+ <!-- Integrations Section -->
353
+ <div id="integrations" class="py-16 bg-gray-50">
354
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
355
+ <div class="lg:text-center">
356
+ <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Integrations</h2>
357
+ <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
358
+ Works with your existing stack
359
+ </p>
360
+ <p class="mt-4 max-w-2xl text-xl text-gray-500 lg:mx-auto">
361
+ Connect with the tools you already use and love.
362
+ </p>
363
+ </div>
364
+
365
+ <div class="mt-10">
366
+ <div class="grid grid-cols-2 gap-8 md:grid-cols-4 lg:grid-cols-6">
367
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
368
+ <img class="max-h-12" src="https://cdn.worldvectorlogo.com/logos/slack-new-logo.svg" alt="Slack">
369
+ </div>
370
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
371
+ <img class="max-h-12" src="https://cdn.worldvectorlogo.com/logos/salesforce-2.svg" alt="Salesforce">
372
+ </div>
373
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
374
+ <img class="max-h-12" src="https://cdn.worldvectorlogo.com/logos/zapier.svg" alt="Zapier">
375
+ </div>
376
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
377
+ <img class="max-h-12" src="https://cdn.worldvectorlogo.com/logos/shopify.svg" alt="Shopify">
378
+ </div>
379
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
380
+ <img class="max-h-12" src="https://cdn.worldvectorlogo.com/logos/google-analytics-3.svg" alt="Google Analytics">
381
+ </div>
382
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
383
+ <img class="max-h-12" src="https://cdn.worldvectorlogo.com/logos/hubspot-3.svg" alt="Hubspot">
384
+ </div>
385
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
386
+ <img class="max-h-12" src="https://cdn.worldvectorlogo.com/logos/mailchimp-freddie-icon.svg" alt="Mailchimp">
387
+ </div>
388
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
389
+ <img class="max-h-12" src="https://cdn.worldvectorlogo.com/logos/quickbooks.svg" alt="Quickbooks">
390
+ </div>
391
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
392
+ <img class="max-h-12" src="https://cdn.worldvectorlogo.com/logos/stripe-4.svg" alt="Stripe">
393
+ </div>
394
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
395
+ <img class="max-h-12" src="https://cdn.worldvectorlogo.com/logos/wordpress-blue.svg" alt="WordPress">
396
+ </div>
397
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
398
+ <img class="max-h-12" src="https://cdn.worldvectorlogo.com/logos/facebook-3.svg" alt="Facebook">
399
+ </div>
400
+ <div class="col-span-1 flex justify-center py-8 px-8 bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow">
401
+ <div class="text-indigo-600 font-bold text-lg">+100 more</div>
402
+ </div>
403
+ </div>
404
+ </div>
405
+ </div>
406
+ </div>
407
+
408
+ <!-- Pricing Section -->
409
+ <div id="pricing" class="py-16 bg-white">
410
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
411
+ <div class="lg:text-center">
412
+ <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Pricing</h2>
413
+ <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
414
+ Simple, transparent pricing
415
+ </p>
416
+ <p class="mt-4 max-w-2xl text-xl text-gray-500 lg:mx-auto">
417
+ Start for free. Upgrade as you grow.
418
+ </p>
419
+ </div>
420
+
421
+ <div class="mt-16">
422
+ <div class="relative bg-white rounded-lg shadow-lg">
423
+ <div class="absolute inset-0 bg-indigo-600 rounded-lg" style="opacity: 0.05;"></div>
424
+ <div class="relative grid grid-cols-1 gap-6 md:grid-cols-3 lg:gap-8 p-6">
425
+ <div class="bg-white rounded-lg shadow-md overflow-hidden">
426
+ <div class="p-6">
427
+ <h3 class="text-lg font-medium text-gray-900">Starter</h3>
428
+ <div class="mt-4 flex items-baseline text-4xl font-extrabold text-gray-900">
429
+ $29
430
+ <span class="ml-1 text-lg font-medium text-gray-500">/mo</span>
431
+ </div>
432
+ <p class="mt-2 text-base text-gray-500">
433
+ Perfect for small teams getting started.
434
+ </p>
435
+ <div class="mt-6">
436
+ <a href="#" class="w-full flex items-center justify-center px-4 py-2 border border-transparent text-base font-medium rounded-md text-indigo-700 bg-indigo-100 hover:bg-indigo-200 md:text-lg">
437
+ Get started
438
+ </a>
439
+ </div>
440
+ </div>
441
+ <div class="border-t border-gray-200 px-6 py-6">
442
+ <h4 class="text-sm font-medium text-gray-900">What's included</h4>
443
+ <ul class="mt-4 space-y-4">
444
+ <li class="flex items-start">
445
+ <div class="flex-shrink-0">
446
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
447
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
448
+ </svg>
449
+ </div>
450
+ <p class="ml-3 text-sm text-gray-700">Up to 10 users</p>
451
+ </li>
452
+ <li class="flex items-start">
453
+ <div class="flex-shrink-0">
454
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
455
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
456
+ </svg>
457
+ </div>
458
+ <p class="ml-3 text-sm text-gray-700">Basic analytics</p>
459
+ </li>
460
+ <li class="flex items-start">
461
+ <div class="flex-shrink-0">
462
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
463
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
464
+ </svg>
465
+ </div>
466
+ <p class="ml-3 text-sm text-gray-700">5 integrations</p>
467
+ </li>
468
+ <li class="flex items-start">
469
+ <div class="flex-shrink-0">
470
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
471
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
472
+ </svg>
473
+ </div>
474
+ <p class="ml-3 text-sm text-gray-700">Email support</p>
475
+ </li>
476
+ </ul>
477
+ </div>
478
+ </div>
479
+
480
+ <div class="bg-white rounded-lg shadow-lg overflow-hidden transform scale-105 z-10">
481
+ <div class="absolute top-0 right-0 bg-indigo-600 text-white text-xs font-bold px-3 py-1 rounded-bl-lg">
482
+ Most popular
483
+ </div>
484
+ <div class="p-6">
485
+ <h3 class="text-lg font-medium text-gray-900">Professional</h3>
486
+ <div class="mt-4 flex items-baseline text-4xl font-extrabold text-gray-900">
487
+ $79
488
+ <span class="ml-1 text-lg font-medium text-gray-500">/mo</span>
489
+ </div>
490
+ <p class="mt-2 text-base text-gray-500">
491
+ For growing teams with advanced needs.
492
+ </p>
493
+ <div class="mt-6">
494
+ <a href="#" class="w-full flex items-center justify-center px-4 py-2 border border-transparent text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 md:text-lg">
495
+ Get started
496
+ </a>
497
+ </div>
498
+ </div>
499
+ <div class="border-t border-gray-200 px-6 py-6">
500
+ <h4 class="text-sm font-medium text-gray-900">What's included</h4>
501
+ <ul class="mt-4 space-y-4">
502
+ <li class="flex items-start">
503
+ <div class="flex-shrink-0">
504
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
505
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
506
+ </svg>
507
+ </div>
508
+ <p class="ml-3 text-sm text-gray-700">Up to 50 users</p>
509
+ </li>
510
+ <li class="flex items-start">
511
+ <div class="flex-shrink-0">
512
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
513
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
514
+ </svg>
515
+ </div>
516
+ <p class="ml-3 text-sm text-gray-700">Advanced analytics</p>
517
+ </li>
518
+ <li class="flex items-start">
519
+ <div class="flex-shrink-0">
520
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
521
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
522
+ </svg>
523
+ </div>
524
+ <p class="ml-3 text-sm text-gray-700">Unlimited integrations</p>
525
+ </li>
526
+ <li class="flex items-start">
527
+ <div class="flex-shrink-0">
528
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
529
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
530
+ </svg>
531
+ </div>
532
+ <p class="ml-3 text-sm text-gray-700">Priority support</p>
533
+ </li>
534
+ <li class="flex items-start">
535
+ <div class="flex-shrink-0">
536
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
537
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
538
+ </svg>
539
+ </div>
540
+ <p class="ml-3 text-sm text-gray-700">Workflow automation</p>
541
+ </li>
542
+ </ul>
543
+ </div>
544
+ </div>
545
+
546
+ <div class="bg-white rounded-lg shadow-md overflow-hidden">
547
+ <div class="p-6">
548
+ <h3 class="text-lg font-medium text-gray-900">Enterprise</h3>
549
+ <div class="mt-4 flex items-baseline text-4xl font-extrabold text-gray-900">
550
+ Custom
551
+ </div>
552
+ <p class="mt-2 text-base text-gray-500">
553
+ For organizations with complex requirements.
554
+ </p>
555
+ <div class="mt-6">
556
+ <a href="#" class="w-full flex items-center justify-center px-4 py-2 border border-transparent text-base font-medium rounded-md text-indigo-700 bg-indigo-100 hover:bg-indigo-200 md:text-lg">
557
+ Contact sales
558
+ </a>
559
+ </div>
560
+ </div>
561
+ <div class="border-t border-gray-200 px-6 py-6">
562
+ <h4 class="text-sm font-medium text-gray-900">What's included</h4>
563
+ <ul class="mt-4 space-y-4">
564
+ <li class="flex items-start">
565
+ <div class="flex-shrink-0">
566
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
567
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
568
+ </svg>
569
+ </div>
570
+ <p class="ml-3 text-sm text-gray-700">Unlimited users</p>
571
+ </li>
572
+ <li class="flex items-start">
573
+ <div class="flex-shrink-0">
574
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
575
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
576
+ </svg>
577
+ </div>
578
+ <p class="ml-3 text-sm text-gray-700">Enterprise analytics</p>
579
+ </li>
580
+ <li class="flex items-start">
581
+ <div class="flex-shrink-0">
582
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
583
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
584
+ </svg>
585
+ </div>
586
+ <p class="ml-3 text-sm text-gray-700">Dedicated integrations</p>
587
+ </li>
588
+ <li class="flex items-start">
589
+ <div class="flex-shrink-0">
590
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
591
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
592
+ </svg>
593
+ </div>
594
+ <p class="ml-3 text-sm text-gray-700">24/7 support</p>
595
+ </li>
596
+ <li class="flex items-start">
597
+ <div class="flex-shrink-0">
598
+ <svg class="h-5 w-5 text-green-500" fill="currentColor" viewBox="0 0 20 20">
599
+ <path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
600
+ </svg>
601
+ </div>
602
+ <p class="ml-3 text-sm text-gray-700">Custom AI models</p>
603
+ </li>
604
+ </ul>
605
+ </div>
606
+ </div>
607
+ </div>
608
+ </div>
609
+ </div>
610
+ </div>
611
+ </div>
612
+
613
+ <!-- Testimonials Section -->
614
+ <div id="testimonials" class="py-16 bg-gray-50">
615
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
616
+ <div class="lg:text-center">
617
+ <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Testimonials</h2>
618
+ <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
619
+ Trusted by businesses worldwide
620
+ </p>
621
+ <p class="mt-4 max-w-2xl text-xl text-gray-500 lg:mx-auto">
622
+ Don't just take our word for it. Here's what our customers say.
623
+ </p>
624
+ </div>
625
+
626
+ <div class="mt-16 grid grid-cols-1 gap-8 md:grid-cols-2 lg:grid-cols-3">
627
+ <div class="testimonial-card bg-white rounded-lg shadow-md p-6">
628
+ <div class="flex items-center">
629
+ <div class="flex-shrink-0">
630
+ <img class="h-12 w-12 rounded-full" src="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
631
+ </div>
632
+ <div class="ml-4">
633
+ <div class="text-lg font-medium text-gray-900">Leslie Alexander</div>
634
+ <div class="text-sm text-gray-500">CEO, TechCorp</div>
635
+ </div>
636
+ </div>
637
+ <div class="mt-4">
638
+ <p class="text-gray-600 italic">
639
+ "ScaleFlow has transformed how we analyze our business performance. The dashboards are intuitive yet powerful, and the automation features have saved us hundreds of hours."
640
+ </p>
641
+ </div>
642
+ <div class="mt-4 flex">
643
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
644
+ <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
645
+ </svg>
646
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
647
+ <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
648
+ </svg>
649
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
650
+ <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
651
+ </svg>
652
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
653
+ <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
654
+ </svg>
655
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
656
+ <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
657
+ </svg>
658
+ </div>
659
+ </div>
660
+
661
+ <div class="testimonial-card bg-white rounded-lg shadow-md p-6">
662
+ <div class="flex items-center">
663
+ <div class="flex-shrink-0">
664
+ <img class="h-12 w-12 rounded-full" src="https://images.unsplash.com/photo-1519244703995-f4e0f30006d5?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
665
+ </div>
666
+ <div class="ml-4">
667
+ <div class="text-lg font-medium text-gray-900">Michael Foster</div>
668
+ <div class="text-sm text-gray-500">Growth Lead, StartupX</div>
669
+ </div>
670
+ </div>
671
+ <div class="mt-4">
672
+ <p class="text-gray-600 italic">
673
+ "The automation capabilities alone have paid for the platform ten times over. We've scaled from 10 to 50 employees without adding operational complexity."
674
+ </p>
675
+ </div>
676
+ <div class="mt-4 flex">
677
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
678
+ <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
679
+ </svg>
680
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
681
+ <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
682
+ </svg>
683
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
684
+ <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
685
+ </svg>
686
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
687
+ <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
688
+ </svg>
689
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
690
+ <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
691
+ </svg>
692
+ </div>
693
+ </div>
694
+
695
+ <div class="testimonial-card bg-white rounded-lg shadow-md p-6">
696
+ <div class="flex items-center">
697
+ <div class="flex-shrink-0">
698
+ <img class="h-12 w-12 rounded-full" src="https://images.unsplash.com/photo-1506794778202-cad84cf45f1d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
699
+ </div>
700
+ <div class="ml-4">
701
+ <div class="text-lg font-medium text-gray-900">Dries Vincent</div>
702
+ <div class="text-sm text-gray-500">CTO, EnterpriseCo</div>
703
+ </div>
704
+ </div>
705
+ <div class="mt-4">
706
+ <p class="text-gray-600 italic">
707
+ "We evaluated dozens of platforms before choosing ScaleFlow. The custom AI recommendations have helped us optimize our funnel in ways we never considered."
708
+ </p>
709
+ </div>
710
+ <div class="mt-4 flex">
711
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
712
+ <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
713
+ </svg>
714
+ <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
715
+
716
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=aimevzulari/b-nmbv" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
717
+ </html>