/* Header v7: CSS hover is independent of JavaScript; JS synchronizes ARIA and dismissal. */
.desktop-nav{align-self:stretch;align-items:stretch;gap:8px;user-select:none}
.nav-collection{display:flex;align-items:stretch}
.desktop-nav>a,.nav-trigger{padding:0 16px;font-size:17px;font-weight:600;letter-spacing:-.025em;line-height:1.2;min-height:48px;gap:8px;white-space:nowrap;transition:color .18s,background .18s}
.desktop-nav>a:after,.nav-trigger:after{left:16px;right:16px;bottom:22px;width:auto;height:2px;transform:scaleX(0);transform-origin:left;transition:transform .2s}
.desktop-nav>a:hover:after,.desktop-nav>a[aria-current]:after,.nav-trigger[aria-expanded=true]:after{width:auto;transform:scaleX(1)}
.desktop-nav>a:hover,.nav-trigger:hover,.nav-trigger[aria-expanded=true]{color:var(--green)}
.nav-chevron{width:17px;height:17px;transition:transform .2s;opacity:.75}
.nav-trigger[aria-expanded=true] .nav-chevron{transform:rotate(180deg)}
.mega-menu{display:none;top:calc(100% - 1px);border-top:2px solid var(--green);padding:32px;gap:28px;background:#f4f2eb;animation:none}
.mega-menu:before{content:'';position:absolute;top:-22px;left:0;right:0;height:22px;background:transparent}
.mega-intro h2{font-size:32px;letter-spacing:-.045em;line-height:1.15;margin:8px 0 16px}
.mega-intro>a{font-size:16px;font-weight:600;letter-spacing:-.015em;line-height:1.5;padding:6px 0}
.mega-intro>a:not(.text-link){color:var(--muted);font-weight:400}
.mega-intro>a:hover{color:var(--orange)}
.mega-card strong{font-size:24px;font-weight:600;letter-spacing:-.035em;line-height:1.25;margin-bottom:5px}
.mega-card small{font-size:14px;line-height:1.5}
@media(min-width:1031px){
  .nav-collection.is-open>.mega-menu{display:grid;animation:editorial-menu .18s ease-out}
  .nav-collection:not(.menu-dismissed):focus-within>.mega-menu{display:grid}
}
@media(min-width:1031px){
  .nav-collection:not(.menu-dismissed):hover>.mega-menu{display:grid;animation:editorial-menu .18s ease-out}
  .nav-collection:not(.menu-dismissed):hover>.nav-trigger .nav-chevron{transform:rotate(180deg)}
  .nav-collection:not(.menu-dismissed):hover>.nav-trigger:after{transform:scaleX(1)}
}
@media(min-width:1031px) and (max-width:1200px){
  .desktop-nav{gap:0}
  .desktop-nav>a,.nav-trigger{font-size:16px;padding-inline:12px}
  .desktop-nav>a:after,.nav-trigger:after{left:12px;right:12px}
  .mega-menu{padding:25px;gap:20px}
}
@media(max-width:1030px){.mega-menu{display:none!important}}
@media(prefers-reduced-motion:reduce){.mega-menu,.nav-chevron,.desktop-nav>a:after,.nav-trigger:after{animation:none!important;transition:none}}
