diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml
index 342b1578..a01f6ba8 100644
--- a/.github/workflows/codeql.yml
+++ b/.github/workflows/codeql.yml
@@ -1,6 +1,8 @@
 name: CodeQL
 
 on:
+  push:
+    branches: [main]
   pull_request:
     branches: [main]
   schedule:
diff --git a/README.md b/README.md
index 4e82d32f..8e6853cf 100644
--- a/README.md
+++ b/README.md
@@ -34,10 +34,6 @@
 
 ## How it works
 
-<p align="center">
-  <img src="docs/src/assets/hero.png" alt="Cascade promotes one artifact through every environment" width="640">
-</p>
-
 The **manifest** (`.github/manifest.yaml`) is the single source of truth. It holds both the pipeline configuration and the live deployment state for every environment. You run `cascade generate-workflow` once; after that the generated workflows own their own execution.
 
 ```
diff --git a/docs/src/styles/cascade.css b/docs/src/styles/cascade.css
index e9ebd445..320cb670 100644
--- a/docs/src/styles/cascade.css
+++ b/docs/src/styles/cascade.css
@@ -66,6 +66,19 @@
   text-wrap: balance;
 }
 
+/* ---- Splash hero illustration: show the wide art in full ------------------ */
+/* Starlight forces the hero <Image> to 400x400 attrs, which boxes our wide
+   662x343 art into a square and clips it. Override to keep the natural aspect
+   ratio, contain the whole image, and cap its height. */
+.hero > img,
+.hero > .hero-html img {
+  object-fit: contain;
+  height: auto;
+  max-height: 320px;
+  width: auto;
+  max-width: 100%;
+}
+
 /* Tasteful teal marker on the active sidebar link. */
 .sidebar a[aria-current='page'] {
   border-inline-start-color: var(--cascade-teal);