From 64d99c96310415bf5f8cd39ac5ea1ab9d46087a5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cl=C3=A9ment?= <clem.heritier@gmail.com>
Date: Tue, 16 Jun 2026 22:58:47 +0200
Subject: [PATCH] =?UTF-8?q?fix:=20Pricing=20dans=20index,=20liens=20navbar?=
 =?UTF-8?q?,=20h2=20About,=20plage=E2=86=92rivi=C3=A8re,=20grille=20Featur?=
 =?UTF-8?q?es=205=20cols?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/About.astro    |  24 +++++---
 src/components/Features.astro |   5 +-
 src/components/Food.astro     |   8 +--
 src/components/Footer.astro   |   2 +-
 src/components/Hero.astro     |   8 +--
 src/components/Navbar.astro   |   5 +-
 src/components/Pricing.astro  | 104 ++++++++++++++++++++++++++++++++++
 src/layouts/MainLayout.astro  |   2 +-
 src/pages/index.astro         |   2 +
 9 files changed, 137 insertions(+), 23 deletions(-)
 create mode 100644 src/components/Pricing.astro

diff --git a/src/components/About.astro b/src/components/About.astro
index e65ab58..6e070a7 100644
--- a/src/components/About.astro
+++ b/src/components/About.astro
@@ -15,30 +15,36 @@ import gallery1 from '../assets/images/gallery_1.jpg';
           Une maison vivante,<br/>entre rivière et forêt
         </h2>
         <p class="text-dark/70 leading-relaxed mb-4">
-          Ancienne demeure en pierre au bord de l'Allier, Cécile l'a faite à son image —
-          chaleureuse, vivante, entourée d'un grand jardin où il fait bon traîner.
+          Charmante maison de village surplombant l'Allier, Cécile l'a faite à son image :
+          chaleureuse, vivante, colorée.
+          Vous pouvez profiter de la terrasse abritée et du jardin, accueillant et verdoyant où il fait bon traîner.<br/>
+          Ses murs épais garantissent une fraîcheur bienvenue par grosses chaleurs.
           On y arrive parfois fatigué du sentier, on en repart ressourcé.
         </p>
         <p class="text-dark/70 leading-relaxed mb-8">
-          Pas une hôtellerie, pas un gîte comme les autres — plutôt une escale humaine,
+          Pas de l'hôtellerie, pas un gîte comme les autres... plutôt une escale humaine,
           dans une maison qui a une âme.
         </p>
         <ul class="space-y-3 list-none">
           <li class="flex items-center gap-3 text-dark/70">
             <span class="w-1.5 h-1.5 rounded-full bg-primary flex-shrink-0"></span>
-            Étape officielle du GR470 (étapes 6 &amp; 7)
-          </li>
-          <li class="flex items-center gap-3 text-dark/70">
-            <span class="w-1.5 h-1.5 rounded-full bg-primary flex-shrink-0"></span>
-            À 100m de l'Allier
+            À 100m de l'Allier · accès direct à la rivière
           </li>
           <li class="flex items-center gap-3 text-dark/70">
             <span class="w-1.5 h-1.5 rounded-full bg-primary flex-shrink-0"></span>
             Jardin, terrasse et coins de verdure
+          </li>   
+          <li class="flex items-center gap-3 text-dark/70">
+            <span class="w-1.5 h-1.5 rounded-full bg-primary flex-shrink-0"></span>
+            3 chambres · 1 dortoir 
+          </li>          
+          <li class="flex items-center gap-3 text-dark/70">
+            <span class="w-1.5 h-1.5 rounded-full bg-primary flex-shrink-0"></span>
+            Jusqu'à 9 personnes
           </li>
           <li class="flex items-center gap-3 text-dark/70">
             <span class="w-1.5 h-1.5 rounded-full bg-primary flex-shrink-0"></span>
-            3 chambres · petits groupes et couples bienvenus
+            Au format Gite ou chambre d'hôtes, selon vos envies 
           </li>
           <li class="flex items-center gap-3 text-dark/70">
             <span class="w-1.5 h-1.5 rounded-full bg-primary flex-shrink-0"></span>
diff --git a/src/components/Features.astro b/src/components/Features.astro
index 784e9ea..cd042e8 100644
--- a/src/components/Features.astro
+++ b/src/components/Features.astro
@@ -1,8 +1,9 @@
 ---
-import { Mountain, Waves, Bike, Fish } from 'lucide-astro';
+import { Mountain, Waves, Bike, Fish, Milestone } from 'lucide-astro';
 
 const features = [
   { icon: Mountain, label: 'GR470 · Étape officielle' },
+  { icon: Milestone, label: 'Via Allier · Vélo itinérant' },
   { icon: Waves,    label: 'Canoë & kayak' },
   { icon: Bike,     label: 'VTT & VTTAE' },
   { icon: Fish,     label: 'Pêche à la mouche' },
@@ -11,7 +12,7 @@ const features = [
 
 <section class="py-20 bg-dark">
   <div class="max-w-6xl mx-auto px-6">
-    <div class="grid grid-cols-2 md:grid-cols-4 gap-8 text-center">
+    <div class="grid grid-cols-2 md:grid-cols-5 gap-8 text-center">
       {features.map(({ icon: Icon, label }) => (
         <div class="flex flex-col items-center gap-4 text-white/60 group">
           <div class="w-14 h-14 flex items-center justify-center border border-white/20 group-hover:border-primary transition-colors">
diff --git a/src/components/Food.astro b/src/components/Food.astro
index a60b91e..2bf4db5 100644
--- a/src/components/Food.astro
+++ b/src/components/Food.astro
@@ -11,7 +11,7 @@ import facade from '../assets/images/facade.jpg';
       <div class="relative order-2 md:order-1">
         <Image
           src={facade}
-          alt="Le Moulin des Rives"
+          alt="La Maison de Cécile"
           class="w-full h-[500px] object-cover rounded-sm"
         />
         <div class="absolute -top-5 -right-5 w-40 h-40 border border-primary/25 -z-10"></div>
@@ -26,11 +26,11 @@ import facade from '../assets/images/facade.jpg';
           Cuisine du marché<br/>et du jardin
         </h2>
         <p class="text-dark/70 leading-relaxed mb-6">
-          Le matin, le petit-déjeuner est fait maison — pain, confitures,
-          fruits de saison, herbes du jardin. Rien d'Instagram, tout de bon.
+          Le matin, le copieux petit-déjeuner est fait maison — pain, yaourt , confitures,
+          fruits de saison, infusion du jardin. Rien d'Instagram, tout de bon.
         </p>
         <p class="text-dark/70 leading-relaxed mb-8">
-          Le soir, Cécile propose parfois un repas partagé selon ce qu'elle
+          Le soir, Cécile vous propose un repas partagé selon ce qu'elle
           a trouvé au marché ou cueillit dans les bois alentour.
           Simple, vivant, sincère.
         </p>
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index 4df979e..2a93a9e 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -1,6 +1,6 @@
 <footer class="bg-dark py-10">
   <div class="max-w-6xl mx-auto px-6 flex flex-col md:flex-row items-center justify-between gap-4">
-    <span class="font-serif text-xl text-white/70">Le Moulin des Rives</span>
+    <span class="font-serif text-xl text-white/70">La Maison de Cécile</span>
     <span class="text-white/30 text-sm">© 2026 · Tous droits réservés</span>
   </div>
 </footer>
\ No newline at end of file
diff --git a/src/components/Hero.astro b/src/components/Hero.astro
index 2e0b2e7..ab1ef9c 100644
--- a/src/components/Hero.astro
+++ b/src/components/Hero.astro
@@ -8,7 +8,7 @@ import facade from '../assets/images/facade.jpg';
   <div class="absolute inset-0">
     <Image
       src={facade}
-      alt="Maison d'hotes chez Cécile"
+      alt="La Maison de Cécile"
       class="w-full h-full object-cover"
       loading="eager"
     />
@@ -18,15 +18,15 @@ import facade from '../assets/images/facade.jpg';
   <!-- Contenu centré -->
   <div class="relative z-10 text-center text-white px-6 max-w-4xl mx-auto">
     <span class="block text-xs tracking-[0.4em] uppercase text-white/60 mb-6">
-      Gorges du Haut-Allier · Alleyras, Auvergne
+      Gite et Chambres d'hôtes · Gorges du Haut-Allier · Alleyras, Haute-Loire
     </span>
 
     <h1 class="font-serif text-7xl md:text-9xl font-light leading-none mb-6">
-      Le Moulin<br/>des Rives
+      La Maison de Cécile
     </h1>
 
     <p class="text-lg text-white/70 font-light mb-12 max-w-lg mx-auto">
-      Une halte authentique sur le GR470, à deux pas de l'Allier sauvage.
+      Une halte authentique sur le GR470 & la Via Allier, à deux pas de l'Allier sauvage.
     </p>
 
     <div class="flex flex-col sm:flex-row gap-4 justify-center">
diff --git a/src/components/Navbar.astro b/src/components/Navbar.astro
index 881aa02..5dfa781 100644
--- a/src/components/Navbar.astro
+++ b/src/components/Navbar.astro
@@ -1,7 +1,7 @@
 <header class="fixed top-0 left-0 right-0 z-50 bg-cream/95 backdrop-blur-sm border-b border-secondary/60">
   <div class="max-w-6xl mx-auto px-6 py-4 flex items-center justify-between">
     <a href="#" class="font-serif text-2xl text-dark tracking-wide">
-      Le Moulin des Rives
+      La Maison de Cécile
     </a>
 
     <nav class="hidden md:flex items-center gap-8">
@@ -9,8 +9,9 @@
       <a href="#gallery" class="text-xs tracking-[0.2em] uppercase text-dark/60 hover:text-primary transition-colors">Galerie</a>
       <a href="#food" class="text-xs tracking-[0.2em] uppercase text-dark/60 hover:text-primary transition-colors">La table</a>
       <a href="#location" class="text-xs tracking-[0.2em] uppercase text-dark/60 hover:text-primary transition-colors">Activités</a>
+      <a href="#pricing" class="text-xs tracking-[0.2em] uppercase text-dark/60 hover:text-primary transition-colors">Tarifs</a>
       <a href="#contact" class="text-xs tracking-[0.2em] uppercase bg-primary text-white px-6 py-2.5 hover:bg-primary/80 transition-colors">
-        Nous écrire
+        Me contacter
       </a>
     </nav>
   </div>
diff --git a/src/components/Pricing.astro b/src/components/Pricing.astro
new file mode 100644
index 0000000..dd92f2a
--- /dev/null
+++ b/src/components/Pricing.astro
@@ -0,0 +1,104 @@
+<section id="pricing" class="py-32 scroll-mt-20 bg-cream">
+  <div class="max-w-6xl mx-auto px-6">
+
+    <!-- En-tête -->
+    <div class="text-center mb-16">
+      <span class="block text-xs tracking-[0.3em] uppercase text-primary mb-5">
+        Les tarifs
+      </span>
+      <h2 class="font-serif text-5xl md:text-6xl font-light leading-tight mb-6">
+        Nos formules
+      </h2>
+      <p class="text-dark/60 max-w-xl mx-auto leading-relaxed">
+        La maison s'adapte à votre séjour — en gîte pour une privatisation complète,
+        ou en chambres d'hôtes pour une escale plus intime.
+      </p>
+    </div>
+
+    <!-- Deux colonnes -->
+    <div class="grid md:grid-cols-2 gap-8 mb-12">
+
+      <!-- Gîte -->
+      <div class="border border-secondary bg-white">
+        <div class="px-8 pt-8 pb-6 border-b border-secondary">
+          <span class="block text-xs tracking-[0.2em] uppercase text-primary mb-2">Location complète</span>
+          <h3 class="font-serif text-3xl font-light text-dark">Gîte</h3>
+          <p class="text-dark/50 text-sm mt-2">Privatisation de la maison entière · jusqu'à 9 personnes</p>
+        </div>
+        <div class="px-8 py-6">
+          <table class="w-full text-sm">
+            <thead>
+              <tr class="border-b border-secondary">
+                <th class="text-left font-normal text-dark/40 tracking-[0.15em] uppercase text-xs pb-3">Formule</th>
+                <th class="text-right font-normal text-dark/40 tracking-[0.15em] uppercase text-xs pb-3">Tarif / nuit</th>
+              </tr>
+            </thead>
+            <tbody class="divide-y divide-secondary/60">
+              <tr>
+                <td class="py-4 text-dark/80">Nuit seule</td>
+                <td class="py-4 text-right font-serif text-lg text-dark">— €</td>
+              </tr>
+              <tr>
+                <td class="py-4 text-dark/80">Avec petit-déjeuner</td>
+                <td class="py-4 text-right font-serif text-lg text-dark">— €</td>
+              </tr>
+              <tr>
+                <td class="py-4 text-dark/80">Avec dîner</td>
+                <td class="py-4 text-right font-serif text-lg text-dark">— €</td>
+              </tr>
+              <tr>
+                <td class="py-4 text-dark/80">Demi-pension <span class="text-dark/40 text-xs">(dîner + pdj)</span></td>
+                <td class="py-4 text-right font-serif text-lg text-dark">— €</td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
+
+      <!-- Chambre d'hôtes -->
+      <div class="border border-secondary bg-white">
+        <div class="px-8 pt-8 pb-6 border-b border-secondary">
+          <span class="block text-xs tracking-[0.2em] uppercase text-primary mb-2">Par chambre</span>
+          <h3 class="font-serif text-3xl font-light text-dark">Chambre d'hôtes</h3>
+          <p class="text-dark/50 text-sm mt-2">Chambre double ou dortoir · par nuit</p>
+        </div>
+        <div class="px-8 py-6">
+          <table class="w-full text-sm">
+            <thead>
+              <tr class="border-b border-secondary">
+                <th class="text-left font-normal text-dark/40 tracking-[0.15em] uppercase text-xs pb-3">Formule</th>
+                <th class="text-right font-normal text-dark/40 tracking-[0.15em] uppercase text-xs pb-3">Tarif / nuit</th>
+              </tr>
+            </thead>
+            <tbody class="divide-y divide-secondary/60">
+              <tr>
+                <td class="py-4 text-dark/80">Nuit seule</td>
+                <td class="py-4 text-right font-serif text-lg text-dark">— €</td>
+              </tr>
+              <tr>
+                <td class="py-4 text-dark/80">Avec petit-déjeuner</td>
+                <td class="py-4 text-right font-serif text-lg text-dark">— €</td>
+              </tr>
+              <tr>
+                <td class="py-4 text-dark/80">Avec dîner</td>
+                <td class="py-4 text-right font-serif text-lg text-dark">— €</td>
+              </tr>
+              <tr>
+                <td class="py-4 text-dark/80">Demi-pension <span class="text-dark/40 text-xs">(dîner + pdj)</span></td>
+                <td class="py-4 text-right font-serif text-lg text-dark">— €</td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
+
+    </div>
+
+    <!-- Note de bas de section -->
+    <p class="text-center text-dark/40 text-xs tracking-[0.2em] uppercase">
+      Tarifs indicatifs · nous contacter pour toute demande spécifique
+    </p>
+
+  </div>
+</section>
+
diff --git a/src/layouts/MainLayout.astro b/src/layouts/MainLayout.astro
index e14d0f9..9f85eca 100644
--- a/src/layouts/MainLayout.astro
+++ b/src/layouts/MainLayout.astro
@@ -6,7 +6,7 @@ interface Props {
 }
 
 const {
-  title = 'Le Moulin des Rives'
+  title = 'La Maison de Cécile'
 } = Astro.props;
 ---
 
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 9b460ba..1df0819 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -7,6 +7,7 @@ import About from '../components/About.astro';
 import Features from '../components/Features.astro';
 import Gallery from '../components/Gallery.astro';
 import Food from '../components/Food.astro';
+import Pricing from '../components/Pricing.astro';
 import Location from '../components/Location.astro';
 import Contact from '../components/Contact.astro';
 import Footer from '../components/Footer.astro';
@@ -21,6 +22,7 @@ import Footer from '../components/Footer.astro';
     <Features />
     <Gallery />
     <Food />
+    <Pricing />
     <Location />
     <Contact />
   </main>