perf: responsive AVIF/WebP images; a11y contrast and link-text fixes

- scripts/optimize-images.mjs generates hashed AVIF/WebP variants at build time (sharp)
- Picture.astro + rehype plugin serve them via <picture> with srcset/sizes; hero gets fetchpriority=high
- footer CTA and active service-nav item meet WCAG AA contrast
- homepage Learn More link gets screen-reader-only context
- llms.txt: insights described as coming soon

src/styles/global.css

@@ -3,6 +3,7 @@
   --blue: #0074a9; /* exact original azure */
   --box: #f3f5f9; /* light box background (matches original .et_pb_column) */
   --cyan: #3ca2bd;
+  --cyan-deep: #287a90; /* --cyan darkened to 4.9:1 against white text (WCAG AA) */
   --green: #81b29a; /* muted sage — subheads (exact original rgb(129,178,154)) */
   --box-blue: #a9d2eb; /* light-blue metric boxes (exact original rgb(169,210,235)) */
   --ink: #1b2b36;
@@ -42,6 +43,17 @@ img {
   height: auto;
 }
 
+/* <picture> wrappers (components/Picture.astro, Markdown images) must not affect layout: the
+   <img> inside keeps behaving as a direct child (absolute hero backgrounds, sticky media). */
+picture {
+  display: contents;
+}
+
+/* ...which would otherwise promote the <source> tags to grid/flex items (extra gaps). */
+picture > source {
+  display: none;
+}
+
 a {
   color: var(--blue);
 }
@@ -939,7 +951,7 @@ p {
 
 .detail-nav li a[aria-current="page"] {
   background: var(--green);
-  color: #fff;
+  color: var(--navy); /* white on sage is 2.4:1; navy is 5.6:1 (WCAG AA) */
 }
 
 .page-detail {
@@ -1139,7 +1151,7 @@ textarea:focus {
 .footer-cta {
   width: fit-content;
   margin-top: 1rem !important;
-  background: var(--cyan);
+  background: var(--cyan-deep);
 }
 
 .footer-bottom {