diff --git a/app/assets/img/energy_sobriety/chemin.png b/app/assets/img/energy_sobriety/chemin.png
deleted file mode 100644
index 61347569..00000000
Binary files a/app/assets/img/energy_sobriety/chemin.png and /dev/null differ
diff --git a/app/assets/img/energy_sobriety/collegue.png b/app/assets/img/energy_sobriety/collegue.png
deleted file mode 100644
index a51bd6b7..00000000
Binary files a/app/assets/img/energy_sobriety/collegue.png and /dev/null differ
diff --git a/app/assets/img/energy_sobriety/derniere.png b/app/assets/img/energy_sobriety/derniere.png
deleted file mode 100644
index 7cb4ad86..00000000
Binary files a/app/assets/img/energy_sobriety/derniere.png and /dev/null differ
diff --git a/app/assets/img/energy_sobriety/etincelle.png b/app/assets/img/energy_sobriety/etincelle.png
deleted file mode 100644
index 08d537dc..00000000
Binary files a/app/assets/img/energy_sobriety/etincelle.png and /dev/null differ
diff --git a/app/assets/img/energy_sobriety/geste.png b/app/assets/img/energy_sobriety/geste.png
deleted file mode 100644
index 567523f2..00000000
Binary files a/app/assets/img/energy_sobriety/geste.png and /dev/null differ
diff --git a/app/assets/img/energy_sobriety/lampadaire.png b/app/assets/img/energy_sobriety/lampadaire.png
deleted file mode 100644
index ae3f160b..00000000
Binary files a/app/assets/img/energy_sobriety/lampadaire.png and /dev/null differ
diff --git a/app/assets/img/energy_sobriety/salon.png b/app/assets/img/energy_sobriety/salon.png
deleted file mode 100644
index aed878d5..00000000
Binary files a/app/assets/img/energy_sobriety/salon.png and /dev/null differ
diff --git a/app/assets/img/energy_sobriety/sobene.png b/app/assets/img/energy_sobriety/sobene.png
deleted file mode 100644
index 55c81eb1..00000000
Binary files a/app/assets/img/energy_sobriety/sobene.png and /dev/null differ
diff --git a/app/assets/img/energy_sobriety/socle.png b/app/assets/img/energy_sobriety/socle.png
deleted file mode 100644
index 258b59af..00000000
Binary files a/app/assets/img/energy_sobriety/socle.png and /dev/null differ
diff --git a/app/assets/img/energy_sobriety/vert.png b/app/assets/img/energy_sobriety/vert.png
deleted file mode 100644
index 528bec9a..00000000
Binary files a/app/assets/img/energy_sobriety/vert.png and /dev/null differ
diff --git a/app/assets/img/energy_sobriety/ying_yang.png b/app/assets/img/energy_sobriety/ying_yang.png
deleted file mode 100644
index 63818f9e..00000000
Binary files a/app/assets/img/energy_sobriety/ying_yang.png and /dev/null differ
diff --git a/app/components/Carousel.vue b/app/components/Carousel.vue
deleted file mode 100644
index 3ed6ae89..00000000
--- a/app/components/Carousel.vue
+++ /dev/null
@@ -1,89 +0,0 @@
-<script setup>
-// oxlint-disable-next-line import/no-unassigned-import
-import "vue3-carousel/dist/carousel.css";
-import { Carousel, Navigation, Pagination, Slide } from "vue3-carousel";
-import { useDisplay } from "vuetify";
-
-const NB_ITEMS_TO_DISPLAY = 3;
-
-const { items } = defineProps({
-  items: { type: Array, required: true },
-});
-
-const { name } = useDisplay();
-const nb_items_to_display = ref(NB_ITEMS_TO_DISPLAY);
-watch(
-  name,
-  (value) => {
-    switch (value) {
-      case "xs": {
-        nb_items_to_display.value = 1;
-        break;
-      }
-      case "sm": {
-        nb_items_to_display.value = 2;
-        break;
-      }
-      default: {
-        nb_items_to_display.value = 3;
-        break;
-      }
-    }
-  },
-  {
-    immediate: true,
-  },
-);
-
-const carrousel_settings = reactive({
-  autoplay: 2000,
-  itemsToShow: nb_items_to_display.value,
-  itemsToScroll: 1,
-  pauseAutoplayOnHover: true,
-  transition: 1000,
-  wrapAround: true,
-});
-</script>
-
-<template>
-  <ClientOnly>
-    <Carousel :settings="carrousel_settings">
-      <Slide v-for="(item, index) in items" :key="index" class="carousel__slide">
-        <a :href="item.url" target="_blank">
-          <img :src="item.logo" class="carousel__item" />
-        </a>
-      </Slide>
-      <template #addons>
-        <Navigation />
-        <Pagination />
-      </template>
-    </Carousel>
-  </ClientOnly>
-</template>
-
-<style scoped>
-.carousel__item {
-  min-height: 200px;
-  width: 100%;
-  background-color: var(--vc-clr-white);
-  color: var(--vc-clr-white);
-  font-size: 20px;
-  border-radius: 10px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-.carousel__slide {
-  display: flex;
-  padding: 15px;
-  align-items: center;
-  justify-content: center;
-}
-
-.carousel__prev,
-.carousel__next {
-  box-sizing: content-box;
-  border: 5px solid red;
-}
-</style>
diff --git a/app/components/Launcher.vue b/app/components/Launcher.vue
index 4d63e7f5..e8838390 100644
--- a/app/components/Launcher.vue
+++ b/app/components/Launcher.vue
@@ -4,6 +4,13 @@ import Recaptcha from "@ogw_front/components/Recaptcha";
 import { Status } from "@ogw_front/utils/status";
 import { useInfraStore } from "@ogw_front/stores/infra";
 
+const { logo } = defineProps({
+  logo: {
+    type: String,
+    required: true,
+  },
+});
+
 const infraStore = useInfraStore();
 
 watch(
@@ -29,7 +36,7 @@ watch(
         <Recaptcha :button_color="'secondary'" />
       </v-col>
       <v-col v-else-if="infraStore.status == Status.CREATING">
-        <Loading />
+        <Loading :logo="logo" />
       </v-col>
     </v-row>
   </v-container>
diff --git a/app/components/Loading.vue b/app/components/Loading.vue
index 6df97945..bc1aeebf 100644
--- a/app/components/Loading.vue
+++ b/app/components/Loading.vue
@@ -1,82 +1,49 @@
 <script setup>
-import chemin from "@ogw_front/assets/img/energy_sobriety/chemin.png";
-import collegue from "@ogw_front/assets/img/energy_sobriety/collegue.png";
-import derniere from "@ogw_front/assets/img/energy_sobriety/derniere.png";
-import etincelle from "@ogw_front/assets/img/energy_sobriety/etincelle.png";
-import geste from "@ogw_front/assets/img/energy_sobriety/geste.png";
-import lampadaire from "@ogw_front/assets/img/energy_sobriety/lampadaire.png";
-import salon from "@ogw_front/assets/img/energy_sobriety/salon.png";
-import sobene from "@ogw_front/assets/img/energy_sobriety/sobene.png";
-import socle from "@ogw_front/assets/img/energy_sobriety/socle.png";
-import vert from "@ogw_front/assets/img/energy_sobriety/vert.png";
-import ying_yang from "@ogw_front/assets/img/energy_sobriety/ying_yang.png";
+const { logo } = defineProps({
+  logo: {
+    type: String,
+    required: true,
+  },
+});
 
-import Carousel from "@ogw_front/components/Carousel";
+const show = ref(false);
+const progress = ref(0);
 
-const users_list = [
-  {
-    name: "YING YANG",
-    logo: ying_yang,
-  },
-  {
-    name: "CHEMIN",
-    logo: chemin,
-  },
-  {
-    name: "SOBRIETE ENERGETIQUE",
-    logo: sobene,
-  },
-  {
-    name: "VERT",
-    logo: vert,
-  },
-  {
-    name: "LAMPADAIRE",
-    logo: lampadaire,
-  },
-  {
-    name: "COLLEGUE",
-    logo: collegue,
-  },
-  {
-    name: "ETINCELLE",
-    logo: etincelle,
-  },
-  {
-    name: "GESTE",
-    logo: geste,
-  },
-  {
-    name: "SOCLE",
-    logo: socle,
-  },
-  {
-    name: "DERNIERE",
-    logo: derniere,
-  },
-  {
-    name: "SALON",
-    logo: salon,
-  },
-];
+onMounted(() => {
+  show.value = true;
+});
 </script>
 
 <template>
-  <v-row justify="center">
-    <v-col cols="12" class="ma-3">
-      <v-card loading>
-        <v-card-title class="text-center"> Microservices are starting... </v-card-title>
-        <v-card-subtitle class="text-center"> Why do you have to wait? </v-card-subtitle>
-        <v-card-text class="text-center">
-          We start our microservices only on demand... and this takes a few minutes before you can
-          use our free app.
-          <br />
-          This is aligned with our energy sobriety policy. So be patient
-          <v-icon color="primary" size="20"> mdi-emoticon-excited-outline </v-icon>
-          <br />
-          <Carousel :items="users_list" />
-        </v-card-text>
-      </v-card>
-    </v-col>
-  </v-row>
+  <v-overlay
+    v-model="show"
+    persistent
+    class="align-center justify-center"
+    style="background: rgba(5, 5, 5, 0.1); backdrop-filter: blur(8px)"
+  >
+    <v-sheet
+      position="fixed"
+      location="center"
+      height="100vh"
+      width="100vw"
+      color="transparent"
+      class="bg-grid-pattern"
+      style="z-index: -1"
+    />
+
+    <v-container class="text-center" style="max-width: 650px">
+      <LoadingHeader :logo="logo" />
+      <LoadingEcoMessages />
+      <LoadingProgress :progress="progress" />
+      <LoadingFooter />
+    </v-container>
+  </v-overlay>
 </template>
+
+<style scoped>
+.bg-grid-pattern {
+  background-image: radial-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 0);
+  background-size: 40px 40px;
+  background-position: center;
+}
+</style>
diff --git a/app/components/Loading/EcoMessages.vue b/app/components/Loading/EcoMessages.vue
new file mode 100644
index 00000000..c6a5fd79
--- /dev/null
+++ b/app/components/Loading/EcoMessages.vue
@@ -0,0 +1,76 @@
+<script setup>
+const ecoMessages = [
+  {
+    icon: "mdi-leaf",
+    title: "Why the wait?",
+    message: "Your workspace starts on demand, no idle servers running 24/7.",
+  },
+  {
+    icon: "mdi-lightning-bolt-outline",
+    title: "Lower carbon footprint",
+    message: "On-demand computing uses up to 70% less energy than always-on servers.",
+  },
+  {
+    icon: "mdi-earth",
+    title: "Your choice matters",
+    message: "By using Vease, you're part of a more sustainable way to work with data.",
+  },
+];
+
+const currentMessage = ref(0);
+let interval = null;
+
+onMounted(() => {
+  interval = setInterval(() => {
+    currentMessage.value = (currentMessage.value + 1) % ecoMessages.length;
+  }, 3000);
+});
+
+onUnmounted(() => {
+  clearInterval(interval);
+});
+</script>
+
+<template>
+  <v-sheet color="transparent" height="160" class="position-relative overflow-visible mb-4">
+    <v-scroll-y-reverse-transition mode="out-in">
+      <v-card
+        :key="currentMessage"
+        rounded="lg"
+        class="pa-6 border mx-auto"
+        color="rgba(255, 255, 255, 0.05)"
+        elevation="0"
+        style="border-color: rgba(255, 255, 255, 0.1) !important"
+      >
+        <v-card-title
+          class="d-flex align-center ga-3 pa-0 mb-3 text-subtitle-1 font-weight-bold text-white text-wrap"
+        >
+          <v-icon
+            :icon="ecoMessages[currentMessage].icon"
+            color="white"
+            size="22"
+            style="filter: drop-shadow(0 0 6px rgba(var(--v-theme-primary), 0.6))"
+          />
+          {{ ecoMessages[currentMessage].title }}
+        </v-card-title>
+        <v-card-text
+          class="pa-0 text-body-2 text-white text-left"
+          style="opacity: 0.85; line-height: 1.7"
+        >
+          {{ ecoMessages[currentMessage].message }}
+        </v-card-text>
+      </v-card>
+    </v-scroll-y-reverse-transition>
+
+    <v-row justify="center" class="ga-3 mt-6">
+      <v-icon
+        v-for="(_, index) in ecoMessages"
+        :key="index"
+        size="10"
+        :color="index <= currentMessage ? 'white' : 'white'"
+        :icon="index === currentMessage ? 'mdi-circle' : 'mdi-circle-outline'"
+        :style="{ opacity: index <= currentMessage ? 1 : 0.25 }"
+      />
+    </v-row>
+  </v-sheet>
+</template>
diff --git a/app/components/Loading/Footer.vue b/app/components/Loading/Footer.vue
new file mode 100644
index 00000000..7ae3553f
--- /dev/null
+++ b/app/components/Loading/Footer.vue
@@ -0,0 +1,13 @@
+<template>
+  <v-card
+    color="transparent"
+    elevation="0"
+    class="mt-8 d-flex align-center justify-center ga-2 text-white"
+    style="opacity: 0.6; letter-spacing: 0.08em"
+  >
+    <v-icon icon="mdi-leaf" size="14" />
+    <v-card-text class="pa-0 text-caption font-weight-medium" style="flex: none">
+      On-demand infrastructure greener by design
+    </v-card-text>
+  </v-card>
+</template>
diff --git a/app/components/Loading/Header.vue b/app/components/Loading/Header.vue
new file mode 100644
index 00000000..8edee063
--- /dev/null
+++ b/app/components/Loading/Header.vue
@@ -0,0 +1,41 @@
+<script setup>
+const { logo } = defineProps({
+  logo: {
+    type: String,
+    required: true,
+  },
+});
+</script>
+
+<template>
+  <v-row justify="center" class="mb-8">
+    <v-img
+      :src="logo"
+      height="180"
+      width="180"
+      style="filter: drop-shadow(0 0 20px rgba(var(--v-theme-primary), 0.4))"
+    />
+  </v-row>
+
+  <v-card color="transparent" elevation="0" class="mb-8 overflow-visible">
+    <v-card-title
+      class="text-h2 font-weight-black text-white text-wrap pa-0 d-block"
+      style="text-shadow: 0 0 20px rgba(255, 255, 255, 0.3)"
+    >
+      STARTING UP
+    </v-card-title>
+    <v-divider thickness="3" class="border-opacity-100 mx-auto my-4" color="primary" width="60" />
+    <v-card-subtitle
+      class="text-subtitle-2 font-weight-bold text-white ls-widest pa-0 text-wrap"
+      style="opacity: 0.9"
+    >
+      YOUR WORKSPACE IS WAKING UP...
+    </v-card-subtitle>
+  </v-card>
+</template>
+
+<style scoped>
+.ls-widest {
+  letter-spacing: 0.6em !important;
+}
+</style>
diff --git a/app/components/Loading/Progress.vue b/app/components/Loading/Progress.vue
new file mode 100644
index 00000000..ed345f75
--- /dev/null
+++ b/app/components/Loading/Progress.vue
@@ -0,0 +1,43 @@
+<script setup>
+const { progress } = defineProps({
+  progress: {
+    type: Number,
+    required: true,
+  },
+});
+</script>
+
+<template>
+  <v-sheet color="transparent" class="position-relative overflow-visible pt-8">
+    <v-progress-linear
+      indeterminate
+      :model-value="progress"
+      color="white"
+      height="8"
+      rounded
+      style="background: rgba(255, 255, 255, 0.1)"
+    >
+      <template v-slot:default="{ value }">
+        <v-sheet
+          color="transparent"
+          class="d-flex justify-end position-absolute h-100"
+          :style="{
+            width: value + '%',
+            left: 0,
+            transition: 'width 0.15s linear',
+          }"
+        >
+          <v-chip
+            color="white"
+            size="small"
+            variant="flat"
+            class="position-absolute font-weight-black"
+            style="top: -40px; right: -20px; box-shadow: 0 0 12px rgba(var(--v-theme-primary), 0.6)"
+          >
+            {{ Math.round(value) }}%
+          </v-chip>
+        </v-sheet>
+      </template>
+    </v-progress-linear>
+  </v-sheet>
+</template>
diff --git a/package.json b/package.json
index ab6faabd..dd35b64c 100644
--- a/package.json
+++ b/package.json
@@ -60,7 +60,6 @@
     "sass": "1.87.0",
     "semver": "7.7.1",
     "uuid": "11.1.0",
-    "vue3-carousel": "0.3.4",
     "vuetify": "3.10.11",
     "vuetify-nuxt-module": "0.18.7",
     "ws": "8.18.3",