/**
 * Component 23 — Prefooter (CTA)
 * Block: .imea-pf   |   Handle: imea-prefooter
 * Namespaced, additive, token-driven. CSS-only (no JS). No dependency on
 * other components. Colours pulled from the design: black field, #21A55E
 * radial glow, #CCFC00 lime button with dark (#062D1F) label.
 */

.imea-pf {
	position: relative;
	padding: clamp(64px, 10vw, 140px) 0;
	background: #000;
	color: var(--text-light, #F4FAF6);
	overflow: hidden;
	isolation: isolate;
}

/* Green radial glow (matches the SVG paint0_radial). */
.imea-pf::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: radial-gradient(
		60% 90% at 50% 42%,
		rgba(33, 165, 94, .55) 0%,
		rgba(33, 165, 94, .18) 34%,
		rgba(6, 45, 31, 0) 70%
	);
	opacity: .7;
	pointer-events: none;
}

/* Optional background image sits under the glow. */
.imea-pf--has-bg::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	background-image: var(--imea-pf-bg);
	background-size: cover;
	background-position: center;
	opacity: .5;
	pointer-events: none;
}

.imea-pf > .container { position: relative; z-index: 1; }

.imea-pf__inner {
	/* max-width: 760px; */
	margin: 0 auto;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
}

/* ---- Text ---------------------------------------------------------------- */
.imea-pf__eyebrow {
	margin: 0 0 16px;
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--primary-color, #21A55E);
}

.imea-pf__title {
	margin: 0;
	font-size: 68px;
	line-height: normal;
	font-weight: 400;
	color: var(--text-light, #F4FAF6);
	letter-spacing: -0.01em;
}

.imea-pf__accent {
	background: linear-gradient(180deg, #177241 30%, #CCFC00 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.imea-pf__desc {
	margin: 18px 0 0;
	max-width: 620px;
	font-size: 22px;
	line-height: 1.6;
	color: rgba(244, 250, 246, .72);
}

/* ---- CTA button (lime pill, dark label) ---------------------------------- */
.imea-pf__actions { margin-top: clamp(28px, 4vw, 44px); }

.imea-pf__btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 28px;
	border-radius: 6px;
	background: var(--secondary-color, #CCFC00);
	color: #062D1F;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
	box-shadow: 0 6px 22px rgba(204, 252, 0, .18);
}

.imea-pf__btn:hover,
.imea-pf__btn:focus-visible {
	transform: translateY(-2px);
	background: #d7ff26;
	box-shadow: 0 10px 30px rgba(204, 252, 0, .32);
	color: #062D1F;
}

.imea-pf__btn:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 3px;
}

.imea-pf__arrow {
	width: 18px;
	height: 18px;
	flex: none;
	transition: transform .25s ease;
}

.imea-pf__btn:hover .imea-pf__arrow,
.imea-pf__btn:focus-visible .imea-pf__arrow {
	transform: translateX(3px);
}

@media(max-width:768px){
	.imea-pf__title {
	    font-size: 32px;
	}
}

/* ---- Reduced motion ------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
	.imea-pf__btn,
	.imea-pf__arrow { transition: none; }
	.imea-pf__btn:hover { transform: none; }
	.imea-pf__btn:hover .imea-pf__arrow { transform: none; }
}