/* ByCar Design System · motion (v101) — Motion Guidelines-ის token-ები და დაცული ეფექტები */
@layer tokens{
:root{
 --dur-instant:90ms;--dur-fast:160ms;--dur-base:260ms;--dur-slow:420ms;--dur-reveal:700ms;
 --ease-out:cubic-bezier(.2,.8,.2,1);--ease-in-out:cubic-bezier(.65,0,.35,1);--ease-spring:cubic-bezier(.34,1.56,.64,1);
}
}
@layer components{
@keyframes ds-shimmer{to{background-position:-200% 0}}
@keyframes ds-spin{to{transform:rotate(360deg)}}
@keyframes ds-pop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
@keyframes ds-shake{0%,100%{transform:none}20%{transform:translateX(-6px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
@keyframes ds-draw{to{stroke-dashoffset:0}}
@keyframes ds-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes ds-fade{from{opacity:0}to{opacity:1}}
@keyframes ds-slide-up{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
@keyframes ds-slide-in{from{transform:translateX(100%)}to{transform:none}}
/* scroll-reveal: ds.js IntersectionObserver ამატებს .is-in-ს; JS-ის გარეშე ელემენტი ჩანს (progressive enhancement) */
.ds-js .ds-reveal{opacity:0;transform:translateY(16px);transition:opacity var(--dur-reveal) var(--ease-out),transform var(--dur-reveal) var(--ease-out);transition-delay:calc(var(--i,0)*55ms)}
.ds-js .ds-reveal.is-in{opacity:1;transform:none}
.ds-shake{animation:ds-shake .42s var(--ease-in-out)}
.ds-pop{animation:ds-pop .45s var(--ease-spring) both}
.ds-rise{animation:ds-rise var(--dur-reveal) var(--ease-out) both;animation-delay:calc(var(--i,0)*55ms)}
}
/* reduced-motion: ყველა ds- ანიმაცია გამორთულია, მდგომარეობა მყისიერად იცვლება */
@media (prefers-reduced-motion:reduce){
 [class*="ds-"],[class*="ds-"]::before,[class*="ds-"]::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
 .ds-js .ds-reveal{opacity:1;transform:none}
}