/* ============================================================
   记工表 官网 V3 · motion（揭示 / 步进 / 降级）· compositor-only
   ============================================================ */
.js .reveal { opacity: 0; transform: translateY(26px); transition: opacity var(--dur-slow) var(--ease-out-expo), transform var(--dur-slow) var(--ease-out-expo); }
.reveal.in { opacity: 1; transform: none; }
.js .reveal[data-d="1"] { transition-delay: .08s; }
.js .reveal[data-d="2"] { transition-delay: .16s; }
.js .reveal[data-d="3"] { transition-delay: .24s; }

/* hero 真机缓浮（仅高端） */
.device { will-change: transform; }
.js:not(.is-cheap) .hero-stage.in .device { animation: floatY 7s ease-in-out infinite; }
@keyframes floatY { 0%,100% { transform: rotate(2deg) translateY(0); } 50% { transform: rotate(2deg) translateY(-12px); } }

/* Bento 柱状图滚入升起 */
.js:not(.is-cheap) .bars i { transform: scaleY(0); transform-origin: bottom; transition: transform .7s var(--ease-out-expo); }
.js:not(.is-cheap) .tile.in .bars i { transform: scaleY(1); }
.js:not(.is-cheap) .bars i:nth-child(2){transition-delay:.06s}
.js:not(.is-cheap) .bars i:nth-child(3){transition-delay:.12s}
.js:not(.is-cheap) .bars i:nth-child(4){transition-delay:.18s}
.js:not(.is-cheap) .bars i:nth-child(5){transition-delay:.24s}
.js:not(.is-cheap) .bars i:nth-child(6){transition-delay:.30s}
.js:not(.is-cheap) .bars i:nth-child(7){transition-delay:.36s}

/* reduced-motion：全静态终态 */
@media (prefers-reduced-motion: reduce) {
  .reveal, .js .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  .device, .bars i { animation: none !important; transform: none !important; }
  .hero-stage .device { transform: rotate(2deg) !important; }
}