Update design 2

themes/hugo-theme-massively/layouts/partials/back-to-top.html

@@ -1,4 +1,5 @@
-<div id="global-back-to-top" class="back-to-top-btn" onclick="scrollToTop()">
+<div id="global-back-to-top" class="back-to-top-btn" onclick="scrollToTop()" 
+     style="position: fixed; bottom: 30px; right: 30px; background: rgba(255, 255, 255, 0.15); color: #ffffff; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 50%; width: 56px; height: 56px; cursor: pointer; font-size: 1.2rem; opacity: 0; visibility: hidden; z-index: 1000; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); backdrop-filter: blur(10px); text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); transition: all 0.3s ease;">
     ↑
 </div>
 
@@ -22,9 +23,28 @@ window.addEventListener('scroll', function() {
     const scrollPercent = (scrollTop + windowHeight) / documentHeight;
     
     if (scrollPercent > 0.66) { // Показываем когда прокрутили 66% страницы
-        backToTopBtn.classList.add('show');
+        backToTopBtn.style.opacity = '1';
+        backToTopBtn.style.visibility = 'visible';
     } else {
-        backToTopBtn.classList.remove('show');
+        backToTopBtn.style.opacity = '0';
+        backToTopBtn.style.visibility = 'hidden';
     }
 });
+
+// Добавляем hover эффекты
+document.addEventListener('DOMContentLoaded', function() {
+    const backToTopBtn = document.getElementById('global-back-to-top');
+    
+    backToTopBtn.addEventListener('mouseenter', function() {
+        this.style.background = 'rgba(255, 255, 255, 0.3)';
+        this.style.transform = 'translateY(-2px) scale(1.05)';
+        this.style.boxShadow = '0 6px 20px rgba(0, 0, 0, 0.4)';
+    });
+    
+    backToTopBtn.addEventListener('mouseleave', function() {
+        this.style.background = 'rgba(255, 255, 255, 0.15)';
+        this.style.transform = 'translateY(0) scale(1)';
+        this.style.boxShadow = '0 4px 15px rgba(0, 0, 0, 0.2)';
+    });
+});
 </script>