/* BizHub motion layer */

/* menus unfold (3D) on open and fold away on close */
.bm-acct-menu,.bm-bell-menu{transform-origin:top right;animation:bm-unfold .42s cubic-bezier(.2,1.3,.4,1) both!important}
.bm-acct-menu > *,.bm-bell-menu > *{animation:bm-item-in .4s cubic-bezier(.2,.9,.3,1) both}
.bm-acct-menu > *:nth-child(2),.bm-bell-menu > *:nth-child(2){animation-delay:.04s}
.bm-acct-menu > *:nth-child(3),.bm-bell-menu > *:nth-child(3){animation-delay:.08s}
.bm-acct-menu > *:nth-child(4),.bm-bell-menu > *:nth-child(4){animation-delay:.12s}
.bm-acct-menu > *:nth-child(5),.bm-bell-menu > *:nth-child(5){animation-delay:.16s}
.bm-acct-menu > *:nth-child(n+6),.bm-bell-menu > *:nth-child(n+6){animation-delay:.2s}
details.is-closing > .bm-acct-menu,details.is-closing > .bm-bell-menu{animation:bm-fold .23s cubic-bezier(.6,0,.8,.4) forwards!important}
@keyframes bm-unfold{0%{opacity:0;transform:perspective(700px) rotateX(-28deg) scale(.86) translateY(-10px);clip-path:inset(0 0 100% 0 round 18px)}
  60%{opacity:1}100%{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 18px)}}
@keyframes bm-fold{to{opacity:0;transform:perspective(700px) rotateX(22deg) scale(.9) translateY(-8px);clip-path:inset(0 0 70% 0 round 18px)}}
@keyframes bm-item-in{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}

/* BizHub dropdown in the main menu: drops with a bounce */
@media(min-width:1200px){
  .bm-navdd:hover .bm-navdd-panel,.bm-navdd.is-open .bm-navdd-panel,.bm-navdd:focus-within .bm-navdd-panel{animation:bm-dd-in .45s cubic-bezier(.2,1.3,.4,1) both}
  .bm-navdd-panel a{transition:transform .25s,background .2s}
}
@keyframes bm-dd-in{from{opacity:0;transform:translate(-42%,18px) scale(.94);filter:blur(4px)}to{opacity:1;transform:translate(-42%,0);filter:none}}

/* mobile menu: links cascade in */
@media(max-width:1199px){
  .bm-nav.is-open{animation:bm-sheet .45s cubic-bezier(.2,1,.3,1) both}
  .bm-nav.is-open > *{animation:bm-cascade .5s cubic-bezier(.2,1,.3,1) both;animation-delay:calc(var(--i,0) * 45ms + 80ms)}
}
@keyframes bm-sheet{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes bm-cascade{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}

/* search panel slides down with blur */
.bm-searchpanel:not([hidden]){animation:bm-search-in .4s cubic-bezier(.2,1.2,.4,1) both}
@keyframes bm-search-in{from{opacity:0;transform:translateY(-16px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}

/* fly-to-cart */
.bm-fly{position:fixed;z-index:9998;object-fit:cover;border-radius:16px;pointer-events:none;box-shadow:0 20px 40px -10px rgba(6,23,12,.6);
  transition:transform .62s cubic-bezier(.5,-.3,.7,.9),opacity .62s ease-in,border-radius .62s}
.bm-cart-link.is-bump{animation:bm-bump .55s cubic-bezier(.3,1.8,.5,1)}
@keyframes bm-bump{0%{transform:scale(1)}40%{transform:scale(1.35) rotate(-8deg)}100%{transform:scale(1)}}

/* toast: drops in, swipes out */
.bm-toast{animation:bm-toast-in .55s cubic-bezier(.2,1.4,.4,1) both}
.bm-toast.is-leaving{animation:bm-toast-out .38s cubic-bezier(.6,0,.8,.4) forwards}
@keyframes bm-toast-in{from{opacity:0;transform:translateY(-40px) scale(.9)}to{opacity:1;transform:none}}
@keyframes bm-toast-out{to{opacity:0;transform:translateX(120%) rotate(6deg)}}

/* product and vendor cards rise with a slight 3D flip */
.bm-flipin{opacity:0;transform:perspective(900px) rotateX(16deg) translateY(30px);transform-origin:center bottom}
.bm-flipin.is-in{opacity:1;transform:none;transition:opacity .7s ease var(--d,0ms),transform .8s cubic-bezier(.2,1,.3,1) var(--d,0ms)}
.no-js .bm-flipin,.bm-calm .bm-flipin{opacity:1;transform:none}

/* category tiles: photo zooms and a light sweep crosses on hover */
.bm-catrow-photo{position:relative;overflow:hidden}
.bm-catrow-photo img{transition:transform .6s cubic-bezier(.2,1,.3,1)}
.bm-catrow-item:hover .bm-catrow-photo img{transform:scale(1.14) rotate(-2deg)}
.bm-catrow-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s ease}
.bm-catrow-item:hover .bm-catrow-photo::after{transform:translateX(120%)}

/* chat opens with a zoom from the list */
.bm-wa.is-open .bm-wa-pane{animation:bm-chat-in .35s cubic-bezier(.2,1,.3,1)}
@keyframes bm-chat-in{from{opacity:.4;transform:translateX(24px)}to{opacity:1;transform:none}}

/* dashboard pages: main column slides in, side menu items cascade */
.bm-dmain{animation:bm-cascade-up .6s cubic-bezier(.2,1,.3,1) backwards}
.bm-dmain:has(.bm-wa.is-open){animation:none}
.bm-dnav a{animation:bm-cascade .5s cubic-bezier(.2,1,.3,1) both}
.bm-dnav a:nth-child(2){animation-delay:.03s}.bm-dnav a:nth-child(3){animation-delay:.06s}.bm-dnav a:nth-child(4){animation-delay:.09s}.bm-dnav a:nth-child(5){animation-delay:.12s}
.bm-dnav a:nth-child(6){animation-delay:.15s}.bm-dnav a:nth-child(7){animation-delay:.18s}.bm-dnav a:nth-child(8){animation-delay:.21s}.bm-dnav a:nth-child(n+9){animation-delay:.24s}
@keyframes bm-cascade-up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion: reduce){
  .bm-acct-menu,.bm-bell-menu,.bm-acct-menu > *,.bm-bell-menu > *,.bm-nav.is-open,.bm-nav.is-open > *,.bm-toast,.bm-dmain,.bm-dnav a,.bm-searchpanel{animation:none!important}
}