Hugging Face's logo

Spaces:
antocarloss
/
testeweb-bp
Running

App Files Community
antocarloss commited on
Commit
4ca40de
·
verified ·
1 Parent(s): 564c806

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +1025 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Testeweb Bp
3
- emoji: ⚡
4
- colorFrom: purple
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: testeweb-bp
3
+ emoji: 🐳
4
+ colorFrom: pink
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,1025 @@
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>Bull Partners - Investimento em Gado Nelore de Corte</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .hero-gradient {
11
+ background: linear-gradient(135deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%);
12
+ }
13
+ .animal-card {
14
+ transition: all 0.3s ease;
15
+ }
16
+ .animal-card:hover {
17
+ transform: translateY(-5px);
18
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
19
+ }
20
+ .testimonial-card {
21
+ background: linear-gradient(135deg, #f8f8f8 0%, #ffffff 100%);
22
+ border-left: 4px solid #d97706;
23
+ }
24
+ .btn-primary {
25
+ background-color: #d97706;
26
+ transition: all 0.3s ease;
27
+ }
28
+ .btn-primary:hover {
29
+ background-color: #b65c04;
30
+ transform: translateY(-2px);
31
+ }
32
+ .stats-item {
33
+ border-bottom: 3px solid #d97706;
34
+ }
35
+ .form-step {
36
+ display: none;
37
+ }
38
+ .form-step.active {
39
+ display: block;
40
+ }
41
+ .progress-bar {
42
+ height: 6px;
43
+ background-color: #e5e7eb;
44
+ border-radius: 3px;
45
+ }
46
+ .progress {
47
+ height: 100%;
48
+ background-color: #d97706;
49
+ border-radius: 3px;
50
+ transition: width 0.4s ease;
51
+ }
52
+ </style>
53
+ </head>
54
+ <body class="font-sans bg-gray-50">
55
+ <!-- Header/Navbar -->
56
+ <header class="bg-white shadow-md sticky top-0 z-50">
57
+ <div class="container mx-auto px-4 py-3 flex justify-between items-center">
58
+ <div class="flex items-center">
59
+ <i class="fas fa-cow text-3xl text-amber-700 mr-2"></i>
60
+ <h1 class="text-2xl font-bold text-gray-800">Bull<span class="text-amber-700">Partners</span></h1>
61
+ </div>
62
+ <nav class="hidden md:flex space-x-8">
63
+ <a href="#home" class="text-gray-800 hover:text-amber-700 font-medium">Início</a>
64
+ <a href="#about" class="text-gray-800 hover:text-amber-700 font-medium">Sobre Nós</a>
65
+ <a href="#invest" class="text-gray-800 hover:text-amber-700 font-medium">Investir</a>
66
+ <a href="#results" class="text-gray-800 hover:text-amber-700 font-medium">Resultados</a>
67
+ <a href="#contact" class="text-gray-800 hover:text-amber-700 font-medium">Contato</a>
68
+ </nav>
69
+ <button class="md:hidden text-gray-800">
70
+ <i class="fas fa-bars text-2xl"></i>
71
+ </button>
72
+ </div>
73
+ </header>
74
+
75
+ <!-- Hero Section -->
76
+ <section id="home" class="relative h-screen flex items-center">
77
+ <div class="absolute inset-0">
78
+ <img src="https://images.unsplash.com/photo-1559123692-5a96f0a88744?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80"
79
+ alt="Gado Nelore" class="w-full h-full object-cover">
80
+ <div class="absolute inset-0 hero-gradient"></div>
81
+ </div>
82
+ <div class="container mx-auto px-4 relative z-10 text-white text-center">
83
+ <h1 class="text-4xl md:text-6xl font-bold mb-6">Invista em Gado Nelore com Segurança</h1>
84
+ <p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto">Rentabilidade acima de 18% ao ano com um dos investimentos mais sólidos do agronegócio brasileiro</p>
85
+ <div class="flex flex-col md:flex-row justify-center gap-4">
86
+ <a href="#invest" class="btn-primary py-3 px-8 rounded-full text-white font-bold text-lg">Simular Investimento</a>
87
+ <a href="#about" class="bg-white py-3 px-8 rounded-full text-amber-700 font-bold text-lg border-2 border-amber-700">Conheça o Processo</a>
88
+ </div>
89
+ </div>
90
+ </section>
91
+
92
+ <!-- Stats Section -->
93
+ <section class="bg-amber-700 text-white py-12">
94
+ <div class="container mx-auto px-4">
95
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center">
96
+ <div class="stats-item pb-4">
97
+ <h3 class="text-4xl font-bold mb-2">R$ 50mi+</h3>
98
+ <p class="text-lg">Em animais negociados</p>
99
+ </div>
100
+ <div class="stats-item pb-4">
101
+ <h3 class="text-4xl font-bold mb-2">1.200+</h3>
102
+ <p class="text-lg">Investidores ativos</p>
103
+ </div>
104
+ <div class="stats-item pb-4">
105
+ <h3 class="text-4xl font-bold mb-2">18%+</h3>
106
+ <p class="text-lg">Rentabilidade média anual</p>
107
+ </div>
108
+ <div class="stats-item pb-4">
109
+ <h3 class="text-4xl font-bold mb-2">100%</h3>
110
+ <p class="text-lg">De contratos honrados</p>
111
+ </div>
112
+ </div>
113
+ </div>
114
+ </section>
115
+
116
+ <!-- About Section -->
117
+ <section id="about" class="py-20 bg-white">
118
+ <div class="container mx-auto px-4">
119
+ <div class="flex flex-col md:flex-row items-center">
120
+ <div class="md:w-1/2 mb-10 md:mb-0 md:pr-10">
121
+ <img src="https://images.unsplash.com/photo-1586771107445-d3ca888129ce?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80"
122
+ alt="Gado Nelore" class="rounded-lg shadow-xl w-full">
123
+ </div>
124
+ <div class="md:w-1/2">
125
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-6">Sobre a Bull Partners</h2>
126
+ <p class="text-lg text-gray-600 mb-6">Especializada na engorda de gado Nelore, a Bull Partners oferece oportunidades de investimento seguro no mercado pecuário, com toda a expertise de uma equipe com mais de 15 anos de experiência.</p>
127
+ <div class="space-y-4">
128
+ <div class="flex items-start">
129
+ <i class="fas fa-check-circle text-amber-700 text-xl mt-1 mr-3"></i>
130
+ <div>
131
+ <h4 class="font-bold text-gray-800">Gado Nelore Puro</h4>
132
+ <p class="text-gray-600">Raça adaptada ao clima tropical com excelente conversão alimentar.</p>
133
+ </div>
134
+ </div>
135
+ <div class="flex items-start">
136
+ <i class="fas fa-check-circle text-amber-700 text-xl mt-1 mr-3"></i>
137
+ <div>
138
+ <h4 class="font-bold text-gray-800">Tecnologia de Ponta</h4>
139
+ <p class="text-gray-600">Manejo moderno com acompanhamento nutricional e sanitário individualizado.</p>
140
+ </div>
141
+ </div>
142
+ <div class="flex items-start">
143
+ <i class="fas fa-check-circle text-amber-700 text-xl mt-1 mr-3"></i>
144
+ <div>
145
+ <h4 class="font-bold text-gray-800">Transparência Total</h4>
146
+ <p class="text-gray-600">Acompanhamento mensal do desenvolvimento do seu investimento.</p>
147
+ </div>
148
+ </div>
149
+ </div>
150
+ <a href="#invest" class="btn-primary inline-block mt-8 py-3 px-8 rounded-full text-white font-bold text-lg">Quero Investir</a>
151
+ </div>
152
+ </div>
153
+ </div>
154
+ </section>
155
+
156
+ <!-- Why Invest Section -->
157
+ <section class="py-20 bg-gray-100">
158
+ <div class="container mx-auto px-4">
159
+ <div class="text-center mb-16">
160
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Por Que Investir em Gado Nelore?</h2>
161
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">O mercado de carne bovina brasileira é um dos mais fortes do mundo, com demanda crescente tanto no mercado interno quanto para exportação.</p>
162
+ </div>
163
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
164
+ <div class="bg-white p-8 rounded-lg shadow-md animal-card">
165
+ <div class="text-amber-700 text-4xl mb-4">
166
+ <i class="fas fa-chart-line"></i>
167
+ </div>
168
+ <h3 class="text-xl font-bold text-gray-800 mb-3">Rentabilidade Comprovada</h3>
169
+ <p class="text-gray-600">Histórico de rentabilidade acima de 18% ao ano, superando muitos investimentos tradicionais.</p>
170
+ </div>
171
+ <div class="bg-white p-8 rounded-lg shadow-md animal-card">
172
+ <div class="text-amber-700 text-4xl mb-4">
173
+ <i class="fas fa-shield-alt"></i>
174
+ </div>
175
+ <h3 class="text-xl font-bold text-gray-800 mb-3">Proteção Against Inflação</h3>
176
+ <p class="text-gray-600">O preço da carne acompanha a inflação, protegendo seu poder de compra.</p>
177
+ </div>
178
+ <div class="bg-white p-8 rounded-lg shadow-md animal-card">
179
+ <div class="text-amber-700 text-4xl mb-4">
180
+ <i class="fas fa-globe-americas"></i>
181
+ </div>
182
+ <h3 class="text-xl font-bold text-gray-800 mb-3">Mercado Global</h3>
183
+ <p class="text-gray-600">O Brasil é o maior exportador de carne bovina do mundo, com demanda crescente.</p>
184
+ </div>
185
+ </div>
186
+ </div>
187
+ </section>
188
+
189
+ <!-- Investment Process Section -->
190
+ <section class="py-20 bg-white">
191
+ <div class="container mx-auto px-4">
192
+ <div class="text-center mb-16">
193
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Como Funciona o Investimento</h2>
194
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Um processo simples e transparente para você investir com segurança.</p>
195
+ </div>
196
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
197
+ <div class="text-center">
198
+ <div class="bg-amber-700 text-white rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-4 text-2xl font-bold">1</div>
199
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Escolha sua Cota</h3>
200
+ <p class="text-gray-600">Selecione o valor de investimento que melhor atende suas necessidades.</p>
201
+ </div>
202
+ <div class="text-center">
203
+ <div class="bg-amber-700 text-white rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-4 text-2xl font-bold">2</div>
204
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Assinatura Digital</h3>
205
+ <p class="text-gray-600">Contrato eletrônico seguro com todas as garantias legais.</p>
206
+ </div>
207
+ <div class="text-center">
208
+ <div class="bg-amber-700 text-white rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-4 text-2xl font-bold">3</div>
209
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Acompanhamento</h3>
210
+ <p class="text-gray-600">Receba relatórios periódicos sobre o desenvolvimento do seu investimento.</p>
211
+ </div>
212
+ <div class="text-center">
213
+ <div class="bg-amber-700 text-white rounded-full w-16 h-16 flex items-center justify-center mx-auto mb-4 text-2xl font-bold">4</div>
214
+ <h3 class="text-xl font-bold text-gray-800 mb-2">Retorno</h3>
215
+ <p class="text-gray-600">Receba seu capital mais lucros ao final do ciclo de engorda.</p>
216
+ </div>
217
+ </div>
218
+ </div>
219
+ </section>
220
+
221
+ <!-- Investment Options Section -->
222
+ <section id="invest" class="py-20 bg-gray-100">
223
+ <div class="container mx-auto px-4">
224
+ <div class="text-center mb-16">
225
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Invista em Gado Nelore</h2>
226
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Escolha a modalidade que melhor se adapta ao seu perfil de investidor.</p>
227
+ </div>
228
+
229
+ <!-- Investment Form -->
230
+ <div class="max-w-4xl mx-auto bg-white rounded-xl shadow-lg overflow-hidden">
231
+ <div class="p-8">
232
+ <div class="mb-8">
233
+ <div class="flex justify-between mb-2">
234
+ <span class="text-sm font-medium text-gray-700">Progresso</span>
235
+ <span class="text-sm font-medium text-gray-700"><span id="current-step">1</span>/4</span>
236
+ </div>
237
+ <div class="progress-bar">
238
+ <div class="progress" id="form-progress" style="width: 25%"></div>
239
+ </div>
240
+ </div>
241
+
242
+ <!-- Step 1: Choose Investment Type -->
243
+ <div class="form-step active" id="step-1">
244
+ <h3 class="text-2xl font-bold text-gray-800 mb-6">Selecione o Tipo de Investimento</h3>
245
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
246
+ <div class="animal-card">
247
+ <input type="radio" name="investment-type" id="type-basic" class="hidden peer" value="basic">
248
+ <label for="type-basic" class="block p-6 border-2 border-gray-200 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
249
+ <div class="text-center mb-4">
250
+ <i class="fas fa-cow text-4xl text-amber-700"></i>
251
+ </div>
252
+ <h4 class="text-xl font-bold text-center text-gray-800 mb-2">Cota Individual</h4>
253
+ <p class="text-gray-600 text-center">Investimento a partir de R$ 5.000 em um animal</p>
254
+ </label>
255
+ </div>
256
+ <div class="animal-card">
257
+ <input type="radio" name="investment-type" id="type-premium" class="hidden peer" value="premium" checked>
258
+ <label for="type-premium" class="block p-6 border-2 border-amber-700 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
259
+ <div class="text-center mb-4">
260
+ <i class="fas fa-cow text-4xl text-amber-700"></i>
261
+ <i class="fas fa-cow text-4xl text-amber-700"></i>
262
+ <i class="fas fa-cow text-4xl text-amber-700"></i>
263
+ </div>
264
+ <h4 class="text-xl font-bold text-center text-gray-800 mb-2">Cota em Lote</h4>
265
+ <p class="text-gray-600 text-center">Investimento a partir de R$ 20.000 em um lote de animais</p>
266
+ </label>
267
+ </div>
268
+ <div class="animal-card">
269
+ <input type="radio" name="investment-type" id="type-enterprise" class="hidden peer" value="enterprise">
270
+ <label for="type-enterprise" class="block p-6 border-2 border-gray-200 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
271
+ <div class="text-center mb-4">
272
+ <i class="fas fa-tractor text-4xl text-amber-700"></i>
273
+ </div>
274
+ <h4 class="text-xl font-bold text-center text-gray-800 mb-2">Cota Empresarial</h4>
275
+ <p class="text-gray-600 text-center">Investimento a partir de R$ 100.000 com benefícios exclusivos</p>
276
+ </label>
277
+ </div>
278
+ </div>
279
+ <div class="mt-8 text-right">
280
+ <button type="button" onclick="nextStep()" class="btn-primary py-3 px-8 rounded-full text-white font-bold text-lg">Próximo</button>
281
+ </div>
282
+ </div>
283
+
284
+ <!-- Step 2: Choose Investment Amount -->
285
+ <div class="form-step" id="step-2">
286
+ <h3 class="text-2xl font-bold text-gray-800 mb-6">Selecione o Valor do Investimento</h3>
287
+
288
+ <div id="basic-options" class="investment-options hidden">
289
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
290
+ <div class="animal-card">
291
+ <input type="radio" name="investment-amount" id="amount-basic-1" class="hidden peer" value="5000">
292
+ <label for="amount-basic-1" class="block p-6 border-2 border-gray-200 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
293
+ <h4 class="text-2xl font-bold text-center text-gray-800 mb-2">R$ 5.000</h4>
294
+ <p class="text-gray-600 text-center">1 animal equivalente</p>
295
+ <p class="text-gray-600 text-center mt-2">Retorno estimado: R$ 6.100</p>
296
+ </label>
297
+ </div>
298
+ <div class="animal-card">
299
+ <input type="radio" name="investment-amount" id="amount-basic-2" class="hidden peer" value="10000">
300
+ <label for="amount-basic-2" class="block p-6 border-2 border-gray-200 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
301
+ <h4 class="text-2xl font-bold text-center text-gray-800 mb-2">R$ 10.000</h4>
302
+ <p class="text-gray-600 text-center">2 animais equivalentes</p>
303
+ <p class="text-gray-600 text-center mt-2">Retorno estimado: R$ 12.200</p>
304
+ </label>
305
+ </div>
306
+ <div class="animal-card">
307
+ <input type="radio" name="investment-amount" id="amount-basic-3" class="hidden peer" value="15000">
308
+ <label for="amount-basic-3" class="block p-6 border-2 border-gray-200 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
309
+ <h4 class="text-2xl font-bold text-center text-gray-800 mb-2">R$ 15.000</h4>
310
+ <p class="text-gray-600 text-center">3 animais equivalentes</p>
311
+ <p class="text-gray-600 text-center mt-2">Retorno estimado: R$ 18.300</p>
312
+ </label>
313
+ </div>
314
+ </div>
315
+ </div>
316
+
317
+ <div id="premium-options" class="investment-options">
318
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
319
+ <div class="animal-card">
320
+ <input type="radio" name="investment-amount" id="amount-premium-1" class="hidden peer" value="20000" checked>
321
+ <label for="amount-premium-1" class="block p-6 border-2 border-amber-700 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
322
+ <h4 class="text-2xl font-bold text-center text-gray-800 mb-2">R$ 20.000</h4>
323
+ <p class="text-gray-600 text-center">5 animais equivalentes</p>
324
+ <p class="text-gray-600 text-center mt-2">Retorno estimado: R$ 24.400</p>
325
+ </label>
326
+ </div>
327
+ <div class="animal-card">
328
+ <input type="radio" name="investment-amount" id="amount-premium-2" class="hidden peer" value="40000">
329
+ <label for="amount-premium-2" class="block p-6 border-2 border-gray-200 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
330
+ <h4 class="text-2xl font-bold text-center text-gray-800 mb-2">R$ 40.000</h4>
331
+ <p class="text-gray-600 text-center">10 animais equivalentes</p>
332
+ <p class="text-gray-600 text-center mt-2">Retorno estimado: R$ 48.800</p>
333
+ </label>
334
+ </div>
335
+ <div class="animal-card">
336
+ <input type="radio" name="investment-amount" id="amount-premium-3" class="hidden peer" value="60000">
337
+ <label for="amount-premium-3" class="block p-6 border-2 border-gray-200 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
338
+ <h4 class="text-2xl font-bold text-center text-gray-800 mb-2">R$ 60.000</h4>
339
+ <p class="text-gray-600 text-center">15 animais equivalentes</p>
340
+ <p class="text-gray-600 text-center mt-2">Retorno estimado: R$ 73.200</p>
341
+ </label>
342
+ </div>
343
+ </div>
344
+ </div>
345
+
346
+ <div id="enterprise-options" class="investment-options hidden">
347
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
348
+ <div class="animal-card">
349
+ <input type="radio" name="investment-amount" id="amount-enterprise-1" class="hidden peer" value="100000">
350
+ <label for="amount-enterprise-1" class="block p-6 border-2 border-gray-200 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
351
+ <h4 class="text-2xl font-bold text-center text-gray-800 mb-2">R$ 100.000</h4>
352
+ <p class="text-gray-600 text-center">25 animais equivalentes</p>
353
+ <p class="text-gray-600 text-center mt-2">Retorno estimado: R$ 122.000</p>
354
+ </label>
355
+ </div>
356
+ <div class="animal-card">
357
+ <input type="radio" name="investment-amount" id="amount-enterprise-2" class="hidden peer" value="200000">
358
+ <label for="amount-enterprise-2" class="block p-6 border-2 border-gray-200 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
359
+ <h4 class="text-2xl font-bold text-center text-gray-800 mb-2">R$ 200.000</h4>
360
+ <p class="text-gray-600 text-center">50 animais equivalentes</p>
361
+ <p class="text-gray-600 text-center mt-2">Retorno estimado: R$ 244.000</p>
362
+ </label>
363
+ </div>
364
+ <div class="animal-card">
365
+ <input type="radio" name="investment-amount" id="amount-enterprise-3" class="hidden peer" value="300000">
366
+ <label for="amount-enterprise-3" class="block p-6 border-2 border-gray-200 rounded-lg cursor-pointer peer-checked:border-amber-700 peer-checked:bg-amber-50">
367
+ <h4 class="text-2xl font-bold text-center text-gray-800 mb-2">R$ 300.000</h4>
368
+ <p class="text-gray-600 text-center">75 animais equivalentes</p>
369
+ <p class="text-gray-600 text-center mt-2">Retorno estimado: R$ 366.000</p>
370
+ </label>
371
+ </div>
372
+ </div>
373
+ </div>
374
+
375
+ <div class="mt-8 flex justify-between">
376
+ <button type="button" onclick="prevStep()" class="bg-gray-200 py-3 px-8 rounded-full text-gray-800 font-bold text-lg">Voltar</button>
377
+ <button type="button" onclick="nextStep()" class="btn-primary py-3 px-8 rounded-full text-white font-bold text-lg">Próximo</button>
378
+ </div>
379
+ </div>
380
+
381
+ <!-- Step 3: Personal Information -->
382
+ <div class="form-step" id="step-3">
383
+ <h3 class="text-2xl font-bold text-gray-800 mb-6">Seus Dados</h3>
384
+
385
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
386
+ <div>
387
+ <label for="name" class="block text-gray-700 font-medium mb-2">Nome Completo</label>
388
+ <input type="text" id="name" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-700 focus:border-transparent" required>
389
+ </div>
390
+ <div>
391
+ <label for="email" class="block text-gray-700 font-medium mb-2">Email</label>
392
+ <input type="email" id="email" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-700 focus:border-transparent" required>
393
+ </div>
394
+ <div>
395
+ <label for="phone" class="block text-gray-700 font-medium mb-2">Telefone</label>
396
+ <input type="tel" id="phone" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-700 focus:border-transparent" required>
397
+ </div>
398
+ <div>
399
+ <label for="cpf" class="block text-gray-700 font-medium mb-2">CPF</label>
400
+ <input type="text" id="cpf" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-700 focus:border-transparent" required>
401
+ </div>
402
+ </div>
403
+
404
+ <div class="mt-6">
405
+ <label for="message" class="block text-gray-700 font-medium mb-2">Alguma observação?</label>
406
+ <textarea id="message" rows="3" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-700 focus:border-transparent"></textarea>
407
+ </div>
408
+
409
+ <div class="mt-8 flex justify-between">
410
+ <button type="button" onclick="prevStep()" class="bg-gray-200 py-3 px-8 rounded-full text-gray-800 font-bold text-lg">Voltar</button>
411
+ <button type="button" onclick="nextStep()" class="btn-primary py-3 px-8 rounded-full text-white font-bold text-lg">Próximo</button>
412
+ </div>
413
+ </div>
414
+
415
+ <!-- Step 4: Review and Submit -->
416
+ <div class="form-step" id="step-4">
417
+ <h3 class="text-2xl font-bold text-gray-800 mb-6">Confirme seu Investimento</h3>
418
+
419
+ <div class="bg-gray-50 p-6 rounded-lg mb-6">
420
+ <h4 class="text-lg font-bold text-gray-800 mb-4">Resumo do Investimento</h4>
421
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
422
+ <div>
423
+ <p class="text-gray-600">Tipo de Cota:</p>
424
+ <p class="font-medium" id="review-type">Cota em Lote</p>
425
+ </div>
426
+ <div>
427
+ <p class="text-gray-600">Valor do Investimento:</p>
428
+ <p class="font-medium" id="review-amount">R$ 20.000</p>
429
+ </div>
430
+ <div>
431
+ <p class="text-gray-600">Quantidade de Animais:</p>
432
+ <p class="font-medium" id="review-animals">5</p>
433
+ </div>
434
+ <div>
435
+ <p class="text-gray-600">Retorno Estimado:</p>
436
+ <p class="font-medium" id="review-return">R$ 24.400</p>
437
+ </div>
438
+ </div>
439
+ </div>
440
+
441
+ <div class="bg-gray-50 p-6 rounded-lg">
442
+ <h4 class="text-lg font-bold text-gray-800 mb-4">Seus Dados</h4>
443
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
444
+ <div>
445
+ <p class="text-gray-600">Nome:</p>
446
+ <p class="font-medium" id="review-name">-</p>
447
+ </div>
448
+ <div>
449
+ <p class="text-gray-600">Email:</p>
450
+ <p class="font-medium" id="review-email">-</p>
451
+ </div>
452
+ <div>
453
+ <p class="text-gray-600">Telefone:</p>
454
+ <p class="font-medium" id="review-phone">-</p>
455
+ </div>
456
+ <div>
457
+ <p class="text-gray-600">CPF:</p>
458
+ <p class="font-medium" id="review-cpf">-</p>
459
+ </div>
460
+ </div>
461
+ </div>
462
+
463
+ <div class="mt-6">
464
+ <div class="flex items-start">
465
+ <input type="checkbox" id="terms" class="mt-1 mr-3" required>
466
+ <label for="terms" class="text-gray-600">Li e aceito os <a href="#" class="text-amber-700 hover:underline">Termos de Contrato</a> e <a href="#" class="text-amber-700 hover:underline">Política de Privacidade</a></label>
467
+ </div>
468
+ </div>
469
+
470
+ <div class="mt-8 flex justify-between">
471
+ <button type="button" onclick="prevStep()" class="bg-gray-200 py-3 px-8 rounded-full text-gray-800 font-bold text-lg">Voltar</button>
472
+ <button type="button" onclick="submitForm()" class="btn-primary py-3 px-8 rounded-full text-white font-bold text-lg">Finalizar Investimento</button>
473
+ </div>
474
+ </div>
475
+
476
+ <!-- Success Message -->
477
+ <div class="form-step hidden" id="success-message">
478
+ <div class="text-center py-12">
479
+ <div class="text-green-500 text-6xl mb-6">
480
+ <i class="fas fa-check-circle"></i>
481
+ </div>
482
+ <h3 class="text-2xl font-bold text-gray-800 mb-4">Investimento Solicitado com Sucesso!</h3>
483
+ <p class="text-gray-600 mb-6">Nossa equipe entrará em contato em até 24 horas para finalizar os detalhes do seu investimento.</p>
484
+ <a href="#home" class="btn-primary py-3 px-8 rounded-full text-white font-bold text-lg inline-block">Voltar ao Início</a>
485
+ </div>
486
+ </div>
487
+ </div>
488
+ </div>
489
+ </div>
490
+ </section>
491
+
492
+ <!-- Results Section -->
493
+ <section id="results" class="py-20 bg-white">
494
+ <div class="container mx-auto px-4">
495
+ <div class="text-center mb-16">
496
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Resultados dos Nossos Investidores</h2>
497
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Veja o retorno real que nossos investidores obtiveram nos últimos ciclos.</p>
498
+ </div>
499
+
500
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
501
+ <div class="bg-gray-100 p-6 rounded-lg">
502
+ <div class="flex justify-between items-center mb-4">
503
+ <h4 class="text-lg font-bold text-gray-800">Ciclo 2022/1</h4>
504
+ <span class="bg-amber-700 text-white text-xs font-bold px-2 py-1 rounded">Finalizado</span>
505
+ </div>
506
+ <div class="mb-4">
507
+ <p class="text-gray-600">Investimento médio:</p>
508
+ <p class="text-xl font-bold text-gray-800">R$ 25.000</p>
509
+ </div>
510
+ <div class="mb-4">
511
+ <p class="text-gray-600">Retorno médio:</p>
512
+ <p class="text-xl font-bold text-gray-800">R$ 30.500</p>
513
+ </div>
514
+ <div>
515
+ <p class="text-gray-600">Rentabilidade:</p>
516
+ <p class="text-xl font-bold text-green-600">22%</p>
517
+ </div>
518
+ </div>
519
+
520
+ <div class="bg-gray-100 p-6 rounded-lg">
521
+ <div class="flex justify-between items-center mb-4">
522
+ <h4 class="text-lg font-bold text-gray-800">Ciclo 2022/2</h4>
523
+ <span class="bg-amber-700 text-white text-xs font-bold px-2 py-1 rounded">Finalizado</span>
524
+ </div>
525
+ <div class="mb-4">
526
+ <p class="text-gray-600">Investimento médio:</p>
527
+ <p class="text-xl font-bold text-gray-800">R$ 28.000</p>
528
+ </div>
529
+ <div class="mb-4">
530
+ <p class="text-gray-600">Retorno médio:</p>
531
+ <p class="text-xl font-bold text-gray-800">R$ 33.600</p>
532
+ </div>
533
+ <div>
534
+ <p class="text-gray-600">Rentabilidade:</p>
535
+ <p class="text-xl font-bold text-green-600">20%</p>
536
+ </div>
537
+ </div>
538
+
539
+ <div class="bg-gray-100 p-6 rounded-lg">
540
+ <div class="flex justify-between items-center mb-4">
541
+ <h4 class="text-lg font-bold text-gray-800">Ciclo 2023/1</h4>
542
+ <span class="bg-blue-500 text-white text-xs font-bold px-2 py-1 rounded">Em Andamento</span>
543
+ </div>
544
+ <div class="mb-4">
545
+ <p class="text-gray-600">Investimento médio:</p>
546
+ <p class="text-xl font-bold text-gray-800">R$ 32.000</p>
547
+ </div>
548
+ <div class="mb-4">
549
+ <p class="text-gray-600">Projeção de retorno:</p>
550
+ <p class="text-xl font-bold text-gray-800">R$ 38.400</p>
551
+ </div>
552
+ <div>
553
+ <p class="text-gray-600">Rentabilidade estimada:</p>
554
+ <p class="text-xl font-bold text-blue-600">20%</p>
555
+ </div>
556
+ </div>
557
+ </div>
558
+
559
+ <div class="mt-12 text-center">
560
+ <a href="#invest" class="btn-primary py-3 px-8 rounded-full text-white font-bold text-lg inline-block">Quero Ter Esses Resultados</a>
561
+ </div>
562
+ </div>
563
+ </section>
564
+
565
+ <!-- Testimonials Section -->
566
+ <section class="py-20 bg-gray-100">
567
+ <div class="container mx-auto px-4">
568
+ <div class="text-center mb-16">
569
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">O Que Nossos Investidores Dizem</h2>
570
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Depoimentos real de quem já investe conosco.</p>
571
+ </div>
572
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
573
+ <div class="testimonial-card p-8 rounded-lg">
574
+ <div class="flex items-center mb-4">
575
+ <div class="text-amber-700 text-3xl mr-3">
576
+ <i class="fas fa-quote-left"></i>
577
+ </div>
578
+ <div class="text-yellow-400">
579
+ <i class="fas fa-star"></i>
580
+ <i class="fas fa-star"></i>
581
+ <i class="fas fa-star"></i>
582
+ <i class="fas fa-star"></i>
583
+ <i class="fas fa-star"></i>
584
+ </div>
585
+ </div>
586
+ <p class="text-gray-700 mb-6">"Investi R$ 20.000 há dois anos e recebi R$ 24.800 no final do ciclo. Melhor que muitos fundos de investimento tradicionais."</p>
587
+ <div class="flex items-center">
588
+ <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="Cliente" class="w-12 h-12 rounded-full mr-4">
589
+ <div>
590
+ <h4 class="font-bold text-gray-800">Carlos Mendes</h4>
591
+ <p class="text-gray-600">Investidor desde 2019</p>
592
+ </div>
593
+ </div>
594
+ </div>
595
+ <div class="testimonial-card p-8 rounded-lg">
596
+ <div class="flex items-center mb-4">
597
+ <div class="text-amber-700 text-3xl mr-3">
598
+ <i class="fas fa-quote-left"></i>
599
+ </div>
600
+ <div class="text-yellow-400">
601
+ <i class="fas fa-star"></i>
602
+ <i class="fas fa-star"></i>
603
+ <i class="fas fa-star"></i>
604
+ <i class="fas fa-star"></i>
605
+ <i class="fas fa-star"></i>
606
+ </div>
607
+ </div>
608
+ <p class="text-gray-700 mb-6">"A transparência dos relatórios me deixou muito seguro. Pude acompanhar todo o processo e visitar a fazenda."</p>
609
+ <div class="flex items-center">
610
+ <img src="https://randomuser.me/api/portraits/women/44.jpg" alt="Cliente" class="w-12 h-12 rounded-full mr-4">
611
+ <div>
612
+ <h4 class="font-bold text-gray-800">Ana Paula Silva</h4>
613
+ <p class="text-gray-600">Investidora desde 2020</p>
614
+ </div>
615
+ </div>
616
+ </div>
617
+ <div class="testimonial-card p-8 rounded-lg">
618
+ <div class="flex items-center mb-4">
619
+ <div class="text-amber-700 text-3xl mr-3">
620
+ <i class="fas fa-quote-left"></i>
621
+ </div>
622
+ <div class="text-yellow-400">
623
+ <i class="fas fa-star"></i>
624
+ <i class="fas fa-star"></i>
625
+ <i class="fas fa-star"></i>
626
+ <i class="fas fa-star"></i>
627
+ <i class="fas fa-star-half-alt"></i>
628
+ </div>
629
+ </div>
630
+ <p class="text-gray-700 mb-6">"Como empresário, diversifiquei meus investimentos com cotas de gado e tem sido uma excelente alternativa à bolsa de valores."</p>
631
+ <div class="flex items-center">
632
+ <img src="https://randomuser.me/api/portraits/men/75.jpg" alt="Cliente" class="w-12 h-12 rounded-full mr-4">
633
+ <div>
634
+ <h4 class="font-bold text-gray-800">Roberto Almeida</h4>
635
+ <p class="text-gray-600">Investidor desde 2018</p>
636
+ </div>
637
+ </div>
638
+ </div>
639
+ </div>
640
+ </div>
641
+ </section>
642
+
643
+ <!-- Gallery Section -->
644
+ <section class="py-20 bg-white">
645
+ <div class="container mx-auto px-4">
646
+ <div class="text-center mb-16">
647
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Nossa Fazenda em Imagens</h2>
648
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Conheça nossa estrutura e nossos animais.</p>
649
+ </div>
650
+ <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
651
+ <div class="overflow-hidden rounded-lg shadow-lg">
652
+ <img src="https://images.unsplash.com/photo-1559123692-5a96f0a88744?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80"
653
+ alt="Gado Nelore" class="w-full h-64 object-cover transition duration-500 hover:scale-105">
654
+ </div>
655
+ <div class="overflow-hidden rounded-lg shadow-lg">
656
+ <img src="https://images.unsplash.com/photo-1516467508483-a7212febe31a?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1473&q=80"
657
+ alt="Fazenda" class="w-full h-64 object-cover transition duration-500 hover:scale-105">
658
+ </div>
659
+ <div class="overflow-hidden rounded-lg shadow-lg">
660
+ <img src="https://images.unsplash.com/photo-1501706362039-c06b2d715385?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80"
661
+ alt="Pastagem" class="w-full h-64 object-cover transition duration-500 hover:scale-105">
662
+ </div>
663
+ <div class="overflow-hidden rounded-lg shadow-lg">
664
+ <img src="https://images.unsplash.com/photo-1553284965-5dd8352ff6bd?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80"
665
+ alt="Curral" class="w-full h-64 object-cover transition duration-500 hover:scale-105">
666
+ </div>
667
+ <div class="overflow-hidden rounded-lg shadow-lg">
668
+ <img src="https://images.unsplash.com/photo-1553284965-83c287af8963?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80"
669
+ alt="Gado no curral" class="w-full h-64 object-cover transition duration-500 hover:scale-105">
670
+ </div>
671
+ <div class="overflow-hidden rounded-lg shadow-lg">
672
+ <img src="https://images.unsplash.com/photo-1553284965-5f480c0c8c1d?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80"
673
+ alt="Equipe" class="w-full h-64 object-cover transition duration-500 hover:scale-105">
674
+ </div>
675
+ </div>
676
+ </div>
677
+ </section>
678
+
679
+ <!-- FAQ Section -->
680
+ <section class="py-20 bg-gray-100">
681
+ <div class="container mx-auto px-4">
682
+ <div class="text-center mb-16">
683
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Perguntas Frequentes</h2>
684
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Tire suas dúvidas sobre investimento em gado de corte.</p>
685
+ </div>
686
+ <div class="max-w-3xl mx-auto">
687
+ <div class="mb-6 border-b border-gray-200 pb-6">
688
+ <button class="flex justify-between items-center w-full text-left font-bold text-lg text-gray-800">
689
+ <span>Como é calculado o retorno do investimento?</span>
690
+ <i class="fas fa-chevron-down text-amber-700"></i>
691
+ </button>
692
+ <div class="mt-4 text-gray-600">
693
+ <p>O retorno é calculado com base no peso vivo do animal no momento da venda, descontados os custos operacionais. Nossos contratos estabelecem claramente a porcentagem de participação nos lucros, que varia conforme o tipo de cota escolhida.</p>
694
+ </div>
695
+ </div>
696
+ <div class="mb-6 border-b border-gray-200 pb-6">
697
+ <button class="flex justify-between items-center w-full text-left font-bold text-lg text-gray-800">
698
+ <span>Quais são os riscos envolvidos?</span>
699
+ <i class="fas fa-chevron-down text-amber-700"></i>
700
+ </button>
701
+ <div class="mt-4 text-gray-600">
702
+ <p>Todo investimento possui riscos. No caso da pecuária, os principais são variações no preço da arroba do boi e fatores climáticos. Mitigamos esses riscos com:</p>
703
+ <ul class="list-disc pl-5 mt-2 space-y-1">
704
+ <li>Seguro contra morte dos animais</li>
705
+ <li>Diversificação de compradores</li>
706
+ <li>Contratos futuros para parte da production</li>
707
+ <li>Monitoramento sanitário rigoroso</li>
708
+ </ul>
709
+ </div>
710
+ </div>
711
+ <div class="mb-6 border-b border-gray-200 pb-6">
712
+ <button class="flex justify-between items-center w-full text-left font-bold text-lg text-gray-800">
713
+ <span>Posso visitar a fazenda e ver meu gado?</span>
714
+ <i class="fas fa-chevron-down text-amber-700"></i>
715
+ </button>
716
+ <div class="mt-4 text-gray-600">
717
+ <p>Sim! Investidores das cotas Premium e Empresarial têm direito a visitas agendadas. Para cotas Básicas, oferecemos visitas coletivas periódicas. Todas as visitas são acompanhadas por nosso time técnico que explica todo o processo de engorda.</p>
718
+ </div>
719
+ </div>
720
+ <div class="mb-6 border-b border-gray-200 pb-6">
721
+ <button class="flex justify-between items-center w-full text-left font-bold text-lg text-gray-800">
722
+ <span>Como é feita a identificação dos animais?</span>
723
+ <i class="fas fa-chevron-down text-amber-700"></i>
724
+ </button>
725
+ <div class="mt-4 text-gray-600">
726
+ <p>Utilizamos brincos eletrônicos com identificação única para cada animal, permitindo rastreamento individualizado. Além disso, mantemos registro fotográfico atualizado e sistema de geolocalização dos lotes.</p>
727
+ </div>
728
+ </div>
729
+ <div class="mb-6">
730
+ <button class="flex justify-between items-center w-full text-left font-bold text-lg text-gray-800">
731
+ <span>Qual a procedência dos animais?</span>
732
+ <i class="fas fa-chevron-down text-amber-700"></i>
733
+ </button>
734
+ <div class="mt-4 text-gray-600">
735
+ <p>Todos nossos animais são adquiridos de criatórios certificados, com comprovada genética Nelore. Exigimos atestado de vacinação completo e realizamos quarentena e exames complementares antes de incorporar novos lotes ao nosso sistema.</p>
736
+ </div>
737
+ </div>
738
+ </div>
739
+ </div>
740
+ </section>
741
+
742
+ <!-- CTA Section -->
743
+ <section class="py-20 bg-amber-700 text-white">
744
+ <div class="container mx-auto px-4 text-center">
745
+ <h2 class="text-3xl md:text-4xl font-bold mb-6">Pronto para Investir em Gado Nelore?</h2>
746
+ <p class="text-xl mb-8 max-w-3xl mx-auto">Preencha o formulário abaixo e nossa equipe entrará em contato para explicar todos os detalhes.</p>
747
+ <a href="#invest" class="bg-white py-3 px-8 rounded-full text-amber-700 font-bold text-lg inline-block">Simular Investimento</a>
748
+ </div>
749
+ </section>
750
+
751
+ <!-- Contact Section -->
752
+ <section id="contact" class="py-20 bg-white">
753
+ <div class="container mx-auto px-4">
754
+ <div class="flex flex-col md:flex-row">
755
+ <div class="md:w-1/2 mb-10 md:mb-0 md:pr-10">
756
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-6">Entre em Contato</h2>
757
+ <p class="text-lg text-gray-600 mb-8">Nossa equipe está pronta para esclarecer todas suas dúvidas sobre investimento em gado de corte.</p>
758
+ <div class="space-y-6">
759
+ <div class="flex items-start">
760
+ <div class="text-amber-700 text-xl mr-4 mt-1">
761
+ <i class="fas fa-map-marker-alt"></i>
762
+ </div>
763
+ <div>
764
+ <h4 class="font-bold text-gray-800">Endereço</h4>
765
+ <p class="text-gray-600">Fazenda Bull Partners, Zona Rural, Barretos/SP</p>
766
+ </div>
767
+ </div>
768
+ <div class="flex items-start">
769
+ <div class="text-amber-700 text-xl mr-4 mt-1">
770
+ <i class="fas fa-phone-alt"></i>
771
+ </div>
772
+ <div>
773
+ <h4 class="font-bold text-gray-800">Telefone</h4>
774
+ <p class="text-gray-600">(17) 3321-4567</p>
775
+ </div>
776
+ </div>
777
+ <div class="flex items-start">
778
+ <div class="text-amber-700 text-xl mr-4 mt-1">
779
+ <i class="fas fa-envelope"></i>
780
+ </div>
781
+ <div>
782
+ <h4 class="font-bold text-gray-800">Email</h4>
783
+ <p class="text-gray-600">[email protected]</p>
784
+ </div>
785
+ </div>
786
+ <div class="flex items-start">
787
+ <div class="text-amber-700 text-xl mr-4 mt-1">
788
+ <i class="fas fa-clock"></i>
789
+ </div>
790
+ <div>
791
+ <h4 class="font-bold text-gray-800">Horário de Atendimento</h4>
792
+ <p class="text-gray-600">Segunda a Sexta, das 8h às 18h</p>
793
+ </div>
794
+ </div>
795
+ </div>
796
+ <div class="mt-10">
797
+ <h4 class="font-bold text-gray-800 mb-4">Siga-nos nas Redes Sociais</h4>
798
+ <div class="flex space-x-4">
799
+ <a href="#" class="bg-gray-100 text-amber-700 w-10 h-10 rounded-full flex items-center justify-center hover:bg-amber-700 hover:text-white transition">
800
+ <i class="fab fa-facebook-f"></i>
801
+ </a>
802
+ <a href="#" class="bg-gray-100 text-amber-700 w-10 h-10 rounded-full flex items-center justify-center hover:bg-amber-700 hover:text-white transition">
803
+ <i class="fab fa-instagram"></i>
804
+ </a>
805
+ <a href="#" class="bg-gray-100 text-amber-700 w-10 h-10 rounded-full flex items-center justify-center hover:bg-amber-700 hover:text-white transition">
806
+ <i class="fab fa-youtube"></i>
807
+ </a>
808
+ <a href="#" class="bg-gray-100 text-amber-700 w-10 h-10 rounded-full flex items-center justify-center hover:bg-amber-700 hover:text-white transition">
809
+ <i class="fab fa-linkedin-in"></i>
810
+ </a>
811
+ </div>
812
+ </div>
813
+ </div>
814
+ <div class="md:w-1/2">
815
+ <form class="bg-gray-50 p-8 rounded-lg shadow-md">
816
+ <div class="mb-6">
817
+ <label for="contact-name" class="block text-gray-700 font-medium mb-2">Nome Completo</label>
818
+ <input type="text" id="contact-name" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-700 focus:border-transparent" required>
819
+ </div>
820
+ <div class="mb-6">
821
+ <label for="contact-email" class="block text-gray-700 font-medium mb-2">Email</label>
822
+ <input type="email" id="contact-email" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-700 focus:border-transparent" required>
823
+ </div>
824
+ <div class="mb-6">
825
+ <label for="contact-phone" class="block text-gray-700 font-medium mb-2">Telefone</label>
826
+ <input type="tel" id="contact-phone" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-700 focus:border-transparent" required>
827
+ </div>
828
+ <div class="mb-6">
829
+ <label for="contact-subject" class="block text-gray-700 font-medium mb-2">Assunto</label>
830
+ <select id="contact-subject" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-700 focus:border-transparent">
831
+ <option value="">Selecione um assunto</option>
832
+ <option value="investment">Informações sobre investimento</option>
833
+ <option value="visit">Agendamento de visita</option>
834
+ <option value="partnership">Parcerias comerciais</option>
835
+ <option value="other">Outros</option>
836
+ </select>
837
+ </div>
838
+ <div class="mb-6">
839
+ <label for="contact-message" class="block text-gray-700 font-medium mb-2">Mensagem</label>
840
+ <textarea id="contact-message" rows="4" class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-700 focus:border-transparent"></textarea>
841
+ </div>
842
+ <button type="submit" class="btn-primary w-full py-3 px-6 rounded-full text-white font-bold text-lg">Enviar Mensagem</button>
843
+ </form>
844
+ </div>
845
+ </div>
846
+ </div>
847
+ </section>
848
+
849
+ <!-- Footer -->
850
+ <footer class="bg-gray-900 text-white py-12">
851
+ <div class="container mx-auto px-4">
852
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
853
+ <div>
854
+ <div class="flex items-center mb-4">
855
+ <i class="fas fa-cow text-2xl text-amber-700 mr-2"></i>
856
+ <h3 class="text-xl font-bold">Bull<span class="text-amber-700">Partners</span></h3>
857
+ </div>
858
+ <p class="text-gray-400">Especialistas em engorda de gado Nelore e investimentos pecuários seguros.</p>
859
+ </div>
860
+ <div>
861
+ <h4 class="text-lg font-bold mb-4">Links Rápidos</h4>
862
+ <ul class="space-y-2">
863
+ <li><a href="#home" class="text-gray-400 hover:text-amber-700">Início</a></li>
864
+ <li><a href="#about" class="text-gray-400 hover:text-amber-700">Sobre Nós</a></li>
865
+ <li><a href="#invest" class="text-gray-400 hover:text-amber-700">Investir</a></li>
866
+ <li><a href="#results" class="text-gray-400 hover:text-amber-700">Resultados</a></li>
867
+ <li><a href="#contact" class="text-gray-400 hover:text-amber-700">Contato</a></li>
868
+ </ul>
869
+ </div>
870
+ <div>
871
+ <h4 class="text-lg font-bold mb-4">Investimento</h4>
872
+ <ul class="space-y-2">
873
+ <li><a href="#" class="text-gray-400 hover:text-amber-700">Cota Individual</a></li>
874
+ <li><a href="#" class="text-gray-400 hover:text-amber-700">Cota em Lote</a></li>
875
+ <li><a href="#" class="text-gray-400 hover:text-amber-700">Cota Empresarial</a></li>
876
+ <li><a href="#" class="text-gray-400 hover:text-amber-700">Perguntas Frequentes</a></li>
877
+ <li><a href="#" class="text-gray-400 hover:text-amber-700">Termos e Condições</a></li>
878
+ </ul>
879
+ </div>
880
+ <div>
881
+ <h4 class="text-lg font-bold mb-4">Newsletter</h4>
882
+ <p class="text-gray-400 mb-4">Assine nossa newsletter para receber novidades e oportunidades.</p>
883
+ <form class="flex">
884
+ <input type="email" placeholder="Seu email" class="px-4 py-2 rounded-l-lg focus:outline-none text-gray-900 w-full">
885
+ <button type="submit" class="bg-amber-700 px-4 py-2 rounded-r-lg hover:bg-amber-800">
886
+ <i class="fas fa-paper-plane"></i>
887
+ </button>
888
+ </form>
889
+ </div>
890
+ </div>
891
+ <div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
892
+ <p class="text-gray-400 mb-4 md:mb-0">© 2023 Bull Partners. Todos os direitos reservados.</p>
893
+ <div class="flex space-x-6">
894
+ <a href="#" class="text-gray-400 hover:text-amber-700"><i class="fab fa-facebook-f"></i></a>
895
+ <a href="#" class="text-gray-400 hover:text-amber-700"><i class="fab fa-instagram"></i></a>
896
+ <a href="#" class="text-gray-400 hover:text-amber-700"><i class="fab fa-youtube"></i></a>
897
+ <a href="#" class="text-gray-400 hover:text-amber-700"><i class="fab fa-linkedin-in"></i></a>
898
+ </div>
899
+ </div>
900
+ </div>
901
+ </footer>
902
+
903
+ <script>
904
+ // Form steps functionality
905
+ let currentStep = 1;
906
+ const totalSteps = 4;
907
+
908
+ function showStep(step) {
909
+ document.querySelectorAll('.form-step').forEach(el => {
910
+ el.classList.add('hidden');
911
+ el.classList.remove('active');
912
+ });
913
+
914
+ document.getElementById(`step-${step}`).classList.remove('hidden');
915
+ document.getElementById(`step-${step}`).classList.add('active');
916
+
917
+ // Update progress bar
918
+ const progressPercentage = (step / totalSteps) * 100;
919
+ document.getElementById('form-progress').style.width = `${progressPercentage}%`;
920
+ document.getElementById('current-step').textContent = step;
921
+
922
+ // Update review section if on last step
923
+ if(step === 4) {
924
+ updateReviewSection();
925
+ }
926
+ }
927
+
928
+ function nextStep() {
929
+ if(currentStep < totalSteps) {
930
+ currentStep++;
931
+ showStep(currentStep);
932
+ }
933
+ }
934
+
935
+ function prevStep() {
936
+ if(currentStep > 1) {
937
+ currentStep--;
938
+ showStep(currentStep);
939
+ }
940
+ }
941
+
942
+ function submitForm() {
943
+ // Here you would normally submit the form to your backend
944
+ // For demo purposes, we'll just show the success message
945
+ document.getElementById('step-4').classList.add('hidden');
946
+ document.getElementById('success-message').classList.remove('hidden');
947
+ }
948
+
949
+ // Investment type selection
950
+ document.querySelectorAll('input[name="investment-type"]').forEach(radio => {
951
+ radio.addEventListener('change', function() {
952
+ document.querySelectorAll('.investment-options').forEach(el => {
953
+ el.classList.add('hidden');
954
+ });
955
+
956
+ document.getElementById(`${this.value}-options`).classList.remove('hidden');
957
+ });
958
+ });
959
+
960
+ // Update review section with form data
961
+ function updateReviewSection() {
962
+ // Get selected investment type
963
+ const selectedType = document.querySelector('input[name="investment-type"]:checked').value;
964
+ let typeText = '';
965
+
966
+ if(selectedType === 'basic') typeText = 'Cota Individual';
967
+ else if(selectedType === 'premium') typeText = 'Cota em Lote';
968
+ else typeText = 'Cota Empresarial';
969
+
970
+ document.getElementById('review-type').textContent = typeText;
971
+
972
+ // Get selected amount
973
+ const selectedAmount = document.querySelector('input[name="investment-amount"]:checked').value;
974
+ document.getElementById('review-amount').textContent = `R$ ${Number(selectedAmount).toLocaleString('pt-BR')}`;
975
+
976
+ // Calculate animals based on amount
977
+ let animals = 0;
978
+ if(selectedType === 'basic') animals = selectedAmount / 5000;
979
+ else if(selectedType === 'premium') animals = selectedAmount / 4000;
980
+ else animals = selectedAmount / 4000;
981
+
982
+ document.getElementById('review-animals').textContent = Math.round(animals);
983
+
984
+ // Calculate estimated return (22% for demo purposes)
985
+ const estimatedReturn = selectedAmount * 1.22;
986
+ document.getElementById('review-return').textContent = `R$ ${Math.round(estimatedReturn).toLocaleString('pt-BR')}`;
987
+
988
+ // Get personal info
989
+ document.getElementById('review-name').textContent = document.getElementById('name').value || '-';
990
+ document.getElementById('review-email').textContent = document.getElementById('email').value || '-';
991
+ document.getElementById('review-phone').textContent = document.getElementById('phone').value || '-';
992
+ document.getElementById('review-cpf').textContent = document.getElementById('cpf').value || '-';
993
+ }
994
+
995
+ // FAQ toggle functionality
996
+ document.querySelectorAll('#faq button').forEach(button => {
997
+ button.addEventListener('click', () => {
998
+ const content = button.nextElementSibling;
999
+ const icon = button.querySelector('i');
1000
+
1001
+ if(content.style.maxHeight) {
1002
+ content.style.maxHeight = null;
1003
+ icon.classList.remove('fa-chevron-up');
1004
+ icon.classList.add('fa-chevron-down');
1005
+ } else {
1006
+ content.style.maxHeight = content.scrollHeight + 'px';
1007
+ icon.classList.remove('fa-chevron-down');
1008
+ icon.classList.add('fa-chevron-up');
1009
+ }
1010
+ });
1011
+ });
1012
+
1013
+ // Smooth scrolling for anchor links
1014
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
1015
+ anchor.addEventListener('click', function (e) {
1016
+ e.preventDefault();
1017
+
1018
+ document.querySelector(this.getAttribute('href')).scrollIntoView({
1019
+ behavior: 'smooth'
1020
+ });
1021
+ });
1022
+ });
1023
+ </script>
1024
+ <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=antocarloss/testeweb-bp" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
1025
+ </html>
prompts.txt ADDED
File without changes