/* UPJET Motion System V4.2 — lightweight, progressive enhancement */
:root{--uj-motion-ease:cubic-bezier(.2,.72,.2,1);--uj-motion-fast:.28s;--uj-motion-normal:.58s}

/* Native reveal fallback. Classes are added only by JS, so content never stays hidden if JS fails. */
html.upjet-motion .uj-motion-item{opacity:0;transform:translate3d(0,18px,0);transition:opacity var(--uj-motion-normal) var(--uj-motion-ease),transform var(--uj-motion-normal) var(--uj-motion-ease);transition-delay:var(--uj-delay,0ms);will-change:opacity,transform}
html.upjet-motion .uj-motion-item.uj-motion-visible{opacity:1;transform:none;will-change:auto}
html.upjet-motion .uj-motion-item.uj-motion-from-left{transform:translate3d(-18px,0,0)}
html.upjet-motion .uj-motion-item.uj-motion-from-right{transform:translate3d(18px,0,0)}
html.upjet-motion .uj-motion-item.uj-motion-from-left.uj-motion-visible,
html.upjet-motion .uj-motion-item.uj-motion-from-right.uj-motion-visible{transform:none}

/* Category hover — no layout jump and no interference with the marquee track. */
html.upjet-motion .v5-category-section .upjet-poster-card{transition:transform .28s var(--uj-motion-ease),filter .28s ease}
html.upjet-motion .v5-category-section .upjet-poster-card .category-thumb{transition:transform .32s var(--uj-motion-ease)}
@media (hover:hover) and (pointer:fine){
  html.upjet-motion .v5-category-section .upjet-poster-card:hover{transform:translateY(-4px);filter:drop-shadow(0 10px 14px rgba(15,23,42,.08))}
  html.upjet-motion .v5-category-section .upjet-poster-card:hover .category-thumb{transform:scale(1.055) rotate(-1deg)}
}

/* Product cards keep their existing hover but get a smoother image response. */
html.upjet-motion .product-card{transition:transform .28s var(--uj-motion-ease),box-shadow .28s ease,border-color .28s ease}
html.upjet-motion .product-card img{transition:transform .38s var(--uj-motion-ease)}
@media (hover:hover) and (pointer:fine){html.upjet-motion .product-card:hover img{transform:translateY(-2px) scale(1.025)}}

/* Banner depth is intentionally subtle so ad artwork stays readable. */
html.upjet-motion .upjet-banner-layout-card,
html.upjet-motion .v5-promo-card{transition:transform .35s var(--uj-motion-ease),box-shadow .35s ease}
@media (hover:hover) and (pointer:fine){
  html.upjet-motion .upjet-banner-layout-card:hover,
  html.upjet-motion .v5-promo-card:hover{transform:translateY(-3px);box-shadow:0 18px 36px rgba(15,23,42,.10)}
}

/* Mobile drawer links arrive as a short cascade. */
@media(max-width:980px){
  html.upjet-motion .mobile-store-drawer .mobile-nav-links>a{opacity:0;transform:translateX(12px);transition:opacity .3s var(--uj-motion-ease),transform .3s var(--uj-motion-ease)}
  html.upjet-motion body.menu-open .mobile-store-drawer .mobile-nav-links>a{opacity:1;transform:none}
  html.upjet-motion body.menu-open .mobile-store-drawer .mobile-nav-links>a:nth-child(1){transition-delay:30ms}
  html.upjet-motion body.menu-open .mobile-store-drawer .mobile-nav-links>a:nth-child(2){transition-delay:55ms}
  html.upjet-motion body.menu-open .mobile-store-drawer .mobile-nav-links>a:nth-child(3){transition-delay:80ms}
  html.upjet-motion body.menu-open .mobile-store-drawer .mobile-nav-links>a:nth-child(4){transition-delay:105ms}
  html.upjet-motion body.menu-open .mobile-store-drawer .mobile-nav-links>a:nth-child(5){transition-delay:130ms}
  html.upjet-motion body.menu-open .mobile-store-drawer .mobile-nav-links>a:nth-child(n+6){transition-delay:150ms}
}

/* PC Builder polish; GSAP handles sequencing when available. */
html.upjet-motion .pcb-step-v31,
html.upjet-motion .pcb-slot-v28{transition:transform .28s var(--uj-motion-ease),box-shadow .28s ease,border-color .28s ease}
@media (hover:hover) and (pointer:fine){html.upjet-motion .pcb-step-v31:hover{transform:translateY(-3px);box-shadow:0 15px 30px rgba(15,23,42,.075)}}

@media(prefers-reduced-motion:reduce){
  html.upjet-motion *,html.upjet-motion *::before,html.upjet-motion *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
  html.upjet-motion .uj-motion-item{opacity:1!important;transform:none!important}
}