patoconnect commited on
Commit
faf0f95
·
verified ·
1 Parent(s): fd87ade

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +6 -4
  2. index.html +582 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Law Firm
3
- emoji: 🐢
4
  colorFrom: green
5
- colorTo: blue
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: law-firm
3
+ emoji: 🐳
4
  colorFrom: green
5
+ colorTo: gray
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,582 @@
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>ROBERTO & CAESER LLP | Building a Law Firm for the Future</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
+ .hero-video {
11
+ position: relative;
12
+ height: 100vh;
13
+ min-height: 600px;
14
+ overflow: hidden;
15
+ }
16
+ .hero-video video {
17
+ position: absolute;
18
+ top: 50%;
19
+ left: 50%;
20
+ transform: translate(-50%, -50%);
21
+ min-width: 100%;
22
+ min-height: 100%;
23
+ width: auto;
24
+ height: auto;
25
+ z-index: 0;
26
+ }
27
+ .video-overlay {
28
+ position: absolute;
29
+ top: 0;
30
+ left: 0;
31
+ width: 100%;
32
+ height: 100%;
33
+ background: rgba(0, 0, 0, 0.5);
34
+ z-index: 1;
35
+ }
36
+ .stat-card {
37
+ transition: all 0.3s ease;
38
+ }
39
+ .stat-card:hover {
40
+ transform: translateY(-5px);
41
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
42
+ }
43
+ .service-card {
44
+ transition: all 0.3s ease;
45
+ }
46
+ .service-card:hover {
47
+ transform: translateY(-5px);
48
+ }
49
+ .case-study-card {
50
+ transition: all 0.3s ease;
51
+ }
52
+ .case-study-card:hover {
53
+ transform: translateY(-5px);
54
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
55
+ }
56
+ .nav-link {
57
+ position: relative;
58
+ }
59
+ .nav-link:after {
60
+ content: '';
61
+ position: absolute;
62
+ width: 0;
63
+ height: 2px;
64
+ bottom: -2px;
65
+ left: 0;
66
+ background-color: #b8860b;
67
+ transition: width 0.3s ease;
68
+ }
69
+ .nav-link:hover:after {
70
+ width: 100%;
71
+ }
72
+ .dropdown:hover .dropdown-menu {
73
+ display: block;
74
+ }
75
+ </style>
76
+ </head>
77
+ <body class="font-sans antialiased text-gray-800">
78
+ <!-- Top Bar -->
79
+ <div class="bg-gray-900 text-white py-2 px-4">
80
+ <div class="container mx-auto flex justify-between items-center">
81
+ <div class="flex space-x-4 text-sm">
82
+ <a href="#" class="hover:text-amber-500"><i class="fas fa-phone-alt mr-1"></i> +1 (212) 555-0100</a>
83
+ <a href="#" class="hover:text-amber-500"><i class="fas fa-envelope mr-1"></i> contact@robertocaeser.com</a>
84
+ </div>
85
+ <div class="flex space-x-4">
86
+ <a href="#" class="hover:text-amber-500"><i class="fab fa-linkedin-in"></i></a>
87
+ <a href="#" class="hover:text-amber-500"><i class="fab fa-twitter"></i></a>
88
+ <a href="#" class="hover:text-amber-500"><i class="fab fa-facebook-f"></i></a>
89
+ </div>
90
+ </div>
91
+ </div>
92
+
93
+ <!-- Navigation -->
94
+ <nav class="bg-white shadow-md sticky top-0 z-50">
95
+ <div class="container mx-auto px-4">
96
+ <div class="flex justify-between items-center py-4">
97
+ <div class="flex items-center">
98
+ <a href="#" class="text-2xl font-bold text-gray-900">
99
+ <span class="text-amber-600">ROBERTO</span> & <span class="text-gray-800">CAESER</span> <span class="text-sm font-normal">LLP</span>
100
+ </a>
101
+ </div>
102
+ <div class="hidden md:flex items-center space-x-8">
103
+ <div class="dropdown relative">
104
+ <a href="#" class="nav-link text-gray-700 hover:text-amber-600 font-medium">Practice Areas <i class="fas fa-chevron-down ml-1 text-xs"></i></a>
105
+ <div class="dropdown-menu absolute hidden bg-white shadow-lg rounded-md mt-2 py-2 w-48">
106
+ <a href="#" class="block px-4 py-2 text-gray-700 hover:bg-gray-100 hover:text-amber-600">Corporate Law</a>
107
+ <a href="#" class="block px-4 py-2 text-gray-700 hover:bg-gray-100 hover:text-amber-600">Litigation</a>
108
+ <a href="#" class="block px-4 py-2 text-gray-700 hover:bg-gray-100 hover:text-amber-600">Intellectual Property</a>
109
+ <a href="#" class="block px-4 py-2 text-gray-700 hover:bg-gray-100 hover:text-amber-600">Real Estate</a>
110
+ <a href="#" class="block px-4 py-2 text-gray-700 hover:bg-gray-100 hover:text-amber-600">Tax Law</a>
111
+ </div>
112
+ </div>
113
+ <a href="#" class="nav-link text-gray-700 hover:text-amber-600 font-medium">Our Firm</a>
114
+ <a href="#" class="nav-link text-gray-700 hover:text-amber-600 font-medium">Attorneys</a>
115
+ <a href="#" class="nav-link text-gray-700 hover:text-amber-600 font-medium">Insights</a>
116
+ <a href="#" class="nav-link text-gray-700 hover:text-amber-600 font-medium">Careers</a>
117
+ <a href="#" class="nav-link text-gray-700 hover:text-amber-600 font-medium">Contact</a>
118
+ </div>
119
+ <div class="md:hidden">
120
+ <button class="text-gray-700 focus:outline-none">
121
+ <i class="fas fa-bars text-xl"></i>
122
+ </button>
123
+ </div>
124
+ </div>
125
+ </div>
126
+ </nav>
127
+
128
+ <!-- Hero Section with Video -->
129
+ <section class="hero-video">
130
+ <video autoplay muted loop>
131
+ <source src="https://example.com/law-firm-video.mp4" type="video/mp4">
132
+ Your browser does not support the video tag.
133
+ </video>
134
+ <div class="video-overlay"></div>
135
+ <div class="relative z-10 flex items-center h-full">
136
+ <div class="container mx-auto px-4 text-white">
137
+ <h1 class="text-4xl md:text-6xl font-bold mb-6">Building a Law Firm <br>for the Future</h1>
138
+ <p class="text-xl md:text-2xl mb-8 max-w-2xl">Innovative legal solutions with a forward-thinking approach to complex challenges.</p>
139
+ <div class="flex space-x-4">
140
+ <a href="#" class="bg-amber-600 hover:bg-amber-700 text-white px-6 py-3 rounded font-medium transition duration-300">Our Services</a>
141
+ <a href="#" class="border-2 border-white hover:bg-white hover:text-gray-900 text-white px-6 py-3 rounded font-medium transition duration-300">Contact Us</a>
142
+ </div>
143
+ </div>
144
+ </div>
145
+ </section>
146
+
147
+ <!-- Stats Section -->
148
+ <section class="py-16 bg-gray-50">
149
+ <div class="container mx-auto px-4">
150
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
151
+ <div class="stat-card bg-white p-8 rounded-lg shadow-md text-center">
152
+ <div class="text-amber-600 text-4xl mb-4">
153
+ <i class="fas fa-balance-scale"></i>
154
+ </div>
155
+ <h3 class="text-3xl font-bold mb-2">150+</h3>
156
+ <p class="text-gray-600">Cases Won</p>
157
+ </div>
158
+ <div class="stat-card bg-white p-8 rounded-lg shadow-md text-center">
159
+ <div class="text-amber-600 text-4xl mb-4">
160
+ <i class="fas fa-user-tie"></i>
161
+ </div>
162
+ <h3 class="text-3xl font-bold mb-2">50+</h3>
163
+ <p class="text-gray-600">Expert Attorneys</p>
164
+ </div>
165
+ <div class="stat-card bg-white p-8 rounded-lg shadow-md text-center">
166
+ <div class="text-amber-600 text-4xl mb-4">
167
+ <i class="fas fa-globe-americas"></i>
168
+ </div>
169
+ <h3 class="text-3xl font-bold mb-2">12</h3>
170
+ <p class="text-gray-600">Global Offices</p>
171
+ </div>
172
+ <div class="stat-card bg-white p-8 rounded-lg shadow-md text-center">
173
+ <div class="text-amber-600 text-4xl mb-4">
174
+ <i class="fas fa-award"></i>
175
+ </div>
176
+ <h3 class="text-3xl font-bold mb-2">25+</h3>
177
+ <p class="text-gray-600">Industry Awards</p>
178
+ </div>
179
+ </div>
180
+ </div>
181
+ </section>
182
+
183
+ <!-- About Section -->
184
+ <section class="py-20">
185
+ <div class="container mx-auto px-4">
186
+ <div class="flex flex-col md:flex-row items-center">
187
+ <div class="md:w-1/2 mb-10 md:mb-0 md:pr-10">
188
+ <h2 class="text-3xl md:text-4xl font-bold mb-6">About <span class="text-amber-600">ROBERTO & CAESER</span> LLP</h2>
189
+ <p class="text-lg text-gray-600 mb-6">Founded in 1995, Roberto & Caeser LLP has grown from a small boutique firm to an internationally recognized legal practice with offices across three continents.</p>
190
+ <p class="text-lg text-gray-600 mb-8">Our forward-thinking approach combines traditional legal expertise with innovative strategies to help our clients navigate an increasingly complex global landscape.</p>
191
+ <a href="#" class="inline-block bg-amber-600 hover:bg-amber-700 text-white px-6 py-3 rounded font-medium transition duration-300">Learn More About Our Firm</a>
192
+ </div>
193
+ <div class="md:w-1/2">
194
+ <div class="relative">
195
+ <img src="https://images.unsplash.com/photo-1589829545856-d10d557cf95f?ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=80" alt="Law firm meeting" class="rounded-lg shadow-xl w-full">
196
+ <div class="absolute -bottom-6 -right-6 bg-white p-6 rounded-lg shadow-lg w-3/4">
197
+ <h3 class="text-xl font-bold mb-2">Our Vision</h3>
198
+ <p class="text-gray-600">To redefine legal excellence through innovation, collaboration, and an unwavering commitment to our clients' success.</p>
199
+ </div>
200
+ </div>
201
+ </div>
202
+ </div>
203
+ </div>
204
+ </section>
205
+
206
+ <!-- Services Section -->
207
+ <section class="py-20 bg-gray-50">
208
+ <div class="container mx-auto px-4">
209
+ <div class="text-center mb-16">
210
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">Our Legal Services</h2>
211
+ <p class="text-xl text-gray-600 max-w-2xl mx-auto">Comprehensive legal solutions tailored to meet your specific needs and challenges.</p>
212
+ </div>
213
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
214
+ <div class="service-card bg-white p-8 rounded-lg shadow-md">
215
+ <div class="text-amber-600 text-4xl mb-4">
216
+ <i class="fas fa-building"></i>
217
+ </div>
218
+ <h3 class="text-xl font-bold mb-4">Corporate Law</h3>
219
+ <p class="text-gray-600 mb-4">Expert guidance on corporate governance, M&A, private equity, and corporate finance transactions.</p>
220
+ <a href="#" class="text-amber-600 font-medium hover:text-amber-700 flex items-center">Learn More <i class="fas fa-arrow-right ml-2"></i></a>
221
+ </div>
222
+ <div class="service-card bg-white p-8 rounded-lg shadow-md">
223
+ <div class="text-amber-600 text-4xl mb-4">
224
+ <i class="fas fa-gavel"></i>
225
+ </div>
226
+ <h3 class="text-xl font-bold mb-4">Litigation</h3>
227
+ <p class="text-gray-600 mb-4">Strategic representation in complex commercial disputes, class actions, and appellate matters.</p>
228
+ <a href="#" class="text-amber-600 font-medium hover:text-amber-700 flex items-center">Learn More <i class="fas fa-arrow-right ml-2"></i></a>
229
+ </div>
230
+ <div class="service-card bg-white p-8 rounded-lg shadow-md">
231
+ <div class="text-amber-600 text-4xl mb-4">
232
+ <i class="fas fa-lightbulb"></i>
233
+ </div>
234
+ <h3 class="text-xl font-bold mb-4">Intellectual Property</h3>
235
+ <p class="text-gray-600 mb-4">Protection and enforcement of patents, trademarks, copyrights, and trade secrets worldwide.</p>
236
+ <a href="#" class="text-amber-600 font-medium hover:text-amber-700 flex items-center">Learn More <i class="fas fa-arrow-right ml-2"></i></a>
237
+ </div>
238
+ <div class="service-card bg-white p-8 rounded-lg shadow-md">
239
+ <div class="text-amber-600 text-4xl mb-4">
240
+ <i class="fas fa-home"></i>
241
+ </div>
242
+ <h3 class="text-xl font-bold mb-4">Real Estate</h3>
243
+ <p class="text-gray-600 mb-4">Full-service real estate practice covering acquisitions, dispositions, financing, and development.</p>
244
+ <a href="#" class="text-amber-600 font-medium hover:text-amber-700 flex items-center">Learn More <i class="fas fa-arrow-right ml-2"></i></a>
245
+ </div>
246
+ <div class="service-card bg-white p-8 rounded-lg shadow-md">
247
+ <div class="text-amber-600 text-4xl mb-4">
248
+ <i class="fas fa-chart-line"></i>
249
+ </div>
250
+ <h3 class="text-xl font-bold mb-4">Tax Law</h3>
251
+ <p class="text-gray-600 mb-4">Strategic tax planning, controversy, and transactional advice for businesses and individuals.</p>
252
+ <a href="#" class="text-amber-600 font-medium hover:text-amber-700 flex items-center">Learn More <i class="fas fa-arrow-right ml-2"></i></a>
253
+ </div>
254
+ <div class="service-card bg-white p-8 rounded-lg shadow-md">
255
+ <div class="text-amber-600 text-4xl mb-4">
256
+ <i class="fas fa-globe"></i>
257
+ </div>
258
+ <h3 class="text-xl font-bold mb-4">International Law</h3>
259
+ <p class="text-gray-600 mb-4">Cross-border transactions, regulatory compliance, and dispute resolution in global markets.</p>
260
+ <a href="#" class="text-amber-600 font-medium hover:text-amber-700 flex items-center">Learn More <i class="fas fa-arrow-right ml-2"></i></a>
261
+ </div>
262
+ </div>
263
+ </div>
264
+ </section>
265
+
266
+ <!-- Case Studies Section -->
267
+ <section class="py-20">
268
+ <div class="container mx-auto px-4">
269
+ <div class="text-center mb-16">
270
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">Notable Case Studies</h2>
271
+ <p class="text-xl text-gray-600 max-w-2xl mx-auto">Explore some of our most significant legal victories and complex matters.</p>
272
+ </div>
273
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
274
+ <div class="case-study-card bg-white rounded-lg overflow-hidden shadow-md">
275
+ <div class="relative">
276
+ <img src="https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=80" alt="Corporate case" class="w-full h-48 object-cover">
277
+ <div class="absolute top-0 left-0 bg-amber-600 text-white px-3 py-1 text-sm font-medium">Corporate</div>
278
+ </div>
279
+ <div class="p-6">
280
+ <h3 class="text-xl font-bold mb-2">$2.4B Tech Merger</h3>
281
+ <p class="text-gray-600 mb-4">Successfully represented a leading tech company in its acquisition by a Fortune 500 corporation.</p>
282
+ <div class="flex justify-between items-center">
283
+ <span class="text-sm text-gray-500">2023</span>
284
+ <a href="#" class="text-amber-600 font-medium hover:text-amber-700 flex items-center">View Details <i class="fas fa-arrow-right ml-2"></i></a>
285
+ </div>
286
+ </div>
287
+ </div>
288
+ <div class="case-study-card bg-white rounded-lg overflow-hidden shadow-md">
289
+ <div class="relative">
290
+ <img src="https://images.unsplash.com/photo-1581094271901-8022df4466f9?ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=80" alt="IP case" class="w-full h-48 object-cover">
291
+ <div class="absolute top-0 left-0 bg-amber-600 text-white px-3 py-1 text-sm font-medium">IP</div>
292
+ </div>
293
+ <div class="p-6">
294
+ <h3 class="text-xl font-bold mb-2">Patent Infringement Victory</h3>
295
+ <p class="text-gray-600 mb-4">Secured a landmark $150M verdict in a high-stakes patent infringement case for a biotech client.</p>
296
+ <div class="flex justify-between items-center">
297
+ <span class="text-sm text-gray-500">2022</span>
298
+ <a href="#" class="text-amber-600 font-medium hover:text-amber-700 flex items-center">View Details <i class="fas fa-arrow-right ml-2"></i></a>
299
+ </div>
300
+ </div>
301
+ </div>
302
+ <div class="case-study-card bg-white rounded-lg overflow-hidden shadow-md">
303
+ <div class="relative">
304
+ <img src="https://images.unsplash.com/photo-1563986768609-322da13575f3?ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=80" alt="Litigation case" class="w-full h-48 object-cover">
305
+ <div class="absolute top-0 left-0 bg-amber-600 text-white px-3 py-1 text-sm font-medium">Litigation</div>
306
+ </div>
307
+ <div class="p-6">
308
+ <h3 class="text-xl font-bold mb-2">Class Action Defense</h3>
309
+ <p class="text-gray-600 mb-4">Achieved dismissal of a nationwide class action against a major financial services provider.</p>
310
+ <div class="flex justify-between items-center">
311
+ <span class="text-sm text-gray-500">2021</span>
312
+ <a href="#" class="text-amber-600 font-medium hover:text-amber-700 flex items-center">View Details <i class="fas fa-arrow-right ml-2"></i></a>
313
+ </div>
314
+ </div>
315
+ </div>
316
+ </div>
317
+ <div class="text-center mt-12">
318
+ <a href="#" class="inline-block border-2 border-amber-600 hover:bg-amber-600 hover:text-white text-amber-600 px-6 py-3 rounded font-medium transition duration-300">View All Case Studies</a>
319
+ </div>
320
+ </div>
321
+ </section>
322
+
323
+ <!-- Video Insights Section -->
324
+ <section class="py-20 bg-gray-900 text-white">
325
+ <div class="container mx-auto px-4">
326
+ <div class="text-center mb-16">
327
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">Legal Insights</h2>
328
+ <p class="text-xl text-gray-300 max-w-2xl mx-auto">Watch our attorneys discuss emerging legal trends and complex case strategies.</p>
329
+ </div>
330
+ <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
331
+ <div class="bg-gray-800 rounded-lg overflow-hidden">
332
+ <div class="relative pb-[56.25%]">
333
+ <iframe class="absolute top-0 left-0 w-full h-full" src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
334
+ </div>
335
+ <div class="p-6">
336
+ <h3 class="text-xl font-bold mb-2">The Future of Corporate Governance</h3>
337
+ <p class="text-gray-300 mb-4">Partner Maria Roberto discusses how evolving regulations are reshaping corporate governance standards.</p>
338
+ <div class="flex items-center text-sm text-gray-400">
339
+ <span>June 15, 2023</span>
340
+ <span class="mx-2">•</span>
341
+ <span>12 min watch</span>
342
+ </div>
343
+ </div>
344
+ </div>
345
+ <div class="bg-gray-800 rounded-lg overflow-hidden">
346
+ <div class="relative pb-[56.25%]">
347
+ <iframe class="absolute top-0 left-0 w-full h-full" src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
348
+ </div>
349
+ <div class="p-6">
350
+ <h3 class="text-xl font-bold mb-2">Navigating Cross-Border Transactions</h3>
351
+ <p class="text-gray-300 mb-4">Senior Partner James Caeser shares insights on managing legal complexities in international deals.</p>
352
+ <div class="flex items-center text-sm text-gray-400">
353
+ <span>May 28, 2023</span>
354
+ <span class="mx-2">•</span>
355
+ <span>18 min watch</span>
356
+ </div>
357
+ </div>
358
+ </div>
359
+ </div>
360
+ <div class="mt-12 grid grid-cols-1 md:grid-cols-3 gap-6">
361
+ <div class="bg-gray-800 p-6 rounded-lg">
362
+ <div class="text-amber-500 text-2xl mb-4">
363
+ <i class="fas fa-chart-pie"></i>
364
+ </div>
365
+ <h3 class="text-lg font-bold mb-2">Market Trends Report</h3>
366
+ <p class="text-gray-300 mb-4">Our latest analysis of emerging trends in corporate law and their impact on business strategy.</p>
367
+ <a href="#" class="text-amber-500 font-medium hover:text-amber-400 flex items-center">Download Report <i class="fas fa-download ml-2"></i></a>
368
+ </div>
369
+ <div class="bg-gray-800 p-6 rounded-lg">
370
+ <div class="text-amber-500 text-2xl mb-4">
371
+ <i class="fas fa-newspaper"></i>
372
+ </div>
373
+ <h3 class="text-lg font-bold mb-2">Quarterly Legal Review</h3>
374
+ <p class="text-gray-300 mb-4">Key legal developments from the past quarter and what they mean for your business.</p>
375
+ <a href="#" class="text-amber-500 font-medium hover:text-amber-400 flex items-center">Read Now <i class="fas fa-arrow-right ml-2"></i></a>
376
+ </div>
377
+ <div class="bg-gray-800 p-6 rounded-lg">
378
+ <div class="text-amber-500 text-2xl mb-4">
379
+ <i class="fas fa-calendar-alt"></i>
380
+ </div>
381
+ <h3 class="text-lg font-bold mb-2">Upcoming Events</h3>
382
+ <p class="text-gray-300 mb-4">Join our attorneys at these upcoming conferences, webinars, and speaking engagements.</p>
383
+ <a href="#" class="text-amber-500 font-medium hover:text-amber-400 flex items-center">View Calendar <i class="fas fa-arrow-right ml-2"></i></a>
384
+ </div>
385
+ </div>
386
+ </div>
387
+ </section>
388
+
389
+ <!-- Testimonials Section -->
390
+ <section class="py-20 bg-amber-50">
391
+ <div class="container mx-auto px-4">
392
+ <div class="text-center mb-16">
393
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">Client Testimonials</h2>
394
+ <p class="text-xl text-gray-600 max-w-2xl mx-auto">What our clients say about working with Roberto & Caeser LLP</p>
395
+ </div>
396
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
397
+ <div class="bg-white p-8 rounded-lg shadow-md">
398
+ <div class="flex items-center mb-4">
399
+ <div class="text-amber-500 text-2xl mr-2">
400
+ <i class="fas fa-quote-left"></i>
401
+ </div>
402
+ <div class="text-gray-600 italic">
403
+ "The team at Roberto & Caeser demonstrated exceptional legal acumen in handling our complex merger. Their strategic guidance was instrumental in achieving a favorable outcome."
404
+ </div>
405
+ </div>
406
+ <div class="flex items-center">
407
+ <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="Client" class="w-12 h-12 rounded-full mr-4">
408
+ <div>
409
+ <h4 class="font-bold">Michael Johnson</h4>
410
+ <p class="text-sm text-gray-500">CEO, Tech Innovations Inc.</p>
411
+ </div>
412
+ </div>
413
+ </div>
414
+ <div class="bg-white p-8 rounded-lg shadow-md">
415
+ <div class="flex items-center mb-4">
416
+ <div class="text-amber-500 text-2xl mr-2">
417
+ <i class="fas fa-quote-left"></i>
418
+ </div>
419
+ <div class="text-gray-600 italic">
420
+ "Their international tax expertise saved our company millions in potential liabilities. The Roberto & Caeser team combines deep knowledge with practical business understanding."
421
+ </div>
422
+ </div>
423
+ <div class="flex items-center">
424
+ <img src="https://randomuser.me/api/portraits/women/44.jpg" alt="Client" class="w-12 h-12 rounded-full mr-4">
425
+ <div>
426
+ <h4 class="font-bold">Sarah Chen</h4>
427
+ <p class="text-sm text-gray-500">CFO, Global Manufacturing Co.</p>
428
+ </div>
429
+ </div>
430
+ </div>
431
+ </div>
432
+ </div>
433
+ </section>
434
+
435
+ <!-- CTA Section -->
436
+ <section class="py-20 bg-amber-600 text-white">
437
+ <div class="container mx-auto px-4 text-center">
438
+ <h2 class="text-3xl md:text-4xl font-bold mb-6">Ready to Discuss Your Legal Needs?</h2>
439
+ <p class="text-xl mb-8 max-w-2xl mx-auto">Contact us today to schedule a consultation with one of our experienced attorneys.</p>
440
+ <div class="flex flex-col sm:flex-row justify-center space-y-4 sm:space-y-0 sm:space-x-4">
441
+ <a href="#" class="bg-white hover:bg-gray-100 text-amber-600 px-8 py-4 rounded font-bold transition duration-300">Get in Touch</a>
442
+ <a href="#" class="border-2 border-white hover:bg-amber-700 text-white px-8 py-4 rounded font-bold transition duration-300">Call Now: (212) 555-0100</a>
443
+ </div>
444
+ </div>
445
+ </section>
446
+
447
+ <!-- Footer -->
448
+ <footer class="bg-gray-900 text-white pt-16 pb-8">
449
+ <div class="container mx-auto px-4">
450
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12">
451
+ <div>
452
+ <h3 class="text-2xl font-bold mb-6">
453
+ <span class="text-amber-500">ROBERTO</span> & <span class="text-white">CAESER</span> <span class="text-sm font-normal">LLP</span>
454
+ </h3>
455
+ <p class="text-gray-400 mb-4">Building a law firm for the future with innovative legal solutions and forward-thinking strategies.</p>
456
+ <div class="flex space-x-4">
457
+ <a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-linkedin-in"></i></a>
458
+ <a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-twitter"></i></a>
459
+ <a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-facebook-f"></i></a>
460
+ </div>
461
+ </div>
462
+ <div>
463
+ <h4 class="text-lg font-bold mb-6">Practice Areas</h4>
464
+ <ul class="space-y-3">
465
+ <li><a href="#" class="text-gray-400 hover:text-white">Corporate Law</a></li>
466
+ <li><a href="#" class="text-gray-400 hover:text-white">Litigation</a></li>
467
+ <li><a href="#" class="text-gray-400 hover:text-white">Intellectual Property</a></li>
468
+ <li><a href="#" class="text-gray-400 hover:text-white">Real Estate</a></li>
469
+ <li><a href="#" class="text-gray-400 hover:text-white">Tax Law</a></li>
470
+ <li><a href="#" class="text-gray-400 hover:text-white">International Law</a></li>
471
+ </ul>
472
+ </div>
473
+ <div>
474
+ <h4 class="text-lg font-bold mb-6">Our Firm</h4>
475
+ <ul class="space-y-3">
476
+ <li><a href="#" class="text-gray-400 hover:text-white">About Us</a></li>
477
+ <li><a href="#" class="text-gray-400 hover:text-white">Attorneys</a></li>
478
+ <li><a href="#" class="text-gray-400 hover:text-white">Diversity & Inclusion</a></li>
479
+ <li><a href="#" class="text-gray-400 hover:text-white">Pro Bono</a></li>
480
+ <li><a href="#" class="text-gray-400 hover:text-white">Careers</a></li>
481
+ <li><a href="#" class="text-gray-400 hover:text-white">Contact Us</a></li>
482
+ </ul>
483
+ </div>
484
+ <div>
485
+ <h4 class="text-lg font-bold mb-6">Contact Information</h4>
486
+ <address class="not-italic text-gray-400">
487
+ <p class="mb-4">123 Legal Avenue<br>New York, NY 10001</p>
488
+ <p class="mb-1"><i class="fas fa-phone-alt mr-2"></i> +1 (212) 555-0100</p>
489
+ <p class="mb-1"><i class="fas fa-fax mr-2"></i> +1 (212) 555-0101</p>
490
+ <p><i class="fas fa-envelope mr-2"></i> contact@robertocaeser.com</p>
491
+ </address>
492
+ </div>
493
+ </div>
494
+ <div class="border-t border-gray-800 pt-8">
495
+ <div class="flex flex-col md:flex-row justify-between items-center">
496
+ <p class="text-gray-400 mb-4 md:mb-0">© 2023 Roberto & Caeser LLP. All rights reserved.</p>
497
+ <div class="flex space-x-6">
498
+ <a href="#" class="text-gray-400 hover:text-white">Privacy Policy</a>
499
+ <a href="#" class="text-gray-400 hover:text-white">Terms of Use</a>
500
+ <a href="#" class="text-gray-400 hover:text-white">Disclaimer</a>
501
+ <a href="#" class="text-gray-400 hover:text-white">Sitemap</a>
502
+ </div>
503
+ </div>
504
+ </div>
505
+ </div>
506
+ </footer>
507
+
508
+ <script>
509
+ // Mobile menu toggle functionality
510
+ document.addEventListener('DOMContentLoaded', function() {
511
+ const mobileMenuButton = document.querySelector('.md\\:hidden button');
512
+ const mobileMenu = document.createElement('div');
513
+ mobileMenu.className = 'hidden bg-white w-full absolute left-0 mt-2 shadow-lg py-2 z-50';
514
+
515
+ const menuItems = [
516
+ {text: 'Practice Areas', subItems: ['Corporate Law', 'Litigation', 'Intellectual Property', 'Real Estate', 'Tax Law']},
517
+ {text: 'Our Firm'},
518
+ {text: 'Attorneys'},
519
+ {text: 'Insights'},
520
+ {text: 'Careers'},
521
+ {text: 'Contact'}
522
+ ];
523
+
524
+ menuItems.forEach(item => {
525
+ const menuItem = document.createElement('div');
526
+ menuItem.className = 'px-4 py-2 border-b border-gray-100';
527
+
528
+ if (item.subItems) {
529
+ const link = document.createElement('a');
530
+ link.href = '#';
531
+ link.className = 'flex justify-between items-center text-gray-700';
532
+ link.innerHTML = `${item.text} <i class="fas fa-chevron-down ml-2 text-xs"></i>`;
533
+ menuItem.appendChild(link);
534
+
535
+ const subMenu = document.createElement('div');
536
+ subMenu.className = 'hidden pl-4 mt-2';
537
+ item.subItems.forEach(subItem => {
538
+ const subMenuItem = document.createElement('a');
539
+ subMenuItem.href = '#';
540
+ subMenuItem.className = 'block py-2 text-gray-600 hover:text-amber-600';
541
+ subMenuItem.textContent = subItem;
542
+ subMenu.appendChild(subMenuItem);
543
+ });
544
+
545
+ menuItem.appendChild(subMenu);
546
+ link.addEventListener('click', function(e) {
547
+ e.preventDefault();
548
+ subMenu.classList.toggle('hidden');
549
+ });
550
+ } else {
551
+ const link = document.createElement('a');
552
+ link.href = '#';
553
+ link.className = 'block text-gray-700';
554
+ link.textContent = item.text;
555
+ menuItem.appendChild(link);
556
+ }
557
+
558
+ mobileMenu.appendChild(menuItem);
559
+ });
560
+
561
+ document.body.appendChild(mobileMenu);
562
+
563
+ mobileMenuButton.addEventListener('click', function() {
564
+ mobileMenu.classList.toggle('hidden');
565
+ });
566
+
567
+ // Smooth scrolling for anchor links
568
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
569
+ anchor.addEventListener('click', function(e) {
570
+ e.preventDefault();
571
+ const target = document.querySelector(this.getAttribute('href'));
572
+ if (target) {
573
+ target.scrollIntoView({
574
+ behavior: 'smooth'
575
+ });
576
+ }
577
+ });
578
+ });
579
+ });
580
+ </script>
581
+ <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=patoconnect/law-firm" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
582
+ </html>