style(ui): full UX/UI + motion pass across storefront, admin, editor

- fix save-bar buttons to use shared app-button primitive (were unstyled)
- fix platform-nav-group border/radius via structural selectors, drop dead
  -middle/-right classes
- storefront widgets (hero/categories/product-carousel/footer-nav): design
  tokens, hover/focus states, 44px touch targets, entrance motion, reduced-
  motion guards
- admin dashboard cards + quick-actions: hover lift, entrance animation
- admin product-form gallery remove badge: hover/focus + expanded hit area
- project-editor section.shared button styles: hover/active/focus/disabled
  states + reduced-motion; section-switch fade-in motion

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/app/features/project-editor/sections/section.shared.scss

@@ -111,12 +111,58 @@ button {
   padding: 0 14px;
   font-weight: 700;
   cursor: pointer;
+  transition: background-color var(--transition-fast, 120ms ease),
+    border-color var(--transition-fast, 120ms ease),
+    transform var(--transition-fast, 120ms ease),
+    box-shadow var(--transition-fast, 120ms ease);
+
+  &:hover {
+    background: var(--primary-hover, #3d635f);
+    border-color: var(--primary-hover, #3d635f);
+    transform: translateY(-1px);
+    box-shadow: var(--shadow-sm, 0 2px 8px rgba(0, 0, 0, 0.1));
+  }
+
+  &:active {
+    transform: translateY(0);
+  }
+
+  &:focus-visible {
+    outline: 2px solid #497671;
+    outline-offset: 2px;
+  }
+
+  &:disabled {
+    cursor: not-allowed;
+    opacity: 0.6;
+    transform: none;
+    box-shadow: none;
+  }
 }
 
 button.secondary {
   background: #fff;
   color: #1e3c38;
   border-color: var(--border-color, #d3dad9);
+
+  &:hover {
+    background: var(--bg-secondary, #f5f5f5);
+    border-color: #497671;
+  }
+
+  &:focus-visible {
+    outline-color: #497671;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  button {
+    transition: none;
+
+    &:hover {
+      transform: none;
+    }
+  }
 }
 
 .editor-error {