Sharpen the Let's talk ribbon and center small outline buttons

The ribbon was a 1600px image stretched almost 3x. It is now upscaled 2x
with Lanczos and light sharpening (keeping transparency) and stretched less.
Small outline buttons such as Replay get symmetric padding since they have
no arrow tile.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/pages/home.mjs

@@ -254,7 +254,7 @@ export default {
 </section>
 
 <section id="connect" aria-labelledby="connect-title">
-  <div class="talk" aria-hidden="true"><img class="ribbon" alt="" src="/assets/o2/ribbon.webp" width="1600" height="900" loading="lazy"><h2>Let’s talk</h2></div>
+  <div class="talk" aria-hidden="true"><img class="ribbon" alt="" src="/assets/o2/ribbon-hd.webp" width="3200" height="1800" loading="lazy"><h2>Let’s talk</h2></div>
   <div class="cbody">
     ${eyebrow('LET’S CONNECT')}
     <h3 id="connect-title" class="grad">Interesting Things Usually Start With a Conversation.</h3>