Hugging Face's logo

Spaces:
mithunparambath
/
nanomatter-quantum-forge
Running

App Files Community
mithunparambath commited on
Commit
daa586d
·
verified ·
1 Parent(s): 6e4d6a1

make it minimal with white background and orange

Browse files
Files changed (3) hide show
  1. components/footer.js +5 -6
  2. components/navbar.js +5 -5
  3. index.html +106 -171
components/footer.js CHANGED
@@ -5,16 +5,15 @@ class CustomFooter extends HTMLElement {
5
  <style>
6
  :host {
7
  display: block;
8
- background: #0d1117;
9
- border-top: 1px solid rgba(255, 55, 95, 0.2);
10
  }
11
  .footer-content {
12
  max-width: 6xl;
13
  margin: 0 auto;
14
- padding: 3rem 1.5rem;
15
  }
16
-
17
- .footer-links a {
18
  transition: color 0.3s ease;
19
  }
20
 
@@ -22,7 +21,7 @@ class CustomFooter extends HTMLElement {
22
  color: #dc2626;
23
  }
24
  </style>
25
- <footer class="bg-[#0d1117] border-t border-[#30363d]">
26
  <div class="footer-content">
27
  <div class="grid md:grid-cols-4 gap-8">
28
  <!-- Company Info -->
 
5
  <style>
6
  :host {
7
  display: block;
8
+ background: white;
9
+ border-top: 1px solid rgba(234, 88, 12, 0.2);
10
  }
11
  .footer-content {
12
  max-width: 6xl;
13
  margin: 0 auto;
14
+ padding: 2rem 1.5rem;
15
  }
16
+ .footer-links a {
 
17
  transition: color 0.3s ease;
18
  }
19
 
 
21
  color: #dc2626;
22
  }
23
  </style>
24
+ <footer class="bg-white border-t border-gray-200">
25
  <div class="footer-content">
26
  <div class="grid md:grid-cols-4 gap-8">
27
  <!-- Company Info -->
components/navbar.js CHANGED
@@ -12,15 +12,15 @@ class CustomNavbar extends HTMLElement {
12
  z-index: 1000;
13
  }
14
  .navbar {
15
- background: rgba(13, 17, 23, 0.95);
16
  backdrop-filter: blur(10px);
17
- border-bottom: 1px solid rgba(255, 55, 95, 0.2);
18
  transition: all 0.3s ease;
19
  }
20
 
21
  .navbar.scrolled {
22
- background: rgba(13, 17, 23, 0.98);
23
- border-bottom-color: rgba(255, 55, 95, 0.3);
24
  }
25
  .nav-link {
26
  position: relative;
@@ -33,7 +33,7 @@ class CustomNavbar extends HTMLElement {
33
  left: 0;
34
  width: 0;
35
  height: 2px;
36
- background: #ff375f;
37
  transition: width 0.3s ease;
38
  }
39
  .nav-link:hover::after {
 
12
  z-index: 1000;
13
  }
14
  .navbar {
15
+ background: rgba(255, 255, 255, 0.95);
16
  backdrop-filter: blur(10px);
17
+ border-bottom: 1px solid rgba(234, 88, 12, 0.2);
18
  transition: all 0.3s ease;
19
  }
20
 
21
  .navbar.scrolled {
22
+ background: rgba(255, 255, 255, 0.98);
23
+ border-bottom-color: rgba(234, 88, 12, 0.3);
24
  }
25
  .nav-link {
26
  position: relative;
 
33
  left: 0;
34
  width: 0;
35
  height: 2px;
36
+ background: #ea580c;
37
  transition: width 0.3s ease;
38
  }
39
  .nav-link:hover::after {
index.html CHANGED
@@ -34,254 +34,190 @@
34
  </head>
35
  <body class="bg-[#0d1117] text-[#f0f6fc] font-sans overflow-x-hidden">
36
  <custom-navbar></custom-navbar>
37
-
38
  <!-- Hero Section -->
39
  <section class="relative min-h-screen flex items-center justify-center overflow-hidden">
40
- <div class="absolute inset-0 bg-gradient-to-br from-[#0d1117] via-[#161b22] to-[#0d1117]"></div>
41
- <div class="absolute inset-0 opacity-20">
42
- <div class="atomic-grid-animation"></div>
43
- </div>
44
 
45
- <div class="relative z-10 text-center px-6 max-w-6xl mx-auto">
46
- <h1 class="text-5xl md:text-7xl font-bold mb-6 leading-tight">
47
- Enabling <span class="text-[#ff375f]">Next-Generation</span><br>
48
- Semiconductor Innovation
49
  </h1>
50
- <p class="text-xl md:text-2xl text-[#8b949e] mb-8 max-w-3xl mx-auto">
51
- Advanced MOCVD & PVD systems for cutting-edge materials research and semiconductor fabrication
52
  </p>
53
  <div class="flex flex-col sm:flex-row gap-4 justify-center">
54
- <a href="#technologies" class="bg-[#ff375f] hover:bg-[#ff1a4a] text-white px-8 py-4 rounded-lg font-semibold text-lg transition-all duration-300 transform hover:scale-105">
55
  Explore Technologies
56
  </a>
57
- <a href="#contact" class="border border-[#30363d] hover:border-[#ff375f] text-white px-8 py-4 rounded-lg font-semibold text-lg transition-all duration-300">
58
- Contact Us
59
  </a>
60
  </div>
61
  </div>
62
- <div class="absolute bottom-10 left-1/2 transform -translate-x-1/2 animate-bounce">
63
- <i data-feather="chevron-down" class="text-[#ff375f] w-8 h-8"></i>
64
- </div>
65
  </section>
66
  <!-- About Section -->
67
- <section id="about" class="py-20 bg-[#161b22]">
68
- <div class="max-w-6xl mx-auto px-6">
69
- <div class="grid md:grid-cols-2 gap-12 items-center">
70
- <div>
71
- <h2 class="text-4xl font-bold mb-6">About NanoMatter Technologies</h2>
72
- <p class="text-lg text-gray-300 mb-6">
73
- NanoMatter Technologies is an advanced semiconductor equipment manufacturer specializing in MOCVD (Metal Organic Chemical Vapor Deposition) and PVD (Physical Vapor Deposition) systems.
74
- </p>
75
- <p class="text-lg text-gray-300 mb-6">
76
- Our technologies empower the fabrication of next-generation materials, including 2D materials and transition metal dichalcogenides (TMDs), driving breakthroughs in electronics, optoelectronics, and quantum devices.
77
- </p>
78
- <div class="flex items-center gap-8 mt-8">
79
- <div class="text-center">
80
- <div class="text-3xl font-bold text-primary">30+</div>
81
- <div class="text-gray-400">Years Experience</div>
82
- </div>
83
- <div class="text-center">
84
- <div class="text-3xl font-bold text-primary">2</div>
85
- <div class="text-gray-400">Global Locations</div>
86
- </div>
87
- </div>
88
- </div>
89
- <div class="relative">
90
- <div class="aspect-square rounded-2xl bg-gradient-to-br from-[#1c2128] to-[#21262d] p-8">
91
- <div class="grid grid-cols-2 gap-4 h-full">
92
- <div class="bg-[#161b22] rounded-lg p-4 flex items-center justify-center">
93
- <i data-feather="cpu" class="w-12 h-12 text-[#ff375f]"></i>
94
- </div>
95
- <div class="bg-[#161b22] rounded-lg p-4 flex items-center justify-center">
96
- <i data-feather="layers" class="w-12 h-12 text-[#ff375f]"></i>
97
- </div>
98
- <div class="bg-[#161b22] rounded-lg p-4 flex items-center justify-center">
99
- <i data-feather="globe" class="w-12 h-12 text-[#ff375f]"></i>
100
- </div>
101
- <div class="bg-[#161b22] rounded-lg p-4 flex items-center justify-center">
102
- <i data-feather="award" class="w-12 h-12 text-[#ff375f]"></i>
103
- </div>
104
- </div>
105
- </div>
106
- </div>
107
  </div>
108
  </section>
109
  <!-- Technologies Section -->
110
- <section id="technologies" class="py-20 bg-[#0d1117]">
111
- <div class="max-w-6xl mx-auto px-6">
112
- <h2 class="text-4xl font-bold text-center mb-16">Our Core Technologies</h2>
113
 
114
- <div class="grid md:grid-cols-2 gap-12 mb-20">
115
- <div class="tech-card group">
116
- <div class="tech-icon">
117
- <i data-feather="wind" class="w-16 h-16"></i>
118
  </div>
119
- <h3 class="text-2xl font-bold mb-4">MOCVD Systems</h3>
120
- <p class="text-gray-300 mb-6">
121
- Metal Organic Chemical Vapor Deposition systems for high-quality epitaxial growth of compound semiconductors and 2D materials.
122
  </p>
123
- <ul class="space-y-2 text-gray-400">
124
  <li class="flex items-center gap-2">
125
- <i data-feather="check" class="w-4 h-4 text-[#ff375f]"></i>
126
- Advanced temperature control (±0.1°C)
127
  </li>
128
  <li class="flex items-center gap-2">
129
- <i data-feather="check" class="w-4 h-4 text-primary"></i>
130
  Multi-gas precursor delivery
131
  </li>
132
- <li class="flex items-center gap-2">
133
- <i data-feather="check" class="w-4 h-4 text-primary"></i>
134
- Real-time process monitoring
135
- </li>
136
  </ul>
137
  </div>
138
 
139
- <div class="tech-card group">
140
- <div class="tech-icon">
141
- <i data-feather="target" class="w-16 h-16"></i>
142
  </div>
143
- <h3 class="text-2xl font-bold mb-4">PVD Systems</h3>
144
- <p class="text-gray-300 mb-6">
145
- Physical Vapor Deposition systems for precise thin film deposition with atomic-level control.
146
  </p>
147
- <ul class="space-y-2 text-gray-400">
148
  <li class="flex items-center gap-2">
149
- <i data-feather="check" class="w-4 h-4 text-primary"></i>
150
  Multi-target sputtering
151
  </li>
152
  <li class="flex items-center gap-2">
153
- <i data-feather="check" class="w-4 h-4 text-primary"></i>
154
  Ultra-high vacuum capability
155
  </li>
156
- <li class="flex items-center gap-2">
157
- <i data-feather="check" class="w-4 h-4 text-primary"></i>
158
- In-situ thickness monitoring
159
- </li>
160
  </ul>
161
  </div>
162
  </div>
163
  </div>
164
  </section>
165
  <!-- Services Section -->
166
- <section id="services" class="py-20 bg-[#161b22]">
167
- <div class="max-w-6xl mx-auto px-6">
168
- <h2 class="text-4xl font-bold text-center mb-16">Deposition as a Service</h2>
169
 
170
- <div class="grid md:grid-cols-3 gap-8">
171
- <div class="service-card">
172
- <div class="service-icon">
173
- <i data-feather="flask" class="w-12 h-12"></i>
174
  </div>
175
- <h3 class="text-xl font-bold mb-4">Research Grade</h3>
176
- <p class="text-gray-300">
177
- High-precision deposition services for academic research and material characterization studies.
178
  </p>
179
  </div>
180
 
181
- <div class="service-card">
182
- <div class="service-icon">
183
- <i data-feather="zap" class="w-12 h-12"></i>
184
  </div>
185
- <h3 class="text-xl font-bold mb-4">Prototype Development</h3>
186
- <p class="text-gray-300">
187
- Custom thin film solutions for startups and companies developing next-generation semiconductor devices.
188
  </p>
189
  </div>
190
 
191
- <div class="service-card">
192
- <div class="service-icon">
193
- <i data-feather="factory" class="w-12 h-12"></i>
194
  </div>
195
- <h3 class="text-xl font-bold mb-4">Industrial Scale</h3>
196
- <p class="text-gray-300">
197
- Production-ready deposition services for semiconductor manufacturers and industrial applications.
198
  </p>
199
  </div>
200
  </div>
201
  </div>
202
  </section>
203
  <!-- Partnerships Section -->
204
- <section id="partnerships" class="py-20 bg-[#0d1117]">
205
- <div class="max-w-6xl mx-auto px-6">
206
- <h2 class="text-4xl font-bold text-center mb-16">Global Research Partnerships</h2>
207
-
208
- <div class="grid md:grid-cols-2 gap-12 items-center">
209
- <div>
210
- <p class="text-lg text-gray-300 mb-6">
211
- We actively collaborate with leading research institutions and universities worldwide, bridging technological excellence between India and Germany.
212
- </p>
213
- <p class="text-lg text-gray-300 mb-8">
214
- Our partnerships focus on advancing material science research and developing next-generation semiconductor technologies.
215
- </p>
216
- <div class="flex flex-wrap gap-4">
217
- <div class="partner-logo">IIT</div>
218
- <div class="partner-logo">Max Planck</div>
219
- <div class="partner-logo">Fraunhofer</div>
220
- <div class="partner-logo">Stanford</div>
221
  </div>
222
- </div>
223
- <div class="relative">
224
- <div class="world-map-animation"></div>
225
- </div>
226
- </div>
227
  </div>
228
  </section>
229
  <!-- Contact Section -->
230
- <section id="contact" class="py-20 bg-[#161b22]">
231
- <div class="max-w-6xl mx-auto px-6">
232
- <h2 class="text-4xl font-bold text-center mb-16">Contact Our Global Team</h2>
233
 
234
- <div class="grid md:grid-cols-2 gap-12">
235
  <div>
236
- <h3 class="text-2xl font-bold mb-6">Get In Touch</h3>
237
- <form class="space-y-6">
238
  <div class="grid md:grid-cols-2 gap-4">
239
  <div>
240
- <label class="block text-gray-300 mb-2">First Name</label>
241
- <input type="text" class="w-full bg-dark-700 border border-gray-600 rounded-lg px-4 py-3 focus:border-primary focus:outline-none transition-colors">
242
  </div>
243
  <div>
244
- <label class="block text-gray-300 mb-2">Last Name</label>
245
- <input type="text" class="w-full bg-dark-700 border border-gray-600 rounded-lg px-4 py-3 focus:border-primary focus:outline-none transition-colors">
246
  </div>
247
  </div>
248
  <div>
249
- <label class="block text-gray-300 mb-2">Email</label>
250
- <input type="email" class="w-full bg-dark-700 border border-gray-600 rounded-lg px-4 py-3 focus:border-primary focus:outline-none transition-colors">
251
- </div>
252
- <div>
253
- <label class="block text-gray-300 mb-2">Company/Institution</label>
254
- <input type="text" class="w-full bg-dark-700 border border-gray-600 rounded-lg px-4 py-3 focus:border-primary focus:outline-none transition-colors">
255
- </div>
256
- <div>
257
- <label class="block text-gray-300 mb-2">Message</label>
258
- <textarea rows="5" class="w-full bg-dark-700 border border-gray-600 rounded-lg px-4 py-3 focus:border-primary focus:outline-none transition-colors"></textarea>
259
  </div>
260
- <button type="submit" class="bg-[#ff375f] hover:bg-[#ff1a4a] text-white px-8 py-4 rounded-lg font-semibold transition-all duration-300">
261
- Send Inquiry
262
  </button>
263
  </form>
264
  </div>
265
 
266
- <div class="space-y-8">
267
  <div>
268
- <h3 class="text-2xl font-bold mb-4">Global Offices</h3>
269
- <div class="space-y-6">
270
- <div class="office-card">
271
- <div class="flex items-center gap-3 mb-2">
272
- <i data-feather="map-pin" class="w-5 h-5 text-[#ff375f]"></i>
273
- <span class="font-semibold">India Headquarters</span>
274
  </div>
275
- <p class="text-gray-300">Bangalore Tech Park</p>
276
- <p class="text-gray-300">Karnataka, India</p>
277
  </div>
278
- <div class="office-card">
279
- <div class="flex items-center gap-3 mb-2">
280
- <i data-feather="map-pin" class="w-5 h-5 text-primary"></i>
281
- <span class="font-semibold">Germany R&D Center</span>
282
  </div>
283
- <p class="text-gray-300">Dresden Innovation Hub</p>
284
- <p class="text-gray-300">Saxony, Germany</p>
285
  </div>
286
  </div>
287
  </div>
@@ -289,8 +225,7 @@ Send Inquiry
289
  </div>
290
  </div>
291
  </section>
292
-
293
- <custom-footer></custom-footer>
294
 
295
  <script src="components/navbar.js"></script>
296
  <script src="components/footer.js"></script>
 
34
  </head>
35
  <body class="bg-[#0d1117] text-[#f0f6fc] font-sans overflow-x-hidden">
36
  <custom-navbar></custom-navbar>
 
37
  <!-- Hero Section -->
38
  <section class="relative min-h-screen flex items-center justify-center overflow-hidden">
39
+ <div class="absolute inset-0 bg-white"></div>
 
 
 
40
 
41
+ <div class="relative z-10 text-center px-6 max-w-4xl mx-auto">
42
+ <h1 class="text-4xl md:text-6xl font-bold mb-6 leading-tight">
43
+ Advanced <span class="text-orange-500">Semiconductor</span><br>
44
+ Equipment
45
  </h1>
46
+ <p class="text-lg md:text-xl text-gray-600 mb-8 max-w-2xl mx-auto">
47
+ MOCVD & PVD systems for cutting-edge materials research
48
  </p>
49
  <div class="flex flex-col sm:flex-row gap-4 justify-center">
50
+ <a href="#technologies" class="bg-orange-500 hover:bg-orange-600 text-white px-8 py-3 rounded-lg font-semibold transition-all duration-300">
51
  Explore Technologies
52
  </a>
53
+ <a href="#contact" class="border border-gray-300 hover:border-orange-500 text-gray-800 px-8 py-3 rounded-lg font-semibold transition-all duration-300">
54
+ Contact Us
55
  </a>
56
  </div>
57
  </div>
 
 
 
58
  </section>
59
  <!-- About Section -->
60
+ <section id="about" class="py-16 bg-white">
61
+ <div class="max-w-4xl mx-auto px-6 text-center">
62
+ <h2 class="text-3xl font-bold mb-6">About NanoMatter</h2>
63
+ <p class="text-lg text-gray-600 mb-8 max-w-2xl mx-auto">
64
+ Advanced semiconductor equipment manufacturer specializing in MOCVD and PVD systems for next-generation materials research.
65
+ </p>
66
+ <div class="flex justify-center gap-12 mt-8">
67
+ <div class="text-center">
68
+ <div class="text-2xl font-bold text-orange-500">30+</div>
69
+ <div class="text-gray-500">Years Experience</div>
70
+ </div>
71
+ <div class="text-center">
72
+ <div class="text-2xl font-bold text-orange-500">2</div>
73
+ <div class="text-gray-500">Global Locations</div>
74
+ </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
75
  </div>
76
  </section>
77
  <!-- Technologies Section -->
78
+ <section id="technologies" class="py-16 bg-white">
79
+ <div class="max-w-4xl mx-auto px-6">
80
+ <h2 class="text-3xl font-bold text-center mb-12">Core Technologies</h2>
81
 
82
+ <div class="grid md:grid-cols-2 gap-8">
83
+ <div class="border border-gray-200 rounded-lg p-6 hover:border-orange-500 transition-all duration-300">
84
+ <div class="w-12 h-12 bg-orange-100 rounded-lg flex items-center justify-center mb-4">
85
+ <i data-feather="wind" class="text-orange-500"></i>
86
  </div>
87
+ <h3 class="text-xl font-bold mb-3">MOCVD Systems</h3>
88
+ <p class="text-gray-600 mb-4">
89
+ Metal Organic Chemical Vapor Deposition systems for high-quality epitaxial growth.
90
  </p>
91
+ <ul class="space-y-2 text-gray-600">
92
  <li class="flex items-center gap-2">
93
+ <i data-feather="check" class="w-4 h-4 text-orange-500"></i>
94
+ Advanced temperature control
95
  </li>
96
  <li class="flex items-center gap-2">
97
+ <i data-feather="check" class="w-4 h-4 text-orange-500"></i>
98
  Multi-gas precursor delivery
99
  </li>
 
 
 
 
100
  </ul>
101
  </div>
102
 
103
+ <div class="border border-gray-200 rounded-lg p-6 hover:border-orange-500 transition-all duration-300">
104
+ <div class="w-12 h-12 bg-orange-100 rounded-lg flex items-center justify-center mb-4">
105
+ <i data-feather="target" class="text-orange-500"></i>
106
  </div>
107
+ <h3 class="text-xl font-bold mb-3">PVD Systems</h3>
108
+ <p class="text-gray-600 mb-4">
109
+ Physical Vapor Deposition systems for precise thin film deposition.
110
  </p>
111
+ <ul class="space-y-2 text-gray-600">
112
  <li class="flex items-center gap-2">
113
+ <i data-feather="check" class="w-4 h-4 text-orange-500"></i>
114
  Multi-target sputtering
115
  </li>
116
  <li class="flex items-center gap-2">
117
+ <i data-feather="check" class="w-4 h-4 text-orange-500"></i>
118
  Ultra-high vacuum capability
119
  </li>
 
 
 
 
120
  </ul>
121
  </div>
122
  </div>
123
  </div>
124
  </section>
125
  <!-- Services Section -->
126
+ <section id="services" class="py-16 bg-gray-50">
127
+ <div class="max-w-4xl mx-auto px-6">
128
+ <h2 class="text-3xl font-bold text-center mb-12">Services</h2>
129
 
130
+ <div class="grid md:grid-cols-3 gap-6">
131
+ <div class="text-center">
132
+ <div class="w-12 h-12 bg-orange-100 rounded-lg flex items-center justify-center mx-auto mb-4">
133
+ <i data-feather="flask" class="text-orange-500"></i>
134
  </div>
135
+ <h3 class="font-bold mb-2">Research Grade</h3>
136
+ <p class="text-gray-600 text-sm">
137
+ High-precision deposition for academic research and material studies.
138
  </p>
139
  </div>
140
 
141
+ <div class="text-center">
142
+ <div class="w-12 h-12 bg-orange-100 rounded-lg flex items-center justify-center mx-auto mb-4">
143
+ <i data-feather="zap" class="text-orange-500"></i>
144
  </div>
145
+ <h3 class="font-bold mb-2">Prototype Development</h3>
146
+ <p class="text-gray-600 text-sm">
147
+ Custom thin film solutions for next-generation devices.
148
  </p>
149
  </div>
150
 
151
+ <div class="text-center">
152
+ <div class="w-12 h-12 bg-orange-100 rounded-lg flex items-center justify-center mx-auto mb-4">
153
+ <i data-feather="factory" class="text-orange-500"></i>
154
  </div>
155
+ <h3 class="font-bold mb-2">Industrial Scale</h3>
156
+ <p class="text-gray-600 text-sm">
157
+ Production-ready deposition services for manufacturers.
158
  </p>
159
  </div>
160
  </div>
161
  </div>
162
  </section>
163
  <!-- Partnerships Section -->
164
+ <section id="partnerships" class="py-16 bg-white">
165
+ <div class="max-w-4xl mx-auto px-6 text-center">
166
+ <h2 class="text-3xl font-bold mb-8">Research Partnerships</h2>
167
+ <p class="text-gray-600 mb-8">
168
+ Collaborating with leading institutions worldwide to advance semiconductor technologies.
169
+ </p>
170
+ <div class="flex flex-wrap justify-center gap-6 mt-8">
171
+ <div class="text-gray-500 font-medium">IIT</div>
172
+ <div class="text-gray-500 font-medium">Max Planck</div>
173
+ <div class="text-gray-500 font-medium">Fraunhofer</div>
 
 
 
 
 
 
 
174
  </div>
 
 
 
 
 
175
  </div>
176
  </section>
177
  <!-- Contact Section -->
178
+ <section id="contact" class="py-16 bg-gray-50">
179
+ <div class="max-w-4xl mx-auto px-6">
180
+ <h2 class="text-3xl font-bold text-center mb-12">Contact</h2>
181
 
182
+ <div class="grid md:grid-cols-2 gap-8">
183
  <div>
184
+ <form class="space-y-4">
 
185
  <div class="grid md:grid-cols-2 gap-4">
186
  <div>
187
+ <label class="block text-gray-600 mb-2">Name</label>
188
+ <input type="text" class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:border-orange-500 focus:outline-none transition-colors">
189
  </div>
190
  <div>
191
+ <label class="block text-gray-600 mb-2">Email</label>
192
+ <input type="email" class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:border-orange-500 focus:outline-none transition-colors">
193
  </div>
194
  </div>
195
  <div>
196
+ <label class="block text-gray-600 mb-2">Message</label>
197
+ <textarea rows="4" class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:border-orange-500 focus:outline-none transition-colors"></textarea>
 
 
 
 
 
 
 
 
198
  </div>
199
+ <button type="submit" class="bg-orange-500 hover:bg-orange-600 text-white px-6 py-2 rounded-lg font-semibold transition-all duration-300">
200
+ Send
201
  </button>
202
  </form>
203
  </div>
204
 
205
+ <div class="space-y-6">
206
  <div>
207
+ <h3 class="font-bold mb-3">Global Offices</h3>
208
+ <div class="border border-gray-200 rounded-lg p-4">
209
+ <div class="flex items-center gap-2 mb-2">
210
+ <i data-feather="map-pin" class="w-4 h-4 text-orange-500"></i>
211
+ <span class="font-medium">India Headquarters</span>
 
212
  </div>
213
+ <p class="text-gray-600 text-sm">Bangalore Tech Park</p>
 
214
  </div>
215
+ <div class="border border-gray-200 rounded-lg p-4">
216
+ <div class="flex items-center gap-2 mb-2">
217
+ <i data-feather="map-pin" class="w-4 h-4 text-orange-500"></i>
218
+ <span class="font-medium">Germany R&D Center</span>
219
  </div>
220
+ <p class="text-gray-600 text-sm">Dresden Innovation Hub</p>
 
221
  </div>
222
  </div>
223
  </div>
 
225
  </div>
226
  </div>
227
  </section>
228
+ <custom-footer></custom-footer>
 
229
 
230
  <script src="components/navbar.js"></script>
231
  <script src="components/footer.js"></script>