/* Header nav: chevrons centred on the label; Products / Solutions labels are links */
.nav-drop summary{display:inline-flex;align-items:center;gap:7px;line-height:1.2}
.nav-drop summary:after{content:none!important;display:none!important}
.nav-drop-link,.nav-drop-label{color:inherit;text-decoration:none;line-height:inherit}
.nav-drop-link:hover,.nav-drop-link:focus-visible{color:#a6dfcd}
.nav-chevron{flex:none;width:7px;height:7px;margin:0 2px;border-right:1.75px solid currentColor;border-bottom:1.75px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s ease}
.nav-drop[open]>summary .nav-chevron{transform:translateY(1px) rotate(-135deg)}
@media(max-width:850px){.nav-drop summary{display:flex;justify-content:space-between}.nav-chevron{width:8px;height:8px;margin-right:6px}}
@media(prefers-reduced-motion:reduce){.nav-chevron{transition:none}}

/* ---- Header hover animations ---- */
@media (min-width:851px){
 /* Categories: underline draws in from the left, label brightens */
 .nav-links>a:not(.button),.nav-drop-link,.nav-drop-label{
  background:linear-gradient(currentColor,currentColor) 0 100%/0 1.5px no-repeat;padding-bottom:4px;margin-bottom:-4px;
  transition:background-size .3s cubic-bezier(.2,.7,.25,1),color .2s ease}
 .nav-links>a:not(.button):hover,.nav-links>a:not(.button):focus-visible,
 .nav-drop:hover .nav-drop-link,.nav-drop:hover .nav-drop-label,
 .nav-drop[open] .nav-drop-link,.nav-drop[open] .nav-drop-label,
 .nav-drop summary:focus-visible .nav-drop-link,.nav-drop summary:focus-visible .nav-drop-label{background-size:100% 1.5px;color:#a6dfcd}
 /* Chevron: dips on hover, flips when open */
 .nav-drop:hover:not([open]) .nav-chevron{transform:translateY(0) rotate(45deg)}
 .nav-drop:hover .nav-chevron,.nav-drop[open] .nav-chevron{color:#a6dfcd}
 /* Dropdown: fades and slides down; items follow in a short stagger */
 .nav-drop[open] .drop-panel{animation:nxDropIn .26s cubic-bezier(.2,.7,.25,1) both;transform-origin:20% 0}
 .nav-drop[open] .drop-panel a{animation:nxItemIn .32s cubic-bezier(.2,.7,.25,1) both}
 .nav-drop[open] .drop-panel a:nth-child(2){animation-delay:.03s}
 .nav-drop[open] .drop-panel a:nth-child(3){animation-delay:.06s}
 .nav-drop[open] .drop-panel a:nth-child(4){animation-delay:.09s}
 .nav-drop[open] .drop-panel a:nth-child(5){animation-delay:.12s}
 .nav-drop[open] .drop-panel a:nth-child(6){animation-delay:.15s}
}
/* Dropdown items: green bar grows in, label slides right */
.drop-panel a{position:relative;transition:background-color .2s ease,color .2s ease,padding-left .25s cubic-bezier(.2,.7,.25,1)}
.drop-panel a::before{content:"";position:absolute;left:5px;top:50%;width:3px;height:0;border-radius:2px;background:var(--green,#03c995);transform:translateY(-50%);transition:height .22s cubic-bezier(.2,.7,.25,1)}
.drop-panel a:hover,.drop-panel a:focus-visible{padding-left:20px;color:#72dfbd}
.drop-panel a:hover::before,.drop-panel a:focus-visible::before{height:55%}
@keyframes nxDropIn{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
@keyframes nxItemIn{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
/* Respect reduced motion and the site's pause-animation toggle */
@media (prefers-reduced-motion:reduce){
 .nav-links>a,.nav-drop-link,.nav-drop-label,.nav-chevron,.drop-panel,.drop-panel a,.drop-panel a::before{transition:none!important;animation:none!important}}
body.motion-paused .nav-links>a,body.motion-paused .nav-drop-link,body.motion-paused .nav-drop-label,body.motion-paused .nav-chevron,
body.motion-paused .drop-panel,body.motion-paused .drop-panel a,body.motion-paused .drop-panel a::before{transition:none!important;animation:none!important}

/* Header figures: no corner crosses or FIG. captions */
.particle-study .study-cross,.particle-study>figcaption{display:none!important}