Trim CSS comments to the ones that prevent silent breakage

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Author: mlaetitia

themes/osi/assets/scss/_6_components.header.scss

@@ -161,7 +161,6 @@
     // open-panel layers: full-bleed white veil (::after escapes the wrapper inset) and
     // page dim; z-index -1 keeps both under content, tree order paints veil over dim
     @mixin nav-open-layers {
-        // the border is the header/panel divider: on the veil so it never fades with panel switches
         &::after {
             background-color: $Nwhite;
             border-bottom: 1px solid $Nlight;

themes/osi/assets/scss/_6_components.mobile-menu.scss

@@ -1,5 +1,4 @@
 .site-header {
-  // centered in the sticky header row: follows any logo height or admin-bar shift
   .open-button-wrapper {
       position: absolute;
       right: 16px;
@@ -190,7 +189,7 @@
             position: static;
         }
 
-        // stack while open: menu overlay (2) < white logo-row bar (3) < logo and buttons (4)
+        // stack while open: overlay (2) < white bar (3) < logo and buttons (4)
         .header--blog-name {
             position: relative;
             z-index: 4;

themes/osi/assets/scss/_6_components.navigation--subnav.scss

@@ -154,7 +154,6 @@
         }
       }
 
-      // selected items recolor only, no underline on mobile
       .menu-item.current-menu-item > a,
       .menu-item.current-menu-parent > a,
       .menu-item.current-menu-ancestor > a {
@@ -172,7 +171,6 @@
         padding: $smallPadding;
       }
 
-      // expanded section runs edge-to-edge: cancel the menu's side padding
       & > .menu-item > ul.sub-menu {
         margin-left: -$smallPadding;
         margin-right: -$smallPadding;
@@ -205,7 +203,6 @@
           }
         }
 
-        // filled triangle per the mobile design, replacing the base chevron glyph
         &:after {
           color: inherit;
           content: '\25BC';
@@ -380,10 +377,8 @@
         padding-right: .5em;
       }
 
-      // full-bleed panel: negative offsets escape the wrapper's inset, and the
-      // content padding re-applies it so panel items align with the header content.
-      // Closing freezes the panel solid for .2s so panel switches never cross-fade
-      // (two translucent panels would flash the dimmed page through)
+      // offsets/padding align the full-bleed panel with the header content; closing
+      // freezes it solid for .2s so switches never cross-fade (dim would flash through)
       & > ul.sub-menu {
         box-shadow: 0 14px 18px -10px rgba(#{$Ndarkest_RGB}, 0.2);
         display: grid;
@@ -504,8 +499,7 @@
         }
       }
 
-      // keyboard open is JS-driven (.is-open); :focus-within here would defeat Escape.
-      // The z-index bump paints the entering panel above a still-solid exiting one
+      // keyboard open is JS-driven (.is-open); :focus-within here would defeat Escape
       &:hover > ul.sub-menu,
       &.is-open > ul.sub-menu {
         opacity: 1;

themes/osi/assets/scss/_6_components.navigation.scss

@@ -110,7 +110,7 @@ nav {
 	display: none;
 }
 
-// nav hover only recolors; the desktop top-level rule re-adds its own underline
+// source order matters: the desktop top-level rule re-adds its own underline below
 .nav-main--menu .menu-item a:hover,
 .nav-main--menu .menu-item a:focus,
 .nav-mobile--menu .menu-item a:hover,
@@ -207,7 +207,7 @@ footer {
 		right: $smallPadding;
 		text-align: center;
 		text-decoration: none;
-		z-index: 5; // local to the .nav-main overlay's own stacking context
+		z-index: 5;
 
 		&:hover, &:focus {
 			background-color: $brandColor1_Dk;