diff --git a/nextjs-app/components/SchoolDetailView.module.css b/nextjs-app/components/SchoolDetailView.module.css
index aefeeaf..359084c 100644
--- a/nextjs-app/components/SchoolDetailView.module.css
+++ b/nextjs-app/components/SchoolDetailView.module.css
@@ -728,8 +728,7 @@
 }
 
 .heroChip {
-  min-width: 180px;
-  flex: 0 1 auto;
+  flex: 0 0 240px;
   padding: 0.75rem 1rem;
   border-radius: 8px;
   border-left: 3px solid var(--border-color, #e5dfd5);
@@ -743,19 +742,23 @@
 .heroChipTitle {
   font-size: 0.9375rem;
   font-weight: 700;
-  line-height: 1.25;
+  line-height: 1.3;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .heroChipSub {
   font-size: 0.75rem;
   color: var(--text-secondary, #5c564d);
-  line-height: 1.35;
+  line-height: 1.4;
 }
 
 .heroChipDetail {
   font-size: 0.75rem;
   font-weight: 600;
-  margin-top: 0.15rem;
+  line-height: 1.4;
+  margin-top: 0.1rem;
 }
 
 /* Hero tone scheme — independent of the .ofstedGrade{N} / .rcGrade{N} badges
@@ -844,7 +847,6 @@
   font-style: italic;
   line-height: 1.5;
   color: var(--text-primary, #1a1612);
-  max-width: 64ch;
 }
 
 .heroDataNote {