/* MUTTI LAB 2.0 — Motion System V2.0
 * Signature: Float -> Focus -> Settle.
 */
@keyframes ml2-float{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-5px,0)}
}
@keyframes ml2-reveal-settle{
  0%{opacity:0;transform:translate3d(0,12px,0) scale(.992)}
  100%{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
.ml2-motion-float{animation:ml2-float 6.8s var(--ml2-ease-standard) infinite}
.ml2-motion-reveal{animation:ml2-reveal-settle var(--ml2-duration-editorial) var(--ml2-ease-emphasized) both}
.ml2-product-focus{transition:transform var(--ml2-duration-commerce) var(--ml2-ease-standard),filter var(--ml2-duration-commerce) var(--ml2-ease-standard)}
.ml2-product-focus:hover{transform:scale(1.025)}

/* Signature visual device. It is opt-in and never attached to legacy/current components automatically. */
.ml2-arc{position:absolute;pointer-events:none;isolation:isolate}
.ml2-arc::before{
  content:"";display:block;width:min(54vw,760px);aspect-ratio:2/1;border-radius:50%;
  border:clamp(10px,1.4vw,20px) solid transparent;
  border-top-color:color-mix(in srgb,var(--ml2-color-raspberry) 38%,transparent);
  border-right-color:color-mix(in srgb,var(--ml2-color-violet) 30%,transparent);
  filter:blur(2px);
}

@media(prefers-reduced-motion:reduce){
  .ml2-motion-float,.ml2-motion-reveal{animation:none}
  .ml2-product-focus,.ml2-button{transition-duration:.01ms}
  .ml2-product-focus:hover,.ml2-button:hover{transform:none}
}
