Fix displaying hero images over blurry image placeholder (#32806)

* Fix displaying hero images over blurry image placeholder

This change allows us to immediately display SSR images when they load, even if this occurs before JS load (or JS fails to load). Before, these images would be stuck behind the blurry image placeholder due to the z-index stacking.

* Fix any placeholder inside SSR amp-img

css/ampshared.css

@@ -357,6 +357,14 @@ amp-img:not(.i-amphtml-element)[i-amphtml-ssr] > img.i-amphtml-fill-content
   z-index: 1;
 }
 
+/* We reset the z-index of blurry image placeholders for images that are
+   rendered by the server and are not (yet) controlled by JS to speed up
+   display of the real image. This conveniently also fixes the display of
+   the image when JS fails to load. */
+amp-img.i-amphtml-ssr:not(.i-amphtml-element) > [placeholder] {
+  z-index: auto;
+}
+
 .i-amphtml-notbuilt > [placeholder] {
   display: block !important;
 }