Hugging Face's logo

Spaces:
Greats
/
orionvrew
Running

App Files Community
ANTIMOLL commited on
Commit
0bec835
·
verified ·
1 Parent(s): 0fba35d

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +878 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Opt6968
3
- emoji: 📚
4
- colorFrom: pink
5
- colorTo: indigo
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: opt6968
3
+ emoji: 🐳
4
+ colorFrom: gray
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,878 @@
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="ru">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Оптика "ОПТОН" - Профессиональный мир очков</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
+ <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
10
+ <style>
11
+ body {
12
+ font-family: 'Poppins', sans-serif;
13
+ background: linear-gradient(135deg, #f5f7fa 0%, #e4e8f0 100%);
14
+ }
15
+ .magic-gradient {
16
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
17
+ }
18
+ .service-card {
19
+ transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
20
+ background: white;
21
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
22
+ border-radius: 20px;
23
+ overflow: hidden;
24
+ }
25
+ .service-card:hover {
26
+ transform: translateY(-10px) scale(1.02);
27
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
28
+ }
29
+ .floating {
30
+ animation: floating 6s ease-in-out infinite;
31
+ }
32
+ @keyframes floating {
33
+ 0% { transform: translateY(0px); }
34
+ 50% { transform: translateY(-15px); }
35
+ 100% { transform: translateY(0px); }
36
+ }
37
+ .pulse {
38
+ animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
39
+ }
40
+ @keyframes pulse {
41
+ 0%, 100% { opacity: 1; }
42
+ 50% { opacity: 0.8; }
43
+ }
44
+ .nav-link {
45
+ position: relative;
46
+ }
47
+ .nav-link:after {
48
+ content: '';
49
+ position: absolute;
50
+ width: 0;
51
+ height: 3px;
52
+ bottom: -5px;
53
+ left: 0;
54
+ background-color: #fff;
55
+ transition: width 0.3s ease;
56
+ border-radius: 3px;
57
+ }
58
+ .nav-link:hover:after {
59
+ width: 100%;
60
+ }
61
+ .contact-card {
62
+ background: white;
63
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
64
+ transition: all 0.3s ease;
65
+ border-radius: 15px;
66
+ }
67
+ .contact-card:hover {
68
+ transform: translateY(-5px);
69
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
70
+ }
71
+ .schedule-item {
72
+ position: relative;
73
+ padding-left: 2rem;
74
+ }
75
+ .schedule-item:before {
76
+ content: '';
77
+ position: absolute;
78
+ left: 0;
79
+ top: 0.5rem;
80
+ width: 1rem;
81
+ height: 1rem;
82
+ background-color: #667eea;
83
+ border-radius: 50%;
84
+ }
85
+ .map-container {
86
+ height: 400px;
87
+ border-radius: 20px;
88
+ overflow: hidden;
89
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
90
+ }
91
+ .glow-text {
92
+ text-shadow: 0 0 10px rgba(102, 126, 234, 0.5);
93
+ }
94
+ .magic-border {
95
+ border: 2px solid transparent;
96
+ background-clip: padding-box;
97
+ background-image: linear-gradient(white, white),
98
+ linear-gradient(135deg, #667eea 0%, #764ba2 100%);
99
+ background-origin: border-box;
100
+ background-clip: padding-box, border-box;
101
+ }
102
+ .article-card {
103
+ background: white;
104
+ border-radius: 20px;
105
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
106
+ overflow: hidden;
107
+ }
108
+ .tip-icon {
109
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
110
+ color: white;
111
+ border-radius: 50%;
112
+ width: 40px;
113
+ height: 40px;
114
+ display: flex;
115
+ align-items: center;
116
+ justify-content: center;
117
+ flex-shrink: 0;
118
+ }
119
+ .logo-icon {
120
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
121
+ color: white;
122
+ border-radius: 12px;
123
+ width: 50px;
124
+ height: 50px;
125
+ display: flex;
126
+ align-items: center;
127
+ justify-content: center;
128
+ font-weight: 700;
129
+ font-size: 24px;
130
+ font-family: 'Montserrat', sans-serif;
131
+ }
132
+ </style>
133
+ </head>
134
+ <body class="bg-gradient-to-br from-blue-50 to-purple-50">
135
+ <!-- Header -->
136
+ <header class="magic-gradient text-white shadow-lg sticky top-0 z-50">
137
+ <div class="container mx-auto px-4 py-4">
138
+ <div class="flex justify-between items-center">
139
+ <div class="flex items-center space-x-3">
140
+ <div class="logo-icon">
141
+ ОП
142
+ </div>
143
+ <h1 class="text-2xl font-bold tracking-tight">ОПТИКА "ОПТОН"</h1>
144
+ </div>
145
+ <nav class="hidden md:flex space-x-8 items-center">
146
+ <a href="#services" class="nav-link font-medium">Услуги</a>
147
+ <a href="#repair" class="nav-link font-medium">Ремонт</a>
148
+ <a href="#manufacturing" class="nav-link font-medium">Изготовление</a>
149
+ <a href="#care" class="nav-link font-medium">Уход за очками</a>
150
+ <a href="#about" class="nav-link font-medium">О нас</a>
151
+ <a href="#contacts" class="nav-link font-medium">Контакты</a>
152
+ <a href="tel:+79263236886" class="bg-white text-purple-600 px-4 py-2 rounded-lg font-semibold hover:bg-gray-100 transition flex items-center">
153
+ <i class="fas fa-phone mr-2"></i>+7 (926) 323-68-86
154
+ </a>
155
+ </nav>
156
+ <div class="md:hidden">
157
+ <button id="menu-btn" class="text-2xl focus:outline-none">
158
+ <i class="fas fa-bars"></i>
159
+ </button>
160
+ </div>
161
+ </div>
162
+ </div>
163
+
164
+ <!-- Mobile Menu -->
165
+ <div id="mobile-menu" class="hidden md:hidden bg-purple-800 px-4 py-2">
166
+ <div class="flex flex-col space-y-3">
167
+ <a href="#services" class="nav-link py-2">Услуги</a>
168
+ <a href="#repair" class="nav-link py-2">Ремонт</a>
169
+ <a href="#manufacturing" class="nav-link py-2">Изготовление</a>
170
+ <a href="#care" class="nav-link py-2">Уход за очками</a>
171
+ <a href="#about" class="nav-link py-2">О нас</a>
172
+ <a href="#contacts" class="nav-link py-2">Контакты</a>
173
+ <a href="tel:+79263236886" class="bg-white text-purple-600 px-4 py-2 rounded-lg font-semibold hover:bg-gray-100 transition text-center">
174
+ <i class="fas fa-phone mr-2"></i>+7 (926) 323-68-86
175
+ </a>
176
+ </div>
177
+ </div>
178
+ </header>
179
+
180
+ <!-- Hero Section -->
181
+ <section class="relative overflow-hidden">
182
+ <div class="absolute inset-0 bg-gradient-to-r from-purple-500 to-blue-500 opacity-90"></div>
183
+ <div class="container mx-auto px-4 py-32 relative z-10 text-center">
184
+ <h1 class="text-5xl md:text-6xl font-bold text-white mb-6">Профессиональный мир очков</h1>
185
+ <p class="text-xl md:text-2xl text-white mb-8 max-w-3xl mx-auto">Качественные услуги по ремонту и изготовлению очков с 20-летним опытом</p>
186
+ <div class="flex justify-center">
187
+ <a href="tel:+79263236886" class="bg-white text-purple-600 px-8 py-4 rounded-full font-semibold hover:bg-gray-100 transition flex items-center text-lg shadow-lg transform hover:scale-105">
188
+ <i class="fas fa-phone mr-3"></i>+7 (926) 323-68-86
189
+ </a>
190
+ </div>
191
+ </div>
192
+ </section>
193
+
194
+ <!-- Services Section -->
195
+ <section id="services" class="py-16 bg-white">
196
+ <div class="container mx-auto px-4">
197
+ <div class="text-center mb-12">
198
+ <h2 class="text-3xl font-bold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-purple-600 to-blue-600">Наши профессиональные услуги</h2>
199
+ <div class="w-20 h-1 bg-gradient-to-r from-purple-400 to-blue-400 mx-auto rounded-full"></div>
200
+ </div>
201
+
202
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
203
+ <!-- Service Card 1 -->
204
+ <div class="service-card">
205
+ <div class="h-48 overflow-hidden">
206
+ <img src="https://images.unsplash.com/photo-1556306535-38febf6782e7?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=800&q=80"
207
+ alt="Ремонт очков"
208
+ class="w-full h-full object-cover">
209
+ </div>
210
+ <div class="p-6">
211
+ <h3 class="text-xl font-semibold mb-4 text-center text-gray-800">Ремонт очков</h3>
212
+ <ul class="space-y-3 text-gray-700">
213
+ <li class="flex items-start">
214
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
215
+ <span>Замена носовых упоров</span>
216
+ </li>
217
+ <li class="flex items-start">
218
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
219
+ <span>Замена и подбор заушников</span>
220
+ </li>
221
+ <li class="flex items-start">
222
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
223
+ <span>Замена винтиков</span>
224
+ </li>
225
+ <li class="flex items-start">
226
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
227
+ <span>Замена гарпунов</span>
228
+ </li>
229
+ </ul>
230
+ </div>
231
+ </div>
232
+
233
+ <!-- Service Card 2 -->
234
+ <div class="service-card">
235
+ <div class="h-48 overflow-hidden">
236
+ <img src="https://static.wixstatic.com/media/f84ec4_8abcd0ad160b421e86c61d6fd4f6dfe0~mv2.jpg/v1/fill/w_620,h_400,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/tl.jpg"
237
+ alt="Окраска линз"
238
+ class="w-full h-full object-cover">
239
+ </div>
240
+ <div class="p-6">
241
+ <h3 class="text-xl font-semibold mb-4 text-center text-gray-800">Окраска линз</h3>
242
+ <ul class="space-y-3 text-gray-700">
243
+ <li class="flex items-start">
244
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
245
+ <span>Окраска полимерных линз</span>
246
+ </li>
247
+ <li class="flex items-start">
248
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
249
+ <span>Любой цвет, включая градиент</span>
250
+ </li>
251
+ <li class="flex items-start">
252
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
253
+ <span>Мультицветные решения</span>
254
+ </li>
255
+ <li class="flex items-start">
256
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
257
+ <span>Примерка перед окраской</span>
258
+ </li>
259
+ </ul>
260
+ </div>
261
+ </div>
262
+
263
+ <!-- Service Card 3 -->
264
+ <div class="service-card">
265
+ <div class="h-48 overflow-hidden">
266
+ <img src="https://static.wixstatic.com/media/11062b_bb306819ebe94806ad697b21dc821887~mv2.jpg/v1/fill/w_620,h_400,al_c,q_80,usm_0.66_1.00_0.01,enc_avif,quality_auto/Примерка%20очков.jpg"
267
+ alt="Изготовление очков"
268
+ class="w-full h-full object-cover">
269
+ </div>
270
+ <div class="p-6">
271
+ <h3 class="text-xl font-semibold mb-4 text-center text-gray-800">Изготовление очков</h3>
272
+ <ul class="space-y-3 text-gray-700">
273
+ <li class="flex items-start">
274
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
275
+ <span>По вашему рецепту</span>
276
+ </li>
277
+ <li class="flex items-start">
278
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
279
+ <span>Широкий выбор оправ</span>
280
+ </li>
281
+ <li class="flex items-start">
282
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
283
+ <span>Качественные линзы</span>
284
+ </li>
285
+ <li class="flex items-start">
286
+ <i class="fas fa-check text-green-500 mt-1 mr-3"></i>
287
+ <span>Индивидуальный подход</span>
288
+ </li>
289
+ </ul>
290
+ </div>
291
+ </div>
292
+ </div>
293
+ </div>
294
+ </section>
295
+
296
+ <!-- Repair Section -->
297
+ <section id="repair" class="py-16 bg-gradient-to-br from-blue-50 to-purple-50">
298
+ <div class="container mx-auto px-4">
299
+ <div class="text-center mb-12">
300
+ <h2 class="text-3xl font-bold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-purple-600 to-blue-600">Ремонт очков</h2>
301
+ <div class="w-20 h-1 bg-gradient-to-r from-purple-400 to-blue-400 mx-auto rounded-full"></div>
302
+ </div>
303
+
304
+ <div class="flex flex-col lg:flex-row items-center">
305
+ <div class="lg:w-1/2 mb-8 lg:mb-0 lg:pr-8">
306
+ <div class="relative">
307
+ <img src="https://images.unsplash.com/photo-1556306535-38febf6782e7?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=800&q=80"
308
+ alt="Ремонт очков"
309
+ class="rounded-2xl shadow-xl w-full floating">
310
+ <div class="absolute -bottom-5 -right-5 bg-white p-4 rounded-lg shadow-lg">
311
+ <div class="bg-purple-100 p-3 rounded-full">
312
+ <i class="fas fa-clock text-purple-600 text-2xl"></i>
313
+ </div>
314
+ <p class="mt-2 font-semibold text-gray-800">Быстро</p>
315
+ <p class="text-sm text-gray-600">15-30 минут</p>
316
+ </div>
317
+ </div>
318
+ </div>
319
+ <div class="lg:w-1/2">
320
+ <h3 class="text-2xl font-semibold mb-6 text-gray-800">Быстро, качественно, недорого</h3>
321
+ <p class="text-gray-700 mb-6">Мы специализируемся на всех видах ремонта очков, используя только качественные материалы и профессиональное оборудование.</p>
322
+
323
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
324
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-start magic-border">
325
+ <div class="bg-purple-100 p-2 rounded-full mr-4">
326
+ <i class="fas fa-wrench text-purple-600"></i>
327
+ </div>
328
+ <div>
329
+ <h4 class="font-semibold">Замена носовых упоров</h4>
330
+ <p class="text-gray-600 text-sm">Комфортные силиконовые или пластиковые упоры</p>
331
+ </div>
332
+ </div>
333
+
334
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-start magic-border">
335
+ <div class="bg-purple-100 p-2 rounded-full mr-4">
336
+ <i class="fas fa-exchange-alt text-purple-600"></i>
337
+ </div>
338
+ <div>
339
+ <h4 class="font-semibold">Замена заушников</h4>
340
+ <p class="text-gray-600 text-sm">Подберем идеально подходящие по форме и размеру</p>
341
+ </div>
342
+ </div>
343
+
344
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-start magic-border">
345
+ <div class="bg-purple-100 p-2 rounded-full mr-4">
346
+ <i class="fas fa-screwdriver text-purple-600"></i>
347
+ </div>
348
+ <div>
349
+ <h4 class="font-semibold">Замена винтиков</h4>
350
+ <p class="text-gray-600 text-sm">Миниатюрные винты для надежной фиксации</p>
351
+ </div>
352
+ </div>
353
+
354
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-start magic-border">
355
+ <div class="bg-purple-100 p-2 rounded-full mr-4">
356
+ <i class="fas fa-plug text-purple-600"></i>
357
+ </div>
358
+ <div>
359
+ <h4 class="font-semibold">Замена гарпунов</h4>
360
+ <p class="text-gray-600 text-sm">Аккуратная работа с пластмассовыми оправами</p>
361
+ </div>
362
+ </div>
363
+ </div>
364
+
365
+ <div class="mt-8 bg-yellow-50 border-l-4 border-yellow-400 p-4 rounded-r">
366
+ <p class="text-yellow-700 font-medium flex items-start">
367
+ <i class="fas fa-exclamation-triangle mr-2 mt-1"></i>
368
+ <span>Обратите внимание: мы не производим пайку оправ.</span>
369
+ </p>
370
+ </div>
371
+ </div>
372
+ </div>
373
+ </div>
374
+ </section>
375
+
376
+ <!-- Care Section -->
377
+ <section id="care" class="py-16 bg-white">
378
+ <div class="container mx-auto px-4">
379
+ <div class="text-center mb-12">
380
+ <h2 class="text-3xl font-bold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-purple-600 to-blue-600">Правильный уход за очками</h2>
381
+ <div class="w-20 h-1 bg-gradient-to-r from-purple-400 to-blue-400 mx-auto rounded-full"></div>
382
+ <p class="text-gray-600 max-w-3xl mx-auto mt-4">Следуйте этим простым правилам, чтобы ваши очки служили долго и сохраняли идеальное состояние</p>
383
+ </div>
384
+
385
+ <div class="article-card max-w-4xl mx-auto">
386
+ <div class="p-8">
387
+ <div class="space-y-8">
388
+ <!-- 1. Правильное хранение -->
389
+ <div class="flex items-start">
390
+ <div class="tip-icon mr-4">
391
+ <span class="font-bold">1</span>
392
+ </div>
393
+ <div>
394
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Правильное хранение</h3>
395
+ <ul class="space-y-2 text-gray-700">
396
+ <li class="flex items-start">
397
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
398
+ <span>Используйте футляр. Всегда храните очки в жестком футляре, чтобы защитить их от повреждений, царапин и пыли.</span>
399
+ </li>
400
+ <li class="flex items-start">
401
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
402
+ <span>Кладите очки линзами вверх. Если очки лежат линзами вниз, они могут поцарапаться.</span>
403
+ </li>
404
+ <li class="flex items-start">
405
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
406
+ <span>Не оставляйте очки в местах с высокой температурой. Например, в машине в жаркий день или рядом с отопительными приборами. Высокая температура может повредить оправу и линзы.</span>
407
+ </li>
408
+ </ul>
409
+ </div>
410
+ </div>
411
+
412
+ <!-- 2. Как надевать и снимать очки -->
413
+ <div class="flex items-start">
414
+ <div class="tip-icon mr-4">
415
+ <span class="font-bold">2</span>
416
+ </div>
417
+ <div>
418
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Как надевать и снимать очки</h3>
419
+ <ul class="space-y-2 text-gray-700">
420
+ <li class="flex items-start">
421
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
422
+ <span>Используйте обе руки. Надевайте и снимайте очки, держа их за дужки двумя руками. Это предотвращает деформацию оправы.</span>
423
+ </li>
424
+ <li class="flex items-start">
425
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
426
+ <span>Не сдвигайте очки на лоб. Это может растянуть дужки и ослабить крепления.</span>
427
+ </li>
428
+ </ul>
429
+ </div>
430
+ </div>
431
+
432
+ <!-- 3. Очистка линз -->
433
+ <div class="flex items-start">
434
+ <div class="tip-icon mr-4">
435
+ <span class="font-bold">3</span>
436
+ </div>
437
+ <div>
438
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Очистка линз</h3>
439
+ <ul class="space-y-2 text-gray-700">
440
+ <li class="flex items-start">
441
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
442
+ <span>Используйте специальные салфетки и спреи. Для очистка линз применяйте мягкие салфетки из микрофибры и специальные спреи для очков.</span>
443
+ </li>
444
+ <li class="flex items-start">
445
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
446
+ <span>Не используйте одежду или бумажные салфетки. Они могут оставить царапины на линзах.</span>
447
+ </li>
448
+ <li class="flex items-start">
449
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
450
+ <span>Промывайте линзы водой. Если на линзах есть пыль или песок, сначала промойте их под проточной водой, чтобы избежать царапин, а затем вытрите салфеткой.</span>
451
+ </li>
452
+ <li class="flex items-start">
453
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
454
+ <span>Избегайте агрессивных химикатов. Не используйте средства для стекол, ацeton или спирт — они могут повредить покрытие линз.</span>
455
+ </li>
456
+ </ul>
457
+ </div>
458
+ </div>
459
+
460
+ <!-- 4. Уход за оправой -->
461
+ <div class="flex items-start">
462
+ <div class="tip-icon mr-4">
463
+ <span class="font-bold">4</span>
464
+ </div>
465
+ <div>
466
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Уход за оправой</h3>
467
+ <ul class="space-y-2 text-gray-700">
468
+ <li class="flex items-start">
469
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
470
+ <span>Регулярно проверяйте винты. Если дужки стали расшатываться, подтяните винты с помощью маленькой отвертки.</span>
471
+ </li>
472
+ <li class="flex items-start">
473
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
474
+ <span>Не подвергайте оправу механическим нагрузкам. Не сгибайте дужки слишком сильно и не кладите на очки тяжелые предметы.</span>
475
+ </li>
476
+ <li class="flex items-start">
477
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
478
+ <span>Очищайте оправу. Протирайте оправу мягкой тканью, чтобы удалить пот и загрязнения.</span>
479
+ </li>
480
+ </ul>
481
+ </div>
482
+ </div>
483
+
484
+ <!-- 5. Защита от царапин и повреждений -->
485
+ <div class="flex items-start">
486
+ <div class="tip-icon mr-4">
487
+ <span class="font-bold">5</span>
488
+ </div>
489
+ <div>
490
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Защита от царапин и повреждений</h3>
491
+ <ul class="space-y-2 text-gray-700">
492
+ <li class="flex items-start">
493
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
494
+ <span>Не кладите очки линзами вниз. Это самая частая причина царапин.</span>
495
+ </li>
496
+ <li class="flex items-start">
497
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
498
+ <span>Используйте защитную пленку. Если линзы не имеют защитного покрытия, можно нанести специальную пленку.</span>
499
+ </li>
500
+ <li class="flex items-start">
501
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
502
+ <span>Избегайте контакта с косметикой и парфюмерией. Косметика и спиртосодержащие средства могут повредить покрытие линз.</span>
503
+ </li>
504
+ </ul>
505
+ </div>
506
+ </div>
507
+
508
+ <!-- 6. Правильное использование в разных условиях -->
509
+ <div class="flex items-start">
510
+ <div class="tip-icon mr-4">
511
+ <span class="font-bold">6</span>
512
+ </div>
513
+ <div>
514
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Правильное использование в разных условиях</h3>
515
+ <ul class="space-y-2 text-gray-700">
516
+ <li class="flex items-start">
517
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
518
+ <span>На пляже или у бассейна. Не оставляйте очки под прямыми солнечными лучами и избегайте контакта с соленой водой или хлоркой.</span>
519
+ </li>
520
+ <li class="flex items-start">
521
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
522
+ <span>В дождь или снег. После попадания под дождь или снег протрите очки мягкой тканью, чтобы удалить влагу.</span>
523
+ </li>
524
+ <li class="flex items-start">
525
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
526
+ <span>За рулем. Используйте очки с антибликовым покрытие, чтобы избежать усталости глаз.</span>
527
+ </li>
528
+ </ul>
529
+ </div>
530
+ </div>
531
+
532
+ <!-- 7. Регулярное обслуживание -->
533
+ <div class="flex items-start">
534
+ <div class="tip-icon mr-4">
535
+ <span class="font-bold">7</span>
536
+ </div>
537
+ <div>
538
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Регулярное обслуживание</h3>
539
+ <ul class="space-y-2 text-gray-700">
540
+ <li class="flex items-start">
541
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
542
+ <span>Проверяйте очки у специалиста. Раз в полгода посещайте оптику, чтобы проверить состояние оправы и линз.</span>
543
+ </li>
544
+ <li class="flex items-start">
545
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
546
+ <span>Меняйте линзы при необходимости. Если линзы сильно поцарапаны или повреждены, замените их, чтобы избежать дискомфорта и усталости глаз.</span>
547
+ </li>
548
+ </ul>
549
+ </div>
550
+ </div>
551
+
552
+ <!-- 8. Чего избегать -->
553
+ <div class="flex items-start">
554
+ <div class="tip-icon mr-4">
555
+ <span class="font-bold">8</span>
556
+ </div>
557
+ <div>
558
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Чего избегать</h3>
559
+ <ul class="space-y-2 text-gray-700">
560
+ <li class="flex items-start">
561
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
562
+ <span>Не носите очки на голове. Это может растянуть дужки и деформировать оправу.</span>
563
+ </li>
564
+ <li class="flex items-start">
565
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
566
+ <span>Не используйте очки без необходимости. Например, не надевайте очки для зрения, если вы смотрите вблизи (если это не предписано врачом).</span>
567
+ </li>
568
+ <li class="flex items-start">
569
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
570
+ <span>Не оставляйте очки без присмотра. Особенно в местах, где они могут упасть или быть повреждены.</span>
571
+ </li>
572
+ </ul>
573
+ </div>
574
+ </div>
575
+
576
+ <!-- Заключение -->
577
+ <div class="bg-purple-50 p-6 rounded-lg mt-8">
578
+ <h3 class="text-xl font-semibold mb-3 text-purple-800">Заключение</h3>
579
+ <p class="text-gray-700">Соблюдение этих простых правил поможет вам сохранить очки в идеальном состоянии на долгие годы. Помните, что очки — это не только аксессуар, но и важный инструмент для защиты вашего зрения. Ухаживайте за ними правильно, и они прослужат вам верой и правдой!</p>
580
+ </div>
581
+ </div>
582
+ </div>
583
+ </div>
584
+ </div>
585
+ </section>
586
+
587
+ <!-- Manufacturing Section -->
588
+ <section id="manufacturing" class="py-16 bg-white">
589
+ <div class="container mx-auto px-4">
590
+ <div class="text-center mb-12">
591
+ <h2 class="text-3xl font-bold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-purple-600 to-blue-600">Изготовление очков</h2>
592
+ <div class="w-20 h-1 bg-gradient-to-r from-purple-400 to-blue-400 mx-auto rounded-full"></div>
593
+ </div>
594
+
595
+ <div class="text-center mb-12 max-w-3xl mx-auto">
596
+ <p class="text-gray-700 text-lg">Мы изготавливаем очки по вашему рецепту с учетом всех индивидуальных особенностей.</p>
597
+ </div>
598
+
599
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
600
+ <!-- Glasses Type 1 -->
601
+ <div class="service-card">
602
+ <div class="h-48 bg-gradient-to-br from-blue-100 to-purple-100 flex items-center justify-center">
603
+ <i class="fas fa-eye text-6xl text-purple-600"></i>
604
+ </div>
605
+ <div class="p-6">
606
+ <h3 class="text-xl font-semibold mb-4 text-center text-gray-800">Диоптрийные очки</h3>
607
+ <p class="text-gray-700 mb-4 text-center">Коррекция зрения с учетом ваших индивидуальных параметров</p>
608
+ <ul class="space-y-2 text-sm text-gray-600">
609
+ <li class="flex items-start">
610
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
611
+ <span>Точное соответствие рецепту</span>
612
+ </li>
613
+ <li class="flex items-start">
614
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
615
+ <span>Различные типы линз</span>
616
+ </li>
617
+ <li class="flex items-start">
618
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
619
+ <span>Подбор оптимальной оправы</span>
620
+ </li>
621
+ </ul>
622
+ </div>
623
+ </div>
624
+
625
+ <!-- Glasses Type 2 -->
626
+ <div class="service-card">
627
+ <div class="h-48 bg-gradient-to-br from-blue-100 to-purple-100 flex items-center justify-center">
628
+ <i class="fas fa-car text-6xl text-purple-600"></i>
629
+ </div>
630
+ <div class="p-6">
631
+ <h3 class="text-xl font-semibold mb-4 text-center text-gray-800">Автомобильные очки</ 3>
632
+ <p class="text-gray-700 mb-4 text-center">Специальные линзы для комфортного вождения</p>
633
+ <ul class="space-y-2 text-sm text-gray-600">
634
+ <li class="flex items-start">
635
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
636
+ <span>Антибликовое покрытие</span>
637
+ </li>
638
+ <li class="flex items-start">
639
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
640
+ <span>Поляризационные фильтры</span>
641
+ </li>
642
+ <li class="flex items-start">
643
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
644
+ <span>Улучшенная контрастность</span>
645
+ </li>
646
+ </ul>
647
+ </div>
648
+ </div>
649
+
650
+ <!-- Glasses Type 3 -->
651
+ <div class="service-card">
652
+ <div class="h-48 bg-gradient-to-br from-blue-100 to-purple-100 flex items-center justify-center">
653
+ <i class="fas fa-sun text-6xl text-purple-600"></i>
654
+ </div>
655
+ <div class="p-6">
656
+ <h3 class="text-xl font-semibold mb-4 text-center text-gray-800">Солнцезащитные очки</h3>
657
+ <p class="text-gray-700 mb-4 text-center">Стиль и защита от ультрафиолета</p>
658
+ <ul class="space-y-2 text-sm text-gray-600">
659
+ <li class="flex items-start">
660
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
661
+ <span>100% защита от UV-лучей</span>
662
+ </li>
663
+ <li class="flex items-start">
664
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
665
+ <span>Модные оправы</span>
666
+ </li>
667
+ <li class="flex items-start">
668
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
669
+ <span>Различные степени затемнения</span>
670
+ </li>
671
+ </ul>
672
+ </div>
673
+ </div>
674
+ </div>
675
+ </div>
676
+ </section>
677
+
678
+ <!-- About Section -->
679
+ <section id="about" class="py-16 bg-gradient-to-br from-blue-50 to-purple-50">
680
+ <div class="container mx-auto px-4">
681
+ <div class="text-center mb-12">
682
+ <h2 class="text-3xl font-bold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-purple-600 to-blue-600">О нашей мастерской</h2>
683
+ <div class="w-20 h-1 bg-gradient-to-r from-purple-400 to-blue-400 mx-auto rounded-full"></div>
684
+ </div>
685
+
686
+ <div class="flex flex-col lg:flex-row items-center">
687
+ <div class="lg:w-1/2 mb-8 lg:mb-0 lg:pr-8">
688
+ <img src="https://images.unsplash.com/photo-1581093450021-559792f1d1b3?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=800&q=80"
689
+ alt="Мастерская"
690
+ class="rounded-2xl shadow-xl w-full">
691
+ </div>
692
+ <div class="lg:w-1/2">
693
+ <h3 class="text-2xl font-semibold mb-6 text-gray-800">Почему выбирают нас?</h3>
694
+ <p class="text-gray-700 mb-6">Наша мастерская уже более 20 лет предоставляет услуги по ремонту и изготовлению очков. Мы гордимся своим вниманием к каждому клиенту.</p>
695
+
696
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
697
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-start magic-border">
698
+ <div class="bg-purple-100 p-3 rounded-full mr-4">
699
+ <i class="fas fa-clock text-purple-600"></i>
700
+ </div>
701
+ <div>
702
+ <h4 class="font-semibold">Быстро</h4>
703
+ <p class="text-gray-600 text-sm">Большинство ремонтов выполняем в течение 15-30 минут</p>
704
+ </div>
705
+ </div>
706
+
707
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-start magic-border">
708
+ <div class="bg-purple-100 p-3 rounded-full mr-4">
709
+ <i class="fas fa-award text-purple-600"></i>
710
+ </div>
711
+ <div>
712
+ <h4 class="font-semibold">Качественно</h4>
713
+ <p class="text-gray-600 text-sm">Используем только проверенные материалы и оборудование</p>
714
+ </div>
715
+ </div>
716
+
717
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-start magic-border">
718
+ <div class="bg-purple-100 p-3 rounded-full mr-4">
719
+ <i class="fas fa-wallet text-purple-600"></i>
720
+ </div>
721
+ <div>
722
+ <h4 class="font-semibold">Доступно</h4>
723
+ <p class="text-gray-600 text-sm">Демократичные цены при высоком качестве работы</p>
724
+ </div>
725
+ </div>
726
+
727
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-start magic-border">
728
+ <div class="bg-purple-100 p-3 rounded-full mr-4">
729
+ <i class="fas fa-shield-alt text-purple-600"></i>
730
+ </div>
731
+ <div>
732
+ <h4 class="font-semibold">Гарантия</h4>
733
+ <p class="text-gray-600 text-sm">Предоставляем гарантию на все виды работ</p>
734
+ </div>
735
+ </div>
736
+ </div>
737
+ </div>
738
+ </div>
739
+ </div>
740
+ </section>
741
+
742
+ <!-- Contacts Section -->
743
+ <section id="contacts" class="py-16 bg-white">
744
+ <div class="container mx-auto px-4">
745
+ <div class="text-center mb-12">
746
+ <h2 class="text-3xl font-bold mb-4 text-transparent bg-clip-text bg-gradient-to-r from-purple-600 to-blue-600">Контакты</h2>
747
+ <div class="w-20 h-1 bg-gradient-to-r from-purple-400 to-blue-400 mx-auto rounded-full"></div>
748
+ </div>
749
+
750
+ <div class="flex flex-col lg:flex-row gap-8">
751
+ <div class="lg:w-1/2">
752
+ <div class="bg-gray-50 p-8 rounded-xl shadow-md h-full">
753
+ <h3 class="text-xl font-semibold mb-6 text-gray-800">Свяжитесь с нами</h3>
754
+
755
+ <div class="space-y-6">
756
+ <div class="contact-card p-4 rounded-lg flex items-start">
757
+ <div class="bg-purple-100 p-3 rounded-full mr-4">
758
+ <i class="fas fa-map-marker-alt text-purple-600"></i>
759
+ </div>
760
+ <div>
761
+ <h4 class="font-semibold">Адрес</h4>
762
+ <p class="text-gray-600">Москва, ул.Берзарина д.34 стр.12</p>
763
+ </div>
764
+ </div>
765
+
766
+ <div class="contact-card p-4 rounded-lg flex items-start">
767
+ <div class="bg-purple-100 p-3 rounded-full mr-4">
768
+ <i class="fas fa-phone text-purple-600"></i>
769
+ </div>
770
+ <div>
771
+ <h4 class="font-semibold">Телефон</h4>
772
+ <p class="text-gray-600">+7 (926) 323-68-86</p>
773
+ <a href="tel:+79263236886" class="text-purple-600 text-sm mt-1 inline-block hover:underline">Позвонить</a>
774
+ </div>
775
+ </div>
776
+
777
+ <div class="contact-card p-4 rounded-lg flex items-start">
778
+ <div class="bg-purple-100 p-3 rounded-full mr-4">
779
+ <i class="fas fa-envelope text-purple-600"></i>
780
+ </div>
781
+ <div>
782
+ <h4 class="font-semibold">Email</h4>
783
+ <p class="text-gray-600">[email protected]</p>
784
+ <a href="mailto:[email protected]" class="text-purple-600 text-sm mt-1 inline-block hover:underline">Написать</a>
785
+ </div>
786
+ </div>
787
+
788
+ <div class="contact-card p-4 rounded-lg">
789
+ <div class="flex items-start mb-4">
790
+ <div class="bg-purple-100 p-3 rounded-full mr-4">
791
+ <i class="fas fa-clock text-purple-600"></i>
792
+ </div>
793
+ <div>
794
+ <h4 class="font-semibold">Время работы</h4>
795
+ </div>
796
+ </div>
797
+ <div class="space-y-3 pl-16">
798
+ <div class="schedule-item">
799
+ <h5 class="font-medium">Понедельник-Четверг</h5>
800
+ <p class="text-gray-600 text-sm">с 8:00 до 16:00</p>
801
+ </div>
802
+ <div class="schedule-item">
803
+ <h5 class="font-medium">Воскресенье</h5>
804
+ <p class="text-gray-600 text-sm">с 9:00 до 14:00</p>
805
+ </div>
806
+ <div class="schedule-item">
807
+ <h5 class="font-medium">Пятница-Суббота</h5>
808
+ <p class="text-gray-600 text-sm">Выходной</p>
809
+ </div>
810
+ </div>
811
+ </div>
812
+
813
+ <div class="mt-6">
814
+ <div>
815
+ <a href="#" class="bg-blue-600 text-white rounded-full hover:bg-blue-700 transition transform hover:scale-110">
816
+ <i></i>
817
+ </a>
818
+ <a href="#">
819
+ <i>&nbsp;</i>
820
+ </a>
821
+ <a href="#">
822
+ <i></i>
823
+ </a>
824
+ <a href="#" class="bg-green-600 transition">
825
+ <i></i>
826
+ </a>
827
+ </div>
828
+ </div>
829
+ </div>
830
+ </div>
831
+ </div>
832
+
833
+ <div class="lg:w-1/2">
834
+ <div class="bg-gray-50 p-8 rounded-xl shadow-md h-full">
835
+ <h3 class="text-xl font-semibold mb-6 text-gray-800">Как нас найти</h3>
836
+ <div class="map-container">
837
+ <!-- Яндекс Карта -->
838
+ <script type="text/javascript" charset="utf-8" async src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3Ac8fcb6c1bec1d088da7abd2d9ca82929556153fe8e67aea432ef025fb36f1714&amp;width=100%&amp;height=100%&amp;lang=ru_RU&amp;scroll=true"></script>
839
+ </div>
840
+ </div>
841
+ </div>
842
+ </div>
843
+ </div>
844
+ </section>
845
+
846
+ <!-- Footer -->
847
+ <footer class="bg-gray-900 text-white py-8">
848
+ <div class="container mx-auto px-4">
849
+ <div class="flex flex-col md:flex-row justify-between items-center">
850
+ <div class="mb-4 md:mb-0">
851
+ <div class="flex items-center space-x-3">
852
+ <div class="logo-icon">
853
+ ОП
854
+ </div>
855
+ <h2 class="text-xl font-bold">ОПТИКА "ОПТОН"</h2>
856
+ </div>
857
+ <p class="text-gray-400 mt-2">Профессиональные услуги по ремонту и изготовлению очков</p>
858
+ </div>
859
+ <div class="flex space-x-6">
860
+ <a href="#services" class="hover:text-purple-400 transition">Услуги</a>
861
+ <a href="#about" class="hover:text-purple-400 transition">О нас</a>
862
+ <a href="#contacts" class="hover:text-purple-400 transition">Контакты</a>
863
+ </div>
864
+ </div>
865
+ <div class="border-t border-gray-800 mt-8 pt-8 text-center text-gray-400">
866
+ <p>© 2023 Оптика "ОПТОН". Все права защищены.</p>
867
+ </div>
868
+ </div>
869
+ </footer>
870
+
871
+ <script>
872
+ // Mobile menu toggle
873
+ document.getElementById('menu-btn').addEventListener('click', function() {
874
+ document.getElementById('mobile-menu').classList.toggle('hidden');
875
+ });
876
+ </script>
877
+ <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=ANTIMOLL/opt6968" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
878
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ измени дизайн логотип замени слова волшебный сделай более строгий