more changes

- Restore the SHARP-ER in the homepage hero section
- Match the design for the 3-image section in the homepage

apps/web/app/components/ui/Navigation/Brand.tsx

@@ -42,11 +42,17 @@ export interface BrandProps {
   /** Accessible name of the link; the images are decorative. */
   label: string;
   surface: NavSurface;
+  /**
+   * Run the "-ER" reveal and its breathing loop. Off on the home page, whose
+   * hero plays the same reveal once - a second, looping copy beside it is
+   * jarring. Anywhere else the two animations run as designed.
+   */
+  animate?: boolean;
   className?: string;
 }
 
 /** The SHARP-ER wordmark, linking home. Sits at the inline start of the bar. */
-export function Brand({ href, label, surface, className }: BrandProps) {
+export function Brand({ href, label, surface, animate = true, className }: BrandProps) {
   const { base, suffix } = BRAND_LOCKUP[surface];
 
   return (
@@ -75,10 +81,12 @@ export function Brand({ href, label, surface, className }: BrandProps) {
         />
 
         {/* The clipping box starts at the P's right edge, so the mark inside
-            it can slide out from behind the P (Navigation.css). */}
+            it can slide out from behind the P (Navigation.css). Without
+            `animate` the box and the reveal classes are dropped and the full
+            lockup simply sits there. */}
         <span
           style={{ flex: `${suffix.drawnWidth} 1 0%` }}
-          className="sh-brand-suffix block min-w-0"
+          className={cx("block min-w-0", animate && "sh-brand-suffix")}
         >
           <img
             src={suffix.src}
@@ -88,7 +96,7 @@ export function Brand({ href, label, surface, className }: BrandProps) {
             loading="eager"
             decoding="async"
             draggable={false}
-            className="sh-brand-suffix__mark block h-auto w-full"
+            className={cx("block h-auto w-full", animate && "sh-brand-suffix__mark")}
           />
         </span>
       </span>