Scss transition property not working after Svelte transition

Question

I have an element that have a transition in with svelte. But in my css I have a transition property that doesn't work right after the svelte transition is finished.

My element with the in transition :

<div
      in:scale={{
        delay: 250,
        duration: 650,
        easing: quadInOut,
      }}
    >
      <img
        src="https://picsum.photos/200"
        alt="mobile version"
      />
    </div>

and here is the scss code where there is the problem

> div {
      transition: transform 0.75s ease; //transform transition that doesn't trigger

      @media screen and (min-width: 1025px) {
        @for $i from 1 to 5 {
          &:nth-of-type(#{$i}) {
            @include global.offset(random(750) + px, 0); //translating each elements with transform property
          }
        }
      }

So my element snap to its translating place right after the svelte transition which is bad, but it doesn't go slowly there.