/* join: original homepage design and editable color variables. */

:where(.wp-site-blocks, .editor-styles-wrapper) .join-banner h2 {
	font-size: clamp(44px,5.6vw,72px);
	line-height: .96;
	letter-spacing: -3px;
	margin: 0;
	font-weight: 700;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .join-banner em {
	font-family: Georgia,"Times New Roman",serif;
	font-weight: 600;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .join-banner {
	margin: 0 auto 70px;
	max-width: 1120px;
	text-align: center;
	padding: 75px 20px;
	border-radius: 22px;
	color: #fff;
	background: radial-gradient(circle at 20% 40%,#fe9d81,transparent 26%),linear-gradient(115deg,#dc4272,#642fc2);
}

:where(.wp-site-blocks, .editor-styles-wrapper) .join-banner h2 {
	font-size: 54px;
	margin-bottom: 23px;
}

@media(max-width:760px) {
	:where(.wp-site-blocks, .editor-styles-wrapper) .join-banner {
		margin: 0 16px 52px;
		padding: 58px 20px;
	}
	
	:where(.wp-site-blocks, .editor-styles-wrapper) .join-banner h2 {
		font-size: 41px;
	}
	
}

.np-block.join-banner {
	color: var(--join-text, #fff);
	background: radial-gradient(circle at 20% 40%, var(--join-glow, #fe9d81), transparent 26%),
		linear-gradient(115deg, var(--join-start, #dc4272), var(--join-end, #642fc2));
}