web theme: make the Revival/RustyWolf feature panels symmetric (equal-height split + shared 16:10 shot frame)

src/app/components/WebLayout.tsx

@@ -152,13 +152,7 @@ function FeatureShot({
 }) {
   return (
     <div className="web-shot">
-      <Image
-        src={src}
-        alt={alt}
-        width={width}
-        height={height}
-        style={{ width: "100%", height: "auto", display: "block" }}
-      />
+      <Image src={src} alt={alt} width={width} height={height} />
     </div>
   );
 }

src/app/web.css

@@ -448,20 +448,31 @@ html[data-theme="web"] body {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
   gap: 26px;
-  align-items: start;
+  align-items: stretch;
 }
 .web-feature {
   display: flex;
   flex-direction: column;
 }
 .web-shot {
+  /* One fixed frame for every feature shot, regardless of the source image's
+     aspect ratio, so the two feature panels line up. */
+  aspect-ratio: 16 / 10;
   border-radius: 16px;
   overflow: hidden;
   border: 1px solid var(--glass-border);
   margin-bottom: 14px;
   box-shadow: 0 18px 36px -22px rgba(23, 32, 60, 0.5);
 }
+.web-shot img {
+  display: block;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  object-position: center top;
+}
 .web-feature-text {
+  flex: 1;
   font-size: 0.9rem;
   color: var(--web-muted);
 }