forked from jayash1973/aAzel-LexAI
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
383 lines (369 loc) · 31 KB
/
index.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Lex AI - Revolutionizing Legal Technology</title>
<script>
document.getElementById('mobile-menu-button').addEventListener('click', function() {
document.getElementById('mobile-menu').classList.toggle('hidden');
});
</script>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Poppins', sans-serif;
}
.full-screen-hero {
height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-image: linear-gradient(rgba(13, 15, 20, 0.8), rgba(17, 24, 39, 0.8)), url('https://images.unsplash.com/photo-1505664194779-8beaceb93744?ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80');
background-size: cover;
background-position: center;
}
.feature-card {
transition: all 0.3s ease;
}
.feature-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
.pricing-card {
transition: all 0.3s ease;
}
.pricing-card:hover {
transform: scale(1.05);
}
.nav-items {
display: flex;
justify-content: center;
gap: 2rem;
}
</style>
</head>
<body class="bg-gray-50">
<header class="bg-gray-900 text-white sticky top-0 z-50">
<div class="container mx-auto px-6 py-3">
<div class="flex items-center justify-between">
<div class="flex items-center flex-shrink-0 mr-6">
<a href="#" class="text-2xl font-bold">Lex AI</a>
</div>
<nav class="flex-grow">
<div class="nav-items">
<a href="#about" class="block mt-4 lg:inline-block lg:mt-0 text-gray-200 hover:text-white">About</a>
<a href="#features" class="block mt-4 lg:inline-block lg:mt-0 text-gray-200 hover:text-white">Features</a>
<a href="#pricing" class="block mt-4 lg:inline-block lg:mt-0 text-gray-200 hover:text-white">Pricing</a>
<a href="#market" class="block mt-4 lg:inline-block lg:mt-0 text-gray-200 hover:text-white">Market Opportunity</a>
<a href="#contact" class="block mt-4 lg:inline-block lg:mt-0 text-gray-200 hover:text-white">Contact</a>
</div>
</nav>
<div>
<a href="https://huggingface.co/spaces/Johan713/aAzelll" class="inline-block text-sm px-4 py-2 leading-none border rounded text-white border-white hover:border-transparent hover:text-gray-900 hover:bg-white mt-4 lg:mt-0">GET STARTED</a>
</div>
</div>
</div>
</header>
<main>
<section class="hero text-white full-screen-hero">
<div class="container mx-auto text-center px-6">
<h1 class="text-5xl md:text-6xl font-bold mb-6">Revolutionizing Legal Technology</h1>
<p class="text-xl mb-8">Empower your legal practice with AI-driven solutions</p>
<a href="https://huggingface.co/spaces/Johan713/aAzelll" class="bg-blue-600 text-white py-3 px-8 rounded-full text-lg font-semibold hover:bg-blue-700 transition duration-300">Free Demo</a>
</div>
</section>
<section id="pricing" class="bg-gray-100 py-20">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center mb-12">Pricing Plans</h2>
<div class="flex flex-col space-y-8 max-w-4xl mx-auto">
<div class="pricing-card bg-white p-8 rounded-lg shadow-md">
<h3 class="text-2xl font-semibold mb-4">Individual</h3>
<p class="text-4xl font-bold mb-6">$14.99<span class="text-lg font-normal">/month</span></p>
<ul class="mb-8 space-y-2">
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Basic Chatbot</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Contract and Document Analysis</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Legal Cost Estimator</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Find a Lawyer</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> 5 million tokens for Falcon 180B</li>
</ul>
<a href="https://huggingface.co/spaces/Johan713/aAzelll" class="block text-center bg-blue-600 text-white py-2 px-4 rounded-full hover:bg-blue-700 transition duration-300">FREE DEMO</a>
</div>
<div class="pricing-card bg-white p-8 rounded-lg shadow-md">
<h3 class="text-2xl font-semibold mb-4">Small Enterprise</h3>
<p class="text-4xl font-bold mb-6">$149.99<span class="text-lg font-normal">/month</span></p>
<ul class="mb-8 space-y-2">
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Advanced Legal Chatbot (Assistant)</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Document Analysis</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Case Precedent Finder</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Legal Cost Estimator</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Contract Analysis</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Case Trend Visualizer</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Case Information Retrieval</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Automated Legal Brief Generation</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Find a Lawyer</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Policy Analysis and Impact</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Contract Drafting Assistant</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Predictive Case Analysis</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> 50 million tokens for Falcon 180B</li>
</ul>
<a href="https://huggingface.co/spaces/Johan713/aAzelll" class="block text-center bg-blue-600 text-white py-2 px-4 rounded-full hover:bg-blue-700 transition duration-300">FREE DEMO</a>
</div>
<div class="pricing-card bg-white p-8 rounded-lg shadow-md">
<h3 class="text-2xl font-semibold mb-4">Large Enterprise</h3>
<p class="text-4xl font-bold mb-6">Contact Sales</p>
<ul class="mb-8 space-y-2">
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> All Small Enterprise Features</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Unlimited tokens for Falcon 180B</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Custom Integration</li>
<li class="flex items-center"><svg class="w-5 h-5 mr-2 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg> Dedicated Support</li>
</ul>
<a href="#contact" class="block text-center bg-blue-600 text-white py-2 px-4 rounded-full hover:bg-blue-700 transition duration-300">Contact Sales</a>
</div>
</div>
</div>
</section>
<section id="about" class="py-20 bg-gray-100">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center mb-8">About Lex AI</h2>
<div class="flex flex-col md:flex-row items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pr-8">
<p class="text-lg mb-4">
Lex AI is at the forefront of legal technology, harnessing the power of advanced artificial intelligence to revolutionize legal practices. Our platform is built on the cutting-edge Falcon 180B language model, one of the most powerful AI systems available today.
</p>
<p class="text-lg mb-4">
By utilizing Falcon 180B to its fullest potential, Lex AI offers unparalleled capabilities in automating complex legal tasks. From document analysis and contract drafting to case law research and predictive analytics, our AI-driven solutions are designed to enhance efficiency, accuracy, and decision-making in legal processes.
</p>
<p class="text-lg">
With Lex AI, legal professionals can focus on high-value tasks while our AI handles time-consuming research and analysis, ultimately leading to better outcomes for clients and a more streamlined legal practice.
</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1531545514256-b1400bc00f31?ixlib=rb-1.2.1&auto=format&fit=crop&w=1567&q=80" alt="AI in Legal Technology" class="rounded-lg shadow-lg">
</div>
</div>
</div>
</section>
<section id="features" class="py-20">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center mb-12">Lex AI's Features</h2>
<div class="space-y-20">
<div class="flex flex-col md:flex-row items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pr-8">
<h3 class="text-2xl font-semibold mb-4">Advanced Legal Chatbot (Assistant)</h3>
<p>Our AI-powered legal assistant provides instant answers to complex legal queries, helping lawyers and legal professionals save time and improve efficiency. It's trained on vast legal databases and can provide accurate information on case law, statutes, and legal procedures.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1531746790731-6c087fecd65a?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="AI Chatbot" class="rounded-lg shadow-lg">
</div>
</div>
<div class="flex flex-col md:flex-row-reverse items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pl-8">
<h3 class="text-2xl font-semibold mb-4">Document Analysis</h3>
<p>Quickly analyze and extract key information from legal documents, contracts, and case files using our advanced AI algorithms, significantly reducing manual review time. Our system can identify important clauses, potential risks, and inconsistencies across multiple documents.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1450101499163-c8848c66ca85?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Document Analysis" class="rounded-lg shadow-lg">
</div>
</div>
<div class="flex flex-col md:flex-row items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pr-8">
<h3 class="text-2xl font-semibold mb-4">Case Precedent Finder</h3>
<p>Our AI scans vast databases of legal cases to find relevant precedents, helping lawyers build stronger arguments and save hours of research time. It can identify similar cases based on multiple factors and provide summaries of key rulings.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1589391886645-d51941baf7fb?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Case Precedent Finder" class="rounded-lg shadow-lg">
</div>
</div>
<div class="flex flex-col md:flex-row-reverse items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pl-8">
<h3 class="text-2xl font-semibold mb-4">Legal Cost Estimator</h3>
<p>Accurately estimate legal costs for clients based on case complexity, duration, and required resources, improving transparency and client satisfaction. Our tool considers historical data and current market rates to provide reliable estimates.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1554224155-6726b3ff858f?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Legal Cost Estimator" class="rounded-lg shadow-lg">
</div>
</div>
<div class="flex flex-col md:flex-row items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pr-8">
<h3 class="text-2xl font-semibold mb-4">Contract Analysis</h3>
<p>Our AI-powered contract analysis tool quickly reviews and extracts key information from various types of contracts. It identifies potential risks, non-standard clauses, and ensures compliance with relevant laws and regulations.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1450101499163-c8848c66ca85?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Contract Analysis" class="rounded-lg shadow-lg">
</div>
</div>
<div class="flex flex-col md:flex-row-reverse items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pl-8">
<h3 class="text-2xl font-semibold mb-4">Case Trend Visualizer</h3>
<p>Visualize trends in case outcomes, judge rulings, and legal precedents over time. This powerful tool helps lawyers identify patterns and make data-driven decisions in their case strategies.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Case Trend Visualizer" class="rounded-lg shadow-lg">
</div>
</div>
<div class="flex flex-col md:flex-row items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pr-8">
<h3 class="text-2xl font-semibold mb-4">Case Information Retrieval</h3>
<p>Quickly retrieve relevant information from vast case databases using natural language queries. Our system understands context and can provide summaries, key points, and direct citations from relevant cases.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1423592707957-3b212afa6733?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Case Information Retrieval" class="rounded-lg shadow-lg">
</div>
</div>
<div class="flex flex-col md:flex-row-reverse items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pl-8">
<h3 class="text-2xl font-semibold mb-4">Automated Legal Brief Generation</h3>
<p>Generate initial drafts of legal briefs based on case details, relevant precedents, and key arguments. This tool significantly reduces the time spent on preliminary drafting, allowing lawyers to focus on refining and perfecting their arguments.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1488190211105-8b0e65b80b4e?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Automated Legal Brief Generation" class="rounded-lg shadow-lg">
</div>
</div>
<div class="flex flex-col md:flex-row items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pr-8">
<h3 class="text-2xl font-semibold mb-4">Find a Lawyer</h3>
<p>Our intelligent lawyer matching system helps clients find the most suitable legal representation based on their specific needs, case type, and location. It considers factors such as expertise, experience, and past case outcomes.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1521791055366-0d553872125f?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Find a Lawyer" class="rounded-lg shadow-lg">
</div>
</div>
<div class="flex flex-col md:flex-row-reverse items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pl-8">
<h3 class="text-2xl font-semibold mb-4">Policy Analysis and Impact</h3>
<p>Analyze the potential impact of new laws and policies on various stakeholders. This tool helps legal professionals and policymakers understand the broader implications of legal changes and make informed decisions.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1436450412740-6b988f486c6b?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Policy Analysis and Impact" class="rounded-lg shadow-lg">
</div>
</div>
<div class="flex flex-col md:flex-row items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pr-8">
<h3 class="text-2xl font-semibold mb-4">Contract Drafting Assistant</h3>
<p>Our AI-powered contract drafting assistant helps lawyers create robust, tailored contracts efficiently. It suggests relevant clauses, identifies potential omissions, and ensures compliance with current laws and regulations.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1450101499163-c8848c66ca85?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Contract Drafting Assistant" class="rounded-lg shadow-lg">
</div>
</div>
<div class="flex flex-col md:flex-row-reverse items-center">
<div class="md:w-1/2 mb-6 md:mb-0 md:pl-8">
<h3 class="text-2xl font-semibold mb-4">Predictive Case Analysis</h3>
<p>Leverage machine learning algorithms to predict potential case outcomes based on historical data, judge tendencies, and case specifics. This tool helps lawyers develop more effective strategies and set realistic expectations for their clients.</p>
</div>
<div class="md:w-1/2">
<img src="https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60" alt="Predictive Case Analysis" class="rounded-lg shadow-lg">
</div>
</div>
</div>
</div>
</section>
<section id="market" class="bg-gray-100 py-20">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center mb-12">Market Opportunity</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div>
<h3 class="text-2xl font-semibold mb-4">Total Addressable Market (TAM)</h3>
<p class="mb-4">The global legal technology market is projected to grow from $29.19 billion in 2021 to $78.12 billion by 2028, with a CAGR of 14.8%.</p>
<div id="tam-graph"></div>
</div>
<div>
<h3 class="text-2xl font-semibold mb-4">Serviceable Addressable Market (SAM)</h3>
<p class="mb-4">Lex AI targets law firms and corporate legal departments. The global legal services market was valued at $849 billion in 2020 and is expected to reach $1.1 trillion by 2026, with a CAGR of 4.4%.</p>
<div id="sam-graph"></div>
</div>
</div>
<div class="mt-12">
<h3 class="text-2xl font-semibold mb-4">Lex AI's Position</h3>
<p>Lex AI's tools for legal document analysis, case precedent research, and information summarization position it well to capture a significant portion of this growing market. By offering a compelling value proposition and continuous innovation, Lex AI can establish itself as a leading player in legal technology.</p>
</div>
</div>
</section>
<section class="bg-blue-100 py-12">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center mb-8">Falcon Hackathon Note</h2>
<p class="text-center text-lg">
This webpage was quickly built for the Falcon hackathon organized by the lablab team on lablab.com. It serves as a demonstration of AI capabilities in the legal technology sector and is not a fully functional product.
</p>
</div>
</section>
<section id="contact" class="py-20">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center mb-12">Contact Sales</h2>
<form class="max-w-lg mx-auto">
<div class="mb-4">
<label for="name" class="block text-gray-700 font-bold mb-2">Name</label>
<input type="text" id="name" name="name" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" required>
</div>
<div class="mb-4">
<label for="business" class="block text-gray-700 font-bold mb-2">Business Name</label>
<input type="text" id="business" name="business" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" required>
</div>
<div class="mb-4">
<label for="phone" class="block text-gray-700 font-bold mb-2">Phone Number</label>
<input type="tel" id="phone" name="phone" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" required>
</div>
<div class="mb-4">
<label for="profession" class="block text-gray-700 font-bold mb-2">Profession</label>
<input type="text" id="profession" name="profession" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" required>
</div>
<div class="mb-4">
<label for="email" class="block text-gray-700 font-bold mb-2">Email</label>
<input type="email" id="email" name="email" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" required>
</div>
<div class="mb-4">
<label class="flex items-center">
<input type="checkbox" class="form-checkbox" required>
<span class="ml-2">I consent to having my information sent to [email protected]</span>
</label>
</div>
<button type="submit" class="w-full bg-blue-600 text-white py-2 px-4 rounded-md hover:bg-blue-700 transition duration-300">Submit</button>
</form>
</div>
</section>
</main>
<footer class="bg-gray-900 text-white py-8">
<div class="container mx-auto px-6 text-center">
<p>© 2024 Lex AI. All rights reserved.</p>
</div>
</footer>
<script>
// TAM Graph
var tamData = [
{year: 2021, value: 29.19},
{year: 2028, value: 78.12}
];
var tamLayout = {
title: 'Global Legal Technology Market Growth',
xaxis: {title: 'Year'},
yaxis: {title: 'Market Size (Billion USD)'}
};
Plotly.newPlot('tam-graph', [{
x: tamData.map(d => d.year),
y: tamData.map(d => d.value),
type: 'scatter',
mode: 'lines+markers'
}], tamLayout);
// SAM Graph
var samData = [
{year: 2020, value: 849},
{year: 2026, value: 1100}
];
var samLayout = {
title: 'Global Legal Services Market Growth',
xaxis: {title: 'Year'},
yaxis: {title: 'Market Size (Billion USD)'}
};
Plotly.newPlot('sam-graph', [{
x: samData.map(d => d.year),
y: samData.map(d => d.value),
type: 'scatter',
mode: 'lines+markers'
}], samLayout);
</script>
</body>
</html>