Redesign accueil : grille 3 axes, hero fade/swipe, pages gestation et décision

- Hero : animation fade-in/fade-out + swipe (useTypewriter composable + TypewriterText)
- 3 axes : Autonomie numérique, économique, citoyenne (AxisBlock + AxisGrid)
- Pages gestation avec présentations (wishBounty, trustWallet, Cloud libre)
- Page /decision : plateforme Décision collective (lien Glibredecision)
- Bloc événement distinct en bas des axes
- Nav : Numérique / Économique / Citoyenne / Événement
- Dark theme éclairci (bg 7→10%, surface 12→14%)
- Suppression BookSection + GrateWizardTeaser (remplacés par AxisGrid)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

app/components/home/AxisGrid.vue

@@ -0,0 +1,145 @@
+<template>
+  <section class="section-padding">
+    <div class="container-content flex flex-col gap-16">
+      <UiScrollReveal>
+        <div id="numerique">
+          <HomeAxisBlock
+            v-if="axes?.numerique"
+            :title="axes.numerique.title"
+            :icon="axes.numerique.icon"
+            color="primary"
+            :items="axes.numerique.items"
+          />
+        </div>
+      </UiScrollReveal>
+
+      <UiScrollReveal :delay="100">
+        <div id="economique">
+          <HomeAxisBlock
+            v-if="axes?.economie"
+            :title="axes.economie.title"
+            :icon="axes.economie.icon"
+            color="accent"
+            :items="axes.economie.items"
+            @open-player="$emit('open-player')"
+            @open-pdf="$emit('open-pdf')"
+            @launch-gratewizard="launchGW"
+          />
+        </div>
+      </UiScrollReveal>
+
+      <UiScrollReveal :delay="200">
+        <div id="citoyenne">
+          <HomeAxisBlock
+            v-if="axes?.politique"
+            :title="axes.politique.title"
+            :icon="axes.politique.icon"
+            color="primary"
+            :items="axes.politique.items"
+          />
+        </div>
+      </UiScrollReveal>
+
+      <!-- Bloc Événement -->
+      <UiScrollReveal v-if="evenement" :delay="300">
+        <NuxtLink :to="evenement.to" class="event-block">
+          <div class="event-content">
+            <div class="event-icon">
+              <div class="i-lucide-calendar-heart h-7 w-7" />
+            </div>
+            <div>
+              <h2 class="font-display text-2xl font-bold text-white sm:text-3xl">
+                {{ evenement.title }}
+              </h2>
+              <p class="font-display text-xl text-white/70 sm:text-2xl">
+                {{ evenement.subtitle }}
+              </p>
+            </div>
+          </div>
+          <span v-if="evenement.gestation" class="event-badge">
+            <div class="i-lucide-flask-conical h-3.5 w-3.5" />
+            En gestation
+          </span>
+        </NuxtLink>
+      </UiScrollReveal>
+    </div>
+  </section>
+</template>
+
+<script setup lang="ts">
+defineEmits<{
+  'open-player': []
+  'open-pdf': []
+}>()
+
+const { data: content } = await usePageContent('home')
+const { launch } = useGrateWizard()
+
+const axes = computed(() => (content.value as any)?.axes)
+const evenement = computed(() => (content.value as any)?.evenement)
+
+function launchGW() {
+  launch()
+}
+</script>
+
+<style scoped>
+.event-block {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 1.5rem;
+  padding: 2rem 2.5rem;
+  border-radius: 1rem;
+  border: 2px solid hsl(var(--color-accent) / 0.25);
+  background: linear-gradient(135deg, hsl(var(--color-accent) / 0.08), hsl(var(--color-primary) / 0.04));
+  transition: border-color 0.3s, box-shadow 0.3s;
+  text-decoration: none;
+}
+
+.event-block:hover {
+  border-color: hsl(var(--color-accent) / 0.45);
+  box-shadow: 0 0 40px hsl(var(--color-accent) / 0.08);
+}
+
+.event-content {
+  display: flex;
+  align-items: center;
+  gap: 1.25rem;
+}
+
+.event-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 3.5rem;
+  height: 3.5rem;
+  border-radius: 0.75rem;
+  background: hsl(var(--color-accent) / 0.15);
+  color: hsl(var(--color-accent));
+  flex-shrink: 0;
+}
+
+.event-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.3rem;
+  padding: 0.25rem 0.75rem;
+  border-radius: 9999px;
+  background: hsl(var(--color-accent) / 0.12);
+  color: hsl(var(--color-accent));
+  font-size: 0.75rem;
+  font-weight: 500;
+  font-family: var(--font-mono);
+  white-space: nowrap;
+  flex-shrink: 0;
+}
+
+@media (max-width: 640px) {
+  .event-block {
+    flex-direction: column;
+    align-items: flex-start;
+    padding: 1.5rem;
+  }
+}
+</style>