diff --git a/apps/site/components/Common/Breadcrumbs/BreadcrumbItem/index.module.css b/apps/site/components/Common/Breadcrumbs/BreadcrumbItem/index.module.css
index 47f767b5c7e73..8edfa1fb194b1 100644
--- a/apps/site/components/Common/Breadcrumbs/BreadcrumbItem/index.module.css
+++ b/apps/site/components/Common/Breadcrumbs/BreadcrumbItem/index.module.css
@@ -1,9 +1,15 @@
 .item {
   @apply flex
-    items-center
-    gap-5
-    text-sm
-    font-medium;
+     max-w-fit
+     items-center
+     gap-5
+     truncate
+     text-sm
+     font-medium;
+
+  &:last-child {
+    @apply w-full;
+  }
 
   a {
     @apply flex-shrink
@@ -23,6 +29,7 @@
 
   .separator {
     @apply size-4
+      max-w-fit
       flex-shrink-0
       flex-grow
       text-neutral-600
diff --git a/apps/site/components/Common/Breadcrumbs/BreadcrumbLink/index.module.css b/apps/site/components/Common/Breadcrumbs/BreadcrumbLink/index.module.css
index d82fa364b5b8f..b23a220ff8147 100644
--- a/apps/site/components/Common/Breadcrumbs/BreadcrumbLink/index.module.css
+++ b/apps/site/components/Common/Breadcrumbs/BreadcrumbLink/index.module.css
@@ -1,4 +1,7 @@
 .link {
+  @apply max-w-fit 
+    truncate;
+
   &.active {
     @apply rounded
       bg-green-600
diff --git a/apps/site/components/Common/Breadcrumbs/BreadcrumbRoot/index.module.css b/apps/site/components/Common/Breadcrumbs/BreadcrumbRoot/index.module.css
index 55bedbeb24394..a0d9c35c8a58c 100644
--- a/apps/site/components/Common/Breadcrumbs/BreadcrumbRoot/index.module.css
+++ b/apps/site/components/Common/Breadcrumbs/BreadcrumbRoot/index.module.css
@@ -1,5 +1,6 @@
 .list {
   @apply flex
-    items-center
-    gap-5;
+    w-full
+    gap-5
+    px-6;
 }