diff --git a/public/brand/ip/wrench-uncle/default.jpg b/public/brand/ip/wrench-uncle/default.jpg
new file mode 100644
index 0000000..a0457f9
Binary files /dev/null and b/public/brand/ip/wrench-uncle/default.jpg differ
diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx
index 2f1eb4a..77416c9 100644
--- a/src/components/Hero.tsx
+++ b/src/components/Hero.tsx
@@ -173,10 +173,11 @@ export default function Hero() {
 
         {/* Feature preview bento row */}
         <motion.div
+          id="features"
           initial={{ opacity: 0, y: 20 }}
           animate={{ opacity: 1, y: 0 }}
           transition={{ duration: 0.6, delay: 0.3 }}
-          className="md:col-span-6 rounded-[28px] bg-[#FAFAF7] border border-black/5 p-6 md:p-7 min-h-[200px] flex flex-col justify-between"
+          className="md:col-span-6 rounded-[28px] bg-[#FAFAF7] border border-black/5 p-6 md:p-7 min-h-[200px] flex flex-col justify-between scroll-mt-6"
         >
           <div className="flex items-center gap-2 text-xs font-mono text-[#1A1A1A]/40 tracking-wider">
             <Gauge size={13} />
diff --git a/src/lib/constants.ts b/src/lib/constants.ts
index d6fca1b..2895db9 100644
--- a/src/lib/constants.ts
+++ b/src/lib/constants.ts
@@ -12,7 +12,7 @@ export const ASSETS = {
   sceneDoneSquare: "/brand/scenes/obdx-scene-done-square.png",
 
   wrench: "/brand/ip/wrench/default.png",
-  wrenchUncle: "/brand/ip/wrench-uncle/default.png",
+  wrenchUncle: "/brand/ip/wrench-uncle/default.jpg",
   wrenchUncleWithDash: "/brand/ip/wrench-uncle/with-dash.png",
   dash: "/brand/ip/dash/default.png",
 } as const;