/**
 * 图片视差悬停：配合 assets/js/parallax-hover.js
 *
 * 用法 A（经典 Image 小部件）：高级 → CSS 类加在**小部件外层** → cx-parallax-hover
 * 用法 B（Elementor V4 原子化图片 / 类直接打在 img 上）：给 **img** 加 cx-parallax-hover 即可
 *
 * 可选旧类名：img.cx-parallax-hover-img（与用法 B 相同）
 *
 * 可调变量（写在对应 img 或外层容器上）：
 * --cx-parallax-shift：最大位移，默认 12px
 * --cx-parallax-scale：悬停略放大，默认 1.05（外层有 overflow:hidden 时边缘更干净）
 */

.cx-parallax-hover:not(img) {
	overflow: hidden;
	display: block;
	--cx-parallax-shift: 12px;
	--cx-parallax-scale: 1.05;
}

.cx-parallax-hover:not(img) img {
	display: block;
	width: 100%;
	height: auto;
	vertical-align: middle;
	transform-origin: center center;
	transition: transform 0.35s ease;
	will-change: transform;
}

img.cx-parallax-hover,
img.cx-parallax-hover-img {
	--cx-parallax-shift: 12px;
	--cx-parallax-scale: 1.05;
	display: block;
	max-width: 100%;
	height: auto;
	overflow: hidden;
	transform-origin: center center;
	transition: transform 0.35s ease;
	will-change: transform;
}