Hugging Face's logo

Spaces:
sdurdiyev
/
ratedispatch3
Running

App Files Community
sdurdiyev commited on
Commit
7aa4fb0
·
verified ·
1 Parent(s): 9073b17

Add 2 files

Browse files
Files changed (2) hide show
  1. index.html +341 -371
  2. prompts.txt +2 -1
index.html CHANGED
@@ -3,7 +3,7 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>RateDispatch - Connecting Dispatchers & Carriers</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>
@@ -25,17 +25,24 @@
25
  color: transparent;
26
  }
27
 
28
- .feature-card:hover {
29
- transform: translateY(-5px);
30
- box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
31
  }
32
 
33
- .testimonial-card {
34
- transition: all 0.3s ease;
 
 
 
 
 
 
 
35
  }
36
 
37
- .testimonial-card:hover {
38
- transform: scale(1.02);
 
39
  }
40
 
41
  .nav-link:hover {
@@ -50,6 +57,20 @@
50
  transform: translateY(-2px);
51
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
52
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
53
  </style>
54
  </head>
55
  <body>
@@ -59,14 +80,14 @@
59
  <div class="flex justify-between h-16">
60
  <div class="flex items-center">
61
  <div class="flex-shrink-0 flex items-center">
62
- <div class="flex items-center">
63
  <i class="fas fa-truck-moving text-3xl mr-2 logo-text"></i>
64
  <span class="text-xl font-bold logo-text">RateDispatch</span>
65
- </div>
66
  </div>
67
  <div class="hidden sm:ml-6 sm:flex sm:space-x-8">
68
- <a href="#" class="nav-link border-indigo-500 text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Home</a>
69
- <a href="#" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">How It Works</a>
70
  <a href="#" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Features</a>
71
  <a href="#" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Pricing</a>
72
  </div>
@@ -87,8 +108,8 @@
87
  <!-- Mobile menu, show/hide based on menu state. -->
88
  <div class="sm:hidden hidden" id="mobile-menu">
89
  <div class="pt-2 pb-3 space-y-1">
90
- <a href="#" class="bg-indigo-50 border-indigo-500 text-indigo-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Home</a>
91
- <a href="#" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">How It Works</a>
92
  <a href="#" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Features</a>
93
  <a href="#" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Pricing</a>
94
  <div class="pt-4 pb-3 border-t border-gray-200">
@@ -108,232 +129,193 @@
108
  <div class="max-w-7xl mx-auto py-16 px-4 sm:py-24 sm:px-6 lg:px-8">
109
  <div class="text-center">
110
  <h1 class="text-4xl font-extrabold tracking-tight sm:text-5xl lg:text-6xl">
111
- The Future of Freight Matching
112
  </h1>
113
  <p class="mt-6 max-w-2xl mx-auto text-xl">
114
- Connecting top dispatchers with reliable carriers in a seamless digital ecosystem.
115
  </p>
116
- <div class="mt-10 flex justify-center space-x-4">
117
- <a href="#" class="btn-primary bg-white text-indigo-600 px-8 py-3 border border-transparent rounded-md text-base font-medium hover:bg-indigo-50 md:py-4 md:text-lg md:px-10">
118
- Find Dispatchers
119
- </a>
120
- <a href="#" class="btn-primary bg-indigo-600 bg-opacity-80 hover:bg-opacity-100 px-8 py-3 border border-transparent rounded-md text-base font-medium text-white md:py-4 md:text-lg md:px-10">
121
- Find Carriers
122
- </a>
123
- </div>
124
  </div>
125
  </div>
126
  </div>
127
 
128
- <!-- Stats Section -->
129
- <div class="bg-white py-12">
130
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
131
- <div class="lg:text-center">
132
- <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Trusted by the industry</h2>
133
- <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
134
- Powering the future of freight
135
- </p>
136
- </div>
137
-
138
- <div class="mt-10">
139
- <div class="grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-4">
140
- <div class="text-center">
141
- <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white mx-auto">
142
- <i class="fas fa-users text-xl"></i>
143
- </div>
144
- <div class="mt-5">
145
- <h3 class="text-lg leading-6 font-medium text-gray-900">5,000+</h3>
146
- <p class="mt-2 text-base text-gray-500">Registered Dispatchers</p>
147
- </div>
148
- </div>
149
-
150
- <div class="text-center">
151
- <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white mx-auto">
152
- <i class="fas fa-truck text-xl"></i>
153
- </div>
154
- <div class="mt-5">
155
- <h3 class="text-lg leading-6 font-medium text-gray-900">12,000+</h3>
156
- <p class="mt-2 text-base text-gray-500">Verified Carriers</p>
157
- </div>
158
- </div>
159
-
160
- <div class="text-center">
161
- <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white mx-auto">
162
- <i class="fas fa-shipping-fast text-xl"></i>
163
- </div>
164
- <div class="mt-5">
165
- <h3 class="text-lg leading-6 font-medium text-gray-900">1M+</h3>
166
- <p class="mt-2 text-base text-gray-500">Loads Matched</p>
167
- </div>
168
- </div>
169
-
170
- <div class="text-center">
171
- <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white mx-auto">
172
- <i class="fas fa-dollar-sign text-xl"></i>
173
- </div>
174
- <div class="mt-5">
175
- <h3 class="text-lg leading-6 font-medium text-gray-900">$250M+</h3>
176
- <p class="mt-2 text-base text-gray-500">In Freight Revenue</p>
177
- </div>
178
- </div>
179
- </div>
180
  </div>
181
  </div>
182
  </div>
183
 
184
- <!-- How It Works Section -->
185
- <div class="bg-gray-50 py-16">
186
- <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
187
- <div class="lg:text-center">
188
- <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Process</h2>
189
- <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
190
- How RateDispatch Works
191
- </p>
192
- <p class="mt-4 max-w-2xl text-xl text-gray-500 lg:mx-auto">
193
- A simple 3-step process to connect dispatchers and carriers efficiently.
194
- </p>
195
- </div>
 
196
 
197
- <div class="mt-20">
198
- <div class="space-y-10 md:space-y-0 md:grid md:grid-cols-3 md:gap-x-8 md:gap-y-10">
199
- <div class="relative feature-card transition-all duration-300 ease-in-out bg-white p-6 rounded-lg shadow">
200
- <div class="absolute -top-6 left-6 h-12 w-12 rounded-md bg-indigo-500 text-white flex items-center justify-center">
201
- <span class="text-xl font-bold">1</span>
202
- </div>
203
- <h3 class="mt-8 text-lg leading-6 font-medium text-gray-900">Create Your Profile</h3>
204
- <p class="mt-2 text-base text-gray-500">
205
- Whether you're a dispatcher or carrier, create a detailed profile showcasing your experience, specialties, and ratings.
206
- </p>
207
- <div class="mt-6">
208
- <i class="fas fa-user-tie text-indigo-500 text-4xl"></i>
 
 
209
  </div>
210
- </div>
211
 
212
- <div class="relative feature-card transition-all duration-300 ease-in-out bg-white p-6 rounded-lg shadow">
213
- <div class="absolute -top-6 left-6 h-12 w-12 rounded-md bg-indigo-500 text-white flex items-center justify-center">
214
- <span class="text-xl font-bold">2</span>
 
 
 
 
 
 
 
 
 
215
  </div>
216
- <h3 class="mt-8 text-lg leading-6 font-medium text-gray-900">Match & Connect</h3>
217
- <p class="mt-2 text-base text-gray-500">
218
- Our AI-powered system matches you with the perfect partners based on your needs and preferences.
219
- </p>
220
- <div class="mt-6">
221
- <i class="fas fa-handshake text-indigo-500 text-4xl"></i>
 
 
 
 
 
 
 
222
  </div>
223
- </div>
224
 
225
- <div class="relative feature-card transition-all duration-300 ease-in-out bg-white p-6 rounded-lg shadow">
226
- <div class="absolute -top-6 left-6 h-12 w-12 rounded-md bg-indigo-500 text-white flex items-center justify-center">
227
- <span class="text-xl font-bold">3</span>
 
 
 
 
 
 
 
 
 
228
  </div>
229
- <h3 class="mt-8 text-lg leading-6 font-medium text-gray-900">Grow Your Business</h3>
230
- <p class="mt-2 text-base text-gray-500">
231
- Build long-term partnerships, increase your revenue, and grow your business with our tools and analytics.
232
- </p>
233
- <div class="mt-6">
234
- <i class="fas fa-chart-line text-indigo-500 text-4xl"></i>
 
 
 
 
 
 
 
235
  </div>
236
  </div>
237
  </div>
238
  </div>
239
  </div>
240
- </div>
241
 
242
- <!-- Features Section -->
243
- <div class="bg-white py-16">
244
- <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
245
- <div class="lg:text-center">
246
- <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Features</h2>
247
- <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
248
- Built for the Modern Freight Industry
249
- </p>
250
- <p class="mt-4 max-w-2xl text-xl text-gray-500 lg:mx-auto">
251
- Everything you need to succeed in today's competitive logistics market.
252
- </p>
253
- </div>
254
 
255
- <div class="mt-20">
256
- <div class="space-y-10 md:space-y-0 md:grid md:grid-cols-2 md:gap-x-8 md:gap-y-10">
257
- <div class="flex">
258
- <div class="flex-shrink-0">
259
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
260
- <i class="fas fa-search-dollar"></i>
261
  </div>
262
- </div>
263
- <div class="ml-4">
264
- <h3 class="text-lg leading-6 font-medium text-gray-900">Smart Matching Algorithm</h3>
265
- <p class="mt-2 text-base text-gray-500">
266
- Our proprietary algorithm analyzes hundreds of data points to connect you with the perfect dispatcher or carrier for your specific needs.
267
  </p>
268
  </div>
269
- </div>
270
 
271
- <div class="flex">
272
- <div class="flex-shrink-0">
273
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
274
- <i class="fas fa-shield-alt"></i>
275
  </div>
276
- </div>
277
- <div class="ml-4">
278
- <h3 class="text-lg leading-6 font-medium text-gray-900">Verified Partners</h3>
279
- <p class="mt-2 text-base text-gray-500">
280
- Every dispatcher and carrier undergoes a rigorous verification process to ensure reliability and professionalism.
281
  </p>
282
  </div>
283
- </div>
284
 
285
- <div class="flex">
286
- <div class="flex-shrink-0">
287
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
288
- <i class="fas fa-comments-dollar"></i>
289
  </div>
290
- </div>
291
- <div class="ml-4">
292
- <h3 class="text-lg leading-6 font-medium text-gray-900">Transparent Pricing</h3>
293
- <p class="mt-2 text-base text-gray-500">
294
- Clear, upfront pricing with no hidden fees. See exactly what you'll pay before making any commitments.
295
  </p>
296
  </div>
297
- </div>
298
 
299
- <div class="flex">
300
- <div class="flex-shrink-0">
301
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
302
- <i class="fas fa-mobile-alt"></i>
303
  </div>
304
- </div>
305
- <div class="ml-4">
306
- <h3 class="text-lg leading-6 font-medium text-gray-900">Mobile Optimized</h3>
307
- <p class="mt-2 text-base text-gray-500">
308
- Manage your freight partnerships on the go with our fully responsive mobile interface.
309
  </p>
310
  </div>
311
- </div>
312
 
313
- <div class="flex">
314
- <div class="flex-shrink-0">
315
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
316
  <i class="fas fa-file-contract"></i>
317
  </div>
318
- </div>
319
- <div class="ml-4">
320
- <h3 class="text-lg leading-6 font-medium text-gray-900">Contract Management</h3>
321
- <p class="mt-2 text-base text-gray-500">
322
- Create, sign, and manage contracts directly within the platform with our built-in document tools.
323
  </p>
324
  </div>
325
- </div>
326
 
327
- <div class="flex">
328
- <div class="flex-shrink-0">
329
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
330
- <i class="fas fa-headset"></i>
331
  </div>
332
- </div>
333
- <div class="ml-4">
334
- <h3 class="text-lg leading-6 font-medium text-gray-900">24/7 Support</h3>
335
- <p class="mt-2 text-base text-gray-500">
336
- Our dedicated support team is available around the clock to help with any questions or issues.
337
  </p>
338
  </div>
339
  </div>
@@ -342,212 +324,200 @@
342
  </div>
343
  </div>
344
 
345
- <!-- Testimonials -->
346
- <div class="gradient-bg py-16">
347
- <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
348
- <div class="lg:text-center">
349
- <h2 class="text-base text-indigo-200 font-semibold tracking-wide uppercase">Testimonials</h2>
350
- <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-white sm:text-4xl">
351
- What Our Users Say
352
- </p>
353
- </div>
354
-
355
- <div class="mt-16 grid gap-8 lg:grid-cols-3">
356
- <div class="testimonial-card bg-white p-8 rounded-lg shadow-lg">
357
- <div class="flex items-center">
358
- <div class="flex-shrink-0">
359
- <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="">
360
- </div>
361
- <div class="ml-4">
362
- <h4 class="text-lg font-medium text-gray-900">Sarah Johnson</h4>
363
- <p class="text-indigo-600">Freight Dispatcher</p>
364
- </div>
365
- </div>
366
- <p class="mt-4 text-gray-600">
367
- "RateDispatch has completely transformed my business. I've connected with reliable carriers who understand my needs, and my revenue has increased by 40% in just six months."
368
  </p>
369
- <div class="mt-4 flex text-yellow-400">
370
- <i class="fas fa-star"></i>
371
- <i class="fas fa-star"></i>
372
- <i class="fas fa-star"></i>
373
- <i class="fas fa-star"></i>
374
- <i class="fas fa-star"></i>
375
- </div>
376
  </div>
377
 
378
- <div class="testimonial-card bg-white p-8 rounded-lg shadow-lg">
379
- <div class="flex items-center">
380
- <div class="flex-shrink-0">
381
- <img class="h-12 w-12 rounded-full" src="https://images.unsplash.com/photo-1570295999919-56ceb5ecca61?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
 
 
 
 
 
 
 
 
 
 
382
  </div>
383
- <div class="ml-4">
384
- <h4 class="text-lg font-medium text-gray-900">Michael Rodriguez</h4>
385
- <p class="text-indigo-600">Trucking Company Owner</p>
 
 
 
 
 
 
 
 
 
 
386
  </div>
387
- </div>
388
- <p class="mt-4 text-gray-600">
389
- "Finding good dispatchers used to be a nightmare. With RateDispatch Sync, I can browse profiles, see ratings, and connect with professionals who actually understand my business."
390
- </p>
391
- <div class="mt-4 flex text-yellow-400">
392
- <i class="fas fa-star"></i>
393
- <i class="fas fa-star"></i>
394
- <i class="fas fa-star"></i>
395
- <i class="fas fa-star"></i>
396
- <i class="fas fa-star"></i>
397
- </div>
398
- </div>
399
 
400
- <div class="testimonial-card bg-white p-8 rounded-lg shadow-lg">
401
- <div class="flex items-center">
402
- <div class="flex-shrink-0">
403
- <img class="h-12 w-12 rounded-full" src="https://images.unsplash.com/photo-1566492031773-4f4e44671857?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
 
 
 
 
 
 
 
 
404
  </div>
405
- <div class="ml-4">
406
- <h4 class="text-lg font-medium text-gray-900">David Chen</h4>
407
- <p class="text-indigo-600">Logistics Manager</p>
 
 
 
 
 
 
 
 
 
 
408
  </div>
409
- </div>
410
- <p class="mt-4 text-gray-600">
411
- "The platform's analytics tools give me incredible insights into my operations. I've optimized my routes and reduced empty miles by 22% since joining."
412
- </p>
413
- <div class="mt-4 flex text-yellow-400">
414
- <i class="fas fa-star"></i>
415
- <i class="fas fa-star"></i>
416
- <i class="fas fa-star"></i>
417
- <i class="fas fa-star"></i>
418
- <i class="fas fa-star-half-alt"></i>
419
- </div>
420
- </div>
421
- </div>
422
- </div>
423
- </div>
424
 
425
- <!-- CTA Section -->
426
- <div class="bg-white">
427
- <div class="max-w-7xl mx-auto py-16 px-4 sm:px-6 lg:px-8">
428
- <div class="bg-indigo-700 rounded-lg shadow-xl overflow-hidden lg:grid lg:grid-cols-2 lg:gap-4">
429
- <div class="pt-10 pb-12 px-6 sm:pt-16 sm:px-16 lg:py-16 lg:pr-0 xl:py-20 xl:px-20">
430
- <div class="lg:self-center">
431
- <h2 class="text-3xl font-extrabold text-white sm:text-4xl">
432
- <span class="block">Ready to transform your freight business?</span>
433
- </h2>
434
- <p class="mt-4 text-lg leading-6 text-indigo-200">
435
- Join thousands of dispatchers and carriers who are already benefiting from our platform.
436
- </p>
437
- <div class="mt-8 flex">
438
- <div class="inline-flex rounded-md shadow">
439
- <a href="#" class="btn-primary inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-indigo-600 bg-white hover:bg-indigo-50">
440
- Get Started
441
- </a>
442
- </div>
443
- <div class="ml-3 inline-flex rounded-md shadow">
444
- <a href="#" class="btn-primary inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-600 bg-opacity-60 hover:bg-opacity-70">
445
- Live Demo
446
- </a>
447
  </div>
448
  </div>
449
  </div>
450
  </div>
451
- <div class="-mt-6 aspect-w-5 aspect-h-3 md:aspect-w-2 md:aspect-h-1">
452
- <img class="transform translate-x-6 translate-y-6 rounded-md object-cover object-left-top sm:translate-x-16 lg:translate-y-20" src="https://images.unsplash.com/photo-1520333789090-1afc82db536a?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1351&q=80" alt="Truck on highway">
453
- </div>
454
  </div>
455
  </div>
456
- </div>
457
 
458
- <!-- Footer -->
459
- <footer class="bg-gray-800">
460
- <div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
461
- <div class="grid grid-cols-2 md:grid-cols-4 gap-8">
462
- <div>
463
- <h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">Solutions</h3>
464
- <ul class="mt-4 space-y-4">
465
- <li><a href="#" class="text-base text-gray-300 hover:text-white">For Dispatchers</a></li>
466
- <li><a href="#" class="text-base text-gray-300 hover:text-white">For Carriers</a></li>
467
- <li><a href="#" class="text-base text-gray-300 hover:text-white">For Brokers</a></li>
468
- <li><a href="#" class="text-base text-gray-300 hover:text-white">Enterprise</a></li>
469
- </ul>
470
- </div>
471
- <div>
472
- <h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">Support</h3>
473
- <ul class="mt-4 space-y-4">
474
- <li><a href="#" class="text-base text-gray-300 hover:text-white">Help Center</a></li>
475
- <li><a href="#" class="text-base text-gray-300 hover:text-white">Guides</a></li>
476
- <li><a href="#" class="text-base text-gray-300 hover:text-white">API Status</a></li>
477
- <li><a href="#" class="text-base text-gray-300 hover:text-white">Contact Us</a></li>
478
- </ul>
479
- </div>
480
- <div>
481
- <h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">Company</h3>
482
- <ul class="mt-4 space-y-4">
483
- <li><a href="#" class="text-base text-gray-300 hover:text-white">About</a></li>
484
- <li><a href="#" class="text-base text-gray-300 hover:text-white">Blog</a></li>
485
- <li><a href="#" class="text-base text-gray-300 hover:text-white">Careers</a></li>
486
- <li><a href="#" class="text-base text-gray-300 hover:text-white">Press</a></li>
487
- </ul>
488
- </div>
489
- <div>
490
- <h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase">Legal</h3>
491
- <ul class="mt-4 space-y-4">
492
- <li><a href="#" class="text-base text-gray-300 hover:text-white">Privacy</a></li>
493
- <li><a href="#" class="text-base text-gray-300 hover:text-white">Terms</a></li>
494
- <li><a href="#" class="text-base text-gray-300 hover:text-white">Cookie Policy</a></li>
495
- <li><a href="#" class="text-base text-gray-300 hover:text-white">Licenses</a></li>
496
- </ul>
497
  </div>
498
- </div>
499
- <div class="mt-12 border-t border-gray-700 pt-8">
500
- <div class="md:flex md:items-center md:justify-between">
501
- <div class="flex justify-center space-x-6 md:order-2">
502
- <a href="#" class="text-gray-400 hover:text-white">
503
- <span class="sr-only">Facebook</span>
504
- <i class="fab fa-facebook-f"></i>
505
- </a>
506
- <a href="#" class="text-gray-400 hover:text-white">
507
- <span class="sr-only">Twitter</span>
508
- <i class="fab fa-twitter"></i>
509
- </a>
510
- <a href="#" class="text-gray-400 hover:text-white">
511
- <span class="sr-only">LinkedIn</span>
512
- <i class="fab fa-linkedin-in"></i>
513
- </a>
514
- <a href="#" class="text-gray-400 hover:text-white">
515
- <span class="sr-only">Instagram</span>
516
- <i class="fab fa-instagram"></i>
517
- </a>
518
- </div>
519
- <div class="mt-8 md:mt-0 md:order-1">
520
- <p class="text-center text-base text-gray-400">
521
- &copy; 2023 RateDispatch. All rights reserved.
522
- </p>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
523
  </div>
524
  </div>
525
  </div>
526
  </div>
527
- </footer>
528
 
529
- <script>
530
- // Mobile menu toggle
531
- document.querySelector('[aria-controls="mobile-menu"]').addEventListener('click', function() {
532
- const menu = document.getElementById('mobile-menu');
533
- if (menu.classList.contains('hidden')) {
534
- menu.classList.remove('hidden');
535
- menu.classList.add('block');
536
- } else {
537
- menu.classList.remove('block');
538
- menu.classList.add('hidden');
539
- }
540
- });
 
541
 
542
- // Smooth scrolling for anchor links
543
- document.querySelectorAll('a[href^="#"]').forEach(anchor => {
544
- anchor.addEventListener('click', function (e) {
545
- e.preventDefault();
546
- document.querySelector(this.getAttribute('href')).scrollIntoView({
547
- behavior: 'smooth'
548
- });
549
- });
550
- });
551
- </script>
552
- <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=sdurdiyev/ratedispatch3" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
 
 
 
 
553
  </html>
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>How It Works - RateDispatch</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>
 
25
  color: transparent;
26
  }
27
 
28
+ .process-step {
29
+ position: relative;
 
30
  }
31
 
32
+ .process-step:not(:last-child):after {
33
+ content: "";
34
+ position: absolute;
35
+ left: 50%;
36
+ top: 100%;
37
+ height: 80px;
38
+ width: 2px;
39
+ background: #e5e7eb;
40
+ transform: translateX(-50%);
41
  }
42
 
43
+ .feature-card:hover {
44
+ transform: translateY(-5px);
45
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
46
  }
47
 
48
  .nav-link:hover {
 
57
  transform: translateY(-2px);
58
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
59
  }
60
+
61
+ .tab-content {
62
+ display: none;
63
+ }
64
+
65
+ .tab-content.active {
66
+ display: block;
67
+ animation: fadeIn 0.5s ease-in-out;
68
+ }
69
+
70
+ @keyframes fadeIn {
71
+ from { opacity: 0; }
72
+ to { opacity: 1; }
73
+ }
74
  </style>
75
  </head>
76
  <body>
 
80
  <div class="flex justify-between h-16">
81
  <div class="flex items-center">
82
  <div class="flex-shrink-0 flex items-center">
83
+ <a href="index.html" class="flex items-center">
84
  <i class="fas fa-truck-moving text-3xl mr-2 logo-text"></i>
85
  <span class="text-xl font-bold logo-text">RateDispatch</span>
86
+ </a>
87
  </div>
88
  <div class="hidden sm:ml-6 sm:flex sm:space-x-8">
89
+ <a href="index.html" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Home</a>
90
+ <a href="how-it-works.html" class="nav-link border-indigo-500 text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">How It Works</a>
91
  <a href="#" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Features</a>
92
  <a href="#" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Pricing</a>
93
  </div>
 
108
  <!-- Mobile menu, show/hide based on menu state. -->
109
  <div class="sm:hidden hidden" id="mobile-menu">
110
  <div class="pt-2 pb-3 space-y-1">
111
+ <a href="index.html" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Home</a>
112
+ <a href="how-it-works.html" class="bg-indigo-50 border-indigo-500 text-indigo-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">How It Works</a>
113
  <a href="#" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Features</a>
114
  <a href="#" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Pricing</a>
115
  <div class="pt-4 pb-3 border-t border-gray-200">
 
129
  <div class="max-w-7xl mx-auto py-16 px-4 sm:py-24 sm:px-6 lg:px-8">
130
  <div class="text-center">
131
  <h1 class="text-4xl font-extrabold tracking-tight sm:text-5xl lg:text-6xl">
132
+ How RateDispatch Works
133
  </h1>
134
  <p class="mt-6 max-w-2xl mx-auto text-xl">
135
+ Our platform makes it simple to connect dispatchers with carriers and grow your logistics business.
136
  </p>
 
 
 
 
 
 
 
 
137
  </div>
138
  </div>
139
  </div>
140
 
141
+ <!-- Tabs Navigation -->
142
+ <div class="bg-white border-b border-gray-200">
143
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
144
+ <div class="flex justify-center">
145
+ <nav class="-mb-px flex space-x-8">
146
+ <button data-tab="dispatchers" class="tab-button border-indigo-500 text-indigo-600 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm">
147
+ For Dispatchers
148
+ </button>
149
+ <button data-tab="carriers" class="tab-button border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm">
150
+ For Carriers
151
+ </button>
152
+ <button data-tab="brokers" class="tab-button border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm">
153
+ For Brokers
154
+ </button>
155
+ </nav>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
156
  </div>
157
  </div>
158
  </div>
159
 
160
+ <!-- Dispatchers Tab Content -->
161
+ <div id="dispatchers" class="tab-content active">
162
+ <div class="bg-gray-50 py-16">
163
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
164
+ <div class="lg:text-center">
165
+ <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">For Dispatchers</h2>
166
+ <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
167
+ Find Reliable Carriers Effortlessly
168
+ </p>
169
+ <p class="mt-4 max-w-2xl text-xl text-gray-500 lg:mx-auto">
170
+ Connect with vetted carriers who match your specific needs and preferences.
171
+ </p>
172
+ </div>
173
 
174
+ <div class="mt-20">
175
+ <div class="flex flex-col items-center">
176
+ <!-- Step 1 -->
177
+ <div class="process-step relative pb-20 text-center max-w-md">
178
+ <div class="flex items-center justify-center h-16 w-16 rounded-full bg-indigo-600 text-white mx-auto text-xl font-bold">
179
+ 1
180
+ </div>
181
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Create Your Profile</h3>
182
+ <p class="mt-2 text-base text-gray-600">
183
+ Set up your dispatcher profile highlighting your experience, specialties, and the types of carriers you work with best.
184
+ </p>
185
+ <div class="mt-6">
186
+ <i class="fas fa-user-tie text-indigo-500 text-4xl"></i>
187
+ </div>
188
  </div>
 
189
 
190
+ <!-- Step 2 -->
191
+ <div class="process-step relative pb-20 text-center max-w-md">
192
+ <div class="flex items-center justify-center h-16 w-16 rounded-full bg-indigo-600 text-white mx-auto text-xl font-bold">
193
+ 2
194
+ </div>
195
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Define Your Needs</h3>
196
+ <p class="mt-2 text-base text-gray-600">
197
+ Specify your requirements - equipment types, lanes, capacity needs, and preferred rates to find perfect matches.
198
+ </p>
199
+ <div class="mt-6">
200
+ <i class="fas fa-sliders-h text-indigo-500 text-4xl"></i>
201
+ </div>
202
  </div>
203
+
204
+ <!-- Step 3 -->
205
+ <div class="process-step relative pb-20 text-center max-w-md">
206
+ <div class="flex items-center justify-center h-16 w-16 rounded-full bg-indigo-600 text-white mx-auto text-xl font-bold">
207
+ 3
208
+ </div>
209
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Browse & Connect</h3>
210
+ <p class="mt-2 text-base text-gray-600">
211
+ Access our database of verified carriers, view ratings and performance metrics, and initiate contact.
212
+ </p>
213
+ <div class="mt-6">
214
+ <i class="fas fa-search text-indigo-500 text-4xl"></i>
215
+ </div>
216
  </div>
 
217
 
218
+ <!-- Step 4 -->
219
+ <div class="process-step relative pb-20 text-center max-w-md">
220
+ <div class="flex items-center justify-center h-16 w-16 rounded-full bg-indigo-600 text-white mx-auto text-xl font-bold">
221
+ 4
222
+ </div>
223
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Manage Relationships</h3>
224
+ <p class="mt-2 text-base text-gray-600">
225
+ Use our tools to track performance, communicate, and build long-term partnerships with your carriers.
226
+ </p>
227
+ <div class="mt-6">
228
+ <i class="fas fa-handshake text-indigo-500 text-4xl"></i>
229
+ </div>
230
  </div>
231
+
232
+ <!-- Step 5 -->
233
+ <div class="process-step relative text-center max-w-md">
234
+ <div class="flex items-center justify-center h-16 w-16 rounded-full bg-indigo-600 text-white mx-auto text-xl font-bold">
235
+ 5
236
+ </div>
237
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Grow Your Business</h3>
238
+ <p class="mt-2 text-base text-gray-600">
239
+ Leverage analytics and reporting to optimize your operations and expand your dispatch services.
240
+ </p>
241
+ <div class="mt-6">
242
+ <i class="fas fa-chart-line text-indigo-500 text-4xl"></i>
243
+ </div>
244
  </div>
245
  </div>
246
  </div>
247
  </div>
248
  </div>
 
249
 
250
+ <!-- Features Section -->
251
+ <div class="bg-white py-16">
252
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
253
+ <div class="lg:text-center">
254
+ <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Dispatcher Features</h2>
255
+ <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
256
+ Tools Designed for Dispatch Success
257
+ </p>
258
+ </div>
 
 
 
259
 
260
+ <div class="mt-20">
261
+ <div class="space-y-10 md:space-y-0 md:grid md:grid-cols-3 md:gap-x-8 md:gap-y-10">
262
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
 
263
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
264
+ <i class="fas fa-filter"></i>
265
  </div>
266
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Advanced Filtering</h3>
267
+ <p class="mt-2 text-base text-gray-600">
268
+ Filter carriers by equipment type, lane preferences, safety ratings, and more to find perfect matches.
 
 
269
  </p>
270
  </div>
 
271
 
272
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
 
273
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
274
+ <i class="fas fa-bell"></i>
275
  </div>
276
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Instant Alerts</h3>
277
+ <p class="mt-2 text-base text-gray-600">
278
+ Get notified when carriers matching your criteria become available in your preferred lanes.
 
 
279
  </p>
280
  </div>
 
281
 
282
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
 
283
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
284
+ <i class="fas fa-star"></i>
285
  </div>
286
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Rating System</h3>
287
+ <p class="mt-2 text-base text-gray-600">
288
+ Rate and review carriers based on performance to help build your preferred network.
 
 
289
  </p>
290
  </div>
 
291
 
292
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
 
293
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
294
+ <i class="fas fa-comments"></i>
295
  </div>
296
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Integrated Messaging</h3>
297
+ <p class="mt-2 text-base text-gray-600">
298
+ Communicate directly with carriers through our secure messaging platform.
 
 
299
  </p>
300
  </div>
 
301
 
302
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
 
303
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
304
  <i class="fas fa-file-contract"></i>
305
  </div>
306
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Contract Management</h3>
307
+ <p class="mt-2 text-base text-gray-600">
308
+ Create, send, and track contracts all within the platform with e-signature capabilities.
 
 
309
  </p>
310
  </div>
 
311
 
312
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
 
313
  <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
314
+ <i class="fas fa-chart-pie"></i>
315
  </div>
316
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Performance Analytics</h3>
317
+ <p class="mt-2 text-base text-gray-600">
318
+ Track key metrics like on-time performance, acceptance rates, and more.
 
 
319
  </p>
320
  </div>
321
  </div>
 
324
  </div>
325
  </div>
326
 
327
+ <!-- Carriers Tab Content -->
328
+ <div id="carriers" class="tab-content">
329
+ <div class="bg-gray-50 py-16">
330
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
331
+ <div class="lg:text-center">
332
+ <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">For Carriers</h2>
333
+ <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
334
+ Connect with Quality Dispatchers
335
+ </p>
336
+ <p class="mt-4 max-w-2xl text-xl text-gray-500 lg:mx-auto">
337
+ Find dispatchers who understand your business and can help you maximize your revenue.
 
 
 
 
 
 
 
 
 
 
 
 
338
  </p>
 
 
 
 
 
 
 
339
  </div>
340
 
341
+ <div class="mt-20">
342
+ <div class="flex flex-col items-center">
343
+ <!-- Step 1 -->
344
+ <div class="process-step relative pb-20 text-center max-w-md">
345
+ <div class="flex items-center justify-center h-16 w-16 rounded-full bg-indigo-600 text-white mx-auto text-xl font-bold">
346
+ 1
347
+ </div>
348
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Complete Your Profile</h3>
349
+ <p class="mt-2 text-base text-gray-600">
350
+ Showcase your fleet details, operating authority, insurance, and preferred lanes to attract the right dispatchers.
351
+ </p>
352
+ <div class="mt-6">
353
+ <i class="fas fa-truck text-indigo-500 text-4xl"></i>
354
+ </div>
355
  </div>
356
+
357
+ <!-- Step 2 -->
358
+ <div class="process-step relative pb-20 text-center max-w-md">
359
+ <div class="flex items-center justify-center h-16 w-16 rounded-full bg-indigo-600 text-white mx-auto text-xl font-bold">
360
+ 2
361
+ </div>
362
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Get Verified</h3>
363
+ <p class="mt-2 text-base text-gray-600">
364
+ Complete our verification process to build trust with dispatchers and access premium opportunities.
365
+ </p>
366
+ <div class="mt-6">
367
+ <i class="fas fa-check-circle text-indigo-500 text-4xl"></i>
368
+ </div>
369
  </div>
 
 
 
 
 
 
 
 
 
 
 
 
370
 
371
+ <!-- Step 3 -->
372
+ <div class="process-step relative pb-20 text-center max-w-md">
373
+ <div class="flex items-center justify-center h-16 w-16 rounded-full bg-indigo-600 text-white mx-auto text-xl font-bold">
374
+ 3
375
+ </div>
376
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Receive Dispatch Offers</h3>
377
+ <p class="mt-2 text-base text-gray-600">
378
+ Get matched with dispatchers looking for carriers with your specific capabilities and preferences.
379
+ </p>
380
+ <div class="mt-6">
381
+ <i class="fas fa-bell text-indigo-500 text-4xl"></i>
382
+ </div>
383
  </div>
384
+
385
+ <!-- Step 4 -->
386
+ <div class="process-step relative pb-20 text-center max-w-md">
387
+ <div class="flex items-center justify-center h-16 w-16 rounded-full bg-indigo-600 text-white mx-auto text-xl font-bold">
388
+ 4
389
+ </div>
390
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Evaluate & Accept</h3>
391
+ <p class="mt-2 text-base text-gray-600">
392
+ Review dispatcher profiles, ratings, and terms before accepting the partnerships that work for you.
393
+ </p>
394
+ <div class="mt-6">
395
+ <i class="fas fa-file-signature text-indigo-500 text-4xl"></i>
396
+ </div>
397
  </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
398
 
399
+ <!-- Step 5 -->
400
+ <div class="process-step relative text-center max-w-md">
401
+ <div class="flex items-center justify-center h-16 w-16 rounded-full bg-indigo-600 text-white mx-auto text-xl font-bold">
402
+ 5
403
+ </div>
404
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Optimize Your Business</h3>
405
+ <p class="mt-2 text-base text-gray-600">
406
+ Use our tools to track loads, communicate with dispatchers, and analyze your business performance.
407
+ </p>
408
+ <div class="mt-6">
409
+ <i class="fas fa-chart-bar text-indigo-500 text-4xl"></i>
 
 
 
 
 
 
 
 
 
 
 
410
  </div>
411
  </div>
412
  </div>
413
  </div>
 
 
 
414
  </div>
415
  </div>
 
416
 
417
+ <!-- Features Section -->
418
+ <div class="bg-white py-16">
419
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
420
+ <div class="lg:text-center">
421
+ <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">Carrier Features</h2>
422
+ <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
423
+ Tools to Grow Your Trucking Business
424
+ </p>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
425
  </div>
426
+
427
+ <div class="mt-20">
428
+ <div class="space-y-10 md:space-y-0 md:grid md:grid-cols-3 md:gap-x-8 md:gap-y-10">
429
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
430
+ <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
431
+ <i class="fas fa-search-dollar"></i>
432
+ </div>
433
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Load Board Access</h3>
434
+ <p class="mt-2 text-base text-gray-600">
435
+ View available loads from our network of dispatchers with transparent rate information.
436
+ </p>
437
+ </div>
438
+
439
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
440
+ <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
441
+ <i class="fas fa-map-marked-alt"></i>
442
+ </div>
443
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Lane Optimization</h3>
444
+ <p class="mt-2 text-base text-gray-600">
445
+ Get matched with dispatchers who can help optimize your lanes and reduce empty miles.
446
+ </p>
447
+ </div>
448
+
449
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
450
+ <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
451
+ <i class="fas fa-star"></i>
452
+ </div>
453
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Reputation Building</h3>
454
+ <p class="mt-2 text-base text-gray-600">
455
+ Build your reputation through verified ratings and reviews from dispatchers.
456
+ </p>
457
+ </div>
458
+
459
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
460
+ <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
461
+ <i class="fas fa-file-invoice-dollar"></i>
462
+ </div>
463
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Quick Payments</h3>
464
+ <p class="mt-2 text-base text-gray-600">
465
+ Integrated payment processing helps ensure timely payments from dispatchers.
466
+ </p>
467
+ </div>
468
+
469
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
470
+ <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
471
+ <i class="fas fa-tachometer-alt"></i>
472
+ </div>
473
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Performance Tracking</h3>
474
+ <p class="mt-2 text-base text-gray-600">
475
+ Monitor your on-time performance, acceptance rates, and other key metrics.
476
+ </p>
477
+ </div>
478
+
479
+ <div class="feature-card relative bg-gray-50 p-6 rounded-lg transition-all duration-300 ease-in-out">
480
+ <div class="flex items-center justify-center h-12 w-12 rounded-md bg-indigo-500 text-white">
481
+ <i class="fas fa-mobile-alt"></i>
482
+ </div>
483
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Mobile App</h3>
484
+ <p class="mt-2 text-base text-gray-600">
485
+ Manage your business on the go with our full-featured mobile application.
486
+ </p>
487
+ </div>
488
  </div>
489
  </div>
490
  </div>
491
  </div>
492
+ </div>
493
 
494
+ <!-- Brokers Tab Content -->
495
+ <div id="brokers" class="tab-content">
496
+ <div class="bg-gray-50 py-16">
497
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
498
+ <div class="lg:text-center">
499
+ <h2 class="text-base text-indigo-600 font-semibold tracking-wide uppercase">For Brokers</h2>
500
+ <p class="mt-2 text-3xl leading-8 font-extrabold tracking-tight text-gray-900 sm:text-4xl">
501
+ Expand Your Carrier Network
502
+ </p>
503
+ <p class="mt-4 max-w-2xl text-xl text-gray-500 lg:mx-auto">
504
+ Connect with reliable carriers through our network of professional dispatchers.
505
+ </p>
506
+ </div>
507
 
508
+ <div class="mt-20">
509
+ <div class="flex flex-col items-center">
510
+ <!-- Step 1 -->
511
+ <div class="process-step relative pb-20 text-center max-w-md">
512
+ <div class="flex items-center justify-center h-16 w-16 rounded-full bg-indigo-600 text-white mx-auto text-xl font-bold">
513
+ 1
514
+ </div>
515
+ <h3 class="mt-6 text-lg font-medium text-gray-900">Register Your Brokerage</h3>
516
+ <p class="mt-2 text-base text-gray-600">
517
+ Create your brokerage profile with your MC number, insurance details, and specialties.
518
+ </p>
519
+ <div class="mt-6">
520
+ <i class="fas fa-building text-indigo-500 text-4xl"></i>
521
+ </div>
522
+
523
  </html>
prompts.txt CHANGED
@@ -1 +1,2 @@
1
- Platform that connect freight dispacthers ( who look to find carrier to work with) and trucking companies ( who look for good dispatcher), like upwork, flat UI design), cool nice logo, futuristic, icons,
 
 
1
+ Platform that connect freight dispacthers ( who look to find carrier to work with) and trucking companies ( who look for good dispatcher), like upwork, flat UI design), cool nice logo, futuristic, icons,
2
+ now lets do how it works page