/*
 * Hiệu ứng dùng chung trang chủ JA (.lx) và trang con JA (.jh-sub).
 * JS assets/js/ja-home-lux.js gắn .lx-js lên wrapper rồi thêm .is-in khi
 * phần tử vào màn hình. Không có JS / bật giảm chuyển động -> không ẩn gì.
 * Ưu tiên dễ đọc: chỉ hiện dần + dịch nhẹ 16px, tối đa .6s, không blur.
 */

/* khối nội dung / tiêu đề trồi lên (stagger 80ms do JS đặt --d) */
.lx-js .lx-up,
.lx-js .lx-mask {
  opacity: 0; transform: translateY(16px);
  transition: opacity .6s cubic-bezier(.22, .61, .36, 1) var(--d, 0s), transform .6s cubic-bezier(.22, .61, .36, 1) var(--d, 0s);
}
.lx-js :is(.lx-up, .lx-mask).is-in { opacity: 1; transform: none; }

/* ảnh bài viết ([jh_latest_posts]) */
:is(.lx, .jh-sub) .jh-post__img { clip-path: none; border-radius: 6px; }

/* giảm chuyển động: tắt toàn bộ animation / transition trên site JA */
@media (prefers-reduced-motion: reduce) {
  body.jh-site *, body.jh-site *::before, body.jh-site *::after {
    animation: none !important; transition: none !important; scroll-behavior: auto !important;
  }
}