/* fx/firma-orient.css · firma "rotor" (scoped bajo .fx). Partitura: _motion-brief.md */
.fx{
  --fx-dur-1:120ms; --fx-dur-2:280ms; --fx-dur-3:620ms;
  --fx-ease-out:cubic-bezier(.23,1,.32,1);
  --fx-ease-out-expo:cubic-bezier(.16,1,.3,1);
  --fx-stagger:60ms;
}
/* las aspas giran sobre su propio cubo: el transform se escribe en el atributo (translate + rotate) */
.fx [data-fx="rotor"] .blades,.fx [data-fx="rotor-mini"] .blades{transform-box:view-box}
.fx [data-fx="rotor-mini"] .mdl,.fx .mdl{transition:box-shadow var(--fx-dur-2) var(--fx-ease-out)}
@media (hover:hover) and (pointer:fine){.fx .mdl:hover{box-shadow:inset 0 0 0 1.5px var(--brand-1)}}
@media (prefers-reduced-motion:reduce){
  .fx [data-fx] *{animation:none!important}
}
/* paralaje de fotos: el driver escribe translate3d en `transform`; la holgura va en `scale` (propiedad aparte) */
.fx img[data-fx="parallax"]{scale:1.26}
/* mercados: estado armado (solo con JS, bajo el pliegue) -> la ola los enciende con transition-delay por punto */
.fx .mk circle[data-k]{transition:opacity 420ms var(--fx-ease-out),transform 520ms var(--fx-ease-out-expo)}
.fx .mk.is-armed circle[data-k]{opacity:0;transform:scale(.2)}
.fx .mk__hk-ring{transform-box:fill-box;transform-origin:center}