diff --git a/components/CategorySelectBox.vue b/components/CategorySelectBox.vue
index ff606a7..f7fa559 100644
--- a/components/CategorySelectBox.vue
+++ b/components/CategorySelectBox.vue
@@ -27,6 +27,7 @@ function onOptionSelected(value: string | number) {
     <div class="relative font-700 font-24px">
       <HeadlessListboxButton
         class="relative cursor-pointer py-6px px-14px text-left border-2px bg-app-white text-app-black text-xs sm:text-sm sm:leading-6"
+        :class="{ 'text-app-danger!': isOptionSelected?.value === 'sunset' }"
       >
         <span class="block truncate mr-8px font">{{ isOptionSelected?.label }} <span
           v-if="titleShowCount"
@@ -58,7 +59,7 @@ function onOptionSelected(value: string | number) {
           >
             <li
               class="w-full relative cursor-pointer select-none py-8px p-16px bg-app-black text-app-white"
-              :class="[active ? 'text-app-white' : 'text-app-white']"
+              :class="[active ? 'text-app-white' : 'text-app-white', { 'text-app-danger!': option.value === 'sunset' }]"
             >
               <span
                 class="block truncate"
diff --git a/composables/useData.ts b/composables/useData.ts
index a46f86b..63c8b4f 100644
--- a/composables/useData.ts
+++ b/composables/useData.ts
@@ -51,9 +51,9 @@ export const useData = defineStore('data', () => {
       const data = await $fetch<{
         categories: Category[]
         projects: Project[]
-        project_phase: { id: string, name: string }[]
-        asset_custody_type: { id: string, name: string }[]
-        sign_in_type_requirments: { id: string, name: string }[]
+        phases: { id: string, name: string }[]
+        custodys: { id: string, name: string }[]
+        requirements: { id: string, name: string }[]
         usecases: Usecase[]
         ecosystems: Ecosystem[]
         assets: Asset[]
@@ -73,9 +73,9 @@ export const useData = defineStore('data', () => {
       features.value = data.features
       ranks.value = data.ranks
 
-      projectPhase.value = data.project_phase?.map(p => ({ id: p.id.toLowerCase(), name: p.name }))
-      assetCustody.value = data.asset_custody_type.map(a => ({ id: a.id.toLowerCase(), name: a.name }))
-      signInRequirments.value = data.sign_in_type_requirments.map(s => ({ id: s.id.toLowerCase(), name: s.name }))
+      projectPhase.value = data.phases?.map(p => ({ id: p.id.toLowerCase(), name: p.name }))
+      assetCustody.value = data.custodys.map(a => ({ id: a.id.toLowerCase(), name: a.name }))
+      signInRequirments.value = data.requirements.map(s => ({ id: s.id.toLowerCase(), name: s.name }))
     }
     catch (e) {
       console.error(e)
@@ -129,7 +129,7 @@ export const useData = defineStore('data', () => {
         selectedCategoryId.value !== 'all' ? project.categories.includes(selectedCategoryId.value) : true,
       )
       .filter(project =>
-        selectedUsecaseId.value !== 'all' ? project.usecases?.map(u => u.toLowerCase()).includes(selectedUsecaseId.value.toLowerCase()) : true,
+        selectedUsecaseId.value !== 'all' ? selectedUsecaseId.value === 'sunset' ? project.sunset : project.usecases?.map(u => u.toLowerCase()).includes(selectedUsecaseId.value.toLowerCase()) : true,
       )
       .filter(project =>
         selectedEcosystemId.value !== 'all' ? project.ecosystem?.map(e => e.toLowerCase()).includes(selectedEcosystemId.value.toLowerCase()) : true,
@@ -204,7 +204,7 @@ export const useData = defineStore('data', () => {
       }
     }).sort((a, b) => b.projects.length - a.projects.length)
 
-    return groupedProjects
+    return groupedProjects.filter(group => group.projects.length > 0)
   })
 
   const filteredProjectsCount = computed(() => filteredProjects.value.length)