/* Sunspire Motion — styles for assets/js/sunspire-motion.js
   html.ss-motion is set in <head> only when JS runs and the visitor allows motion. */

/* Hidden until the engine has applied the "from" state (no flash of the final layout) */
html.ss-motion [data-ss-anim]:not(.ss-anim-init) {
	opacity: 0;
}

@media (max-width: 767px) {
	html.ss-motion [data-ss-anim][data-ss-mobile="off"] {
		opacity: 1;
	}
}

/* Split words: each word sits in its own mask (descenders get a little room) */
.ss-split .ss-word {
	display: inline-block;
	overflow: hidden;
	vertical-align: top;
	padding-bottom: 0.2em;     /* room for descenders (g, y, p) in tight line-heights */
	margin-bottom: -0.2em;
}

/* After the reveal the mask is no longer needed */
.ss-split--done .ss-word {
	overflow: visible;
}

.ss-split--plain .ss-word {
	overflow: visible;
	padding-bottom: 0;
	margin-bottom: 0;
}

.ss-split .ss-word__in {
	display: inline-block; /* no will-change: GSAP promotes words only while they move */
}

/* Gradient headings: the gradient is painted per word (see paintGradient in the JS) */
.ss-split[data-ss-gradient] {
	background-image: none !important;
}

.ss-split .ss-word__in--gradient {
	/* Gradient text only paints inside the word's own box: stretch the box over the
	   descenders (g, y) and ascenders, then pull the layout back so nothing moves. */
	padding: 0.1em 0.04em 0.25em;
	margin: -0.1em -0.04em -0.25em;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}

/* Zoom out: the enlarged image stays inside its own frame */
.ss-zoom-frame,
.ss-zoom-frame > .elementor-widget-container {
	overflow: clip;
}

/* Rise: content comes up out of the element's own bottom edge */
.ss-rise {
	overflow: clip;
}