Eliminate duplicate same-named menu subentries

Claude made that change in the name of accessibility
(see 2274d64), but
I have strong negative feelings about menu trees
being rendered that way: noooo, we cannot begin a
list of H3s with its parent H2! It's just so wrong!

So this commit puts it back how it was before, where
non-leaf headers can still function as links.
To mitigate any possible confusion, hovering over a
header-that-is-also-a-link now has an ease-in effect
matching the one used for regular links elsewhere.

Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>

Author: ctrueden

_includes/menu/section

@@ -11,11 +11,12 @@
 {%- else -%}
 <details>
 {%- endif -%}
-<summary>{{include.title}}</summary>
-<ul>
 {%- if include.link -%}
-<li><a href="{{include.link}}">{{include.title}}</a></li>
+<summary><a href="{{include.link}}">{{include.title}}</a></summary>
+{%- else -%}
+<summary>{{include.title}}</summary>
 {%- endif -%}
+<ul>
 
 {%- comment -%}
 # vi:syntax=liquid

assets/css/layout.scss

@@ -351,6 +351,15 @@ $sidebarPadding: 10px;
 .menu a {
   color: var(--color-menu-link);
   text-decoration: none;
+  transition: color 0.2s ease-in;
+}
+
+.menu a:hover {
+  color: var(--color-link-hover);
+  text-decoration: underline solid;
+  text-decoration-thickness: 1px;
+  text-underline-offset: 3px;
+  border-bottom: none;
 }
 
 .menu ul li {
@@ -401,6 +410,8 @@ $sidebarPadding: 10px;
 
 .menu a.current-page:hover {
   border-bottom: none;
+  text-decoration: none;
+  color: var(--color-menu-current-page);
 }
 
 $leftColumnArrowOffset: $sidebarWidth - 2*$sidebarMargin - 2*$sidebarPadding - 30px;

assets/js/jquery.toc.js

@@ -81,16 +81,12 @@
                     var parentItem = stack[0].children("li:last")[0];
                     if (parentItem) {
                         var aItem = $(parentItem.firstChild); // <a> element
-                        var details = $("<details/>");
+                        var details = $("<details open/>");
                         var summary = $("<summary/>");
-                        // Use text only (not link) in summary to avoid nesting an interactive
-                        // <a> inside the interactive <summary> (WCAG nested-interactive).
-                        // The link is re-added as the first <li> in the expanded list.
-                        summary.text(aItem.text());
+                        // Put the link directly in the summary so the header is clickable.
+                        summary.append(aItem);
                         details.append(summary);
                         var ol = $("<" + listTag + "/>");
-                        // Re-add the section link as first item in the expanded list
-                        $("<li/>").append(aItem).appendTo(ol);
                         details.append(ol);
                         details.appendTo(parentItem);
                         stack.unshift(ol); // move down to the new <ol> level