/* Local preview motion layer: short, consistent, and independent of layout. */
:root{
  --motion-ease:cubic-bezier(.22,1,.36,1);
  --motion-quick:160ms;
  --motion-standard:240ms;
  --motion-disclosure:280ms;
  --transition:color 160ms cubic-bezier(.22,1,.36,1),background-color 160ms cubic-bezier(.22,1,.36,1),border-color 160ms cubic-bezier(.22,1,.36,1),box-shadow 240ms cubic-bezier(.22,1,.36,1),transform 240ms cubic-bezier(.22,1,.36,1),opacity 160ms cubic-bezier(.22,1,.36,1);
}
:where(a,button,input,select){
  transition:color var(--motion-quick) var(--motion-ease),background-color var(--motion-quick) var(--motion-ease),border-color var(--motion-quick) var(--motion-ease),box-shadow var(--motion-quick) var(--motion-ease),transform var(--motion-quick) var(--motion-ease);
}
.product-center-preview :is(a,button,select){
  transition:color var(--motion-quick) var(--motion-ease),background-color var(--motion-quick) var(--motion-ease),border-color var(--motion-quick) var(--motion-ease),transform var(--motion-quick) var(--motion-ease);
}
/* One underline belongs to the label; the separate SVG never inherits it. */
.product-center-preview .product-model-action{gap:5px;text-decoration:none!important}
.product-center-preview .product-model-action-label{position:relative;display:inline-block;font-size:inherit;line-height:1.5}
.product-center-preview .product-model-action-label::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;opacity:0;transition:opacity var(--motion-quick) var(--motion-ease)}
.product-center-preview .product-model-action>svg{width:12px;height:12px;transition:transform var(--motion-standard) var(--motion-ease)}
.product-center-preview .product-model-link:focus-visible .product-model-action-label::after{opacity:1}
.product-center-preview :is(.series-card,.product-model-card){transition:transform var(--motion-standard) var(--motion-ease)}
.product-center-preview :is(.series-card-visual,.product-model-visual) img{transition:transform var(--motion-standard) var(--motion-ease)}
.product-center-preview .series-card-caption{transition:color var(--motion-quick) var(--motion-ease),border-color var(--motion-quick) var(--motion-ease)}
/* Keep font metrics fixed as controls change state. */
.product-center-preview :is(.facet-option,.facet-option.active,.termination-button,.termination-button.active,.part-tabs button,.part-tabs button.active){font-weight:500}
.product-center-preview :is(.facet-more,.text-button) svg{transition:transform var(--motion-standard) var(--motion-ease)}
.product-center-preview :is(.facet-more,.text-button)[aria-expanded="true"] svg{transform:rotate(180deg)}
.product-center-preview .advanced-disclosure{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows var(--motion-disclosure) var(--motion-ease),opacity 180ms var(--motion-ease)}
.product-center-preview .advanced-disclosure.is-open{grid-template-rows:1fr;opacity:1}
.product-center-preview .advanced-disclosure-inner{min-height:0;overflow:hidden}
.product-center-preview .series-overview{animation:motion-fade 220ms var(--motion-ease)}
.product-center-preview .series-3d-stage[data-stage-status="ready"] canvas{animation:motion-fade 180ms var(--motion-ease)}
.product-center-preview dialog[open]{animation:motion-panel-in 220ms var(--motion-ease)}
.product-center-preview dialog[open]::backdrop{animation:motion-fade 180ms var(--motion-ease)}
.product-center-preview dialog.is-closing{animation:motion-panel-out 140ms var(--motion-ease) forwards}
.product-center-preview dialog.is-closing::backdrop{animation:motion-backdrop-out 140ms var(--motion-ease) forwards}
.product-center-preview .toast{transition:opacity 180ms var(--motion-ease),transform 220ms var(--motion-ease);transform:translate(-50%,6px)}
.product-center-preview .toast.visible{transform:translate(-50%,0)}
/* Search remains stable: the suggestions open without pushing the logo or CTA. */
@media(min-width:1081px){
  .nav-search,.nav-search:hover,.nav-search:focus-within{flex-basis:var(--nav-search-w)}
  .navbar-inner:has(.nav-search:is(:hover,:focus-within)) .navbar-logo{transform:none;margin-right:0}
  .navbar-inner:has(.nav-search:is(:hover,:focus-within)) .navbar-cta{max-width:148px;margin-left:12px;padding:8px 18px;gap:6px;opacity:1;transform:none;pointer-events:auto}
}
@media(min-width:1081px) and (max-width:1200px){
  .navbar-inner:has(.nav-search:is(:hover,:focus-within)) .navbar-cta{margin-left:6px;padding:8px 14px}
}
@media(min-width:1201px) and (max-width:1400px){
  .navbar-inner:has(.nav-search:is(:hover,:focus-within)) .navbar-cta{margin-left:8px;padding:8px 16px}
}
.nav-search{transition:background-color var(--motion-quick) var(--motion-ease),border-color var(--motion-quick) var(--motion-ease),box-shadow var(--motion-quick) var(--motion-ease)}
.navbar{transition:background-color var(--motion-standard) var(--motion-ease),box-shadow var(--motion-standard) var(--motion-ease),border-color var(--motion-quick) var(--motion-ease)}
.navbar-nav>a:not(.navbar-cta){transition:color var(--motion-quick) var(--motion-ease),background-color var(--motion-quick) var(--motion-ease)}
.navbar-nav>a:not(.navbar-cta)::before,.navbar-nav>a:not(.navbar-cta)::after{display:none}
.navbar-nav>a:not(.navbar-cta):hover,.navbar.scrolled .navbar-nav>a:not(.navbar-cta):hover{color:var(--accent);background:rgba(0,113,227,.05)}
.navbar-nav>a:not(.navbar-cta):focus-visible{color:var(--accent);outline:2px solid #0071e3;outline-offset:2px;border-radius:4px}
.navbar-cta{transition:background-color var(--motion-quick) var(--motion-ease),box-shadow var(--motion-quick) var(--motion-ease),transform var(--motion-quick) var(--motion-ease)}
.navbar-cta::before{display:none}
.navbar-cta:hover{transform:none}
.nav-suggest:not([hidden]){animation:motion-panel-in 180ms var(--motion-ease)}
.nav-suggest-thumb img{transition:transform var(--motion-standard) var(--motion-ease)}
.nav-suggest:not(.kbd) .nav-suggest-item:hover .nav-suggest-thumb img,.nav-suggest-item.active .nav-suggest-thumb img{transform:scale(1.02)}
.menu-toggle span{transition:transform 220ms var(--motion-ease),opacity var(--motion-quick) var(--motion-ease)}
.nav-suggest-chevron{transition:opacity var(--motion-quick) var(--motion-ease),transform var(--motion-standard) var(--motion-ease)}
.navbar-nav.open{animation:motion-panel-in 200ms var(--motion-ease)}
/* Same restrained rhythm on the other local site pages. */
.reveal{transform:translateY(8px);transition:opacity 400ms var(--motion-ease),transform 400ms var(--motion-ease)}
.reveal.visible{transform:none;transition-delay:0ms!important}
.product-card{transition:transform var(--motion-standard) var(--motion-ease),box-shadow var(--motion-standard) var(--motion-ease),border-color var(--motion-quick) var(--motion-ease)}
.product-card-image img,.news-img img,.app-bento-bg,.why-hero-media img,.client-logo-img{transition:transform var(--motion-standard) var(--motion-ease)}
.product-card:hover .product-card-image img,.news-card:hover .news-img img,.app-bento-card:hover .app-bento-bg,.why-hero-media:hover img,.client-card:hover .client-logo-img{transform:scale(1.02)}
.app-bento-card:hover .app-bento-content{transform:none}
.app-bento-card:hover,.news-card:hover,.why-point:hover,.cert-badge:hover,.contact-map-card:hover,.article-nav a:hover{transform:translateY(-2px)}
.app-bento-card,.news-card,.why-point,.cert-badge,.contact-map-card,.article-nav a{transition:transform var(--motion-standard) var(--motion-ease),box-shadow var(--motion-standard) var(--motion-ease),border-color var(--motion-quick) var(--motion-ease)}
.btn-primary,.btn-outline,.why-btn,.contact-submit,.contact-copy,.product-tab,.news-filter-btn,.products-load-more-btn,.back-to-top{transition:background-color var(--motion-quick) var(--motion-ease),color var(--motion-quick) var(--motion-ease),border-color var(--motion-quick) var(--motion-ease),box-shadow var(--motion-quick) var(--motion-ease),transform var(--motion-quick) var(--motion-ease)}
.btn-primary:hover,.btn-outline:hover,.why-btn:hover,.contact-submit:hover,.products-load-more-btn:hover,.back-to-top:hover{transform:translateY(-1px)}
.product-lightbox{transition:opacity var(--motion-standard) var(--motion-ease),visibility var(--motion-standard) var(--motion-ease)}
.lightbox-content{transform:translateY(6px);transition:transform var(--motion-standard) var(--motion-ease)}
.product-lightbox.open .lightbox-content{transform:none}
.lightbox-img{transition:opacity var(--motion-quick) var(--motion-ease)}
.lightbox-close,.lightbox-nav{transition:background-color var(--motion-quick) var(--motion-ease),transform var(--motion-quick) var(--motion-ease)}
.back-to-top{transform:translateY(6px);transition:opacity var(--motion-quick) var(--motion-ease),visibility var(--motion-quick) var(--motion-ease),background-color var(--motion-quick) var(--motion-ease),transform var(--motion-standard) var(--motion-ease)}
.back-to-top.visible{transform:none}
.back-to-top.visible:hover{transform:translateY(-1px)}
.back-to-top.visible:active{transform:scale(.985)}
.hero-badge .pulse{animation:none}
.product-showcase-card:hover .product-card-image img,.product-showcase-card:focus-within .product-card-image img{transform:scale(1.02)}
.product-showcase-more-link,.why-link,.article-share button,.privacy-back,.contact-choice-list label span{transition:color var(--motion-quick) var(--motion-ease),background-color var(--motion-quick) var(--motion-ease),border-color var(--motion-quick) var(--motion-ease),transform var(--motion-quick) var(--motion-ease)}
.product-showcase-more-link:hover,.product-showcase-more-link:focus-visible{transform:translateY(-1px)}
.product-showcase-more-link:active,.product-tab:active,.products-load-more-btn:active,.why-btn:active,.article-share button:active,.privacy-back:active,.lightbox-close:active,.back-to-top:active{transform:scale(.985)}
.lightbox-nav:active{transform:translateY(-50%) scale(.985)}
.product-card-action svg,.product-showcase-arrow,.product-showcase-more-link svg,.news-read-more svg,.contact-submit svg,.products-load-more-btn svg,.navbar-cta svg{transition:transform var(--motion-standard) var(--motion-ease)}
.product-card:hover .product-card-action svg,.product-card:focus-within .product-card-action svg,.product-showcase-card:hover .product-showcase-arrow,.product-showcase-card:focus-within .product-showcase-arrow,.product-showcase-more-link:hover svg,.product-showcase-more-link:focus-visible svg,.news-card:hover .news-read-more svg,.contact-submit:hover svg{transform:translateX(2px)}
.why-link-label::after{transform:none;transition:opacity var(--motion-quick) var(--motion-ease)}
.why-link-chev{transition:transform var(--motion-standard) var(--motion-ease)}
.why-link:hover .why-link-chev,.why-link:focus-visible .why-link-chev{transform:translateX(2px)}
.why-hero-media::before{transition:opacity var(--motion-standard) var(--motion-ease);transform:none!important}
.why-point::before,.why-point-num{transition:transform var(--motion-standard) var(--motion-ease)}
@keyframes motion-fade{from{opacity:0}to{opacity:1}}
@keyframes motion-panel-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes motion-panel-out{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(4px)}}
@keyframes motion-backdrop-out{from{opacity:1}to{opacity:0}}
@keyframes productFadeIn{from{opacity:0}to{opacity:1}}
@media(hover:hover) and (pointer:fine){
  .product-center-preview :is(.series-card,.product-model-card):hover{transform:translateY(-2px)}
  .product-center-preview :is(.series-card,.product-model-card):hover img{transform:scale(1.015)}
  .product-center-preview .product-model-link:hover .product-model-action-label::after{opacity:1}
  .product-center-preview .product-model-link:hover .product-model-action>svg{transform:translateX(2px)}
}
.product-center-preview .product-model-link:active{transform:scale(.995)}
.product-center-preview :is(.button,.search-box button,.icon-button):active,.navbar-cta:active,.contact-submit:active,.btn-primary:active,.btn-outline:active{transform:scale(.985)}
@media(hover:none){
  .product-card:hover,.app-bento-card:hover,.news-card:hover,.why-point:hover,.cert-badge:hover,.contact-map-card:hover,.article-nav a:hover,.btn-primary:hover,.btn-outline:hover,.why-btn:hover,.contact-submit:hover,.products-load-more-btn:hover,.back-to-top:hover{transform:none}
  .product-card:hover img,.app-bento-card:hover .app-bento-bg,.news-card:hover img,.why-hero-media:hover img,.client-card:hover img{transform:none}
  .product-showcase-card:hover .product-card-image img,.product-showcase-card:focus-within .product-card-image img,.product-showcase-more-link:hover,.why-link:hover,.contact-copy:hover,.contact-choice-list label:hover span,.article-share button:hover{transform:none}
  .back-to-top.visible:hover{transform:none}
  .navbar-nav>a:not(.navbar-cta):hover,.navbar.scrolled .navbar-nav>a:not(.navbar-cta):hover{color:var(--text);background:transparent}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{transition:none!important;animation:none!important}
  .reveal{opacity:1!important;transform:none!important}
  .product-center-preview :is(.series-card,.product-model-card):hover,.product-center-preview .product-model-link:active{transform:none}
  .product-center-preview :is(.series-card,.product-model-card):hover img,.product-center-preview .product-model-link:hover .product-model-action>svg{transform:none}
  .product-card:hover,.app-bento-card:hover,.news-card:hover,.why-point:hover,.cert-badge:hover,.contact-map-card:hover,.article-nav a:hover,.btn-primary:hover,.btn-outline:hover,.why-btn:hover,.contact-submit:hover,.products-load-more-btn:hover,.back-to-top:hover,.why-link:hover,.why-link:active,.navbar-cta:active,.contact-submit:active,.btn-primary:active,.btn-outline:active{transform:none}
  .product-card:hover img,.app-bento-card:hover .app-bento-bg,.app-bento-card:hover .app-bento-content,.news-card:hover img,.why-hero-media:hover img,.client-card:hover img,.navbar-cta:hover svg,.why-link:hover .why-link-chev{transform:none}
  .product-center-preview :is(.button,.search-box button,.icon-button):active{transform:none}
  .lightbox-nav:active{transform:translateY(-50%)}
  .lightbox-close:active{transform:none}
  .back-to-top.visible:hover,.back-to-top.visible:active{transform:none}
  .product-showcase-more-link:hover,.product-showcase-more-link:focus-visible,.product-showcase-more-link:active,.product-tab:active,.products-load-more-btn:active,.why-btn:active,.article-share button:hover,.article-share button:active,.privacy-back:active,.back-to-top:active,.contact-copy:hover,.contact-choice-list label:hover span,.product-card:focus-within,.why-link:focus-visible{transform:none}
  .product-showcase-card:hover .product-card-image img,.product-showcase-card:focus-within .product-card-image img,.product-card:focus-within .product-card-image img,.product-card:hover .product-card-action svg,.product-card:focus-within .product-card-action svg,.product-showcase-card:hover .product-showcase-arrow,.product-showcase-card:focus-within .product-showcase-arrow,.product-showcase-more-link:hover svg,.product-showcase-more-link:focus-visible svg,.news-card:hover .news-read-more svg,.contact-submit:hover svg,.why-link:focus-visible .why-link-chev,.why-point:hover .why-point-num{transform:none}
  .lightbox-content,.product-lightbox.open .lightbox-content{transform:none}
}