diff --git a/components/landing-page/agent.tsx b/components/landing-page/agent.tsx
index 46086e1..c3d8354 100644
--- a/components/landing-page/agent.tsx
+++ b/components/landing-page/agent.tsx
@@ -37,7 +37,7 @@ export default function Agent() {
               new Date(b.created_at).getTime() -
               new Date(a.created_at).getTime(),
           ) // ✅ newest first
-          .slice(0, 5); // ✅ max 5
+          .slice(0, 3); // ✅ max 5
 
         setAgents(latestApprovedAgents);
       } catch (error) {
@@ -60,7 +60,7 @@ export default function Agent() {
         Our Teams
       </motion.h2>
 
-      <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-4 gap-2 place-items-center mt-10">
+      <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-2 place-items-center mt-10">
         {agents.map((agent, index) => (
           <motion.div
             key={agent.id}
@@ -86,7 +86,7 @@ export default function Agent() {
             <h3 className="text-lg text-gray-900 text-center">{agent.name}</h3>
 
             <p className="text-sm text-gray-600 text-center mt-1">
-              {agent.job_title}
+              {agent.job_title}Cihampelas Bandung
             </p>
           </motion.div>
         ))}
diff --git a/components/landing-page/best-agent.tsx b/components/landing-page/best-agent.tsx
index e2eace4..fb416e9 100644
--- a/components/landing-page/best-agent.tsx
+++ b/components/landing-page/best-agent.tsx
@@ -37,7 +37,7 @@ export default function BestAgent() {
               new Date(b.created_at).getTime() -
               new Date(a.created_at).getTime(),
           ) // ✅ newest first
-          .slice(0, 5); // ✅ max 5
+          .slice(0, 3); // ✅ max 5
 
         setAgents(latestApprovedAgents);
       } catch (error) {
@@ -60,7 +60,7 @@ export default function BestAgent() {
         Our Teams
       </motion.h2>
 
-      <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-4 gap-2 place-items-center mt-10">
+      <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-2 place-items-center mt-10">
         {agents.map((agent, index) => (
           <motion.div
             key={agent.id}
diff --git a/service/http-config/axios-base-instance.ts b/service/http-config/axios-base-instance.ts
index 31005c0..703fb0e 100644
--- a/service/http-config/axios-base-instance.ts
+++ b/service/http-config/axios-base-instance.ts
@@ -4,7 +4,7 @@ import axios from "axios";
 const baseURL =
   process.env.NEXT_PUBLIC_API_BASE_URL || "https://jaecoocihampelasbdg.com/api";
 const clientKey =
-  process.env.NEXT_PUBLIC_CLIENT_KEY || "bb65b1ad-e954-4a1a-b4d0-74df5bb0b640";
+  process.env.NEXT_PUBLIC_CLIENT_KEY || "92387f2e-d45f-49e0-b663-66e5d2878d00";
 
 const axiosBaseInstance = axios.create({
   baseURL,
diff --git a/service/http-config/axios-interceptor-instance.ts b/service/http-config/axios-interceptor-instance.ts
index b80ca9f..8a76be9 100644
--- a/service/http-config/axios-interceptor-instance.ts
+++ b/service/http-config/axios-interceptor-instance.ts
@@ -6,7 +6,7 @@ import Cookies from "js-cookie";
 const baseURL =
   process.env.NEXT_PUBLIC_API_BASE_URL || "https://jaecoocihampelasbdg.com/api";
 const clientKey =
-  process.env.NEXT_PUBLIC_CLIENT_KEY || "bb65b1ad-e954-4a1a-b4d0-74df5bb0b640";
+  process.env.NEXT_PUBLIC_CLIENT_KEY || "92387f2e-d45f-49e0-b663-66e5d2878d00";
 
 const refreshToken = Cookies.get("refresh_token");
 
diff --git a/service/http-config/http-base-services.ts b/service/http-config/http-base-services.ts
index 755d158..ade0c63 100644
--- a/service/http-config/http-base-services.ts
+++ b/service/http-config/http-base-services.ts
@@ -2,11 +2,11 @@ import axiosBaseInstance from "./axios-base-instance";
 
 const defaultHeaders = {
   "Content-Type": "application/json",
-  "X-Client-Key": "bb65b1ad-e954-4a1a-b4d0-74df5bb0b640"
+  "X-Client-Key": "92387f2e-d45f-49e0-b663-66e5d2878d00",
 };
 
-export async function httpGet(pathUrl: any, headers?: any) {  
-  console.log("X-HEADERS : ", defaultHeaders)
+export async function httpGet(pathUrl: any, headers?: any) {
+  console.log("X-HEADERS : ", defaultHeaders);
   const mergedHeaders = {
     ...defaultHeaders,
     ...headers,
diff --git a/service/http-config/http-interceptor-services.ts b/service/http-config/http-interceptor-services.ts
index 4d33d96..4c3c229 100644
--- a/service/http-config/http-interceptor-services.ts
+++ b/service/http-config/http-interceptor-services.ts
@@ -5,11 +5,11 @@ import { getCsrfToken } from "../master-user";
 
 const defaultHeaders = {
   "Content-Type": "application/json",
-  "X-Client-Key": "bb65b1ad-e954-4a1a-b4d0-74df5bb0b640"
+  "X-Client-Key": "92387f2e-d45f-49e0-b663-66e5d2878d00",
 };
 
 export async function httpGetInterceptor(pathUrl: any) {
-  console.log("X-HEADERS : ", defaultHeaders)
+  console.log("X-HEADERS : ", defaultHeaders);
   const response = await axiosInterceptorInstance
     .get(pathUrl, { headers: defaultHeaders })
     .catch((error) => error.response);
@@ -35,7 +35,11 @@ export async function httpGetInterceptor(pathUrl: any) {
   }
 }
 
-export async function httpPostInterceptor(pathUrl: any, data: any, headers?: any) {
+export async function httpPostInterceptor(
+  pathUrl: any,
+  data: any,
+  headers?: any,
+) {
   const resCsrf = await getCsrfToken();
   const csrfToken = resCsrf?.data?.csrf_token;
 
@@ -67,7 +71,11 @@ export async function httpPostInterceptor(pathUrl: any, data: any, headers?: any
   }
 }
 
-export async function httpPutInterceptor(pathUrl: any, data: any, headers?: any) {
+export async function httpPutInterceptor(
+  pathUrl: any,
+  data: any,
+  headers?: any,
+) {
   const resCsrf = await getCsrfToken();
   const csrfToken = resCsrf?.data?.csrf_token;
 
@@ -99,7 +107,7 @@ export async function httpPutInterceptor(pathUrl: any, data: any, headers?: any)
 }
 
 export async function httpDeleteInterceptor(pathUrl: any, headers?: any) {
-   const resCsrf = await getCsrfToken();
+  const resCsrf = await getCsrfToken();
   const csrfToken = resCsrf?.data?.csrf_token;
 
   const mergedHeaders = {