diff --git a/.changeset/five-radios-laugh.md b/.changeset/five-radios-laugh.md
new file mode 100644
index 00000000000..2cf949c8eb3
--- /dev/null
+++ b/.changeset/five-radios-laugh.md
@@ -0,0 +1,5 @@
+---
+'@astrojs/starlight': patch
+---
+
+Fixes display of focus indicator around site title
diff --git a/packages/starlight/components/Header.astro b/packages/starlight/components/Header.astro
index fa87ce89570..5907a279550 100644
--- a/packages/starlight/components/Header.astro
+++ b/packages/starlight/components/Header.astro
@@ -39,14 +39,6 @@ const shouldRenderSearch =
 		height: 100%;
 	}
 
-	.title-wrapper {
-		/* Prevent long titles overflowing and covering the search and menu buttons on narrow viewports. */
-		overflow: clip;
-		/* Avoid clipping focus ring around link inside title wrapper. */
-		padding: 0.25rem;
-		margin: -0.25rem;
-	}
-
 	.right-group,
 	.social-icons {
 		gap: 1rem;
diff --git a/packages/starlight/components/SiteTitle.astro b/packages/starlight/components/SiteTitle.astro
index 2f4b829943e..a42a8ad03d0 100644
--- a/packages/starlight/components/SiteTitle.astro
+++ b/packages/starlight/components/SiteTitle.astro
@@ -29,7 +29,7 @@ const { siteTitle, siteTitleHref } = Astro.props;
 			</>
 		)
 	}
-	<span class:list={{ 'sr-only': config.logo?.replacesTitle }}>
+	<span class:list={[{ 'sr-only': config.logo?.replacesTitle }, 'site-title-text']}>
 		{siteTitle}
 	</span>
 </a>
@@ -43,6 +43,12 @@ const { siteTitle, siteTitleHref } = Astro.props;
 		color: var(--sl-color-text-accent);
 		text-decoration: none;
 		white-space: nowrap;
+		min-width: 0;
+	}
+	.site-title-text {
+		overflow: hidden;
+		text-overflow: ellipsis;
+		text-wrap: nowrap;
 	}
 	img {
 		height: calc(var(--sl-nav-height) - 2 * var(--sl-nav-pad-y));