Add 2 files
Browse files- README.md +7 -5
- index.html +658 -19
README.md
CHANGED
@@ -1,10 +1,12 @@
|
|
1 |
---
|
2 |
-
title:
|
3 |
-
emoji:
|
4 |
-
colorFrom:
|
5 |
-
colorTo:
|
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: weber
|
3 |
+
emoji: 🐳
|
4 |
+
colorFrom: yellow
|
5 |
+
colorTo: green
|
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,658 @@
|
|
1 |
-
<!
|
2 |
-
<html>
|
3 |
-
|
4 |
-
|
5 |
-
|
6 |
-
|
7 |
-
|
8 |
-
|
9 |
-
|
10 |
-
|
11 |
-
|
12 |
-
|
13 |
-
|
14 |
-
|
15 |
-
|
16 |
-
|
17 |
-
|
18 |
-
|
19 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
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>Industries We Serve | GlobalProcure - Specialized Procurement Solutions</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 |
+
<script>
|
10 |
+
tailwind.config = {
|
11 |
+
theme: {
|
12 |
+
extend: {
|
13 |
+
colors: {
|
14 |
+
primary: '#2563eb',
|
15 |
+
secondary: '#1e40af',
|
16 |
+
accent: '#3b82f6',
|
17 |
+
}
|
18 |
+
}
|
19 |
+
}
|
20 |
+
}
|
21 |
+
</script>
|
22 |
+
<style>
|
23 |
+
.hero-gradient {
|
24 |
+
background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
|
25 |
+
}
|
26 |
+
.card-hover:hover {
|
27 |
+
transform: translateY(-5px);
|
28 |
+
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
|
29 |
+
}
|
30 |
+
.transition-all {
|
31 |
+
transition: all 0.3s ease;
|
32 |
+
}
|
33 |
+
.industry-icon {
|
34 |
+
width: 80px;
|
35 |
+
height: 80px;
|
36 |
+
background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
|
37 |
+
}
|
38 |
+
.stats-card:hover .stats-icon {
|
39 |
+
transform: scale(1.1);
|
40 |
+
}
|
41 |
+
</style>
|
42 |
+
</head>
|
43 |
+
<body class="font-sans antialiased text-gray-800">
|
44 |
+
<!-- Navigation -->
|
45 |
+
<nav class="bg-white shadow-md sticky top-0 z-50">
|
46 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
47 |
+
<div class="flex justify-between h-16">
|
48 |
+
<div class="flex items-center">
|
49 |
+
<div class="flex-shrink-0 flex items-center">
|
50 |
+
<i class="fas fa-boxes text-blue-600 text-2xl mr-2"></i>
|
51 |
+
<span class="text-xl font-bold text-gray-900">GlobalProcure</span>
|
52 |
+
</div>
|
53 |
+
</div>
|
54 |
+
<div class="hidden md:ml-6 md:flex md:items-center md:space-x-8">
|
55 |
+
<a href="index.html" class="text-gray-500 hover:text-blue-600 px-3 py-2 text-sm font-medium">Home</a>
|
56 |
+
<a href="#" class="text-gray-500 hover:text-blue-600 px-3 py-2 text-sm font-medium">Services</a>
|
57 |
+
<a href="industries.html" class="text-blue-600 px-3 py-2 text-sm font-medium border-b-2 border-blue-600">Industries</a>
|
58 |
+
<a href="about.html" class="text-gray-500 hover:text-blue-600 px-3 py-2 text-sm font-medium">About Us</a>
|
59 |
+
<a href="#" class="text-gray-500 hover:text-blue-600 px-3 py-2 text-sm font-medium">Contact</a>
|
60 |
+
<a href="#" class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md text-sm font-medium transition-all">Get a Quote</a>
|
61 |
+
</div>
|
62 |
+
<div class="-mr-2 flex items-center md:hidden">
|
63 |
+
<button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-blue-500" aria-controls="mobile-menu" aria-expanded="false">
|
64 |
+
<span class="sr-only">Open main menu</span>
|
65 |
+
<i class="fas fa-bars"></i>
|
66 |
+
</button>
|
67 |
+
</div>
|
68 |
+
</div>
|
69 |
+
</div>
|
70 |
+
</nav>
|
71 |
+
|
72 |
+
<!-- Hero Section -->
|
73 |
+
<div class="hero-gradient text-white">
|
74 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-24 text-center">
|
75 |
+
<h1 class="text-4xl md:text-5xl font-bold leading-tight mb-6">Industry-Specific Procurement Solutions</h1>
|
76 |
+
<p class="text-xl mb-8 opacity-90 max-w-3xl mx-auto">We understand the unique challenges and opportunities in your industry and tailor our procurement services accordingly</p>
|
77 |
+
<div class="flex justify-center">
|
78 |
+
<a href="#" class="border-2 border-white hover:bg-white hover:text-blue-600 px-6 py-3 rounded-md text-lg font-semibold text-center transition-all inline-flex items-center">
|
79 |
+
Speak to an Expert <i class="fas fa-arrow-right ml-3"></i>
|
80 |
+
</a>
|
81 |
+
</div>
|
82 |
+
</div>
|
83 |
+
</div>
|
84 |
+
|
85 |
+
<!-- Industry Highlights -->
|
86 |
+
<div class="py-20 bg-white">
|
87 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
88 |
+
<div class="text-center mb-16">
|
89 |
+
<h2 class="text-3xl font-bold text-gray-900 mb-4">Trusted by Leaders Across Industries</h2>
|
90 |
+
<p class="text-xl text-gray-600 max-w-3xl mx-auto">Our specialized procurement teams have deep experience in these key sectors</p>
|
91 |
+
</div>
|
92 |
+
|
93 |
+
<div class="grid md:grid-cols-3 gap-8">
|
94 |
+
<!-- Industry 1 -->
|
95 |
+
<div class="bg-white rounded-xl shadow-md p-6 card-hover transition-all text-center">
|
96 |
+
<div class="industry-icon rounded-full flex items-center justify-center mx-auto mb-6">
|
97 |
+
<i class="fas fa-industry text-white text-3xl"></i>
|
98 |
+
</div>
|
99 |
+
<h3 class="text-xl font-bold text-gray-900 mb-3">Manufacturing</h3>
|
100 |
+
<p class="text-gray-600 mb-4">Raw materials, components, machinery, and MRO supplies with quality assurance protocols.</p>
|
101 |
+
<a href="#manufacturing" class="text-blue-600 font-medium inline-flex items-center">
|
102 |
+
Learn More <i class="fas fa-chevron-right ml-2 text-sm"></i>
|
103 |
+
</a>
|
104 |
+
</div>
|
105 |
+
|
106 |
+
<!-- Industry 2 -->
|
107 |
+
<div class="bg-white rounded-xl shadow-md p-6 card-hover transition-all text-center">
|
108 |
+
<div class="industry-icon rounded-full flex items-center justify-center mx-auto mb-6">
|
109 |
+
<i class="fas fa-stethoscope text-white text-3xl"></i>
|
110 |
+
</div>
|
111 |
+
<h3 class="text-xl font-bold text-gray-900 mb-3">Healthcare</h3>
|
112 |
+
<p class="text-gray-600 mb-4">Medical equipment, pharmaceuticals, PPE with regulatory compliance expertise.</p>
|
113 |
+
<a href="#healthcare" class="text-blue-600 font-medium inline-flex items-center">
|
114 |
+
Learn More <i class="fas fa-chevron-right ml-2 text-sm"></i>
|
115 |
+
</a>
|
116 |
+
</div>
|
117 |
+
|
118 |
+
<!-- Industry 3 -->
|
119 |
+
<div class="bg-white rounded-xl shadow-md p-6 card-hover transition-all text-center">
|
120 |
+
<div class="industry-icon rounded-full flex items-center justify-center mx-auto mb-6">
|
121 |
+
<i class="fas fa-building text-white text-3xl"></i>
|
122 |
+
</div>
|
123 |
+
<h3 class="text-xl font-bold text-gray-900 mb-3">Construction</h3>
|
124 |
+
<p class="text-gray-600 mb-4">Building materials, fixtures, and equipment with logistics optimization.</p>
|
125 |
+
<a href="#construction" class="text-blue-600 font-medium inline-flex items-center">
|
126 |
+
Learn More <i class="fas fa-chevron-right ml-2 text-sm"></i>
|
127 |
+
</a>
|
128 |
+
</div>
|
129 |
+
|
130 |
+
<!-- Industry 4 -->
|
131 |
+
<div class="bg-white rounded-xl shadow-md p-6 card-hover transition-all text-center">
|
132 |
+
<div class="industry-icon rounded-full flex items-center justify-center mx-auto mb-6">
|
133 |
+
<i class="fas fa-tshirt text-white text-3xl"></i>
|
134 |
+
</div>
|
135 |
+
<h3 class="text-xl font-bold text-gray-900 mb-3">Retail & Apparel</h3>
|
136 |
+
<p class="text-gray-600 mb-4">Finished goods, textiles, and accessories with ethical sourcing commitments.</p>
|
137 |
+
<a href="#retail" class="text-blue-600 font-medium inline-flex items-center">
|
138 |
+
Learn More <i class="fas fa-chevron-right ml-2 text-sm"></i>
|
139 |
+
</a>
|
140 |
+
</div>
|
141 |
+
|
142 |
+
<!-- Industry 5 -->
|
143 |
+
<div class="bg-white rounded-xl shadow-md p-6 card-hover transition-all text-center">
|
144 |
+
<div class="industry-icon rounded-full flex items-center justify-center mx-auto mb-6">
|
145 |
+
<i class="fas fa-utensils text-white text-3xl"></i>
|
146 |
+
</div>
|
147 |
+
<h3 class="text-xl font-bold text-gray-900 mb-3">Food & Beverage</h3>
|
148 |
+
<p class="text-gray-600 mb-4">Ingredients, packaging, and equipment with food safety certifications.</p>
|
149 |
+
<a href="#food" class="text-blue-600 font-medium inline-flex items-center">
|
150 |
+
Learn More <i class="fas fa-chevron-right ml-2 text-sm"></i>
|
151 |
+
</a>
|
152 |
+
</div>
|
153 |
+
|
154 |
+
<!-- Industry 6 -->
|
155 |
+
<div class="bg-white rounded-xl shadow-md p-6 card-hover transition-all text-center">
|
156 |
+
<div class="industry-icon rounded-full flex items-center justify-center mx-auto mb-6">
|
157 |
+
<i class="fas fa-bolt text-white text-3xl"></i>
|
158 |
+
</div>
|
159 |
+
<h3 class="text-xl font-bold text-gray-900 mb-3">Energy & Utilities</h3>
|
160 |
+
<p class="text-gray-600 mb-4">Specialized equipment, spare parts, and maintenance services.</p>
|
161 |
+
<a href="#energy" class="text-blue-600 font-medium inline-flex items-center">
|
162 |
+
Learn More <i class="fas fa-chevron-right ml-2 text-sm"></i>
|
163 |
+
</a>
|
164 |
+
</div>
|
165 |
+
</div>
|
166 |
+
</div>
|
167 |
+
</div>
|
168 |
+
|
169 |
+
<!-- Industry Stats -->
|
170 |
+
<div class="py-20 bg-gray-50">
|
171 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
172 |
+
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
|
173 |
+
<!-- Stat 1 -->
|
174 |
+
<div class="bg-white rounded-xl shadow-md p-8 stats-card transition-all text-center">
|
175 |
+
<div class="stats-icon w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-6 transition-all">
|
176 |
+
<i class="fas fa-industry text-blue-600 text-2xl"></i>
|
177 |
+
</div>
|
178 |
+
<h3 class="text-4xl font-bold text-gray-900 mb-2">1,200+</h3>
|
179 |
+
<p class="text-gray-600">Manufacturing Clients Served</p>
|
180 |
+
</div>
|
181 |
+
|
182 |
+
<!-- Stat 2 -->
|
183 |
+
<div class="bg-white rounded-xl shadow-md p-8 stats-card transition-all text-center">
|
184 |
+
<div class="stats-icon w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-6 transition-all">
|
185 |
+
<i class="fas fa-globe-americas text-blue-600 text-2xl"></i>
|
186 |
+
</div>
|
187 |
+
<h3 class="text-4xl font-bold text-gray-900 mb-2">87+</h3>
|
188 |
+
<p class="text-gray-600">Countries in Our Supplier Network</p>
|
189 |
+
</div>
|
190 |
+
|
191 |
+
<!-- Stat 3 -->
|
192 |
+
<div class="bg-white rounded-xl shadow-md p-8 stats-card transition-all text-center">
|
193 |
+
<div class="stats-icon w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-6 transition-all">
|
194 |
+
<i class="fas fa-percentage text-blue-600 text-2xl"></i>
|
195 |
+
</div>
|
196 |
+
<h3 class="text-4xl font-bold text-gray-900 mb-2">12-30%</h3>
|
197 |
+
<p class="text-gray-600">Average Cost Savings for Clients</p>
|
198 |
+
</div>
|
199 |
+
|
200 |
+
<!-- Stat 4 -->
|
201 |
+
<div class="bg-white rounded-xl shadow-md p-8 stats-card transition-all text-center">
|
202 |
+
<div class="stats-icon w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-6 transition-all">
|
203 |
+
<i class="fas fa-project-diagram text-blue-600 text-2xl"></i>
|
204 |
+
</div>
|
205 |
+
<h3 class="text-4xl font-bold text-gray-900 mb-2">28</h3>
|
206 |
+
<p class="text-gray-600">Industry Specializations</p>
|
207 |
+
</div>
|
208 |
+
</div>
|
209 |
+
</div>
|
210 |
+
</div>
|
211 |
+
|
212 |
+
<!-- Detailed Industry Sections -->
|
213 |
+
<div class="py-20 bg-white" id="manufacturing">
|
214 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
215 |
+
<div class="md:flex md:items-center md:space-x-12">
|
216 |
+
<div class="md:w-1/2 mb-12 md:mb-0">
|
217 |
+
<img src="https://images.unsplash.com/photo-1521791136064-7986c2920216?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1469&q=80" alt="Manufacturing" class="rounded-lg shadow-xl w-full">
|
218 |
+
</div>
|
219 |
+
<div class="md:w-1/2">
|
220 |
+
<div class="bg-blue-100 text-blue-800 inline-flex items-center px-4 py-2 rounded-full text-sm font-medium mb-6">
|
221 |
+
<i class="fas fa-industry mr-2"></i> Manufacturing
|
222 |
+
</div>
|
223 |
+
<h2 class="text-3xl font-bold text-gray-900 mb-6">Precision Procurement for Manufacturers</h2>
|
224 |
+
<p class="text-lg text-gray-600 mb-6">In manufacturing, procurement isn't just about cost—it's about reliability, quality, and production continuity. We specialize in sourcing raw materials, components, and MRO supplies that meet your exact specifications while optimizing your supply chain.</p>
|
225 |
+
|
226 |
+
<div class="space-y-4 mb-8">
|
227 |
+
<div class="flex items-start">
|
228 |
+
<div class="flex-shrink-0 mt-1">
|
229 |
+
<i class="fas fa-check-circle text-blue-600"></i>
|
230 |
+
</div>
|
231 |
+
<div class="ml-3">
|
232 |
+
<p class="text-gray-800 font-medium">Dedicated supplier quality assurance teams</p>
|
233 |
+
</div>
|
234 |
+
</div>
|
235 |
+
<div class="flex items-start">
|
236 |
+
<div class="flex-shrink-0 mt-1">
|
237 |
+
<i class="fas fa-check-circle text-blue-600"></i>
|
238 |
+
</div>
|
239 |
+
<div class="ml-3">
|
240 |
+
<p class="text-gray-800 font-medium">Just-in-time inventory management</p>
|
241 |
+
</div>
|
242 |
+
</div>
|
243 |
+
<div class="flex items-start">
|
244 |
+
<div class="flex-shrink-0 mt-1">
|
245 |
+
<i class="fas fa-check-circle text-blue-600"></i>
|
246 |
+
</div>
|
247 |
+
<div class="ml-3">
|
248 |
+
<p class="text-gray-800 font-medium">Strategic sourcing for specialty metals and alloys</p>
|
249 |
+
</div>
|
250 |
+
</div>
|
251 |
+
</div>
|
252 |
+
|
253 |
+
<a href="#" class="text-blue-600 font-medium inline-flex items-center">
|
254 |
+
View Manufacturing Case Studies <i class="fas fa-arrow-right ml-3"></i>
|
255 |
+
</a>
|
256 |
+
</div>
|
257 |
+
</div>
|
258 |
+
</div>
|
259 |
+
</div>
|
260 |
+
|
261 |
+
<div class="py-20 bg-gray-50" id="healthcare">
|
262 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
263 |
+
<div class="md:flex md:items-center md:space-x-12 flex-row-reverse">
|
264 |
+
<div class="md:w-1/2 mb-12 md:mb-0">
|
265 |
+
<img src="https://images.unsplash.com/photo-1579684385127-1ef15d508118?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Healthcare" class="rounded-lg shadow-xl w-full">
|
266 |
+
</div>
|
267 |
+
<div class="md:w-1/2">
|
268 |
+
<div class="bg-blue-100 text-blue-800 inline-flex items-center px-4 py-2 rounded-full text-sm font-medium mb-6">
|
269 |
+
<i class="fas fa-stethoscope mr-2"></i> Healthcare
|
270 |
+
</div>
|
271 |
+
<h2 class="text-3xl font-bold text-gray-900 mb-6">Compliant Medical Procurement</h2>
|
272 |
+
<p class="text-lg text-gray-600 mb-6">Healthcare procurement requires specialized knowledge of regulatory requirements, sterile processing, and medical device standards. Our team includes former healthcare professionals who understand clinical needs and compliance challenges.</p>
|
273 |
+
|
274 |
+
<div class="space-y-4 mb-8">
|
275 |
+
<div class="flex items-start">
|
276 |
+
<div class="flex-shrink-0 mt-1">
|
277 |
+
<i class="fas fa-check-circle text-blue-600"></i>
|
278 |
+
</div>
|
279 |
+
<div class="ml-3">
|
280 |
+
<p class="text-gray-800 font-medium">FDA, CE, and ISO 13485 compliant suppliers</p>
|
281 |
+
</div>
|
282 |
+
</div>
|
283 |
+
<div class="flex items-start">
|
284 |
+
<div class="flex-shrink-0 mt-1">
|
285 |
+
<i class="fas fa-check-circle text-blue-600"></i>
|
286 |
+
</div>
|
287 |
+
<div class="ml-3">
|
288 |
+
<p class="text-gray-800 font-medium">Emergency supply chain solutions for critical items</p>
|
289 |
+
</div>
|
290 |
+
</div>
|
291 |
+
<div class="flex items-start">
|
292 |
+
<div class="flex-shrink-0 mt-1">
|
293 |
+
<i class="fas fa-check-circle text-blue-600"></i>
|
294 |
+
</div>
|
295 |
+
<div class="ml-3">
|
296 |
+
<p class="text-gray-800 font-medium">Pharmaceutical cold chain logistics expertise</p>
|
297 |
+
</div>
|
298 |
+
</div>
|
299 |
+
</div>
|
300 |
+
|
301 |
+
<a href="#" class="text-blue-600 font-medium inline-flex items-center">
|
302 |
+
Healthcare Procurement Whitepaper <i class="fas fa-download ml-3"></i>
|
303 |
+
</a>
|
304 |
+
</div>
|
305 |
+
</div>
|
306 |
+
</div>
|
307 |
+
</div>
|
308 |
+
|
309 |
+
<div class="py-20 bg-white" id="construction">
|
310 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
311 |
+
<div class="md:flex md:items-center md:space-x-12">
|
312 |
+
<div class="md:w-1/2 mb-12 md:mb-0">
|
313 |
+
<img src="https://images.unsplash.com/photo-1600585154340-be6161a56a0c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Construction" class="rounded-lg shadow-xl w-full">
|
314 |
+
</div>
|
315 |
+
<div class="md:w-1/2">
|
316 |
+
<div class="bg-blue-100 text-blue-800 inline-flex items-center px-4 py-2 rounded-full text-sm font-medium mb-6">
|
317 |
+
<i class="fas fa-building mr-2"></i> Construction
|
318 |
+
</div>
|
319 |
+
<h2 class="text-3xl font-bold text-gray-900 mb-6">Building Material Procurement Partners</h2>
|
320 |
+
<p class="text-lg text-gray-600 mb-6">Construction projects live or die by their supply chains. We provide predictable, cost-effective access to building materials with logistical coordination that keeps your projects on schedule and within budget.</p>
|
321 |
+
|
322 |
+
<div class="space-y-4 mb-8">
|
323 |
+
<div class="flex items-start">
|
324 |
+
<div class="flex-shrink-0 mt-1">
|
325 |
+
<i class="fas fa-check-circle text-blue-600"></i>
|
326 |
+
</div>
|
327 |
+
<div class="ml-3">
|
328 |
+
<p class="text-gray-800 font-medium">Bulk material sourcing with volume discounts</p>
|
329 |
+
</div>
|
330 |
+
</div>
|
331 |
+
<div class="flex items-start">
|
332 |
+
<div class="flex-shrink-0 mt-1">
|
333 |
+
<i class="fas fa-check-circle text-blue-600"></i>
|
334 |
+
</div>
|
335 |
+
<div class="ml-3">
|
336 |
+
<p class="text-gray-800 font-medium">Just-in-sequence delivery for lean construction</p>
|
337 |
+
</div>
|
338 |
+
</div>
|
339 |
+
<div class="flex items-start">
|
340 |
+
<div class="flex-shrink-0 mt-1">
|
341 |
+
<i class="fas fa-check-circle text-blue-600"></i>
|
342 |
+
</div>
|
343 |
+
<div class="ml-3">
|
344 |
+
<p class="text-gray-800 font-medium">Sustainable material sourcing options</p>
|
345 |
+
</div>
|
346 |
+
</div>
|
347 |
+
</div>
|
348 |
+
|
349 |
+
<a href="#" class="text-blue-600 font-medium inline-flex items-center">
|
350 |
+
Construction Material Calculator <i class="fas fa-calculator ml-3"></i>
|
351 |
+
</a>
|
352 |
+
</div>
|
353 |
+
</div>
|
354 |
+
</div>
|
355 |
+
</div>
|
356 |
+
|
357 |
+
<!-- CTA Banner -->
|
358 |
+
<div class="bg-blue-600 text-white">
|
359 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
360 |
+
<div class="text-center">
|
361 |
+
<h2 class="text-3xl font-bold mb-6">Looking for a Different Industry Solution?</h2>
|
362 |
+
<p class="text-xl opacity-90 mb-8 max-w-3xl mx-auto">Our procurement specialists likely have experience in your specific vertical. Contact us to discuss your industry's unique requirements.</p>
|
363 |
+
<a href="#" class="bg-white text-blue-600 hover:bg-gray-100 px-8 py-4 rounded-md text-lg font-semibold text-center transition-all inline-flex items-center">
|
364 |
+
Get Industry-Specific Advice <i class="fas fa-arrow-right ml-3"></i>
|
365 |
+
</a>
|
366 |
+
</div>
|
367 |
+
</div>
|
368 |
+
</div>
|
369 |
+
|
370 |
+
<!-- Our Approach -->
|
371 |
+
<div class="py-20 bg-gray-50">
|
372 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
373 |
+
<div class="text-center mb-16">
|
374 |
+
<h2 class="text-3xl font-bold text-gray-900 mb-4">Our Industry-Centric Approach</h2>
|
375 |
+
<p class="text-xl text-gray-600 max-w-3xl mx-auto">How we customize procurement solutions for each sector</p>
|
376 |
+
</div>
|
377 |
+
|
378 |
+
<div class="grid md:grid-cols-2 gap-12">
|
379 |
+
<div class="bg-white rounded-xl shadow-md p-8">
|
380 |
+
<div class="w-16 h-16 bg-blue-100 rounded-lg flex items-center justify-center mb-6">
|
381 |
+
<i class="fas fa-user-tie text-blue-600 text-2xl"></i>
|
382 |
+
</div>
|
383 |
+
<h3 class="text-xl font-bold text-gray-900 mb-3">Sector-Specialized Teams</h3>
|
384 |
+
<p class="text-gray-600 mb-6">We organize procurement experts into industry-focused teams who develop deep knowledge of your sector's suppliers, standards, and pain points.</p>
|
385 |
+
<ul class="space-y-3">
|
386 |
+
<li class="flex items-start">
|
387 |
+
<div class="flex-shrink-0 mt-1">
|
388 |
+
<i class="fas fa-check text-blue-600"></i>
|
389 |
+
</div>
|
390 |
+
<div class="ml-3">
|
391 |
+
<p class="text-gray-800">Team members with 10+ years in your industry</p>
|
392 |
+
</div>
|
393 |
+
</li>
|
394 |
+
<li class="flex items-start">
|
395 |
+
<div class="flex-shrink-0 mt-1">
|
396 |
+
<i class="fas fa-check text-blue-600"></i>
|
397 |
+
</div>
|
398 |
+
<div class="ml-3">
|
399 |
+
<p class="text-gray-800">Continuous sector-specific training programs</p>
|
400 |
+
</div>
|
401 |
+
</li>
|
402 |
+
<li class="flex items-start">
|
403 |
+
<div class="flex-shrink-0 mt-1">
|
404 |
+
<i class="fas fa-check text-blue-600"></i>
|
405 |
+
</div>
|
406 |
+
<div class="ml-3">
|
407 |
+
<p class="text-gray-800">Active participation in industry associations</p>
|
408 |
+
</div>
|
409 |
+
</li>
|
410 |
+
</ul>
|
411 |
+
</div>
|
412 |
+
|
413 |
+
<div class="bg-white rounded-xl shadow-md p-8">
|
414 |
+
<div class="w-16 h-16 bg-blue-100 rounded-lg flex items-center justify-center mb-6">
|
415 |
+
<i class="fas fa-chart-pie text-blue-600 text-2xl"></i>
|
416 |
+
</div>
|
417 |
+
<h3 class="text-xl font-bold text-gray-900 mb-3">Customized KPIs & Metrics</h3>
|
418 |
+
<p class="text-gray-600 mb-6">We go beyond generic procurement metrics to track what matters most in your industry, from clinical outcomes to construction timelines.</p>
|
419 |
+
<ul class="space-y-3">
|
420 |
+
<li class="flex items-start">
|
421 |
+
<div class="flex-shrink-0 mt-1">
|
422 |
+
<i class="fas fa-check text-blue-600"></i>
|
423 |
+
</div>
|
424 |
+
<div class="ml-3">
|
425 |
+
<p class="text-gray-800">Sector-specific cost benchmarks</p>
|
426 |
+
</div>
|
427 |
+
</li>
|
428 |
+
<li class="flex items-start">
|
429 |
+
<div class="flex-shrink-0 mt-1">
|
430 |
+
<i class="fas fa-check text-blue-600"></i>
|
431 |
+
</div>
|
432 |
+
<div class="ml-3">
|
433 |
+
<p class="text-gray-800">Industry-standard quality metrics</p>
|
434 |
+
</div>
|
435 |
+
</li>
|
436 |
+
<li class="flex items-start">
|
437 |
+
<div class="flex-shrink-0 mt-1">
|
438 |
+
<i class="fas fa-check text-blue-600"></i>
|
439 |
+
</div>
|
440 |
+
<div class="ml-3">
|
441 |
+
<p class="text-gray-800">Regulatory compliance tracking</p>
|
442 |
+
</div>
|
443 |
+
</li>
|
444 |
+
</ul>
|
445 |
+
</div>
|
446 |
+
</div>
|
447 |
+
</div>
|
448 |
+
</div>
|
449 |
+
|
450 |
+
<!-- Client Testimonials -->
|
451 |
+
<div class="py-20 bg-white">
|
452 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
453 |
+
<div class="text-center mb-16">
|
454 |
+
<h2 class="text-3xl font-bold text-gray-900 mb-4">What Industry Leaders Say</h2>
|
455 |
+
<p class="text-xl text-gray-600 max-w-3xl mx-auto">Hear from clients across different sectors about their experience working with GlobalProcure</p>
|
456 |
+
</div>
|
457 |
+
|
458 |
+
<div class="grid md:grid-cols-3 gap-8">
|
459 |
+
<!-- Testimonial 1 -->
|
460 |
+
<div class="relative bg-gray-50 p-8 rounded-xl">
|
461 |
+
<div class="absolute -top-4 -left-4 bg-blue-600 text-white w-10 h-10 rounded-full flex items-center justify-center">
|
462 |
+
<i class="fas fa-quote-left text-sm"></i>
|
463 |
+
</div>
|
464 |
+
<div class="mb-4">
|
465 |
+
<i class="fas fa-star text-yellow-400"></i>
|
466 |
+
<i class="fas fa-star text-yellow-400"></i>
|
467 |
+
<i class="fas fa-star text-yellow-400"></i>
|
468 |
+
<i class="fas fa-star text-yellow-400"></i>
|
469 |
+
<i class="fas fa-star text-yellow-400"></i>
|
470 |
+
</div>
|
471 |
+
<p class="text-gray-700 mb-6">"GlobalProcure's manufacturing specialists helped us reduce raw material costs by 18% while actually improving quality standards—something we didn't think was possible."</p>
|
472 |
+
<div class="flex items-center">
|
473 |
+
<div class="flex-shrink-0">
|
474 |
+
<img class="h-10 w-10 rounded-full" src="https://images.unsplash.com/photo-1560250097-0b93528c311a?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1287&q=80" alt="Profile">
|
475 |
+
</div>
|
476 |
+
<div class="ml-3">
|
477 |
+
<p class="text-sm font-medium text-gray-900">Mark Thompson</p>
|
478 |
+
<p class="text-sm text-gray-500">VP of Supply Chain, Acme Manufacturing</p>
|
479 |
+
</div>
|
480 |
+
</div>
|
481 |
+
</div>
|
482 |
+
|
483 |
+
<!-- Testimonial 2 -->
|
484 |
+
<div class="relative bg-gray-50 p-8 rounded-xl">
|
485 |
+
<div class="absolute -top-4 -left-4 bg-blue-600 text-white w-10 h-10 rounded-full flex items-center justify-center">
|
486 |
+
<i class="fas fa-quote-left text-sm"></i>
|
487 |
+
</div>
|
488 |
+
<div class="mb-4">
|
489 |
+
<i class="fas fa-star text-yellow-400"></i>
|
490 |
+
<i class="fas fa-star text-yellow-400"></i>
|
491 |
+
<i class="fas fa-star text-yellow-400"></i>
|
492 |
+
<i class="fas fa-star text-yellow-400"></i>
|
493 |
+
<i class="fas fa-star text-yellow-400"></i>
|
494 |
+
</div>
|
495 |
+
<p class="text-gray-700 mb-6">"Their knowledge of FDA medical device regulations saved us months in procurement time while ensuring full compliance—priceless for our startup."</p>
|
496 |
+
<div class="flex items-center">
|
497 |
+
<div class="flex-shrink-0">
|
498 |
+
<img class="h-10 w-10 rounded-full" src="https://images.unsplash.com/photo-1573496359142-b8d87734a5a2?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1288&q=80" alt="Profile">
|
499 |
+
</div>
|
500 |
+
<div class="ml-3">
|
501 |
+
<p class="text-sm font-medium text-gray-900">Dr. Lisa Rodriguez</p>
|
502 |
+
<p class="text-sm text-gray-500">CEO, HealthInnovate Medical</p>
|
503 |
+
</div>
|
504 |
+
</div>
|
505 |
+
</div>
|
506 |
+
|
507 |
+
<!-- Testimonial 3 -->
|
508 |
+
<div class="relative bg-gray-50 p-8 rounded-xl">
|
509 |
+
<div class="absolute -top-4 -left-4 bg-blue-600 text-white w-10 h-10 rounded-full flex items-center justify-center">
|
510 |
+
<i class="fas fa-quote-left text-sm"></i>
|
511 |
+
</div>
|
512 |
+
<div class="mb-4">
|
513 |
+
<i class="fas fa-star text-yellow-400"></i>
|
514 |
+
<i class="fas fa-star text-yellow-400"></i>
|
515 |
+
<i class="fas fa-star text-yellow-400"></i>
|
516 |
+
<i class="fas fa-star text-yellow-400"></i>
|
517 |
+
<i class="fas fa-star text-yellow-400"></i>
|
518 |
+
</div>
|
519 |
+
<p class="text-gray-700 mb-6">"By leveraging their construction supplier network, we completed our latest project 12% under budget and got premium materials at wholesale prices."</p>
|
520 |
+
<div class="flex items-center">
|
521 |
+
<div class="flex-shrink-0">
|
522 |
+
<img class="h-10 w-10 rounded-full" src="https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Profile">
|
523 |
+
</div>
|
524 |
+
<div class="ml-3">
|
525 |
+
<p class="text-sm font-medium text-gray-900">James Wilson</p>
|
526 |
+
<p class="text-sm text-gray-500">Project Director, CityScape Developers</p>
|
527 |
+
</div>
|
528 |
+
</div>
|
529 |
+
</div>
|
530 |
+
</div>
|
531 |
+
</div>
|
532 |
+
</div>
|
533 |
+
|
534 |
+
<!-- Footer -->
|
535 |
+
<footer class="bg-gray-900 text-white pt-16 pb-8">
|
536 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
537 |
+
<div class="grid md:grid-cols-4 gap-12 mb-12">
|
538 |
+
<div>
|
539 |
+
<div class="flex items-center mb-6">
|
540 |
+
<i class="fas fa-boxes text-blue-400 text-2xl mr-2"></i>
|
541 |
+
<span class="text-xl font-bold">GlobalProcure</span>
|
542 |
+
</div>
|
543 |
+
<p class="text-gray-400 mb-6">Your trusted partner for global procurement solutions and supply chain optimization.</p>
|
544 |
+
<div class="flex space-x-4">
|
545 |
+
<a href="#" class="text-gray-400 hover:text-white transition-all"><i class="fab fa-linkedin-in"></i></a>
|
546 |
+
<a href="#" class="text-gray-400 hover:text-white transition-all"><i class="fab fa-twitter"></i></a>
|
547 |
+
<a href="#" class="text-gray-400 hover:text-white transition-all"><i class="fab fa-facebook-f"></i></a>
|
548 |
+
</div>
|
549 |
+
</div>
|
550 |
+
|
551 |
+
<div>
|
552 |
+
<h3 class="text-lg font-semibold mb-6">Services</h3>
|
553 |
+
<ul class="space-y-3">
|
554 |
+
<li><a href="#" class="text-gray-400 hover:text-white transition-all">Strategic Sourcing</a></li>
|
555 |
+
<li><a href="#" class="text-gray-400 hover:text-white transition-all">Global Procurement</a></li>
|
556 |
+
<li><a href="#" class="text-gray-400 hover:text-white transition-all">Supplier Management</a></li>
|
557 |
+
<li><a href="#" class="text-gray-400 hover:text-white transition-all">Quality Assurance</a></li>
|
558 |
+
<li><a href="#" class="text-gray-400 hover:text-white transition-all">Logistics Coordination</a></li>
|
559 |
+
</ul>
|
560 |
+
</div>
|
561 |
+
|
562 |
+
<div>
|
563 |
+
<h3 class="text-lg font-semibold mb-6">Industries</h3>
|
564 |
+
<ul class="space-y-3">
|
565 |
+
<li><a href="industries.html" class="text-gray-400 hover:text-white transition-all">Manufacturing</a></li>
|
566 |
+
<li><a href="industries.html" class="text-gray-400 hover:text-white transition-all">Healthcare</a></li>
|
567 |
+
<li><a href="industries.html" class="text-gray-400 hover:text-white transition-all">Construction</a></li>
|
568 |
+
<li><a href="industries.html" class="text-gray-400 hover:text-white transition-all">Retail & Apparel</a></li>
|
569 |
+
<li><a href="industries.html" class="text-gray-400 hover:text-white transition-all">Food & Beverage</a></li>
|
570 |
+
</ul>
|
571 |
+
</div>
|
572 |
+
|
573 |
+
<div>
|
574 |
+
<h3 class="text-lg font-semibold mb-6">Contact Us</h3>
|
575 |
+
<ul class="space-y-3 text-gray-400">
|
576 |
+
<li class="flex items-start">
|
577 |
+
<i class="fas fa-map-marker-alt mt-1 mr-3 text-blue-400"></i>
|
578 |
+
<span>123 Procurement Ave, Suite 500, New York, NY 10001</span>
|
579 |
+
</li>
|
580 |
+
<li class="flex items-center">
|
581 |
+
<i class="fas fa-phone-alt mr-3 text-blue-400"></i>
|
582 |
+
<span>+1 (555) 123-4567</span>
|
583 |
+
</li>
|
584 |
+
<li class="flex items-center">
|
585 |
+
<i class="fas fa-envelope mr-3 text-blue-400"></i>
|
586 |
+
<span>info@globalprocure.com</span>
|
587 |
+
</li>
|
588 |
+
</ul>
|
589 |
+
</div>
|
590 |
+
</div>
|
591 |
+
|
592 |
+
<div class="border-t border-gray-800 pt-8 flex flex-col md:flex-row justify-between items-center">
|
593 |
+
<p class="text-gray-400 mb-4 md:mb-0">© 2023 GlobalProcure. All rights reserved.</p>
|
594 |
+
<div class="flex space-x-6">
|
595 |
+
<a href="#" class="text-gray-400 hover:text-white transition-all">Privacy Policy</a>
|
596 |
+
<a href="#" class="text-gray-400 hover:text-white transition-all">Terms of Service</a>
|
597 |
+
<a href="#" class="text-gray-400 hover:text-white transition-all">Sitemap</a>
|
598 |
+
</div>
|
599 |
+
</div>
|
600 |
+
</div>
|
601 |
+
</footer>
|
602 |
+
|
603 |
+
<script>
|
604 |
+
// Mobile menu toggle functionality
|
605 |
+
const mobileMenuButton = document.querySelector('[aria-controls="mobile-menu"]');
|
606 |
+
const mobileMenu = document.createElement('div');
|
607 |
+
mobileMenu.id = 'mobile-menu';
|
608 |
+
mobileMenu.className = 'hidden md:hidden bg-white shadow-lg';
|
609 |
+
mobileMenu.innerHTML = `
|
610 |
+
<div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
|
611 |
+
<a href="index.html" class="block px-3 py-2 rounded-md text-base font-medium text-gray-500 hover:text-gray-900 hover:bg-gray-50">Home</a>
|
612 |
+
<a href="#" class="block px-3 py-2 rounded-md text-base font-medium text-gray-500 hover:text-gray-900 hover:bg-gray-50">Services</a>
|
613 |
+
<a href="industries.html" class="block px-3 py-2 rounded-md text-base font-medium text-gray-900 bg-gray-100">Industries</a>
|
614 |
+
<a href="about.html" class="block px-3 py-2 rounded-md text-base font-medium text-gray-500 hover:text-gray-900 hover:bg-gray-50">About Us</a>
|
615 |
+
<a href="#" class="block px-3 py-2 rounded-md text-base font-medium text-gray-500 hover:text-gray-900 hover:bg-gray-50">Contact</a>
|
616 |
+
<a href="#" class="block px-3 py-2 rounded-md text-base font-medium text-white bg-blue-600 hover:bg-blue-700">Get a Quote</a>
|
617 |
+
</div>
|
618 |
+
`;
|
619 |
+
document.body.appendChild(mobileMenu);
|
620 |
+
|
621 |
+
let menuOpen = false;
|
622 |
+
mobileMenuButton.addEventListener('click', () => {
|
623 |
+
menuOpen = !menuOpen;
|
624 |
+
if (menuOpen) {
|
625 |
+
mobileMenu.classList.remove('hidden');
|
626 |
+
mobileMenuButton.innerHTML = '<i class="fas fa-times"></i>';
|
627 |
+
} else {
|
628 |
+
mobileMenu.classList.add('hidden');
|
629 |
+
mobileMenuButton.innerHTML = '<i class="fas fa-bars"></i>';
|
630 |
+
}
|
631 |
+
});
|
632 |
+
|
633 |
+
// Smooth scrolling for anchor links
|
634 |
+
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
635 |
+
anchor.addEventListener('click', function (e) {
|
636 |
+
e.preventDefault();
|
637 |
+
const targetId = this.getAttribute('href');
|
638 |
+
if (targetId === '#') return;
|
639 |
+
|
640 |
+
const targetElement = document.querySelector(targetId);
|
641 |
+
if (targetElement) {
|
642 |
+
targetElement.scrollIntoView({
|
643 |
+
behavior: 'smooth',
|
644 |
+
block: 'start'
|
645 |
+
});
|
646 |
+
|
647 |
+
// Close mobile menu if open
|
648 |
+
if (menuOpen) {
|
649 |
+
mobileMenu.classList.add('hidden');
|
650 |
+
mobileMenuButton.innerHTML = '<i class="fas fa-bars"></i>';
|
651 |
+
menuOpen = false;
|
652 |
+
}
|
653 |
+
}
|
654 |
+
});
|
655 |
+
});
|
656 |
+
</script>
|
657 |
+
<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=Neoman/weber" style="color: #fff;text-decoration: underline;" target="_blank" >🧬 Remix</a></p></body>
|
658 |
+
</html>
|