diff --git a/frontend/pages/employees/index.vue b/frontend/pages/employees/index.vue
index a1a6d0b..951cf65 100644
--- a/frontend/pages/employees/index.vue
+++ b/frontend/pages/employees/index.vue
@@ -27,14 +27,14 @@
       Aucun employé pour le moment.
     </div>
 
-    <div v-else class="grid grid-cols-4 gap-8 lg:[grid-template-columns:repeat(auto-fit,328px)]">
+    <div v-else class="grid gap-8 [grid-template-columns:repeat(auto-fill,minmax(260px,1fr))]">
       <NuxtLink
         v-for="employee in filteredEmployees"
         :key="employee.id"
         :to="`/employees/${employee.id}`"
         target="_blank"
         rel="noopener noreferrer"
-        class="group relative h-[328px] w-[328px] overflow-hidden rounded-lg bg-tertiary-500 p-4 transition-all duration-200 hover:shadow-md"
+        class="group relative min-h-[328px] overflow-hidden rounded-lg bg-tertiary-500 p-4 transition-all duration-200 hover:shadow-md"
       >
         <div class="flex flex-col items-center gap-7 transition-opacity duration-200 group-hover:opacity-0">
           <div class="rounded-full bg-neutral-300 h-[175px] w-[175px]"></div>
@@ -218,7 +218,7 @@ const contracts = ref<Contract[]>([])
 const employeeFilter = ref('')
 const selectedSiteIds = ref<number[]>([])
 
-const filteredEmployees = computed(() => {
+const filteredEmployees = computed<Employee[]>(() => {
   if (selectedSiteIds.value.length === 0) return []
 
   const filter = employeeFilter.value.trim().toLowerCase()