diff --git a/nextjs-app/components/SchoolDetailView.module.css b/nextjs-app/components/SchoolDetailView.module.css
index 359084c..8367523 100644
--- a/nextjs-app/components/SchoolDetailView.module.css
+++ b/nextjs-app/components/SchoolDetailView.module.css
@@ -801,21 +801,29 @@
   flex: 0 0 auto;
 }
 
-.heroStatNumber {
+.heroStatNumber,
+.heroStatNumberSerif {
   font-family: var(--font-playfair), 'Playfair Display', serif;
-  font-size: clamp(2rem, 4vw, 2.75rem);
   font-weight: 700;
   line-height: 1;
   color: var(--text-primary, #1a1612);
+  /* Fixed height so every stat's label row sits at the same Y, regardless
+     of whether the content is a short numeral or a longer word. Each
+     stat's content is bottom-aligned within this box. */
+  min-height: clamp(2rem, 4vw, 2.75rem);
+  display: flex;
+  align-items: flex-end;
+}
+
+.heroStatNumber {
+  font-size: clamp(2rem, 4vw, 2.75rem);
   font-variant-numeric: tabular-nums;
 }
 
 .heroStatNumberSerif {
-  font-family: var(--font-playfair), 'Playfair Display', serif;
-  font-size: clamp(1.5rem, 3vw, 2rem);
-  font-weight: 700;
-  line-height: 1.1;
-  color: var(--text-primary, #1a1612);
+  /* Slightly smaller so long words like "Requires Improvement" still fit,
+     but aligned on the same bottom baseline as the numeric stats. */
+  font-size: clamp(1.75rem, 3.5vw, 2.25rem);
 }
 
 .heroStatNumberSerif.tone-teal,