Show full hero GIF without cropping

styles.css

@@ -88,15 +88,15 @@ main {
   border-radius: 14px;
   background: rgba(2,4,5,0.45);
   box-shadow: 0 30px 120px rgba(0,0,0,0.5);
-  object-fit: cover;
+  object-fit: contain;
   opacity: 0.86;
   filter: saturate(1.08) contrast(1.05);
   animation: float 10s ease-in-out infinite;
 }
 
 .asset-a {
-  width: min(48vw, 760px);
-  height: min(42vw, 520px);
+  width: min(54vw, 860px);
+  height: auto;
   right: 5vw;
   top: 17svh;
   transform: rotateX(5deg) rotateY(-14deg) rotateZ(2deg);
@@ -542,7 +542,7 @@ code {
 
 @media (max-width: 980px) {
   .screen { width: min(100vw - 28px, 1380px); }
-  .asset-a { width: 76vw; height: 42svh; right: -7vw; top: 9svh; opacity: 0.56; }
+  .asset-a { width: 82vw; height: auto; right: -8vw; top: 9svh; opacity: 0.56; }
   .hero-panel { position: relative; right: auto; bottom: auto; width: 100%; margin-bottom: 80px; }
   .hero-copy { padding-bottom: 28px; }
   .model-stage, .pipeline { grid-template-columns: 1fr; }
@@ -553,7 +553,7 @@ code {
 
 @media (max-width: 640px) {
   h1 { font-size: clamp(48px, 17vw, 78px); }
-  .asset-a { width: 92vw; height: 34svh; right: -22vw; top: 10svh; opacity: 0.42; }
+  .asset-a { width: 104vw; height: auto; right: -28vw; top: 10svh; opacity: 0.42; }
   .command-wrap { grid-template-columns: 1fr; }
   .model-tabs { grid-template-columns: 1fr; }
   .pipeline-art { min-height: 420px; }