.ssq {
	position: relative;
	height: var(--ssq-h, 300vh);
	background: var(--ssq-bg, #000);
	margin: 0;
	padding: 0;
}

/* Break out of a boxed Divi/Elementor row to the full browser width. */
.ssq.ssq-fullwidth {
	width: calc(100vw - var(--ssq-sbw, 0px));
	left: 50%;
	margin-left: calc((100vw - var(--ssq-sbw, 0px)) / -2);
	max-width: none;
}

.ssq-sticky {
	position: sticky;
	top: 0;
	height: 100vh;
	height: 100svh;
	overflow: hidden;
}

/* JS pinning fallback, used automatically when a theme wrapper breaks sticky
   (e.g. a parent with overflow: hidden). */
.ssq.ssq-js-pin .ssq-sticky { position: absolute; top: 0; left: 0; right: 0; }
.ssq.ssq-js-pin.is-pinned .ssq-sticky { position: fixed; top: 0; }
.ssq.ssq-js-pin.is-after .ssq-sticky { top: auto; bottom: 0; }

.ssq-canvas,
.ssq-poster {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
}

.ssq-poster { object-fit: cover; }
.ssq-poster.ssq-fit-contain { object-fit: contain; }
.ssq.ssq-ready .ssq-poster { visibility: hidden; }

/* Reduced motion: show a single still frame, no long scroll. */
.ssq.ssq-static { height: auto; }
.ssq.ssq-static .ssq-sticky { position: relative; height: 70vh; }
.ssq.ssq-static .ssq-canvas { display: none; }

.ssq-text {
	position: absolute;
	left: 0;
	right: 0;
	padding: 0 6vw;
	text-align: center;
	color: var(--ssq-color, #fff);
	opacity: 0;
	transform: translateY(16px);
	transition: opacity .6s ease, transform .6s ease;
	pointer-events: none;
	z-index: 2;
}
.ssq-text.is-visible { opacity: 1; transform: none; }
.ssq-pos-top { top: 10%; }
.ssq-pos-center { top: 50%; margin-top: -1.5em; }
.ssq-pos-bottom { bottom: 10%; }

.ssq .ssq-headline {
	color: inherit;
	font-size: clamp(30px, 5.5vw, 72px);
	line-height: 1.05;
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 0;
	padding: 0;
	text-shadow: 0 2px 24px rgba(0, 0, 0, .35);
}
.ssq .ssq-subhead {
	color: inherit;
	font-size: clamp(16px, 1.8vw, 22px);
	line-height: 1.4;
	margin: .6em auto 0;
	padding: 0;
	max-width: 40em;
	opacity: .85;
	text-shadow: 0 1px 12px rgba(0, 0, 0, .35);
}

@media (prefers-reduced-motion: reduce) {
	.ssq-text { transition: none; transform: none; }
}