From 08470bf2b8b6394830fa88f363a12b74a9c4a286 Mon Sep 17 00:00:00 2001
From: anshul-dying <anshulkhaire3303dll@gmail.com>
Date: Thu, 16 Jul 2026 10:38:33 +0530
Subject: [PATCH] Fix Cube3D rotation orbit and animation

---
 app/components/Cube3D.module.css | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/app/components/Cube3D.module.css b/app/components/Cube3D.module.css
index bc0382b..bda80df 100644
--- a/app/components/Cube3D.module.css
+++ b/app/components/Cube3D.module.css
@@ -1,13 +1,10 @@
 /* Cube Animation */
 @keyframes tumble {
   0% { 
-    transform: rotateX(0deg) rotateY(0deg); 
-  }
-  50% { 
-    transform: rotateX(180deg) rotateY(180deg); 
+    transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); 
   }
   100% { 
-    transform: rotateX(360deg) rotateY(360deg); 
+    transform: rotateX(360deg) rotateY(720deg) rotateZ(360deg); 
   }
 }
 
@@ -39,6 +36,10 @@
 /* Face States */
 .face {
   position: absolute;
+  top: 50%;
+  left: 50%;
+  margin-top: -26px;
+  margin-left: -26px;
   width: 52px;
   height: 52px;
   border: 1px solid #fff;
@@ -80,6 +81,10 @@
   height: 100%;
 }
 
+.cubeWrapper:hover .cube {
+  animation-play-state: paused;
+}
+
 .cube {
   position: absolute;
   top: 0;
@@ -88,7 +93,7 @@
   height: 100%;
   transform-style: preserve-3d;
   transform-origin: center;
-  animation: tumble 12s linear infinite;
+  animation: tumble 24s linear infinite;
 }
 
 /* Tooltip */