Crop banner viewBox so header/footer rules align with body edges

The original viewBox (0 0 2048 620) included ~40 units of empty
padding on the left/right and ~50 units top/bottom, which made the
banner content look small inside the body-width container. Crop to
(40 50 1970 540) so the horizontal rules at x=40 and x=2010 sit at
the banner's left/right edges — same edges as the blog text below.

Nothing inside the SVG was repositioned; only the viewBox and
matching aspect-ratio changed.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

demo.html

@@ -87,7 +87,7 @@
 
     display: block;
     width: 100%;
-    aspect-ratio: 2048 / 620;
+    aspect-ratio: 1970 / 540;
     position: relative;
     overflow: hidden;
     background:
@@ -612,7 +612,7 @@
 
 <div class="banner-wrap">
 <section class="carbon-banner" aria-label="Carbon DNA model banner">
-  <svg class="carbon-art" viewBox="0 0 2048 620" role="img" aria-labelledby="cb-carbonTitle cb-carbonDesc">
+  <svg class="carbon-art" viewBox="40 50 1970 540" role="img" aria-labelledby="cb-carbonTitle cb-carbonDesc">
     <title id="cb-carbonTitle">Carbon genomic language model banner</title>
     <desc id="cb-carbonDesc">A technical editorial banner with the CARBON-0 model name and an adjacent animated DNA strand.</desc>