diff --git a/.Jules/palette.md b/.Jules/palette.md
index 049f738..3ef069d 100644
--- a/.Jules/palette.md
+++ b/.Jules/palette.md
@@ -50,3 +50,7 @@
 ## 2025-05-14 - Social Sharing Implementation
 **Learning:** Placeholders for social sharing buttons significantly degrade UX when users expect to share discovered content. Standardizing these intents with popup windows (550x450) provides a "premium" feel while keeping users on the platform.
 **Action:** Always verify if sharing icons in modals are functional; if not, implement standardized platform intents using centered popups.
+
+## 2026-06-27 - Tactile Feedback and Logo-Navigation Patterns
+**Learning:** Adding a subtle :active scale effect (0.97) across all interactive elements provides immediate, satisfying tactile feedback that improves the "feel" of the application. Using the brand logo as a "Back to Top" trigger is an intuitive navigation pattern for long-scrolling archives.
+**Action:** Implement global :active scale transforms for all interactive components. Ensure brand logos are keyboard-accessible and serve as navigation anchors to the page top.
diff --git a/css/style.css b/css/style.css
index 4a6c0cb..999e8fa 100644
--- a/css/style.css
+++ b/css/style.css
@@ -590,6 +590,19 @@ body {
     transform: translateY(0);
   }
 
+  .btn:active,
+  .action-btn:active,
+  .nav-link:active,
+  .card:active,
+  .chip:active,
+  .social-links a:active,
+  .scroll-to-top:active,
+  .menu-toggle:active,
+  .search-clear:active,
+  .navbar-brand:active {
+    transform: scale(0.97);
+  }
+
   .btn-secondary {
     background-color: rgba(255, 255, 255, 0.15);
     color: white;
diff --git a/index.html b/index.html
index 0b438d6..0bf3326 100644
--- a/index.html
+++ b/index.html
@@ -64,7 +64,7 @@
   <!-- Navigation Header -->
   <header class="navbar">
     <div class="navbar-container">
-      <div class="navbar-brand">
+      <div class="navbar-brand" title="Back to Top" role="button" tabindex="0">
         <div class="brand-icon">
           <svg viewBox="0 0 100 100" width="32" height="32" fill="currentColor">
             <path d="M50 10 L90 90 L10 90 Z"/>
@@ -168,7 +168,7 @@ <h2 class="hero-title" id="hero-title">Exploring Islamic History</h2>
               autocomplete="off"
             >
             <kbd class="search-kbd-hint">/</kbd>
-            <button id="clearSearch" class="search-clear" aria-label="Clear search" style="display: none;">
+            <button id="clearSearch" class="search-clear" aria-label="Clear search" title="Clear search" style="display: none;">
               <i class="fas fa-times"></i>
             </button>
             <div id="searchDropdown" class="search-dropdown"></div>
@@ -606,9 +606,9 @@ <h2>Episode Notes</h2>
           <h3 class="premium-gradient-text">Ruh Al Tarikh</h3>
           <p>A cinematic archive exploring Islamic history, scripture, and contested ideas through a professional, high-fidelity lens.</p>
           <div class="social-links mt-4">
-            <a href="https://www.youtube.com/@Ruh-Al-Tarikh" target="_blank" rel="noopener" aria-label="YouTube"><i class="fab fa-youtube"></i></a>
-            <a href="#" aria-label="Twitter"><i class="fab fa-twitter"></i></a>
-            <a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
+            <a href="https://www.youtube.com/@Ruh-Al-Tarikh" target="_blank" rel="noopener" aria-label="YouTube" title="Follow on YouTube"><i class="fab fa-youtube"></i></a>
+            <a href="#" aria-label="Twitter" title="Follow on Twitter"><i class="fab fa-twitter"></i></a>
+            <a href="#" aria-label="Instagram" title="Follow on Instagram"><i class="fab fa-instagram"></i></a>
           </div>
         </div>
         <div class="footer-section">
diff --git a/js/app.js b/js/app.js
index 5abcb24..476dcd6 100644
--- a/js/app.js
+++ b/js/app.js
@@ -1033,6 +1033,20 @@ function bindEvents() {
     });
 
     // Hero buttons
+    // Brand Scroll to Top
+    const brand = document.querySelector('.navbar-brand');
+    if (brand) {
+        brand.addEventListener('click', () => {
+            window.scrollTo({ top: 0, behavior: 'smooth' });
+        });
+        brand.addEventListener('keydown', (e) => {
+            if (e.key === 'Enter' || e.key === ' ') {
+                e.preventDefault();
+                window.scrollTo({ top: 0, behavior: 'smooth' });
+            }
+        });
+    }
+
     // Navbar Episodes Scroll
     if (DOM.episodesNavBtn && DOM.episodesSection) {
         DOM.episodesNavBtn.addEventListener('click', () => {