/* ==========================================================================
   组件：滚动渐入
   由 js/components/reveal.js 注入 data-reveal，无 JS 时内容正常显示
   用 translate 独立属性做位移，避免与卡片 hover 的 transform 冲突
   ========================================================================== */

.has-reveal [data-reveal] {
    opacity: 0;
    translate: 0 18px;
    transition: opacity 0.7s cubic-bezier(0.22, 0.61, 0.36, 1),
        translate 0.7s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.has-reveal [data-reveal].is-in {
    opacity: 1;
    translate: none;
}

@media (prefers-reduced-motion: reduce) {
    .has-reveal [data-reveal] {
        opacity: 1;
        translate: none;
        transition: none;
    }
}