polish: smooth hover transitions on nav and footer links

- Desktop nav: underline uses scaleX transform (origin-left) instead of
  width, now shows on hover for inactive links too
- Mobile nav: link text slides translateX on hover for directional feel
- Footer nav: matching scaleX underline on hover
- Footer social: external arrow icon nudges diagonally on hover

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

layouts/partials/footer.html

@@ -23,14 +23,17 @@
       <ul class="flex flex-wrap gap-x-8 gap-y-4">
         {{- range .Site.Menus.footer -}}
         <li>
-          <a href="{{ .URL }}" class="label text-fog hover:text-heat transition-colors">{{ .Name }}</a>
+          <a href="{{ .URL }}" class="group label relative text-fog hover:text-heat transition-colors duration-200">
+            {{ .Name }}
+            <span class="absolute -bottom-0.5 left-0 h-px w-full bg-heat origin-left scale-x-0 group-hover:scale-x-100 transition-transform duration-300 ease-out"></span>
+          </a>
         </li>
         {{- end -}}
         {{- with .Site.Params.social -}}
           {{- range $platform, $url := . -}}
           <li>
-            <a href="{{ $url }}" target="_blank" rel="noopener noreferrer" class="label text-fog hover:text-frost transition-colors">
-              {{- $platform | upper -}} {{ partial "icon.html" "arrow-external" }}
+            <a href="{{ $url }}" target="_blank" rel="noopener noreferrer" class="group label text-fog hover:text-frost transition-colors duration-200">
+              {{- $platform | upper -}}<span class="inline-block transition-transform duration-200 group-hover:translate-x-0.5 group-hover:-translate-y-0.5">{{ partial "icon.html" "arrow-external" }}</span>
             </a>
           </li>
           {{- end -}}