/* =========================================================
 * Tech Resolve — WordPress Final CTA
 * ======================================================= */

.tr-wordpress-final-cta {
	position: relative;
	overflow: hidden;

	padding:
		clamp(115px,12vw,200px)
		var(--tr-gutter);

	color: #0c1912;

	background:
		linear-gradient(
			135deg,
			#f4f6f3,
			#edf5ef
		);
}


.tr-wordpress-final-cta__background,
.tr-wordpress-final-cta__grid,
.tr-wordpress-final-cta__glow {
	position: absolute;

	pointer-events: none;
}


.tr-wordpress-final-cta__background {
	inset: 0;
}


.tr-wordpress-final-cta__grid {
	inset: 0;

	opacity: .45;

	background-image:
		linear-gradient(
			rgba(8,185,93,.045) 1px,
			transparent 1px
		),
		linear-gradient(
			90deg,
			rgba(8,185,93,.045) 1px,
			transparent 1px
		);

	background-size: 54px 54px;
}


.tr-wordpress-final-cta__glow {
	top: -280px;
	right: -40px;

	width: 760px;
	height: 760px;

	background:
		radial-gradient(
			circle,
			rgba(25,224,120,.16),
			transparent 68%
		);
}


.tr-wordpress-final-cta__shell {
	position: relative;
	z-index: 2;

	display: grid;
	grid-template-columns:
		minmax(0,1.08fr)
		minmax(430px,.92fr);
	align-items: center;
	gap: clamp(60px,9vw,140px);

	width: min(100%,var(--tr-container));
	margin: 0 auto;
}


/* =========================================================
 * Copy
 * ======================================================= */

.tr-wordpress-final-cta__eyebrow {
	display: block;

	margin-bottom: 19px;

	color: #08b95d;

	font-size: 9px;
	font-weight: 800;
	letter-spacing: .15em;
}


.tr-wordpress-final-cta__copy h2 {
	max-width: 900px;
	margin: 0;

	font-size:
		clamp(48px,6vw,88px);

	font-weight: 800;
	line-height: .94;
	letter-spacing: -.062em;
}


.tr-wordpress-final-cta__copy > p {
	max-width: 690px;

	margin: 29px 0 0;

	color: #647169;

	font-size: 14px;
	line-height: 1.78;
}


/* =========================================================
 * Actions
 * ======================================================= */

.tr-wordpress-final-cta__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 11px;

	margin-top: 38px;
}


.tr-wordpress-final-cta__primary,
.tr-wordpress-final-cta__secondary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 11px;

	min-height: 52px;
	padding: 0 20px;

	text-decoration: none;

	border-radius: 999px;

	font-size: 10px;
	font-weight: 800;
}


.tr-wordpress-final-cta__primary {
	color: #06100d;

	background: #19e078;

	border: 1px solid #19e078;
}


.tr-wordpress-final-cta__primary:hover {
	color: #06100d;

	background: #35ef8d;
}


.tr-wordpress-final-cta__primary svg {
	width: 17px;
	height: 17px;
}


.tr-wordpress-final-cta__secondary {
	color: #536159;

	background: rgba(255,255,255,.72);

	border: 1px solid #d7e0da;
}


.tr-wordpress-final-cta__secondary:hover {
	color: #142019;

	background: #fff;

	border-color: #cbd7cf;
}


/* =========================================================
 * System
 * ======================================================= */

.tr-wordpress-final-cta__system {
	overflow: hidden;

	color: #fff;

	background: #07120e;

	border:
		1px solid rgba(25,224,120,.13);

	border-radius: 24px;

	box-shadow:
		0 40px 100px rgba(7,18,14,.17);
}


.tr-wordpress-final-cta__system-top {
	display: flex;
	align-items: center;
	justify-content: space-between;

	min-height: 51px;
	padding: 0 18px;

	color: rgba(255,255,255,.3);

	border-bottom:
		1px solid rgba(255,255,255,.075);

	font-size: 7px;
	font-weight: 800;
	letter-spacing: .12em;
}


.tr-wordpress-final-cta__system-top > div {
	display: flex;
	align-items: center;
	gap: 7px;

	color: #19e078;
}


.tr-wordpress-final-cta__system-top i {
	width: 6px;
	height: 6px;

	background: #19e078;

	border-radius: 50%;

	box-shadow:
		0 0 11px rgba(25,224,120,.7);
}


/* =========================================================
 * Map
 * ======================================================= */

.tr-wordpress-final-cta__map {
	position: relative;

	min-height: 370px;
}


.tr-wordpress-final-cta__orbit {
	position: absolute;
	top: 50%;
	left: 50%;

	width: 235px;
	height: 235px;

	transform:
		translate(-50%,-50%);
}


.tr-wordpress-final-cta__orbit span {
	position: absolute;

	border:
		1px solid rgba(25,224,120,.13);

	border-radius: 50%;
}


.tr-wordpress-final-cta__orbit span:nth-child(1) {
	inset: 0;
}


.tr-wordpress-final-cta__orbit span:nth-child(2) {
	inset: 31px;

	border-color:
		rgba(20,215,232,.09);
}


.tr-wordpress-final-cta__orbit span:nth-child(3) {
	inset: 67px;

	border-color:
		rgba(255,255,255,.07);
}


.tr-wordpress-final-cta__core {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 3;

	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;

	width: 120px;
	height: 120px;

	background:
		radial-gradient(
			circle,
			rgba(25,224,120,.15),
			rgba(25,224,120,.025)
		);

	border:
		1px solid rgba(25,224,120,.24);

	border-radius: 50%;

	transform:
		translate(-50%,-50%);
}


.tr-wordpress-final-cta__core span {
	color: #19e078;

	font-size: 8px;
	font-weight: 800;
}


.tr-wordpress-final-cta__core strong {
	margin-top: 5px;

	color: #fff;

	font-size: 29px;
	line-height: 1;
}


.tr-wordpress-final-cta__core small {
	margin-top: 5px;

	color: rgba(255,255,255,.3);

	font-size: 7px;
	font-weight: 800;
	letter-spacing: .12em;
}


/* =========================================================
 * Nodes
 * ======================================================= */

.tr-wordpress-final-cta__node {
	position: absolute;

	display: grid;
	place-items: center;

	width: 68px;
	height: 32px;

	color: rgba(255,255,255,.48);

	background:
		rgba(255,255,255,.025);

	border:
		1px solid rgba(255,255,255,.08);

	border-radius: 999px;

	font-size: 7px;
	font-weight: 800;
	letter-spacing: .1em;
}


.tr-wordpress-final-cta__node--one {
	top: 45px;
	left: 50%;

	transform:
		translateX(-50%);
}


.tr-wordpress-final-cta__node--two {
	top: 50%;
	right: 34px;

	transform:
		translateY(-50%);
}


.tr-wordpress-final-cta__node--three {
	bottom: 45px;
	left: 50%;

	transform:
		translateX(-50%);
}


.tr-wordpress-final-cta__node--four {
	top: 50%;
	left: 34px;

	transform:
		translateY(-50%);
}


/* =========================================================
 * Status
 * ======================================================= */

.tr-wordpress-final-cta__status {
	display: grid;
	grid-template-columns:
		1fr
		auto
		1fr;
	align-items: center;
	gap: 20px;

	padding: 20px;

	border-top:
		1px solid rgba(255,255,255,.07);
}


.tr-wordpress-final-cta__status span {
	display: block;

	color: rgba(255,255,255,.25);

	font-size: 7px;
	font-weight: 800;
	letter-spacing: .11em;
}


.tr-wordpress-final-cta__status strong {
	display: block;

	margin-top: 5px;

	color: rgba(255,255,255,.66);

	font-size: 9px;
}


.tr-wordpress-final-cta__status > i {
	width: 6px;
	height: 6px;

	background: #19e078;

	border-radius: 50%;
}


@media (max-width: 1050px) {

	.tr-wordpress-final-cta__shell {
		grid-template-columns: 1fr;
	}

}