fix(anim): drop <object> for <img>, and say cryptocurrency

THE GREY BOX. The decorative animations were embedded with <object>, which
creates a nested browsing context that paints its own canvas. On the dark pages
that canvas showed as a light grey square behind the mark. The SVG's own baked
tile had been hiding most of it, so only the rounded corners leaked, which is
why it read as "grey corners" rather than "grey box": removing the tile exposed
the whole thing and made the real cause obvious.

<img> has a transparent canvas and still runs CSS animations inside an SVG, as
the splash morph and the Hash Bags icon already demonstrate. Swapped on all
three pages that used the pattern, not just the one that was reported: /apps,
/products and /blog all had it. Verified on the rendered dark page, where the
pixels outside the mark, inside the old tile, and the page background are now
the same colour.

The marks themselves are now the tileless variants from such-graphics f457c37,
so nothing bakes a background colour that has to match ours.

COPY. "crypto payment tools" -> "cryptocurrency tools", and the supporting line
now names both ways of working with us rather than only the products.

apps/web/public/images/animations/games_pulse_bare.svg

@@ -23,7 +23,6 @@
       .nd { animation: none; }
     }
   </style>
-  <rect width="200" height="200" rx="26" fill="#0a0a0a"/>
   <g class="field">
     <path d="M 178,164 C 178,92 142,20 100,20 C 58,20 22,92 22,164" fill="none" stroke="#45c99e" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" opacity="0.24"/>
     <path class="pl pl0" d="M 178,164 C 178,92 142,20 100,20 C 58,20 22,92 22,164" fill="none" stroke="#45c99e" stroke-width="3" opacity="0.9" stroke-linecap="round" stroke-linejoin="round" filter="url(#sg-pulse-glow)" stroke-dasharray="30 323.8"/>

apps/web/public/images/animations/games_pulse_bare_light.svg

@@ -23,7 +23,6 @@
       .nd { animation: none; }
     }
   </style>
-  <rect width="200" height="200" rx="26" fill="#f7f8fa"/>
   <g class="field">
     <path d="M 178,164 C 178,92 142,20 100,20 C 58,20 22,92 22,164" fill="none" stroke="#1a5c38" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" opacity="0.2"/>
     <path class="pl pl0" d="M 178,164 C 178,92 142,20 100,20 C 58,20 22,92 22,164" fill="none" stroke="#1a5c38" stroke-width="3" opacity="0.9" stroke-linecap="round" stroke-linejoin="round" filter="url(#sg-pulse-glow)" stroke-dasharray="30 323.8"/>

apps/web/src/app/apps/page.tsx

@@ -134,8 +134,8 @@ export default function LinksPage() {
         </div>
 
         <div className="flex justify-center mt-12 mb-6 motion-reduce:hidden">
-          <object data="/images/animations/games_pulse_light.svg" type="image/svg+xml" aria-hidden="true" className="w-20 h-20 opacity-50 block dark:hidden pointer-events-none"></object>
+          <img src="/images/animations/games_pulse_bare_light.svg" alt="" aria-hidden="true" className="w-20 h-20 opacity-50 block dark:hidden pointer-events-none" />
-          <object data="/images/animations/games_pulse.svg" type="image/svg+xml" aria-hidden="true" className="w-20 h-20 opacity-50 hidden dark:block pointer-events-none"></object>
+          <img src="/images/animations/games_pulse_bare.svg" alt="" aria-hidden="true" className="w-20 h-20 opacity-50 hidden dark:block pointer-events-none" />
         </div>
 
         <div className="text-center">

apps/web/src/app/blog/page.tsx

@@ -30,8 +30,8 @@ export default function BlogPage() {
 
         {/* Animated accent */}
         <div className="flex justify-center mb-12 motion-reduce:hidden">
-          <object data="/images/animations/anim_type_v4_light.svg" type="image/svg+xml" aria-hidden="true" className="w-24 h-24 opacity-60 block dark:hidden pointer-events-none"></object>
+          <img src="/images/animations/anim_type_v4_light.svg" alt="" aria-hidden="true" className="w-24 h-24 opacity-60 block dark:hidden pointer-events-none" />
-          <object data="/images/animations/anim_type_v4.svg" type="image/svg+xml" aria-hidden="true" className="w-24 h-24 opacity-60 hidden dark:block pointer-events-none"></object>
+          <img src="/images/animations/anim_type_v4.svg" alt="" aria-hidden="true" className="w-24 h-24 opacity-60 hidden dark:block pointer-events-none" />
         </div>
 
         {posts.length === 0 ? (

apps/web/src/app/page.tsx

@@ -32,8 +32,9 @@ export default function Home() {
           <span className="block">for Everyone</span>
         </h1>
         <p className="max-w-2xl text-xl text-muted-foreground mb-8">
-          Custom e-commerce, apps, games, and crypto payment tools, built to order in
+          Custom e-commerce, apps, games, and cryptocurrency tools, built in Kennett Square,
-          Kennett Square, PA. Plus a shelf of mobile apps and games of our own.
+          PA. End to end delivery or consulting engagements. Plus a shelf of mobile apps
+          &amp; games of our own.
         </p>
 
         <div className="flex flex-wrap justify-center gap-4 mb-14">

apps/web/src/app/products/page.tsx

@@ -167,8 +167,8 @@ export default function ProductsPage() {
         <ProductsGrid products={products} />
 
         <div className="flex justify-center mt-16 motion-reduce:hidden">
-          <object data="/images/animations/anim3_matrix_light.svg" type="image/svg+xml" aria-hidden="true" className="w-20 h-20 opacity-40 block dark:hidden pointer-events-none"></object>
+          <img src="/images/animations/anim3_matrix_light.svg" alt="" aria-hidden="true" className="w-20 h-20 opacity-40 block dark:hidden pointer-events-none" />
-          <object data="/images/animations/anim3_matrix.svg" type="image/svg+xml" aria-hidden="true" className="w-20 h-20 opacity-50 hidden dark:block pointer-events-none"></object>
+          <img src="/images/animations/anim3_matrix.svg" alt="" aria-hidden="true" className="w-20 h-20 opacity-50 hidden dark:block pointer-events-none" />
         </div>
       </div>
       <MobileNav />