/* ==========================================================================
   Parallax Split Block — sticky text
   ========================================================================== */

.parallax-split {
	--content-bg: #fff;
	--content-text: #1a1a1a;
	--content-muted: #555;
	--cta-bg: #1a1a1a;
	--cta-text: #fff;

	display: flex;
	align-items: flex-start;
	width: 100%;
}

/* Image panel — must be taller than viewport to give sticky room to operate */
.parallax-split__image-panel {
	width: 50%;
	min-height: 100vh;
}

.parallax-split__image-bg {
	width: 100%;
	height: 100%;
	min-height: 200vh;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

/* Text panel — sticks while image scrolls past */
.parallax-split__content-panel {
	width: 50%;
	position: sticky;
	top: 0;
	height: 100vh;
	display: flex;
	align-items: center;
	background-color: var(--content-bg);
}

.parallax-split__content-inner {
	padding: 3rem;
}

/* Column order */
.parallax-split--image-right .parallax-split__image-panel { order: 2; }
.parallax-split--image-right .parallax-split__content-panel { order: 1; }
.parallax-split--image-left .parallax-split__image-panel { order: 1; }
.parallax-split--image-left .parallax-split__content-panel { order: 2; }

/* Typography */
.parallax-split__eyebrow {
	font-size: 0.75rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	opacity: 0.6;
	margin: 0 0 1rem;
}

.parallax-split__heading {
	font-size: clamp(2rem, 4vw, 3.25rem);
	line-height: 1.1;
	font-weight: 700;
	color: var(--content-text);
	margin: 0 0 1.5rem;
}

.parallax-split__body {
	font-size: 17px;
	line-height: 1.75;
	color: var(--content-muted);
	margin: 0 0 2rem;
}

/* CTA */
.parallax-split__cta {
	display: inline-block;
	padding: 0.8em 2em;
	font-size: 0.9rem;
	font-weight: 600;
	text-decoration: none;
	background-color: var(--cta-bg);
	color: var(--cta-text);
}

/* Mobile — stack, no sticky */
@media (max-width: 767px) {
	.parallax-split { flex-direction: column; }
	.parallax-split__image-panel,
	.parallax-split__content-panel {
		width: 100%;
		order: unset !important;
		position: static;
		height: auto;
		min-height: 0;
	}
	.parallax-split__image-panel { min-height: 60vw; }
	.parallax-split__image-bg { min-height: 60vw; }
}