/* Preview interaction layer. Native links, buttons and details retain their behavior.
   Product-showroom descendants are deliberately excluded from every target. */
:root{--lh-ui-curve:cubic-bezier(.22,1,.36,1);--lh-ui-duration:500ms}
.site-head .nav>a,.site-head .nav-treatment>summary,.site-head .treatment-links>a,
:is(a,button):is(.cta,.ghost,.btn,.glass-btn,.menu-btn,[data-target],.pilot-filters>button):not(#product-picks *),
:is(a.card,a.knowledge-card,a.portal-card,a.lh-reading-card,a.reading-path,.pilot-route-grid>a,.brand-choice>a,.pilot-card>a):not(#product-picks *){
 transform-origin:center;
 transition:transform var(--lh-ui-duration) var(--lh-ui-curve),opacity 300ms var(--lh-ui-curve),background-color 300ms var(--lh-ui-curve),color 300ms var(--lh-ui-curve),border-color 300ms var(--lh-ui-curve);
}
/* Keep text and focus available throughout; no forced animation delay on navigation. */
.site-head .nav>a:focus-visible,.site-head .nav-treatment>summary:focus-visible,
.site-head .treatment-links>a:focus-visible,
:is(a,button):is(.cta,.ghost,.btn,.glass-btn,.menu-btn,[data-target],.pilot-filters>button):focus-visible:not(#product-picks *),
:is(a.card,a.knowledge-card,a.portal-card,a.lh-reading-card,a.reading-path,.pilot-route-grid>a,.brand-choice>a,.pilot-card>a):focus-visible:not(#product-picks *){
 outline:3px solid #745683;outline-offset:4px;
}
/* Product list cards clip their child link; keep its ring inside that edge. */
.pilot-card>a:focus-visible:not(#product-picks *){outline-offset:-4px}
.site-head .nav-treatment[open]>.treatment-links{
 transform-origin:top center;
 animation:lh-ui-menu-enter 400ms var(--lh-ui-curve) backwards;
}
.site-head .nav-treatment[open]>.treatment-links>a{animation:lh-ui-item-enter 300ms var(--lh-ui-curve) backwards}
.site-head .nav-treatment[open]>.treatment-links>a:nth-child(2){animation-delay:20ms}
.site-head .nav-treatment[open]>.treatment-links>a:nth-child(3){animation-delay:40ms}
.site-head .nav-treatment[open]>.treatment-links>a:nth-child(4){animation-delay:60ms}
.site-head .nav-treatment[open]>.treatment-links>a:nth-child(n+5){animation-delay:80ms}
@keyframes lh-ui-menu-enter{from{opacity:.86;transform:translateY(-6px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes lh-ui-item-enter{from{opacity:.86;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media(hover:hover) and (pointer:fine){
 .site-head .nav>a:hover,.site-head .nav-treatment>summary:hover{transform:translateY(-1px) scale(1.035)}
 .site-head .treatment-links>a:hover{transform:translateX(2px) scale(1.015)}
 :is(a,button):is(.cta,.ghost,.btn,.glass-btn,.menu-btn,[data-target],.pilot-filters>button):hover:not(#product-picks *){transform:translateY(-2px) scale(1.025)}
 :is(a.card,a.knowledge-card,a.portal-card,a.lh-reading-card,a.reading-path,.pilot-route-grid>a,.brand-choice>a,.pilot-card>a):hover:not(#product-picks *){transform:translateY(-3px) scale(1.012)}
}
/* :active also works with touch, without a hover step or JavaScript interception. */
.site-head .nav>a:active,.site-head .nav-treatment>summary:active,.site-head .treatment-links>a:active,
:is(a,button):is(.cta,.ghost,.btn,.glass-btn,.menu-btn,[data-target],.pilot-filters>button):active:not(#product-picks *),
:is(a.card,a.knowledge-card,a.portal-card,a.lh-reading-card,a.reading-path,.pilot-route-grid>a,.brand-choice>a,.pilot-card>a):active:not(#product-picks *){
 transform:translateY(0) scale(.98);transition-duration:200ms;
}
@media(max-width:1120px){
 .site-head .nav.open{animation:lh-ui-menu-enter 400ms var(--lh-ui-curve) backwards}
 .site-head .nav-treatment[open]>.treatment-links{animation:lh-ui-item-enter 300ms var(--lh-ui-curve) backwards}
}
@media(prefers-reduced-motion:reduce){
 .site-head .nav,.site-head .nav>a,.site-head .nav-treatment>summary,.site-head .treatment-links,.site-head .treatment-links>a,
 :is(a,button):is(.cta,.ghost,.btn,.glass-btn,.menu-btn,[data-target],.pilot-filters>button):not(#product-picks *),
 :is(a.card,a.knowledge-card,a.portal-card,a.lh-reading-card,a.reading-path,.pilot-route-grid>a,.brand-choice>a,.pilot-card>a):not(#product-picks *){
  animation:none!important;transition:none!important;transform:none!important;
 }
}
