Hugging Face's logo

Spaces:
Koffy23
/
renaissance-rurale
Running

App Files Community
Koffy23 commited on
Commit
db94628
·
verified ·
1 Parent(s): fc0d3c5

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +632 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Renaissance Rurale
3
- emoji: 🌖
4
- colorFrom: blue
5
- colorTo: gray
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: renaissance-rurale
3
+ emoji: 🐳
4
+ colorFrom: gray
5
+ colorTo: blue
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,632 @@
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="fr">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Renaissance Rurale - Revitalisation Agricole</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-slider {
11
+ height: 500px;
12
+ background-size: cover;
13
+ background-position: center;
14
+ transition: background-image 1s ease-in-out;
15
+ }
16
+ .region-card:hover {
17
+ transform: translateY(-5px);
18
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
19
+ }
20
+ .testimonial-card {
21
+ transition: all 0.3s ease;
22
+ }
23
+ .testimonial-card:hover {
24
+ transform: scale(1.03);
25
+ }
26
+ .dropdown:hover .dropdown-menu {
27
+ display: block;
28
+ }
29
+ @media (max-width: 768px) {
30
+ .hero-slider {
31
+ height: 350px;
32
+ }
33
+ }
34
+ </style>
35
+ </head>
36
+ <body class="font-sans bg-gray-50">
37
+ <!-- Header with National Logo -->
38
+ <header class="bg-white shadow-md">
39
+ <div class="container mx-auto px-4 py-3 flex justify-between items-center">
40
+ <div class="flex items-center">
41
+ <img src="https://upload.wikimedia.org/wikipedia/commons/f/fe/Flag_of_C%C3%B4te_d%27Ivoire.svg" alt="Logo République de Côte d'Ivoire" class="h-12 mr-3">
42
+ <h1 class="text-xl md:text-2xl font-bold text-green-800">Renaissance Rurale</h1>
43
+ </div>
44
+ <div class="hidden md:flex space-x-6">
45
+ <a href="#projet" class="text-gray-700 hover:text-green-600 font-medium">Le Projet</a>
46
+ <div class="dropdown relative">
47
+ <button class="text-gray-700 hover:text-green-600 font-medium flex items-center">
48
+ Régions <i class="fas fa-chevron-down ml-1 text-xs"></i>
49
+ </button>
50
+ <div class="dropdown-menu absolute hidden bg-white shadow-lg rounded mt-2 py-2 w-48 z-10">
51
+ <a href="#" class="block px-4 py-2 text-gray-700 hover:bg-green-50">Abidjan</a>
52
+ <a href="#" class="block px-4 py-2 text-gray-700 hover:bg-green-50">Yamoussoukro</a>
53
+ <a href="#" class="block px-4 py-2 text-gray-700 hover:bg-green-50">San Pedro</a>
54
+ <a href="#" class="block px-4 py-2 text-gray-700 hover:bg-green-50">Bouaké</a>
55
+ <a href="#" class="block px-4 py-2 text-gray-700 hover:bg-green-50">Daloa</a>
56
+ </div>
57
+ </div>
58
+ <a href="#biogaz" class="text-gray-700 hover:text-green-600 font-medium">Biogaz</a>
59
+ <a href="#galerie" class="text-gray-700 hover:text-green-600 font-medium">Galerie</a>
60
+ <a href="#contact" class="text-gray-700 hover:text-green-600 font-medium">Contact</a>
61
+ </div>
62
+ <button class="md:hidden text-gray-700">
63
+ <i class="fas fa-bars text-2xl"></i>
64
+ </button>
65
+ </div>
66
+ </header>
67
+
68
+ <!-- Hero Slider -->
69
+ <div class="hero-slider bg-green-100 flex items-center justify-center relative">
70
+ <div class="text-center px-4 z-10">
71
+ <h2 class="text-3xl md:text-5xl font-bold text-white bg-black bg-opacity-50 py-2 px-4 rounded">Renaissance Rurale</h2>
72
+ <p class="text-xl md:text-2xl mt-4 text-white bg-black bg-opacity-50 py-2 px-4 rounded">Relever la Côte d'Ivoire par ses jeunes et sa terre</p>
73
+ </div>
74
+ </div>
75
+
76
+ <!-- Project Introduction -->
77
+ <section id="projet" class="py-12 bg-white">
78
+ <div class="container mx-auto px-4">
79
+ <h2 class="text-3xl font-bold text-center text-green-800 mb-8">Le Projet Renaissance Rurale</h2>
80
+ <div class="grid md:grid-cols-3 gap-8">
81
+ <div class="bg-green-50 p-6 rounded-lg shadow">
82
+ <div class="text-green-600 text-4xl mb-4">
83
+ <i class="fas fa-bullseye"></i>
84
+ </div>
85
+ <h3 class="text-xl font-semibold mb-3">Vision</h3>
86
+ <p class="text-gray-700">Transformer l'agriculture ivoirienne en un système intégré et durable, créateur d'emplois pour les jeunes.</p>
87
+ </div>
88
+ <div class="bg-green-50 p-6 rounded-lg shadow">
89
+ <div class="text-green-600 text-4xl mb-4">
90
+ <i class="fas fa-tractor"></i>
91
+ </div>
92
+ <h3 class="text-xl font-semibold mb-3">Mission</h3>
93
+ <p class="text-gray-700">Moderniser les pratiques agricoles et d'élevage tout en développant la production d'énergie verte.</p>
94
+ </div>
95
+ <div class="bg-green-50 p-6 rounded-lg shadow">
96
+ <div class="text-green-600 text-4xl mb-4">
97
+ <i class="fas fa-users"></i>
98
+ </div>
99
+ <h3 class="text-xl font-semibold mb-3">Emploi des Jeunes</h3>
100
+ <p class="text-gray-700">Former et employer massivement les jeunes dans des fermes intégrées à travers tout le pays.</p>
101
+ </div>
102
+ </div>
103
+ </div>
104
+ </section>
105
+
106
+ <!-- Regions Section -->
107
+ <section class="py-12 bg-gray-50">
108
+ <div class="container mx-auto px-4">
109
+ <h2 class="text-3xl font-bold text-center text-green-800 mb-8">Nos Régions d'Intervention</h2>
110
+ <div class="grid sm:grid-cols-2 lg:grid-cols-3 gap-6">
111
+ <!-- Region Card 1 -->
112
+ <div class="region-card bg-white rounded-lg overflow-hidden shadow-md transition duration-300">
113
+ <img src="https://images.unsplash.com/photo-1545566239-0ec1b69fce6c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Région d'Abidjan" class="w-full h-48 object-cover">
114
+ <div class="p-6">
115
+ <h3 class="text-xl font-semibold mb-2">Abidjan</h3>
116
+ <p class="text-gray-600 mb-4">Spécialités: Cultures maraîchères, aviculture</p>
117
+ <div class="flex justify-between text-sm">
118
+ <span class="bg-green-100 text-green-800 px-2 py-1 rounded"><i class="fas fa-users mr-1"></i> 250 emplois</span>
119
+ <span class="bg-blue-100 text-blue-800 px-2 py-1 rounded"><i class="fas fa-bolt mr-1"></i> 5 digesteurs</span>
120
+ </div>
121
+ </div>
122
+ </div>
123
+
124
+ <!-- Region Card 2 -->
125
+ <div class="region-card bg-white rounded-lg overflow-hidden shadow-md transition duration-300">
126
+ <img src="https://images.unsplash.com/photo-1500380804539-4e1e8c1e7118?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Région de Yamoussoukro" class="w-full h-48 object-cover">
127
+ <div class="p-6">
128
+ <h3 class="text-xl font-semibold mb-2">Yamoussoukro</h3>
129
+ <p class="text-gray-600 mb-4">Spécialités: Riziculture, élevage bovin</p>
130
+ <div class="flex justify-between text-sm">
131
+ <span class="bg-green-100 text-green-800 px-2 py-1 rounded"><i class="fas fa-users mr-1"></i> 180 emplois</span>
132
+ <span class="bg-blue-100 text-blue-800 px-2 py-1 rounded"><i class="fas fa-bolt mr-1"></i> 3 digesteurs</span>
133
+ </div>
134
+ </div>
135
+ </div>
136
+
137
+ <!-- Region Card 3 -->
138
+ <div class="region-card bg-white rounded-lg overflow-hidden shadow-md transition duration-300">
139
+ <img src="https://images.unsplash.com/photo-1500382017258-82e9f4771a85?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Région de San Pedro" class="w-full h-48 object-cover">
140
+ <div class="p-6">
141
+ <h3 class="text-xl font-semibold mb-2">San Pedro</h3>
142
+ <p class="text-gray-600 mb-4">Spécialités: Cacao, cultures vivrières</p>
143
+ <div class="flex justify-between text-sm">
144
+ <span class="bg-green-100 text-green-800 px-2 py-1 rounded"><i class="fas fa-users mr-1"></i> 320 emplois</span>
145
+ <span class="bg-blue-100 text-blue-800 px-2 py-1 rounded"><i class="fas fa-bolt mr-1"></i> 7 digesteurs</span>
146
+ </div>
147
+ </div>
148
+ </div>
149
+ </div>
150
+ <div class="text-center mt-8">
151
+ <a href="#" class="inline-block bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-6 rounded-lg transition duration-300">
152
+ Voir toutes les régions <i class="fas fa-arrow-right ml-2"></i>
153
+ </a>
154
+ </div>
155
+ </div>
156
+ </section>
157
+
158
+ <!-- Biogaz Section -->
159
+ <section id="biogaz" class="py-12 bg-white">
160
+ <div class="container mx-auto px-4">
161
+ <h2 class="text-3xl font-bold text-center text-green-800 mb-8">Biogaz & Environnement</h2>
162
+ <div class="flex flex-col lg:flex-row items-center gap-8">
163
+ <div class="lg:w-1/2">
164
+ <img src="https://images.unsplash.com/photo-1635070041078-e363dbe005cb?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Digesteur de biogaz" class="w-full rounded-lg shadow-lg">
165
+ </div>
166
+ <div class="lg:w-1/2">
167
+ <h3 class="text-2xl font-semibold mb-4 text-green-700">Transformer les déchets en énergie</h3>
168
+ <p class="text-gray-700 mb-4">Nos digesteurs permettent de valoriser les déchets agricoles et d'élevage pour produire du biogaz, une énergie renouvelable.</p>
169
+ <ul class="space-y-3 mb-6">
170
+ <li class="flex items-start">
171
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
172
+ <span>Réduction des émissions de méthane</span>
173
+ </li>
174
+ <li class="flex items-start">
175
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
176
+ <span>Production d'engrais organique de qualité</span>
177
+ </li>
178
+ <li class="flex items-start">
179
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
180
+ <span>Énergie propre pour les communautés rurales</span>
181
+ </li>
182
+ </ul>
183
+ <div class="bg-blue-50 p-4 rounded-lg">
184
+ <h4 class="font-semibold text-blue-800 mb-2">Chiffres clés</h4>
185
+ <div class="grid grid-cols-2 gap-4">
186
+ <div>
187
+ <p class="text-3xl font-bold text-blue-600">15+</p>
188
+ <p class="text-sm text-gray-600">Digesteurs installés</p>
189
+ </div>
190
+ <div>
191
+ <p class="text-3xl font-bold text-blue-600">500+</p>
192
+ <p class="text-sm text-gray-600">Tonnes de déchets traités/mois</p>
193
+ </div>
194
+ </div>
195
+ </div>
196
+ </div>
197
+ </div>
198
+ </div>
199
+ </section>
200
+
201
+ <!-- Gallery Section -->
202
+ <section id="galerie" class="py-12 bg-gray-50">
203
+ <div class="container mx-auto px-4">
204
+ <h2 class="text-3xl font-bold text-center text-green-800 mb-8">Galerie Photos</h2>
205
+ <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
206
+ <div class="overflow-hidden rounded-lg shadow-md hover:shadow-xl transition duration-300">
207
+ <img src="https://images.unsplash.com/photo-1500382017258-82e9f4771a85?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Ferme intégrée" class="w-full h-48 object-cover hover:scale-105 transition duration-500">
208
+ </div>
209
+ <div class="overflow-hidden rounded-lg shadow-md hover:shadow-xl transition duration-300">
210
+ <img src="https://images.unsplash.com/photo-1545566239-0ec1b69fce6c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Jeunes agriculteurs" class="w-full h-48 object-cover hover:scale-105 transition duration-500">
211
+ </div>
212
+ <div class="overflow-hidden rounded-lg shadow-md hover:shadow-xl transition duration-300">
213
+ <img src="https://images.unsplash.com/photo-1635070041078-e363dbe005cb?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Digesteur biogaz" class="w-full h-48 object-cover hover:scale-105 transition duration-500">
214
+ </div>
215
+ <div class="overflow-hidden rounded-lg shadow-md hover:shadow-xl transition duration-300">
216
+ <img src="https://images.unsplash.com/photo-1500380804539-4e1e8c1e7118?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Production agricole" class="w-full h-48 object-cover hover:scale-105 transition duration-500">
217
+ </div>
218
+ <div class="overflow-hidden rounded-lg shadow-md hover:shadow-xl transition duration-300">
219
+ <img src="https://images.unsplash.com/photo-1560493676-04071c5f467b?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1374&q=80" alt="Formation des jeunes" class="w-full h-48 object-cover hover:scale-105 transition duration-500">
220
+ </div>
221
+ <div class="overflow-hidden rounded-lg shadow-md hover:shadow-xl transition duration-300">
222
+ <img src="https://images.unsplash.com/photo-1551650975-87deedd944c3?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1374&q=80" alt="Élevage intégré" class="w-full h-48 object-cover hover:scale-105 transition duration-500">
223
+ </div>
224
+ <div class="overflow-hidden rounded-lg shadow-md hover:shadow-xl transition duration-300">
225
+ <img src="https://images.unsplash.com/photo-1500380804539-4e1e8c1e7118?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Transformation locale" class="w-full h-48 object-cover hover:scale-105 transition duration-500">
226
+ </div>
227
+ <div class="overflow-hidden rounded-lg shadow-md hover:shadow-xl transition duration-300">
228
+ <img src="https://images.unsplash.com/photo-1560493676-04071c5f467b?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1374&q=80" alt="Communauté rurale" class="w-full h-48 object-cover hover:scale-105 transition duration-500">
229
+ </div>
230
+ </div>
231
+ <div class="text-center mt-8">
232
+ <a href="#" class="inline-block bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-6 rounded-lg transition duration-300">
233
+ Voir plus de photos <i class="fas fa-images ml-2"></i>
234
+ </a>
235
+ </div>
236
+ </div>
237
+ </section>
238
+
239
+ <!-- Testimonials Section -->
240
+ <section class="py-12 bg-white">
241
+ <div class="container mx-auto px-4">
242
+ <h2 class="text-3xl font-bold text-center text-green-800 mb-8">Témoignages de nos Jeunes Agriculteurs</h2>
243
+ <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
244
+ <!-- Testimonial 1 -->
245
+ <div class="testimonial-card bg-green-50 p-6 rounded-lg shadow-md">
246
+ <div class="flex items-center mb-4">
247
+ <img src="https://randomuser.me/api/portraits/women/32.jpg" alt="Aminata K." class="w-12 h-12 rounded-full object-cover mr-4">
248
+ <div>
249
+ <h4 class="font-semibold">Aminata K.</h4>
250
+ <p class="text-sm text-gray-600">Agricultrice, Région de Bouaké</p>
251
+ </div>
252
+ </div>
253
+ <p class="text-gray-700 italic">"Grâce à Renaissance Rurale, j'ai pu apprendre des techniques modernes d'agriculture et créer ma propre petite entreprise. Aujourd'hui, je suis autonome et je forme d'autres jeunes."</p>
254
+ <div class="mt-4 text-yellow-400">
255
+ <i class="fas fa-star"></i>
256
+ <i class="fas fa-star"></i>
257
+ <i class="fas fa-star"></i>
258
+ <i class="fas fa-star"></i>
259
+ <i class="fas fa-star"></i>
260
+ </div>
261
+ </div>
262
+
263
+ <!-- Testimonial 2 -->
264
+ <div class="testimonial-card bg-green-50 p-6 rounded-lg shadow-md">
265
+ <div class="flex items-center mb-4">
266
+ <img src="https://randomuser.me/api/portraits/men/45.jpg" alt="Koffi A." class="w-12 h-12 rounded-full object-cover mr-4">
267
+ <div>
268
+ <h4 class="font-semibold">Koffi A.</h4>
269
+ <p class="text-sm text-gray-600">Technicien biogaz, Région de Daloa</p>
270
+ </div>
271
+ </div>
272
+ <p class="text-gray-700 italic">"Je me suis spécialisé dans la maintenance des digesteurs. C'est une technologie d'avenir qui permet à notre village d'avoir de l'énergie propre tout en recyclant nos déchets."</p>
273
+ <div class="mt-4 text-yellow-400">
274
+ <i class="fas fa-star"></i>
275
+ <i class="fas fa-star"></i>
276
+ <i class="fas fa-star"></i>
277
+ <i class="fas fa-star"></i>
278
+ <i class="fas fa-star-half-alt"></i>
279
+ </div>
280
+ </div>
281
+
282
+ <!-- Testimonial 3 -->
283
+ <div class="testimonial-card bg-green-50 p-6 rounded-lg shadow-md">
284
+ <div class="flex items-center mb-4">
285
+ <img src="https://randomuser.me/api/portraits/women/65.jpg" alt="Fatou T." class="w-12 h-12 rounded-full object-cover mr-4">
286
+ <div>
287
+ <h4 class="font-semibold">Fatou T.</h4>
288
+ <p class="text-sm text-gray-600">Éleveuse, Région de Korhogo</p>
289
+ </div>
290
+ </div>
291
+ <p class="text-gray-700 italic">"Le projet m'a fourni des animaux de qualité et une formation en gestion. Aujourd'hui, mon élevage prospère et je peux envoyer mes enfants à l'école grâce à ce revenu stable."</p>
292
+ <div class="mt-4 text-yellow-400">
293
+ <i class="fas fa-star"></i>
294
+ <i class="fas fa-star"></i>
295
+ <i class="fas fa-star"></i>
296
+ <i class="fas fa-star"></i>
297
+ <i class="fas fa-star"></i>
298
+ </div>
299
+ </div>
300
+ </div>
301
+ </div>
302
+ </section>
303
+
304
+ <!-- Forms Section -->
305
+ <section class="py-12 bg-gray-50">
306
+ <div class="container mx-auto px-4">
307
+ <h2 class="text-3xl font-bold text-center text-green-800 mb-8">Nous Rejoindre</h2>
308
+ <div class="grid md:grid-cols-2 gap-8">
309
+ <!-- Candidature Form -->
310
+ <div class="bg-white p-6 rounded-lg shadow-md">
311
+ <h3 class="text-xl font-semibold mb-4 text-green-700">Candidature Jeune Agriculteur</h3>
312
+ <form>
313
+ <div class="mb-4">
314
+ <label for="name" class="block text-gray-700 mb-2">Nom complet</label>
315
+ <input type="text" id="name" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500">
316
+ </div>
317
+ <div class="mb-4">
318
+ <label for="email" class="block text-gray-700 mb-2">Email</label>
319
+ <input type="email" id="email" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500">
320
+ </div>
321
+ <div class="mb-4">
322
+ <label for="phone" class="block text-gray-700 mb-2">Téléphone</label>
323
+ <input type="tel" id="phone" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500">
324
+ </div>
325
+ <div class="mb-4">
326
+ <label for="region" class="block text-gray-700 mb-2">Région d'intérêt</label>
327
+ <select id="region" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500">
328
+ <option value="">Sélectionnez une région</option>
329
+ <option value="abidjan">Abidjan</option>
330
+ <option value="yamoussoukro">Yamoussoukro</option>
331
+ <option value="sanpedro">San Pedro</option>
332
+ <option value="bouake">Bouaké</option>
333
+ <option value="daloa">Daloa</option>
334
+ </select>
335
+ </div>
336
+ <div class="mb-4">
337
+ <label for="message" class="block text-gray-700 mb-2">Motivation</label>
338
+ <textarea id="message" rows="3" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500"></textarea>
339
+ </div>
340
+ <button type="submit" class="w-full bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-4 rounded-lg transition duration-300">
341
+ Envoyer ma candidature
342
+ </button>
343
+ </form>
344
+ </div>
345
+
346
+ <!-- Partenariat Form -->
347
+ <div class="bg-white p-6 rounded-lg shadow-md">
348
+ <h3 class="text-xl font-semibold mb-4 text-green-700">Demande de Partenariat</h3>
349
+ <form>
350
+ <div class="mb-4">
351
+ <label for="org-name" class="block text-gray-700 mb-2">Nom de l'organisation</label>
352
+ <input type="text" id="org-name" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500">
353
+ </div>
354
+ <div class="mb-4">
355
+ <label for="org-type" class="block text-gray-700 mb-2">Type d'organisation</label>
356
+ <select id="org-type" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500">
357
+ <option value="">Sélectionnez un type</option>
358
+ <option value="entreprise">Entreprise privée</option>
359
+ <option value="ong">ONG</option>
360
+ <option value="institution">Institution publique</option>
361
+ <option value="cooperative">Coopérative</option>
362
+ <option value="autre">Autre</option>
363
+ </select>
364
+ </div>
365
+ <div class="mb-4">
366
+ <label for="contact-person" class="block text-gray-700 mb-2">Personne de contact</label>
367
+ <input type="text" id="contact-person" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500">
368
+ </div>
369
+ <div class="mb-4">
370
+ <label for="partnership-type" class="block text-gray-700 mb-2">Type de partenariat envisagé</label>
371
+ <select id="partnership-type" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500">
372
+ <option value="">Sélectionnez un type</option>
373
+ <option value="financier">Appui financier</option>
374
+ <option value="technique">Appui technique</option>
375
+ <option value="formation">Formation</option>
376
+ <option value="equipement">Fourniture d'équipements</option>
377
+ <option value="autre">Autre</option>
378
+ </select>
379
+ </div>
380
+ <div class="mb-4">
381
+ <label for="partnership-details" class="block text-gray-700 mb-2">Détails de la proposition</label>
382
+ <textarea id="partnership-details" rows="3" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500"></textarea>
383
+ </div>
384
+ <button type="submit" class="w-full bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-lg transition duration-300">
385
+ Envoyer la demande
386
+ </button>
387
+ </form>
388
+ </div>
389
+ </div>
390
+ </div>
391
+ </section>
392
+
393
+ <!-- News Section -->
394
+ <section class="py-12 bg-white">
395
+ <div class="container mx-auto px-4">
396
+ <h2 class="text-3xl font-bold text-center text-green-800 mb-8">Actualités & Blog</h2>
397
+ <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
398
+ <!-- News 1 -->
399
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md hover:shadow-lg transition duration-300">
400
+ <img src="https://images.unsplash.com/photo-1551650975-87deedd944c3?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1374&q=80" alt="Nouvelle ferme" class="w-full h-48 object-cover">
401
+ <div class="p-6">
402
+ <span class="text-sm text-green-600">15 Juin 2023</span>
403
+ <h3 class="text-xl font-semibold my-2">Inauguration d'une nouvelle ferme intégrée à Man</h3>
404
+ <p class="text-gray-700 mb-4">La nouvelle ferme de Man accueillera 120 jeunes et produira du cacao, des cultures vivrières et du biogaz.</p>
405
+ <a href="#" class="text-green-600 font-medium hover:text-green-800">Lire la suite <i class="fas fa-arrow-right ml-1"></i></a>
406
+ </div>
407
+ </div>
408
+
409
+ <!-- News 2 -->
410
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md hover:shadow-lg transition duration-300">
411
+ <img src="https://images.unsplash.com/photo-1560493676-04071c5f467b?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1374&q=80" alt="Formation" class="w-full h-48 object-cover">
412
+ <div class="p-6">
413
+ <span class="text-sm text-green-600">2 Juin 2023</span>
414
+ <h3 class="text-xl font-semibold my-2">Session de formation en agriculture durable</h3>
415
+ <p class="text-gray-700 mb-4">45 jeunes ont bénéficié d'une formation intensive de 2 semaines sur les techniques agricoles modernes.</p>
416
+ <a href="#" class="text-green-600 font-medium hover:text-green-800">Lire la suite <i class="fas fa-arrow-right ml-1"></i></a>
417
+ </div>
418
+ </div>
419
+
420
+ <!-- News 3 -->
421
+ <div class="bg-gray-50 rounded-lg overflow-hidden shadow-md hover:shadow-lg transition duration-300">
422
+ <img src="https://images.unsplash.com/photo-1635070041078-e363dbe005cb?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Partenariat" class="w-full h-48 object-cover">
423
+ <div class="p-6">
424
+ <span class="text-sm text-green-600">20 Mai 2023</span>
425
+ <h3 class="text-xl font-semibold my-2">Partenariat avec une entreprise allemande</h3>
426
+ <p class="text-gray-700 mb-4">Un accord a été signé pour le financement de 10 nouveaux digesteurs dans les régions du nord.</p>
427
+ <a href="#" class="text-green-600 font-medium hover:text-green-800">Lire la suite <i class="fas fa-arrow-right ml-1"></i></a>
428
+ </div>
429
+ </div>
430
+ </div>
431
+ <div class="text-center mt-8">
432
+ <a href="#" class="inline-block bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-6 rounded-lg transition duration-300">
433
+ Voir toutes les actualités <i class="fas fa-newspaper ml-2"></i>
434
+ </a>
435
+ </div>
436
+ </div>
437
+ </section>
438
+
439
+ <!-- Contact Section -->
440
+ <section id="contact" class="py-12 bg-gray-50">
441
+ <div class="container mx-auto px-4">
442
+ <h2 class="text-3xl font-bold text-center text-green-800 mb-8">Contactez-nous</h2>
443
+ <div class="flex flex-col lg:flex-row gap-8">
444
+ <div class="lg:w-1/2">
445
+ <div class="bg-white p-6 rounded-lg shadow-md">
446
+ <h3 class="text-xl font-semibold mb-4 text-green-700">Envoyez-nous un message</h3>
447
+ <form>
448
+ <div class="mb-4">
449
+ <label for="contact-name" class="block text-gray-700 mb-2">Votre nom</label>
450
+ <input type="text" id="contact-name" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500">
451
+ </div>
452
+ <div class="mb-4">
453
+ <label for="contact-email" class="block text-gray-700 mb-2">Votre email</label>
454
+ <input type="email" id="contact-email" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500">
455
+ </div>
456
+ <div class="mb-4">
457
+ <label for="contact-subject" class="block text-gray-700 mb-2">Sujet</label>
458
+ <input type="text" id="contact-subject" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500">
459
+ </div>
460
+ <div class="mb-4">
461
+ <label for="contact-message" class="block text-gray-700 mb-2">Message</label>
462
+ <textarea id="contact-message" rows="4" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500"></textarea>
463
+ </div>
464
+ <button type="submit" class="w-full bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-4 rounded-lg transition duration-300">
465
+ Envoyer le message
466
+ </button>
467
+ </form>
468
+ </div>
469
+ </div>
470
+ <div class="lg:w-1/2">
471
+ <div class="bg-white p-6 rounded-lg shadow-md h-full">
472
+ <h3 class="text-xl font-semibold mb-4 text-green-700">Nos coordonnées</h3>
473
+ <div class="space-y-4">
474
+ <div class="flex items-start">
475
+ <div class="text-green-600 text-xl mr-4 mt-1">
476
+ <i class="fas fa-map-marker-alt"></i>
477
+ </div>
478
+ <div>
479
+ <h4 class="font-medium text-gray-800">Adresse</h4>
480
+ <p class="text-gray-600">Rue des Agriculteurs, Plateau<br>Abidjan, Côte d'Ivoire</p>
481
+ </div>
482
+ </div>
483
+ <div class="flex items-start">
484
+ <div class="text-green-600 text-xl mr-4 mt-1">
485
+ <i class="fas fa-phone-alt"></i>
486
+ </div>
487
+ <div>
488
+ <h4 class="font-medium text-gray-800">Téléphone</h4>
489
+ <p class="text-gray-600">+225 XX XX XX XX</p>
490
+ </div>
491
+ </div>
492
+ <div class="flex items-start">
493
+ <div class="text-green-600 text-xl mr-4 mt-1">
494
+ <i class="fas fa-envelope"></i>
495
+ </div>
496
+ <div>
497
+ <h4 class="font-medium text-gray-800">Email</h4>
498
+ <p class="text-gray-600">[email protected]</p>
499
+ </div>
500
+ </div>
501
+ <div class="flex items-start">
502
+ <div class="text-green-600 text-xl mr-4 mt-1">
503
+ <i class="fas fa-clock"></i>
504
+ </div>
505
+ <div>
506
+ <h4 class="font-medium text-gray-800">Heures d'ouverture</h4>
507
+ <p class="text-gray-600">Lundi - Vendredi: 8h - 17h<br>Samedi: 9h - 13h</p>
508
+ </div>
509
+ </div>
510
+ </div>
511
+ <div class="mt-8">
512
+ <h4 class="font-medium text-gray-800 mb-3">Suivez-nous sur les réseaux sociaux</h4>
513
+ <div class="flex space-x-4">
514
+ <a href="#" class="text-blue-600 hover:text-blue-800 text-2xl"><i class="fab fa-facebook"></i></a>
515
+ <a href="#" class="text-pink-600 hover:text-pink-800 text-2xl"><i class="fab fa-instagram"></i></a>
516
+ <a href="#" class="text-blue-400 hover:text-blue-600 text-2xl"><i class="fab fa-twitter"></i></a>
517
+ <a href="#" class="text-red-600 hover:text-red-800 text-2xl"><i class="fab fa-youtube"></i></a>
518
+ <a href="#" class="text-green-600 hover:text-green-800 text-2xl"><i class="fab fa-whatsapp"></i></a>
519
+ </div>
520
+ </div>
521
+ <div class="mt-6 h-48 rounded-lg overflow-hidden">
522
+ <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3970.786272315496!2d-4.008903924686341!3d5.320070394735195!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xfc1eb9ccc5e36c9%3A0x2a9bd0673a8a4f9a!2sPlateau%2C%20Abidjan!5e0!3m2!1sfr!2sci!4v1686756787895!5m2!1sfr!2sci" width="100%" height="100%" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
523
+ </div>
524
+ </div>
525
+ </div>
526
+ </div>
527
+ </div>
528
+ </section>
529
+
530
+ <!-- Footer -->
531
+ <footer class="bg-green-800 text-white py-8">
532
+ <div class="container mx-auto px-4">
533
+ <div class="grid md:grid-cols-4 gap-8">
534
+ <div>
535
+ <h3 class="text-xl font-semibold mb-4">Renaissance Rurale</h3>
536
+ <p class="mb-4">Un projet national de revitalisation agricole par région, avec un système intégré (agriculture, élevage, biogaz), favorisant l'emploi massif des jeunes.</p>
537
+ <img src="https://upload.wikimedia.org/wikipedia/commons/f/fe/Flag_of_C%C3%B4te_d%27Ivoire.svg" alt="Logo Côte d'Ivoire" class="h-10">
538
+ </div>
539
+ <div>
540
+ <h3 class="text-xl font-semibold mb-4">Liens rapides</h3>
541
+ <ul class="space-y-2">
542
+ <li><a href="#" class="hover:text-green-300">Accueil</a></li>
543
+ <li><a href="#projet" class="hover:text-green-300">Le Projet</a></li>
544
+ <li><a href="#" class="hover:text-green-300">Régions</a></li>
545
+ <li><a href="#biogaz" class="hover:text-green-300">Biogaz</a></li>
546
+ <li><a href="#galerie" class="hover:text-green-300">Galerie</a></li>
547
+ <li><a href="#contact" class="hover:text-green-300">Contact</a></li>
548
+ </ul>
549
+ </div>
550
+ <div>
551
+ <h3 class="text-xl font-semibold mb-4">Ressources</h3>
552
+ <ul class="space-y-2">
553
+ <li><a href="#" class="hover:text-green-300">Actualités</a></li>
554
+ <li><a href="#" class="hover:text-green-300">Témoignages</a></li>
555
+ <li><a href="#" class="hover:text-green-300">Documents</a></li>
556
+ <li><a href="#" class="hover:text-green-300">FAQ</a></li>
557
+ <li><a href="#" class="hover:text-green-300">Politique de confidentialité</a></li>
558
+ </ul>
559
+ </div>
560
+ <div>
561
+ <h3 class="text-xl font-semibold mb-4">Newsletter</h3>
562
+ <p class="mb-4">Abonnez-vous à notre newsletter pour recevoir les dernières actualités du projet.</p>
563
+ <form class="flex">
564
+ <input type="email" placeholder="Votre email" class="px-4 py-2 w-full rounded-l-lg text-gray-800 focus:outline-none">
565
+ <button type="submit" class="bg-green-600 hover:bg-green-700 px-4 py-2 rounded-r-lg">
566
+ <i class="fas fa-paper-plane"></i>
567
+ </button>
568
+ </form>
569
+ <div class="mt-4 flex space-x-4">
570
+ <a href="#" class="text-white hover:text-green-300 text-xl"><i class="fab fa-facebook"></i></a>
571
+ <a href="#" class="text-white hover:text-green-300 text-xl"><i class="fab fa-twitter"></i></a>
572
+ <a href="#" class="text-white hover:text-green-300 text-xl"><i class="fab fa-instagram"></i></a>
573
+ <a href="#" class="text-white hover:text-green-300 text-xl"><i class="fab fa-linkedin"></i></a>
574
+ </div>
575
+ </div>
576
+ </div>
577
+ <div class="border-t border-green-700 mt-8 pt-6 text-center">
578
+ <p>&copy; 2023 Renaissance Rurale. Tous droits réservés.</p>
579
+ </div>
580
+ </div>
581
+ </footer>
582
+
583
+ <script>
584
+ // Hero Slider Animation
585
+ const heroImages = [
586
+ 'https://images.unsplash.com/photo-1500382017258-82e9f4771a85?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80',
587
+ 'https://images.unsplash.com/photo-1545566239-0ec1b69fce6c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80',
588
+ 'https://images.unsplash.com/photo-1560493676-04071c5f467b?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1374&q=80'
589
+ ];
590
+
591
+ let currentImage = 0;
592
+ const heroSlider = document.querySelector('.hero-slider');
593
+
594
+ function changeHeroImage() {
595
+ currentImage = (currentImage + 1) % heroImages.length;
596
+ heroSlider.style.backgroundImage = `linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(${heroImages[currentImage]})`;
597
+ }
598
+
599
+ // Set initial image
600
+ heroSlider.style.backgroundImage = `linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(${heroImages[0]})`;
601
+
602
+ // Change image every 5 seconds
603
+ setInterval(changeHeroImage, 5000);
604
+
605
+ // Mobile menu toggle
606
+ const mobileMenuButton = document.querySelector('button.md\\:hidden');
607
+ const mobileMenu = document.querySelector('.md\\:hidden + .mobile-menu');
608
+
609
+ mobileMenuButton.addEventListener('click', () => {
610
+ // This would need to be expanded to show/hide a mobile menu
611
+ alert('Mobile menu would open here in a full implementation');
612
+ });
613
+
614
+ // Smooth scrolling for anchor links
615
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
616
+ anchor.addEventListener('click', function (e) {
617
+ e.preventDefault();
618
+
619
+ const targetId = this.getAttribute('href');
620
+ if (targetId === '#') return;
621
+
622
+ const targetElement = document.querySelector(targetId);
623
+ if (targetElement) {
624
+ targetElement.scrollIntoView({
625
+ behavior: 'smooth'
626
+ });
627
+ }
628
+ });
629
+ });
630
+ </script>
631
+ <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=Koffy23/renaissance-rurale" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
632
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ Cahier des charges – Site Web du projet Renaissance Rurale I. Présentation générale Nom du projet : Renaissance Rurale Objectif principal : Présenter un projet national de revitalisation agricole par région, avec un système intégré (agriculture, élevage, biogaz), et favoriser l’emploi massif des jeunes. Public cible : Institutions étatiques, investisseurs, partenaires techniques et financiers, jeunes en quête d’emploi, collectivités locales. --- II. Objectifs du site web 1. Expliquer la vision du projet Renaissance Rurale par région. 2. Montrer les composantes techniques : agriculture, élevage, biogaz, transformation locale. 3. Valoriser les jeunes employés par le projet. 4. Fournir des guides pratiques via des formulaires. 5. Inclure des photos de démonstration (fermes, digesteurs, cultures, produits). 6. Afficher l’appui ou l’accord de l’État avec le logo de la République sur la page d’accueil. --- III. Fonctionnalités principales A. Page d’accueil Logo officiel de la République de Côte d'Ivoire en haut à gauche. Slider ou bannière dynamique illustrant des fermes intégrées par région. Accroche : « Renaissance Rurale – Relever la Côte d’Ivoire par ses jeunes et sa terre. » B. Menus 1. Le projet : Vision, mission, contexte. Constat sur le vieillissement des agriculteurs. Objectifs à court, moyen et long terme. Emploi des jeunes par région. 2. Par région (10 régions clés dans un premier temps) : Spécialités agricoles et élevage. Maquettes ou plans de fermes intégrées. Digesteur et production de biogaz. Nombre d’emplois créés ou prévus. 3. Biogaz & environnement : Fonctionnement des digesteurs. Utilisation des déchets agricoles, fientes, boues, feuilles. Quantités de gaz estimées et usage. Compostage & valorisation du digestat. 4. Galerie photos & vidéos : Photos réelles ou illustratives de fermes intégrées. Témoignages de jeunes engagés. Infographies sur les rendements agricoles & bioénergie. 5. Formulaires de guide : Formulaire de candidature pour jeunes souhaitant intégrer une ferme. Formulaire de proposition de partenariat. Formulaire de demande d’information. 6. Actualités / Blog : Nouvelles des régions. Événements & conférences. Rapport d’avancement mensuel. 7. Contact : Coordonnées du porteur du projet. Liens vers les réseaux sociaux du projet. Intégration carte de localisation (Google Maps). --- IV. Exigences techniques Langage : HTML5, CSS3, JavaScript, PHP ou framework moderne (React, Laravel, Django). Base de données : MySQL ou PostgreSQL. Responsive Design : Compatible mobile/tablette. Sécurité : Formulaires protégés (captcha, validation). CMS recommandé : WordPress avec plugins avancés ou développement sur mesure. Multilingue : Français (obligatoire), anglais (optionnel). --- V. Hébergement & nom de domaine Nom de domaine à prévoir : renaissancerurale.ci Hébergement cloud (OVH, Hostinger, etc.). SSL obligatoire (https). --- VI. Délais & livrables Durée estimée : 45 jours. Livrables attendus : Maquette graphique validée. Développement du site. Intégration des contenus & visuels. Mise en ligne et test de fonctionnement. Manuel utilisateur (PDF ou web). ---