From 66d0203f55672bbf557f5b3a2641578eeea4e82a Mon Sep 17 00:00:00 2001
From: mAi <mai@flexsiebels.de>
Date: Mon, 27 Apr 2026 20:05:45 +0200
Subject: [PATCH 1/2] mAi: #7 - smartin3.de Mobile: 3D-Animation-Touch auf
 Wrapper begrenzen
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Touchmove-Listener von .hero auf .text3d-wrapper verschoben, sodass nur
Touches direkt auf der animierten Text-Komponente die Animation triggern.
preventDefault() entfernt + touch-action: pan-y auf den Wrapper —
vertical scroll funktioniert jetzt sowohl außerhalb als auch innerhalb
des Animations-Bereichs ungestört. Desktop-mousemove unverändert.
---
 sites/smartin3.de/index.html | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/sites/smartin3.de/index.html b/sites/smartin3.de/index.html
index ac416d7..8736fe1 100644
--- a/sites/smartin3.de/index.html
+++ b/sites/smartin3.de/index.html
@@ -93,6 +93,7 @@
       margin: 0 auto 40px;
       display: flex; justify-content: center;
       padding: 60px 40px;
+      touch-action: pan-y;
     }
 
     .text3d {
@@ -670,8 +671,9 @@
     // Interactive 3D text
     (function() {
       var hero = document.querySelector('.hero');
+      var wrapper = document.querySelector('.text3d-wrapper');
       var text = document.querySelector('.text3d');
-      if (!hero || !text) return;
+      if (!hero || !wrapper || !text) return;
 
       function handleMove(x, y) {
         var w = window.innerWidth;
@@ -684,10 +686,9 @@
       }
 
       hero.addEventListener('mousemove', function(e) { handleMove(e.clientX, e.clientY); });
-      hero.addEventListener('touchmove', function(e) {
-        e.preventDefault();
+      wrapper.addEventListener('touchmove', function(e) {
         handleMove(e.touches[0].clientX, e.touches[0].clientY);
-      }, {passive: false});
+      }, {passive: true});
       hero.addEventListener('mouseleave', function() {
         text.style.animation = '';
         text.style.transform = '';

From 095ed0fccfe5f59cbf69347f8711796a16e8a744 Mon Sep 17 00:00:00 2001
From: mAi <mai@flexsiebels.de>
Date: Mon, 27 Apr 2026 20:08:25 +0200
Subject: [PATCH 2/2] mAi: #7 - Mobile-Gating: Touch-Fix nur unter 768px
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

CSS touch-action: pan-y und JS-Listener-Scope (wrapper statt hero,
ohne preventDefault) jetzt explizit per @media / matchMedia auf
max-width: 768px begrenzt. Über 768px bleibt das ursprüngliche
Verhalten erhalten — touchmove auf .hero mit preventDefault, falls
Touch-Hardware im Desktop-Layout im Spiel ist.
---
 sites/smartin3.de/index.html | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/sites/smartin3.de/index.html b/sites/smartin3.de/index.html
index 8736fe1..74eab9a 100644
--- a/sites/smartin3.de/index.html
+++ b/sites/smartin3.de/index.html
@@ -93,7 +93,9 @@
       margin: 0 auto 40px;
       display: flex; justify-content: center;
       padding: 60px 40px;
-      touch-action: pan-y;
+    }
+    @media (max-width: 768px) {
+      .text3d-wrapper { touch-action: pan-y; }
     }
 
     .text3d {
@@ -686,9 +688,16 @@
       }
 
       hero.addEventListener('mousemove', function(e) { handleMove(e.clientX, e.clientY); });
-      wrapper.addEventListener('touchmove', function(e) {
-        handleMove(e.touches[0].clientX, e.touches[0].clientY);
-      }, {passive: true});
+      if (window.matchMedia('(max-width: 768px)').matches) {
+        wrapper.addEventListener('touchmove', function(e) {
+          handleMove(e.touches[0].clientX, e.touches[0].clientY);
+        }, {passive: true});
+      } else {
+        hero.addEventListener('touchmove', function(e) {
+          e.preventDefault();
+          handleMove(e.touches[0].clientX, e.touches[0].clientY);
+        }, {passive: false});
+      }
       hero.addEventListener('mouseleave', function() {
         text.style.animation = '';
         text.style.transform = '';