/**
 * SoapKits - scroll-linked animations
 *
 * Deliberately tiny. Nothing here hides content: every "start hidden" state is
 * applied by the JavaScript, so if the script fails to load the page renders
 * normally. That is the opposite of Elementor's own entrance animation, which
 * ships `elementor-invisible` in the HTML and leaves content hidden forever if
 * its JS never runs.
 *
 * Everything else the effects need is written inline by GSAP at runtime.
 */

/*
 * Parallax clip.
 *
 * `.fq-card-img` ships as `overflow: visible` and the image inside it is
 * SHORTER than the frame, so a translated image spills out and overlaps the
 * heading and body text below it. This adds the clip that turns the overscale
 * applied by the script into usable headroom.
 *
 * The image is deliberately NOT taken out of flow: the frame derives its height
 * from the image, so `position: absolute` would collapse the frame to zero.
 */
.sk-parallax {
	overflow: hidden;
}

.sk-parallax > img {
	will-change: transform;
	backface-visibility: hidden;
}

/*
 * Belt-and-braces for reduced motion. The script already returns early, but if
 * a transform was applied before the preference changed (or by some other
 * script) this neutralises it.
 */
@media (prefers-reduced-motion: reduce) {
	.sk-parallax > img {
		transform: none !important;
	}
}