Hugging Face's logo

Spaces:
Lioszada
/
lioszada
Running

App Files Community
Lioszada commited on
Commit
b7ff7ab
·
verified ·
1 Parent(s): 6120dae

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +870 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Lioszada
3
- emoji: 🏆
4
- colorFrom: gray
5
- colorTo: red
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: lioszada
3
+ emoji: 🐳
4
+ colorFrom: pink
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,870 @@
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="pt-BR">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>OdontoVas - Clínica Odontológica em Planaltina/DF</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
11
+
12
+ body {
13
+ font-family: 'Poppins', sans-serif;
14
+ scroll-behavior: smooth;
15
+ }
16
+
17
+ .hero {
18
+ background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://images.unsplash.com/photo-1588776814546-1ffcf47267a5?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80');
19
+ background-size: cover;
20
+ background-position: center;
21
+ background-attachment: fixed;
22
+ }
23
+
24
+ .treatment-card:hover {
25
+ transform: translateY(-10px);
26
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
27
+ }
28
+
29
+ .testimonial-card {
30
+ transition: all 0.3s ease;
31
+ }
32
+
33
+ .testimonial-card:hover {
34
+ transform: scale(1.05);
35
+ }
36
+
37
+ .whatsapp-float {
38
+ position: fixed;
39
+ width: 60px;
40
+ height: 60px;
41
+ bottom: 40px;
42
+ right: 40px;
43
+ background-color: #25d366;
44
+ color: #FFF;
45
+ border-radius: 50px;
46
+ text-align: center;
47
+ font-size: 30px;
48
+ box-shadow: 2px 2px 3px #999;
49
+ z-index: 100;
50
+ display: flex;
51
+ align-items: center;
52
+ justify-content: center;
53
+ }
54
+
55
+ .navbar-scroll {
56
+ background-color: rgba(255, 255, 255, 0.95);
57
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
58
+ }
59
+
60
+ .video-container {
61
+ position: relative;
62
+ padding-bottom: 56.25%;
63
+ height: 0;
64
+ overflow: hidden;
65
+ }
66
+
67
+ .video-container iframe {
68
+ position: absolute;
69
+ top: 0;
70
+ left: 0;
71
+ width: 100%;
72
+ height: 100%;
73
+ }
74
+
75
+ .accordion-content {
76
+ max-height: 0;
77
+ overflow: hidden;
78
+ transition: max-height 0.3s ease-out;
79
+ }
80
+
81
+ .logo-img {
82
+ height: 100px; /* Increased logo size */
83
+ }
84
+
85
+ .about-logo {
86
+ max-width: 350px; /* Increased logo size */
87
+ margin: 0 auto 30px;
88
+ }
89
+
90
+ .dentist-img {
91
+ width: 100%;
92
+ height: 100%;
93
+ object-fit: cover;
94
+ }
95
+
96
+ .specialist-container {
97
+ display: flex;
98
+ flex-direction: column;
99
+ align-items: center;
100
+ }
101
+
102
+ @media (min-width: 768px) {
103
+ .specialist-container {
104
+ flex-direction: row;
105
+ align-items: flex-start;
106
+ }
107
+ }
108
+
109
+ .specialist-photo {
110
+ width: 100%;
111
+ max-width: 300px;
112
+ height: auto;
113
+ border-radius: 8px;
114
+ margin-bottom: 20px;
115
+ }
116
+
117
+ @media (min-width: 768px) {
118
+ .specialist-photo {
119
+ width: 40%;
120
+ margin-right: 30px;
121
+ margin-bottom: 0;
122
+ }
123
+ }
124
+
125
+ .specialist-info {
126
+ width: 100%;
127
+ }
128
+
129
+ @media (min-width: 768px) {
130
+ .specialist-info {
131
+ width: 60%;
132
+ }
133
+ }
134
+
135
+ .slogan-box {
136
+ background-color: #4f46e5;
137
+ color: white;
138
+ padding: 20px;
139
+ border-radius: 8px;
140
+ text-align: center;
141
+ font-size: 1.5rem;
142
+ font-weight: bold;
143
+ margin-top: 20px;
144
+ }
145
+ </style>
146
+ </head>
147
+ <body>
148
+ <!-- WhatsApp Float Button -->
149
+ <a href="https://wa.me/556198902272" class="whatsapp-float" target="_blank">
150
+ <i class="fab fa-whatsapp"></i>
151
+ </a>
152
+
153
+ <!-- Header/Navigation -->
154
+ <header class="bg-white shadow-md sticky top-0 z-50 transition-all duration-300" id="navbar">
155
+ <div class="container mx-auto px-6 py-3">
156
+ <div class="flex items-center justify-between">
157
+ <div class="flex items-center">
158
+ <!-- Updated Logo Section with horizontal logo -->
159
+ <a href="#" class="flex items-center">
160
+ <img src="https://huggingface.co/spaces/Lioszada/odontovas/resolve/main/HORIZONTAL%20SITE.png" alt="OdontoVas" class="logo-img">
161
+ </a>
162
+ </div>
163
+
164
+ <div class="flex items-center space-x-8">
165
+ <nav class="hidden md:flex space-x-8">
166
+ <a href="#home" class="text-gray-800 hover:text-indigo-600 font-medium">Início</a>
167
+ <a href="#about" class="text-gray-800 hover:text-indigo-600 font-medium">Sobre</a>
168
+ <a href="#services" class="text-gray-800 hover:text-indigo-600 font-medium">Serviços</a>
169
+ <a href="#specialists" class="text-gray-800 hover:text-indigo-600 font-medium">Especialistas</a>
170
+ <a href="#testimonials" class="text-gray-800 hover:text-indigo-600 font-medium">Depoimentos</a>
171
+ <a href="#contact" class="text-gray-800 hover:text-indigo-600 font-medium">Contato</a>
172
+ </nav>
173
+
174
+ <a href="https://wa.me/556198902272" class="hidden md:block bg-indigo-600 text-white px-4 py-2 rounded-md hover:bg-indigo-700 transition duration-300">
175
+ Agendar Consulta
176
+ </a>
177
+
178
+ <button class="md:hidden focus:outline-none" id="menu-btn">
179
+ <i class="fas fa-bars text-2xl text-gray-800"></i>
180
+ </button>
181
+ </div>
182
+ </div>
183
+
184
+ <!-- Mobile Menu -->
185
+ <div class="md:hidden hidden mt-4" id="mobile-menu">
186
+ <div class="flex flex-col space-y-3">
187
+ <a href="#home" class="text-gray-800 hover:text-indigo-600 font-medium">Início</a>
188
+ <a href="#about" class="text-gray-800 hover:text-indigo-600 font-medium">Sobre</a>
189
+ <a href="#services" class="text-gray-800 hover:text-indigo-600 font-medium">Serviços</a>
190
+ <a href="#specialists" class="text-gray-800 hover:text-indigo-600 font-medium">Especialistas</a>
191
+ <a href="#testimonials" class="text-gray-800 hover:text-indigo-600 font-medium">Depoimentos</a>
192
+ <a href="#contact" class="text-gray-800 hover:text-indigo-600 font-medium">Contato</a>
193
+ <a href="https://wa.me/556198902272" class="bg-indigo-600 text-white px-4 py-2 rounded-md hover:bg-indigo-700 transition duration-300 text-center">
194
+ Agendar Consulta
195
+ </a>
196
+ </div>
197
+ </div>
198
+ </div>
199
+ </header>
200
+
201
+ <!-- Hero Section -->
202
+ <section class="hero text-white py-32 md:py-48 flex items-center" id="home">
203
+ <div class="container mx-auto px-6">
204
+ <div class="max-w-2xl">
205
+ <h1 class="text-4xl md:text-5xl lg:text-6xl font-bold mb-6 leading-tight">Sua saúde bucal em boas mãos</h1>
206
+ <p class="text-xl md:text-2xl mb-8">Tratamentos odontológicos personalizados com tecnologia de ponta em Planaltina/DF</p>
207
+ <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
208
+ <a href="https://wa.me/556198902272" class="bg-indigo-600 hover:bg-indigo-700 text-white px-8 py-4 rounded-md font-medium text-lg transition duration-300 text-center">
209
+ <i class="fas fa-calendar-check mr-2"></i> Agendar Consulta
210
+ </a>
211
+ <a href="#services" class="bg-white hover:bg-gray-100 text-indigo-600 px-8 py-4 rounded-md font-medium text-lg transition duration-300 text-center">
212
+ <i class="fas fa-teeth-open mr-2"></i> Nossos Serviços
213
+ </a>
214
+ </div>
215
+ </div>
216
+ </div>
217
+ </section>
218
+
219
+ <!-- Featured Services -->
220
+ <section class="py-16 bg-gray-50">
221
+ <div class="container mx-auto px-6">
222
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
223
+ <div class="bg-white p-6 rounded-lg shadow-md flex items-start">
224
+ <div class="text-indigo-600 mr-4 text-3xl">
225
+ <i class="fas fa-teeth"></i>
226
+ </div>
227
+ <div>
228
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Clínica Geral</h3>
229
+ <p class="text-gray-600">Atendimento completo para toda a família, desde exames preventivos até tratamentos complexos.</p>
230
+ </div>
231
+ </div>
232
+
233
+ <div class="bg-white p-6 rounded-lg shadow-md flex items-start">
234
+ <div class="text-indigo-600 mr-4 text-3xl">
235
+ <i class="fas fa-child"></i>
236
+ </div>
237
+ <div>
238
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Odontopediatria</h3>
239
+ <p class="text-gray-600">Cuidados especiais para crianças, com abordagem lúdica e ambiente acolhedor.</p>
240
+ </div>
241
+ </div>
242
+
243
+ <div class="bg-white p-6 rounded-lg shadow-md flex items-start">
244
+ <div class="text-indigo-600 mr-4 text-3xl">
245
+ <i class="fas fa-implant"></i>
246
+ </div>
247
+ <div>
248
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Implantes Dentários</h3>
249
+ <p class="text-gray-600">Solução definitiva para reposição de dentes perdidos, com tecnologia de ponta.</p>
250
+ </div>
251
+ </div>
252
+ </div>
253
+ </div>
254
+ </section>
255
+
256
+ <!-- About Section -->
257
+ <section class="py-16" id="about">
258
+ <div class="container mx-auto px-6">
259
+ <div class="flex flex-col lg:flex-row items-center">
260
+ <div class="lg:w-1/2 mb-12 lg:mb-0 lg:pr-12">
261
+ <div class="relative">
262
+ <!-- Large principal logo in the About section -->
263
+ <img src="https://huggingface.co/spaces/Lioszada/odontovas/resolve/main/PRINCIPAL.png" alt="OdontoVas" class="about-logo">
264
+ <div class="slogan-box">
265
+ Estamos cuidando do teu sorriso
266
+ </div>
267
+ </div>
268
+ </div>
269
+
270
+ <div class="lg:w-1/2">
271
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-6">Sobre a Odonto<span class="text-indigo-600">Vas</span></h2>
272
+ <p class="text-gray-600 mb-6">A OdontoVas é uma clínica odontológica de referência em Planaltina/DF, com mais de 2 anos de existência e mais de 6 anos de experiência no mercado. Nossa equipe de especialistas está pronta para oferecer o melhor tratamento para você e sua família.</p>
273
+
274
+ <div class="mb-8">
275
+ <div class="flex items-start mb-4">
276
+ <div class="text-indigo-600 mr-3 mt-1">
277
+ <i class="fas fa-check-circle"></i>
278
+ </div>
279
+ <div>
280
+ <h4 class="font-bold text-gray-800 mb-1">Equipe Qualificada</h4>
281
+ <p class="text-gray-600">Profissionais especializados e em constante atualização</p>
282
+ </div>
283
+ </div>
284
+
285
+ <div class="flex items-start mb-4">
286
+ <div class="text-indigo-600 mr-3 mt-1">
287
+ <i class="fas fa-check-circle"></i>
288
+ </div>
289
+ <div>
290
+ <h4 class="font-bold text-gray-800 mb-1">Tecnologia Avançada</h4>
291
+ <p class="text-gray-600">Equipamentos modernos para diagnósticos precisos</p>
292
+ </div>
293
+ </div>
294
+
295
+ <div class="flex items-start">
296
+ <div class="text-indigo-600 mr-3 mt-1">
297
+ <i class="fas fa-check-circle"></i>
298
+ </div>
299
+ <div>
300
+ <h4 class="font-bold text-gray-800 mb-1">Atendimento Humanizado</h4>
301
+ <p class="text-gray-600">Cuidamos de você com atenção và carinho</p>
302
+ </div>
303
+ </div>
304
+ </div>
305
+
306
+ <div class="bg-gray-100 p-4 rounded-lg mb-6">
307
+ <p class="text-gray-800"><strong>EPAO:</strong> 3736</p>
308
+ <p class="text-gray-800"><strong>CNPJ:</strong> 51.615.586/0001-30</p>
309
+ </div>
310
+
311
+ <a href="#contact" class="inline-block bg-indigo-600 hover:bg-indigo-700 text-white px-6 py-3 rounded-md font-medium transition duration-300">
312
+ Conheça nossa clínica
313
+ </a>
314
+ </div>
315
+ </div>
316
+ </div>
317
+ </section>
318
+
319
+ <!-- Video Section -->
320
+ <section class="py-16 bg-gray-100">
321
+ <div class="container mx-auto px-6">
322
+ <div class="text-center mb-12">
323
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Conheça nossa clínica</h2>
324
+ <p class="text-xl text-gray-600 max-w-2xl mx-auto">Veja nossa estrutura e equipe em ação</p>
325
+ <div class="w-20 h-1 bg-indigo-600 mx-auto mt-4"></div>
326
+ </div>
327
+
328
+ <div class="max-w-4xl mx-auto">
329
+ <div class="video-container rounded-lg shadow-xl overflow-hidden">
330
+ <iframe src="https://www.youtube.com/embed/VIDEO_ID" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
331
+ </div>
332
+ </div>
333
+ </div>
334
+ </section>
335
+
336
+ <!-- Services Section -->
337
+ <section class="py-16" id="services">
338
+ <div class="container mx-auto px-6">
339
+ <div class="text-center mb-12">
340
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Nossos Tratamentos</h2>
341
+ <p class="text-xl text-gray-600 max-w-2xl mx-auto">Oferecemos uma ampla gama de tratamentos odontológicos</p>
342
+ <div class="w-20 h-1 bg-indigo-600 mx-auto mt-4"></div>
343
+ </div>
344
+
345
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
346
+ <!-- Service 1 -->
347
+ <div class="bg-white rounded-lg shadow-md overflow-hidden treatment-card transition duration-300">
348
+ <div class="h-48 bg-indigo-100 flex items-center justify-center">
349
+ <i class="fas fa-tooth text-6xl text-indigo-600"></i>
350
+ </div>
351
+ <div class="p-6">
352
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Clínica Geral</h3>
353
+ <p class="text-gray-600 mb-4">Exames completos, diagnóstico e tratamento de problemas bucais comuns, garantindo a saúde geral dos seus dentes e gengivas.</p>
354
+ <a href="https://wa.me/556198902272" class="text-indigo-600 font-medium hover:text-indigo-800 transition duration-300 inline-flex items-center">
355
+ Saiba mais <i class="fas fa-arrow-right ml-2"></i>
356
+ </a>
357
+ </div>
358
+ </div>
359
+
360
+ <!-- Service 2 -->
361
+ <div class="bg-white rounded-lg shadow-md overflow-hidden treatment-card transition duration-300">
362
+ <div class="h-48 bg-indigo-100 flex items-center justify-center">
363
+ <i class="fas fa-child text-6xl text-indigo-600"></i>
364
+ </div>
365
+ <div class="p-6">
366
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Odontopediatria</h3>
367
+ <p class="text-gray-600 mb-4">Atendimento especializado para crianças, com abordagem lúdica e acolhedora, promovendo saúde bucal desde os primeiro anos de vida.</p>
368
+ <a href="https://wa.me/556198902272" class="text-indigo-600 font-medium hover:text-indigo-800 transition duration-300 inline-flex items-center">
369
+ Saiba mais <i class="fas fa-arrow-right ml-2"></i>
370
+ </a>
371
+ </div>
372
+ </div>
373
+
374
+ <!-- Service 3 -->
375
+ <div class="bg-white rounded-lg shadow-md overflow-hidden treatment-card transition duration-300">
376
+ <div class="h-48 bg-indigo-100 flex items-center justify-center">
377
+ <i class="fas fa-implant text-6xl text-indigo-600"></i>
378
+ </div>
379
+ <div class="p-6">
380
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Implantes Dentários</h3>
381
+ <p class="text-gray-600 mb-4">Solução permanente para substituição de dentes perdidos, com tecnologia de ponta para resultados naturais e duradouros.</p>
382
+ <a href="https://wa.me/556198902272" class="text-indigo-600 font-medium hover:text-indigo-800 transition duration-300 inline-flex items-center">
383
+ Saiba mais <i class="fas fa-arrow-right ml-2"></i>
384
+ </a>
385
+ </div>
386
+ </div>
387
+
388
+ <!-- Service 4 -->
389
+ <div class="bg-white rounded-lg shadow-md overflow-hidden treatment-card transition duration-300">
390
+ <div class="h-48 bg-indigo-100 flex items-center justify-center">
391
+ <i class="fas fa-braces text-6xl text-indigo-600"></i>
392
+ </div>
393
+ <div class="p-6">
394
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Ortodontia</h3>
395
+ <p class="text-gray-600 mb-4">Correção de alinhamento dental com diversas opções, incluindo aparelhos fixos, móveis e estéticos, para um sorriso harmonioso.</p>
396
+ <a href="https://wa.me/556198902272" class="text-indigo-600 font-medium hover:text-indigo-800 transition duration-300 inline-flex items-center">
397
+ Saiba mais <i class="fas fa-arrow-right ml-2"></i>
398
+ </a>
399
+ </div>
400
+ </div>
401
+
402
+ <!-- Service 5 -->
403
+ <div class="bg-white rounded-lg shadow-md overflow-hidden treatment-card transition duration-300">
404
+ <div class="h-48 bg-indigo-100 flex items-center justify-center">
405
+ <i class="fas fa-sun text-6xl text-indigo-600"></i>
406
+ </div>
407
+ <div class="p-6">
408
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Clareamento Dental</h3>
409
+ <p class="text-gray-600 mb-4">Tratamentos eficazes para clarear seus dentes, incluindo opções em consultório e caseiras, para um sorriso mais branco e brilhante.</p>
410
+ <a href="https://wa.me/556198902272" class="text-indigo-600 font-medium hover:text-indigo-800 transition duration-300 inline-flex items-center">
411
+ Saiba mais <i class="fas fa-arrow-right ml-2"></i>
412
+ </a>
413
+ </div>
414
+ </div>
415
+
416
+ <!-- Service 6 -->
417
+ <div class="bg-white rounded-lg shadow-md overflow-hidden treatment-card transition duration-300">
418
+ <div class="h-48 bg-indigo-100 flex items-center justify-center">
419
+ <i class="fas fa-teeth-open text-6xl text-indigo-600"></i>
420
+ </div>
421
+ <div class="p-6">
422
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Periodontia</h3>
423
+ <p class="text-gray-600 mb-4">Tratamento especializado para doenças gengivais, incluindo gengivite e periodontite, para preservar a saúde da sua gengiva.</p>
424
+ <a href="https://wa.me/556198902272" class="text-indigo-600 font-medium hover:text-indigo-800 transition duration-300 inline-flex items-center">
425
+ Saiba mais <i class="fas fa-arrow-right ml-2"></i>
426
+ </a>
427
+ </div>
428
+ </div>
429
+ </div>
430
+
431
+ <div class="text-center mt-12">
432
+ <a href="#contact" class="inline-block bg-indigo-600 hover:bg-indigo-700 text-white px-8 py-4 rounded-md font-medium text-lg transition duration-300">
433
+ Agende sua avaliação
434
+ </a>
435
+ </div>
436
+ </div>
437
+ </section>
438
+
439
+ <!-- Specialists Section -->
440
+ <section class="py-16 bg-gray-50" id="specialists">
441
+ <div class="container mx-auto px-6">
442
+ <div class="text-center mb-12">
443
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Nossos Especialistas</h2>
444
+ <p class="text-xl text-gray-600 max-w-2xl mx-auto">Conheça nossa equipe de profissionais qualificados</p>
445
+ <div class="w-20 h-1 bg-indigo-600 mx-auto mt-4"></div>
446
+ </div>
447
+
448
+ <div class="grid grid-cols-1 gap-12">
449
+ <!-- Specialist 1 - Vinícius Gutierrez -->
450
+ <div class="bg-white rounded-lg shadow-md overflow-hidden p-6">
451
+ <div class="specialist-container">
452
+ <div class="specialist-photo">
453
+ <img src="https://huggingface.co/spaces/Lioszada/odontovas/resolve/main/VINICIUS%202.png" alt="Dr. Vinícius Gutierrez" class="w-full h-auto rounded-lg">
454
+ </div>
455
+ <div class="specialist-info">
456
+ <h3 class="text-xl font-bold text-gray-800 mb-1">Dr. Vinícius Gutierrez</h3>
457
+ <p class="text-indigo-600 font-medium mb-2">CEO e Dentista Clínico Geral</p>
458
+ <p class="text-gray-500 mb-2">CRO/DF 13109</p>
459
+ <p class="text-gray-600 mb-4">Formado pela Universidade de Brasília com especialização em Dentística Restauradora. Com mais de 6 anos de experiência, é o responsável pela gestão da clínica e atendimento de pacientes adultos.</p>
460
+ <div class="flex space-x-4">
461
+ <a href="#" class="text-gray-400 hover:text-indigo-600">
462
+ <i class="fab fa-instagram"></i>
463
+ </a>
464
+ <a href="#" class="text-gray-400 hover:text-indigo-600">
465
+ <i class="fab fa-linkedin"></i>
466
+ </a>
467
+ </div>
468
+ </div>
469
+ </div>
470
+ </div>
471
+
472
+ <!-- Specialist 2 - Alef Vasconcelos -->
473
+ <div class="bg-white rounded-lg shadow-md overflow-hidden p-6">
474
+ <div class="specialist-container">
475
+ <div class="specialist-photo">
476
+ <img src="https://huggingface.co/spaces/Lioszada/odontovas/resolve/main/ALEF%202.png" alt="Dr. Alef Vasconcelos" class="w-full h-auto rounded-lg">
477
+ </div>
478
+ <div class="specialist-info">
479
+ <h3 class="text-xl font-bold text-gray-800 mb-1">Dr. Alef Vasconcelos</h3>
480
+ <p class="text-indigo-600 font-medium mb-2">Dentista Clínico Geral</p>
481
+ <p class="text-gray-500 mb-2">CRO/DF 14127</p>
482
+ <p class="text-gray-600 mb-4">Especialista em Ortodontia pela ABO-DF, com experiência em aparelhos fixos và alinhadores invisíveis. Responsável pelos tratamentos ortodônticos da clínica e atendimento de pacientes de todas as idades.</p>
483
+ <div class="flex space-x-4">
484
+ <a href="#" class="text-gray-400 hover:text-indigo-600">
485
+ <i class="fab fa-instagram"></i>
486
+ </a>
487
+ <a href="#" class="text-gray-400 hover:text-indigo-600">
488
+ <i class="fab fa-linkedin"></i>
489
+ </a>
490
+ </div>
491
+ </div>
492
+ </div>
493
+ </div>
494
+ </div>
495
+ </div>
496
+ </section>
497
+
498
+ <!-- FAQ Section -->
499
+ <section class="py-16">
500
+ <div class="container mx-auto px-6">
501
+ <div class="text-center mb-12">
502
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Perguntas Frequentes</h2>
503
+ <p class="text-xl text-gray-600 max-w-2xl mx-auto">Tire suas dúvidas sobre tratamentos odontológicos</p>
504
+ <div class="w-20 h-1 bg-indigo-600 mx-auto mt-4"></div>
505
+ </div>
506
+
507
+ <div class="max-w-3xl mx-auto">
508
+ <!-- FAQ Item 1 -->
509
+ <div class="mb-4 border-b border-gray-200 pb-4">
510
+ <button class="flex justify-between items-center w-full text-left focus:outline-none" onclick="toggleAccordion('faq1')">
511
+ <h3 class="text-lg font-medium text-gray-800">Qual a importância de ir ao dentista regularmente?</h3>
512
+ <i class="fas fa-chevron-down text-indigo-600 transition-transform duration-300" id="faq1-icon"></i>
513
+ </button>
514
+ <div class="accordion-content", id="faq1-content">
515
+ <p class="mt-4 text-gray-600">Visitas regulares ao dentista (a cada 6 meses) são essenciais para prevenir problemas bucais, identificar condições em estágios iniciais e manter a saúde bucal em dia. A limpeza profissional remove placas bacterianas que não saem com a escovação comum, prevenindo cáries e doenças gengivais.</p>
516
+ </div>
517
+ </div>
518
+
519
+ <!-- FAQ Item 2 -->
520
+ <div class="mb-4 border-b border-gray-200 pb-4">
521
+ <button class="flex justify-between items-center w-full text-left focus:outline-none" onclick="toggleAccordion('faq2')">
522
+ <h3 class="text-lg font-medium text-gray-800">A partir de qual idade devo levar meu filho ao dentista?</h3>
523
+ <i class="fas fa-chevron-down text-indigo-600 transition-transform duration-300" id="faq2-icon"></i>
524
+ </button>
525
+ <div class="accordion-content" id="faq2-content">
526
+ <p class="mt-4 text-gray-600">Recomendamos que a primeira visita ao odontopediatra ocorra ainda no primeiro ano de vida, assim que os primeiro dentinhos começarem a nascer. Essa consulta inicial é importante para orientar os parents sobre cuidados com a saúde bucal do bebê e prevenir problemas futuros.</p>
527
+ </div>
528
+ </div>
529
+
530
+ <!-- FAQ Item 3 -->
531
+ <div class="mb-4 border-b border-gray-200 pb-4">
532
+ <button class="flex justify-between items-center w-full text-left focus:outline-none" onclick="toggleAccordion('faq3')">
533
+ <h3 class="text-lg font-medium text-gray-800">O clareamento dental danifica os dentes?</h3>
534
+ <i class="fas fa-chevron-down text-indigo-600 transition-transform duration-300" id="faq3-icon"></i>
535
+ </button>
536
+ <div class="accordion-content" id="faq3-content">
537
+ <p class="mt-4 text-gray-600">Quando realizado corretamente por um profissional qualificado e com produtos de qualidade, o clareamento dental não danifica os dentes. Podem ocorrer sensibilidade temporária durante o tratamento, que normalmente desaparece após alguns dias. Nossa equipe utiliza técnicas e produtos safes, com acompanhamento profissional.</p>
538
+ </div>
539
+ </div>
540
+
541
+ <!-- FAQ Item 4 -->
542
+ <div class="mb-4 border-b border-gray-200 pb-4">
543
+ <button class="flex justify-between items-center w-full text-left focus:outline-none" onclick="toggleAccordion('faq4')">
544
+ <h3 class="text-lg font-medium text-gray-800">Quanto tempo dura um tratamento de implante dentário?</h3>
545
+ <i class="fas fa-chevron-down text-indigo-600 transition-transform duration-300" id="faq4-icon"></i>
546
+ </button>
547
+ <div class="accordion-content" id="faq4-content">
548
+ <p class="mt-4 text-gray-600">O tempo de tratamento varies conforme cada caso, mas em média leva de 3 a 6 meses. Isso inclui a fase de colocação do implante, período de osseointegração (quando o implante se integra ao osso) và colocação da prótese definitiva. Casos mais complexos podem levar mais tempo. Durante a consulta, nosso especialista fará uma avaliação e estimativa del tempo necessário para seu caso específico.</p>
549
+ </div>
550
+ </div>
551
+ </div>
552
+ </div>
553
+ </section>
554
+
555
+ <!-- Testimonials Section -->
556
+ <section class="py-16 bg-indigo-50" id="testimonials">
557
+ <div class="container mx-auto px-6">
558
+ <div class="text-center mb-12">
559
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Depoimentos de Nossos Pacientes</h2>
560
+ <p class="text-xl text-gray-600 max-w-2xl mx-auto">Veja o que nossos pacientes dizem sobre nossos serviços</p>
561
+ <div class="w-20 h-1 bg-indigo-600 mx-auto mt-4"></div>
562
+ </div>
563
+
564
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
565
+ <!-- Testimonial 1 -->
566
+ <div class="bg-white p-6 rounded-lg shadow-md testimonial-card">
567
+ <div class="flex items-center mb-4">
568
+ <div class="text-yellow-400 mr-2">
569
+ <i class="fas fa-star"></i>
570
+ <i class="fas fa-star"></i>
571
+ <i class="fas fa-star"></i>
572
+ <i class="fas fa-star"></i>
573
+ <i class="fas fa-star"></i>
574
+ </div>
575
+ </div>
576
+ <p class="text-gray-600 mb-4">"Excelente atendimento na OdontoVas! Fiz um implante e o resultado foi perfeito. A equipe é muito profissional e atenciosa, explicou todo o processo com detalhes. Recomendo muito!"</p>
577
+ <div class="flex items-center">
578
+ <div class="bg-indigo-100 text-indigo-600 rounded-full w-12 h-12 flex items-center justify-center mr-4">
579
+ <i class="fas fa-user text-xl"></i>
580
+ </div>
581
+ <div>
582
+ <h4 class="font-bold text-gray-800">Carlos Silva</h4>
583
+ <p class="text-gray-500">Paciente de Implante</p>
584
+ </div>
585
+ </div>
586
+ </div>
587
+
588
+ <!-- Testimonial 2 -->
589
+ <div class="bg-white p-6 rounded-lg shadow-md testimonial-card">
590
+ <div class="flex items-center mb-4">
591
+ <div class="text-yellow-400 mr-2">
592
+ <i class="fas fa-star"></i>
593
+ <i class="fas fa-star"></i>
594
+ <i class="fas fa-star"></i>
595
+ <i class="fas fa-star"></i>
596
+ <i class="fas fa-star"></i>
597
+ </div>
598
+ </div>
599
+ <p class="text-gray-600 mb-4">"Levei meu filho de 5 anos para a primeira consulta e fiquei impressionada com a paciência e cuidado da dentista. Ele saiu feliz e querendo voltar! O espaço infantil é encantador."</p>
600
+ <div class="flex items-center">
601
+ <div class="bg-indigo-100 text-indigo-600 rounded-full w-12 h-12 flex items-center justify-center mr-4">
602
+ <i class="fas fa-user text-xl"></i>
603
+ </div>
604
+ <div>
605
+ <h4 class="font-bold text-gray-800">Ana Paula Rocha</h4>
606
+ <p class="text-gray-500">Mãe de paciente infantil</p>
607
+ </div>
608
+ </div>
609
+ </div>
610
+
611
+ <!-- Testimonial 3 -->
612
+ <div class="bg-white p-6 rounded-lg shadow-md testimonial-card">
613
+ <div class="flex items-center mb-4">
614
+ <div class="text-yellow-400 mr-2">
615
+ <i class="fas fa-star"></i>
616
+ <i class="fas fa-star"></i>
617
+ <i class="fas fa-star"></i>
618
+ <i class="fas fa-star"></i>
619
+ <i class="fas fa-star-half-alt"></i>
620
+ </div>
621
+ </div>
622
+ <p class="text-gray-600 mb-4">"Fiz clareamento na OdontoVas e adorei o resultado! O tratamento foi indolor e o acompanhamento foi excelente. Meu sorriso ficou incrível! Já indiquei para várias amigas."</p>
623
+ <div class="flex items-center">
624
+ <div class="bg-indigo-100 text-indigo-600 rounded-full w-12 h-12 flex items-center justify-center mr-4">
625
+ <i class="fas fa-user text-xl"></i>
626
+ </div>
627
+ <div>
628
+ <h4 class="font-bold text-gray-800">Juliana Mendes</h4>
629
+ <p class="text-gray-500">Paciente de Clareamento</p>
630
+ </div>
631
+ </div>
632
+ </div>
633
+ </div>
634
+ </div>
635
+ </section>
636
+
637
+ <!-- Contact Section -->
638
+ <section class="py-16 bg-gray-800 text-white" id="contact">
639
+ <div class="container mx-auto px-6">
640
+ <div class="text-center mb-12">
641
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">Agende sua Consulta</h2>
642
+ <p class="text-xl text-gray-300 max-w-2xl mx-auto">Entre em contato conosco e marque sua avaliação</p>
643
+ <div class="w-20 h-1 bg-indigo-400 mx-auto mt-4"></div>
644
+ </div>
645
+
646
+ <div class="flex flex-col lg:flex-row">
647
+ <div class="lg:w-1/2 mb-12 lg:mb-0 lg:pr-12">
648
+ <h3 class="text-2xl font-bold mb-6">Informações de Contato</h3>
649
+
650
+ <div class="flex items-start mb-6">
651
+ <div class="text-indigo-400 mr-4 mt-1">
652
+ <i class="fas fa-map-marker-alt text-xl"></i>
653
+ </div>
654
+ <div>
655
+ <h4 class="font-bold text-lg mb-1">Endereço</h4>
656
+ <p class="text-gray-300">Quadra 03 Conjunto C Lote 39 - Sala 101 / Vila Buritis - Planaltina/DF</p>
657
+ </div>
658
+ </div>
659
+
660
+ <div class="flex items-start mb-6">
661
+ <div class="text-indigo-400 mr-4 mt-1">
662
+ <i class="fas fa-phone-alt text-xl"></i>
663
+ </div>
664
+ <div>
665
+ <h4 class="font-bold text-lg mb-1">Telefone</h4>
666
+ <p class="text-gray-300">(61) 9 9890-2272</p>
667
+ </div>
668
+ </div>
669
+
670
+ <div class="flex items-start mb-6">
671
+ <div class="text-indigo-400 mr-4 mt-1">
672
+ <i class="fas fa-envelope text-xl"></i>
673
+ </div>
674
+ <div>
675
+ <h4 class="font-bold text-lg mb-1">E-mail</h4>
676
+ <p class="text-gray-300">[email protected]</p>
677
+ </div>
678
+ </div>
679
+
680
+ <div class="flex items-start mb-6">
681
+ <div class="text-indigo-400 mr-4 mt-1">
682
+ <i class="fab fa-instagram text-xl"></i>
683
+ </div>
684
+ <div>
685
+ <h4 class="font-bold text-lg mb-1">Instagram</h4>
686
+ <p class="text-gray-300">@vas.odonto</p>
687
+ </div>
688
+ </div>
689
+
690
+ <div class="flex items-start">
691
+ <div class="text-indigo-400 mr-4 mt-1">
692
+ <i class="fas fa-clock text-xl"></i>
693
+ </div>
694
+ <div>
695
+ <h4 class="font-bold text-lg mb-1">Horário de Funcionamento</h4>
696
+ <p class="text-gray-300">Segunda a Sexta: 8h às 18h<br>Sábado: 8h às 12h</p>
697
+ </div>
698
+ </div>
699
+
700
+ <div class="mt-8">
701
+ <h4 class="font-bold text-lg mb-4">Nos acompanhe nas redes sociais</h4>
702
+ <div class="flex space-x-4">
703
+ <a href="https://www.instagram.com/vas.odonto" target="_blank" class="bg-indigo-600 hover:bg-indigo-700 text-white w-10 h-10 rounded-full flex items-center justify-center transition duration-300">
704
+ <i class="fab fa-instagram"></i>
705
+ </a>
706
+ <a href="#" class="bg-indigo-600 hover:bg-indigo-700 text-white w-10 h-10 rounded-full flex items-center justify-center transition duration-300">
707
+ <i class="fab fa-facebook-f"></i>
708
+ </a>
709
+ <a href="#" class="bg-indigo-600 hover:bg-indigo-700 text-white w-10 h-10 rounded-full flex items-center justify-center transition duration-300">
710
+ <i class="fab fa-linkedin-in"></i>
711
+ </a>
712
+ </div>
713
+ </div>
714
+ </div>
715
+
716
+ <div class="lg:w-1/2">
717
+ <div class="bg-white p-8 rounded-lg shadow-lg">
718
+ <h3 class="text-2xl font-bold text-gray-800 mb-6">Envie uma Mensagem</h3>
719
+ <form id="contact-form">
720
+ <div class="mb-4">
721
+ <label for="name" class="block text-gray-700 font-medium mb-2">Nome Completo</label>
722
+ <input type="text" id="name" name="name" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500" required>
723
+ </div>
724
+
725
+ <div class="mb-4">
726
+ <label for="email" class="block text-gray-700 font-medium mb-2">E-mail</label>
727
+ <input type="email" id="email" name="email" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500" required>
728
+ </div>
729
+
730
+ <div class="mb-4">
731
+ <label for="phone" class="block text-gray-700 font-medium mb-2">Telefone</label>
732
+ <input type="tel" id="phone" name="phone" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500" required>
733
+ </div>
734
+
735
+ <div class="mb-4">
736
+ <label for="service" class="block text-gray-700 font-medium mb-2">Serviço de Interesse</label>
737
+ <select id="service" name="service" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500">
738
+ <option value="">Selecione um serviço</option>
739
+ <option value="clinica-geral">Clínica Geral</option>
740
+ <option value="limpeza">Limpeza</option>
741
+ <option value="periodontia">Periodontia</option>
742
+ <option value="extracao">Extrações</option>
743
+ <option value="canal">Canal</option>
744
+ <option value="restauracao">Restaurações</option>
745
+ <option value="protese">Próteses</option>
746
+ <option value="implante">Implantes</option>
747
+ <option value="clareamento">Clareamento</option>
748
+ <option value="radiologia">Radiologia (periapical)</option>
749
+ <option value="ortodontia">Aparelhos Ortodônticos</option>
750
+ <option value="infantil">Atendimento Infantil</option>
751
+ </select>
752
+ </div>
753
+
754
+ <div class="mb-4">
755
+ <label for="message" class="block text-gray-700 font-medium mb-2">Mensagem</label>
756
+ <textarea id="message" name="message" rows="4" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500"></textarea>
757
+ </div>
758
+
759
+ <button type="submit" class="w-full bg-indigo-600 hover:bg-indigo-700 text-white px-6 py-3 rounded-md font-medium transition duration-300">
760
+ Enviar Mensagem
761
+ </button>
762
+ </form>
763
+ </div>
764
+ </div>
765
+ </div>
766
+ </div>
767
+ </section>
768
+
769
+ <!-- Map Section -->
770
+ <div class="h-96 w-full">
771
+ <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3836.123456789012!2d-47.65123456789123!3d-15.612345678901234!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x0!2zMTXCsDM2JzQ0LjQiUyA0N8KwMzknMDUuNiJX!5e0!3m2!1spt-BR!2sbr!4v1234567890123!5m2!1spt-BR!2sbr" width="100%" height="100%" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
772
+ </div>
773
+
774
+ <!-- Footer -->
775
+ <footer class="bg-gray-900 text-white py-8">
776
+ <div class="container mx-auto px-6">
777
+ <div class="flex flex-col md:flex-row justify-between items-center">
778
+ <div class="mb-6 md:mb-0">
779
+ <div class="flex items-center justify-center">
780
+ <!-- Footer Logo with horizontal white logo -->
781
+ <img src="https://huggingface.co/spaces/Lioszada/odontovas/resolve/main/HORIZONTAL%20SITE%20BRANCA.png" alt="OdontoVas" class="h-16">
782
+ </div>
783
+ <p class="mt-2 text-gray-400 text-center">Cuidando do seu sorriso com excelência</p>
784
+ <p class="mt-2 text-gray-400 text-sm text-center">EPAO: 3736 | CNPJ: 51.615.586/0001-30</p>
785
+ </div>
786
+
787
+ <div class="flex space-x-6">
788
+ <a href="https://www.instagram.com/vas.odonto" target="_blank" class="text-gray-400 hover:text-white transition duration-300">
789
+ <i class="fab fa-instagram text-2xl"></i>
790
+ </a>
791
+ <a href="https://wa.me/556198902272" target="_blank" class="text-gray-400 hover:text-white transition duration-300">
792
+ <i class="fab fa-whatsapp text-2xl"></i>
793
+ </a>
794
+ <a href="#" class="text-gray-400 hover:text-white transition duration-300">
795
+ <i class="fab fa-facebook text-2xl"></i>
796
+ </a>
797
+ </div>
798
+ </div>
799
+
800
+ <div class="border-t border-gray-800 mt-8 pt-8 flex flex-col md:flex-row justify-between">
801
+ <div class="mb-4 md:mb-0">
802
+ <p class="text-gray-400">&copy; 2023 OdontoVas. Todos os direitos reservados.</p>
803
+ </div>
804
+
805
+ <div class="flex flex-col md:flex-row space-y-2 md:space-y-0 md:space-x-6">
806
+ <a href="#home" class="text-gray-400 hover:text-white transition duration-300">Início</a>
807
+ <a href="#about" class="text-gray-400 hover:text-white transition duration-300">Sobre</a>
808
+ <a href="#services" class="text-gray-400 hover:text-white transition duration-300">Serviços</a>
809
+ <a href="#contact" class="text-gray-400 hover:text-white transition duration-300">Contato</a>
810
+ <a href="#" class="text-gray-400 hover:text-white transition duration-300">Política de Privacidade</p>
811
+ </div>
812
+ </div>
813
+ </div>
814
+ </footer>
815
+
816
+ <script>
817
+ // Mobile menu toggle
818
+ const menuBtn = document.getElementById('menu-btn');
819
+ const mobileMenu = document.getElementById('mobile-menu');
820
+
821
+ menuBtn.addEventListener('click', () => {
822
+ mobileMenu.classList.toggle('hidden');
823
+ });
824
+
825
+ // Form submission
826
+ const contactForm = document.getElementById('contact-form');
827
+
828
+ contactForm.addEventListener('submit', (e) => {
829
+ e.preventDefault();
830
+
831
+ // Get form values
832
+ const name = document.getElementById('name').value;
833
+ const email = document.getElementById('email').value;
834
+ const phone = document.getElementById('phone').value;
835
+ const service = document.getElementById('service').value;
836
+ const message = document.getElementById('message').value;
837
+
838
+ // Here you would typically send the form data to a server
839
+ // For this example, we'll just show an alert
840
+ alert(`Obrigado, ${name}! Sua mensagem foi enviada com sucesso. Entraremos em contato em breve.`);
841
+
842
+ // Reset form
843
+ contactForm.reset();
844
+ });
845
+
846
+ // Smooth scrolling for anchor links
847
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
848
+ anchor.addEventListener('click', function (e) {
849
+ e.preventDefault();
850
+
851
+ const targetId = this.getAttribute('href');
852
+ const targetElement = document.querySelector(targetId);
853
+
854
+ if (targetElement) {
855
+ window.scrollTo({
856
+ top: targetElement.offsetTop - 80,
857
+ behavior: 'smooth'
858
+ });
859
+
860
+ // Close mobile menu if open
861
+ if (!mobileMenu.classList.contains('hidden')) {
862
+ mobileMenu.classList.add('hidden');
863
+ }
864
+ }
865
+ });
866
+ });
867
+
868
+ // Navbar scroll effect
869
+ window.addEventListener('scroll', function()
870
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ Abaixo de onde tem o mapa, que você coloca mais uma logo, usa essa branca: https://huggingface.co/spaces/Lioszada/odontovas/resolve/main/HORIZONTAL%20SITE%20BRANCA.png, só que aumenta um pouco mais ela, está muito pequena. Sobre as fotos dos doutores, coloque em vertical, pois não dá pra ver os rostos deles, deixe agradável. Você pode colocar as fotos em verticais, de forma agradável, e ao lado as informações. Onde tem "Sobre a OdontoVas" que contém a experiência, tira o +6 Anos de esperiência e coloque "Estamos cuidando do teu sorriso".