From f55c631d14783ee2986292a265062ee4d0b0a4d0 Mon Sep 17 00:00:00 2001
From: Bissbert <43237892+Bissbert@users.noreply.github.com>
Date: Fri, 17 Jul 2026 10:35:07 +0200
Subject: [PATCH] fix(hero): centre the home hero crystal so it spins in place

The auto-rotating hero crystal's geometry was never centred on its
centroid, so it orbited the group origin and drifted off-centre in
its specimen plate at some rotation angles (often off centre). Added
geometry.center() + computeBoundingSphere() (matching the working
Crystal3DViewer) and removed the compensating hardcoded
<Center position={[0,0.15,0]}> offset.

Browser-verified: crystal stays centred across a full rotation,
reduced-motion static+centred, both themes + mobile OK, no console
errors. Build clean.
---
 src/components/crystal/HeroCrystal3D.tsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/components/crystal/HeroCrystal3D.tsx b/src/components/crystal/HeroCrystal3D.tsx
index 8e97c60..3eeb7c0 100644
--- a/src/components/crystal/HeroCrystal3D.tsx
+++ b/src/components/crystal/HeroCrystal3D.tsx
@@ -71,6 +71,13 @@ function parseGLTFToGeometry(gltfData: any): THREE.BufferGeometry | null {
     geometry.setAttribute('normal', new THREE.BufferAttribute(normData, 3));
     geometry.setIndex(new THREE.BufferAttribute(idxData, 1));
 
+    // Center the geometry on its own centroid so it spins in place. Without
+    // this the crystal's centre is offset from the group origin, so it orbits
+    // the origin as it auto-rotates and drifts off-centre (matches the working
+    // Crystal3DViewer, which centres the same way).
+    geometry.center();
+    geometry.computeBoundingSphere();
+
     return geometry;
   } catch (error) {
     console.error('Error parsing glTF:', error);
@@ -230,7 +237,7 @@ export function HeroCrystal3D({
           <directionalLight position={[5, 5, 5]} intensity={0.8} />
           <directionalLight position={[-3, 3, -3]} intensity={0.3} />
 
-          <Center position={[0, 0.15, 0]}>
+          <Center>
             {geometry ? (
               <RotatingCrystal geometry={geometry} rotationSpeed={effectiveRotation} scale={scale} />
             ) : (