/* Page CTA (closing call to action on inner pages): full-width photo under a dark veil that runs straight
   into the footer; text and button on the left, light contact plate on the right inside the photo. Mobile-first. */

.iw-pcta {
	--iw-pcta-drift: 80px; /* photo parallax travel, see script.js */
	position: relative;
	isolation: isolate;
	display: flex;
	align-items: flex-end;
	min-height: 520px;
	overflow: hidden;
	background: var(--iw-color-espresso);
	color: var(--iw-color-on-ink);
}

.iw-pcta__media {
	position: absolute;
	inset: 0;
	z-index: -2;
	overflow: hidden;
}

.iw-pcta__media picture {
	display: block;
	width: 100%;
	height: 100%;
}

/* Taller than the section so it can drift with the scroll without showing an edge */
.iw-pcta__media img {
	display: block;
	width: 100%;
	height: calc(100% + var(--iw-pcta-drift));
	object-fit: cover;
	transform: translate3d(0, var(--iw-shift, calc(var(--iw-pcta-drift) / -2)), 0);
	will-change: transform;
}

.iw-pcta__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg,
			color-mix(in srgb, var(--iw-color-espresso) 70%, transparent) 0%,
			color-mix(in srgb, var(--iw-color-espresso) 92%, transparent) 100%);
}

.iw-pcta__inner {
	display: grid;
	gap: var(--iw-space-10);
	width: 100%;
	max-width: var(--iw-container);
	margin: 0 auto;
	padding: var(--iw-space-16) var(--iw-gutter);
}

.iw-pcta__kicker {
	display: flex;
	align-items: center;
	gap: var(--iw-space-4);
	margin: 0 0 var(--iw-space-4);
	color: var(--iw-color-taupe-light);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}

.iw-pcta__kicker::before {
	content: "";
	flex: none;
	width: 40px;
	height: 2px;
	background: var(--iw-color-primary);
}

.iw-pcta__title {
	max-width: 18ch;
	margin: 0 0 var(--iw-space-6);
	color: var(--iw-color-on-ink);
	font-size: clamp(2.25rem, 1.5rem + 3vw, 4rem);
	line-height: var(--iw-leading-tight);
	letter-spacing: -0.02em;
}

.iw-pcta__title-accent {
	display: block;
	color: var(--iw-color-taupe);
}

.iw-pcta__text {
	max-width: 34rem;
	margin: 0 0 var(--iw-space-8);
	color: rgb(255 255 255 / 80%);
	font-size: var(--iw-text-lg);
}

/* Same green button as the home CTA; scoped so Elementor's ".elementor a" rules do not win */
.iw-pcta .iw-pcta__button {
	display: inline-block;
	padding: var(--iw-space-4) var(--iw-space-8);
	border-radius: var(--iw-radius);
	background: var(--iw-color-primary);
	color: var(--iw-color-on-primary);
	font-size: 1.0625rem;
	font-weight: 600;
	text-decoration: none;
	transition: background-color 0.15s ease;
}

.iw-pcta .iw-pcta__button:hover {
	background: var(--iw-color-primary-dark);
	color: var(--iw-color-on-primary);
}

/* Contact plate */
.iw-pcta__plate {
	display: grid;
	gap: var(--iw-space-6);
	padding: var(--iw-space-6);
	background: var(--iw-color-bg);
	box-shadow: var(--iw-shadow-md);
	color: var(--iw-color-ink);
}

.iw-pcta__block {
	display: grid;
	align-content: start;
	justify-items: start;
	gap: var(--iw-space-1);
}

.iw-pcta__block + .iw-pcta__block {
	padding-top: var(--iw-space-6);
	border-top: 1px solid var(--iw-color-line);
}

.iw-pcta__label {
	margin: 0 0 var(--iw-space-1);
	color: var(--iw-color-ink-soft);
	font-size: var(--iw-text-sm);
}

.iw-pcta .iw-pcta__email,
.iw-pcta .iw-pcta__phone {
	color: var(--iw-color-brown);
	font-family: var(--iw-font-heading);
	font-size: var(--iw-text-h4);
	line-height: var(--iw-leading-tight);
	font-variant-numeric: lining-nums;
	text-decoration: none;
	transition: color 0.15s ease;
}

.iw-pcta .iw-pcta__email:hover,
.iw-pcta .iw-pcta__phone:hover {
	color: var(--iw-color-primary-dark);
}

/* Reveal (script.js adds is-armed, then is-in): text fades in, the plate rises */
@media (prefers-reduced-motion: no-preference) {
	.iw-pcta.is-armed .iw-pcta__content > *,
	.iw-pcta.is-armed .iw-pcta__plate {
		opacity: 0;
		transform: translateY(20px);
		transition: opacity 0.8s ease, transform 0.9s cubic-bezier(0.2, 0.7, 0.2, 1);
	}

	.iw-pcta.is-armed.is-in .iw-pcta__content > *,
	.iw-pcta.is-armed.is-in .iw-pcta__plate {
		opacity: 1;
		transform: none;
	}

	.iw-pcta.is-in .iw-pcta__content > :nth-child(2) { transition-delay: 0.1s; }
	.iw-pcta.is-in .iw-pcta__content > :nth-child(3) { transition-delay: 0.2s; }
	.iw-pcta.is-in .iw-pcta__content > :nth-child(4) { transition-delay: 0.3s; }
	.iw-pcta.is-in .iw-pcta__plate { transition-delay: 0.5s; }
}

@media (min-width: 1024px) {
	.iw-pcta {
		--iw-pcta-drift: 120px;
		min-height: clamp(560px, 64svh, 700px);
	}

	.iw-pcta__media::after {
		background:
			linear-gradient(90deg,
				color-mix(in srgb, var(--iw-color-espresso) 90%, transparent) 0%,
				color-mix(in srgb, var(--iw-color-espresso) 70%, transparent) 50%,
				color-mix(in srgb, var(--iw-color-espresso) 45%, transparent) 100%);
	}

	/* Text on the left, plate on the right; both end on the same line */
	.iw-pcta__inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		align-items: end;
		gap: var(--iw-space-8);
		padding: var(--iw-space-24) var(--iw-gutter);
	}

	.iw-pcta__content {
		grid-column: 1 / span 7;
	}

	.iw-pcta__plate {
		grid-column: 9 / span 4;
		padding: var(--iw-space-8);
	}
}
