/*
 * Opt-in final contact CTA.
 * Content and destinations remain owned by the existing dynamic block.
 */
.dir-ui.dir-ui-contact-cta {
	position: relative;
	display: block;
	min-height: 0;
	overflow: hidden;
	padding-block: clamp(var(--dir-ui-space-16), 6vw, var(--dir-ui-space-20));
	color: var(--dir-ui-color-text-inverse);
	background: var(--dir-ui-color-brand-dark);
}

.dir-ui.dir-ui-contact-cta::before,
.dir-ui.dir-ui-contact-cta::after {
	display: none;
	background: none;
}

.dir-ui.dir-ui-contact-cta .dir-v2-contact-cta__inner {
	position: relative;
	z-index: 1;
	display: grid;
	width: min(
		calc(100% - (var(--dir-ui-container-padding) * 2)),
		var(--dir-ui-container-max)
	);
	max-width: none;
	grid-template-columns: minmax(0, 1.15fr) auto;
	gap: clamp(var(--dir-ui-space-8), 6vw, var(--dir-ui-space-20));
	align-items: center;
	margin-inline: auto;
}

.dir-ui.dir-ui-contact-cta .dir-v2-contact-copy {
	max-width: 42rem;
}

.dir-ui.dir-ui-contact-cta .dir-v2-contact-copy__title {
	max-width: 18ch;
	margin: 0;
	color: var(--dir-ui-color-text-inverse);
	font-family: var(--dir-ui-font-heading);
	font-size: clamp(var(--dir-ui-font-size-700), 3.1vw, var(--dir-ui-font-size-900));
	font-weight: var(--dir-ui-font-weight-bold);
	line-height: var(--dir-ui-line-height-tight);
	letter-spacing: var(--dir-ui-letter-spacing-tight);
}

.dir-ui.dir-ui-contact-cta .dir-v2-contact-copy__text {
	max-width: 38rem;
	margin: var(--dir-ui-space-4) 0 0;
	color: var(--dir-ui-color-neutral-200);
	font-family: var(--dir-ui-font-body);
	font-size: var(--dir-ui-font-size-400);
	font-weight: var(--dir-ui-font-weight-regular);
	line-height: var(--dir-ui-line-height-body);
	letter-spacing: 0;
}

.dir-ui.dir-ui-contact-cta .dir-v2-contact-actions {
	display: flex;
	min-width: 0;
	flex-wrap: wrap;
	gap: var(--dir-ui-space-4);
	align-items: center;
	justify-content: flex-end;
}

.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button {
	width: auto;
	min-width: 0;
	min-height: 3.25rem;
	gap: var(--dir-ui-space-2);
	padding: 0.75rem 1.5rem;
	border: 1px solid transparent;
	border-radius: var(--dir-ui-button-radius) !important;
	font-family: var(--dir-ui-font-heading);
	font-size: var(--dir-ui-font-size-300);
	font-weight: var(--dir-ui-font-weight-bold);
	line-height: 1;
	letter-spacing: 0;
	white-space: nowrap;
	transition:
		color var(--dir-ui-transition-fast),
		background-color var(--dir-ui-transition-fast),
		border-color var(--dir-ui-transition-fast),
		transform var(--dir-ui-transition-fast);
}

.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button svg {
	width: 1.125rem;
	height: 1.125rem;
	flex: 0 0 1.125rem;
	fill: none;
	stroke: currentcolor;
	stroke-width: 1.9;
}

.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--primary,
.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--primary:visited {
	color: var(--dir-ui-color-brand-dark);
	background: var(--dir-ui-color-neutral-0);
	border-color: var(--dir-ui-color-neutral-0);
}

.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--primary:hover,
.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--primary:focus-visible {
	color: var(--dir-ui-color-brand-dark);
	background: var(--dir-ui-color-brand-on-dark);
	border-color: var(--dir-ui-color-brand-on-dark);
	transform: translateY(-1px);
}

.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--secondary,
.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--secondary:visited {
	color: var(--dir-ui-color-text-inverse) !important;
	background: transparent;
	border-color: var(--dir-ui-color-neutral-0);
}

.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--secondary:hover,
.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--secondary:focus-visible {
	color: var(--dir-ui-color-brand-dark) !important;
	background: var(--dir-ui-color-neutral-0);
	border-color: var(--dir-ui-color-neutral-0);
	transform: translateY(-1px);
}

.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--secondary span {
	transition: transform var(--dir-ui-transition-fast);
}

.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--secondary:hover span,
.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--secondary:focus-visible span {
	transform: translateX(var(--dir-ui-space-1));
}

.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button:focus-visible {
	outline: 3px solid var(--dir-ui-color-focus);
	outline-offset: 3px;
}

@media (max-width: 1023px) {
	.dir-ui.dir-ui-contact-cta .dir-v2-contact-cta__inner {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--dir-ui-space-8);
	}

	.dir-ui.dir-ui-contact-cta .dir-v2-contact-actions {
		justify-content: flex-start;
	}
}

@media (max-width: 640px) {
	.dir-ui.dir-ui-contact-cta {
		padding-block: var(--dir-ui-space-16);
	}

	.dir-ui.dir-ui-contact-cta .dir-v2-contact-copy__title {
		max-width: none;
		font-size: var(--dir-ui-font-size-700);
	}

	.dir-ui.dir-ui-contact-cta .dir-v2-contact-copy__text {
		font-size: var(--dir-ui-font-size-400);
	}

	.dir-ui.dir-ui-contact-cta .dir-v2-contact-actions {
		display: grid;
		width: 100%;
		grid-template-columns: minmax(0, 1fr);
	}

	.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button {
		width: 100%;
		white-space: normal;
	}
}

@media (prefers-reduced-motion: reduce) {
	.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button,
	.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--secondary span {
		transition: none;
	}

	.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button:hover,
	.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button:focus-visible,
	.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--secondary:hover span,
	.dir-ui.dir-ui-contact-cta .dir-ui-contact-cta__button--secondary:focus-visible span {
		transform: none;
	}
}