.pipeline-newsletter-popup {
	--newsletter-popup-bg: var(--wp--preset--color--iron-black, #111213);
	--newsletter-popup-border: color-mix(in srgb, var(--wp--preset--color--white, #fff) 16%, transparent);
	--newsletter-popup-muted: color-mix(in srgb, var(--wp--preset--color--white, #fff) 72%, transparent);
	--newsletter-popup-red: var(--wp--preset--color--brand-red, #d71920);
	inset: 0;
	pointer-events: none;
	position: fixed;
	z-index: 100000;
}

.pipeline-newsletter-popup[hidden] {
	display: none;
}

.pipeline-newsletter-popup__backdrop {
	display: none;
}

.pipeline-newsletter-popup__dialog {
	background: var(--newsletter-popup-bg);
	border: 1px solid var(--newsletter-popup-border);
	border-radius: var(--wp--custom--radius--brand, 2px);
	box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.35);
	box-sizing: border-box;
	color: var(--wp--preset--color--white, #fff);
	inline-size: min(26rem, calc(100vw - 2rem));
	inset-block-end: 1.5rem;
	inset-inline-start: 1.5rem;
	opacity: 0;
	overflow: hidden;
	pointer-events: auto;
	position: absolute;
	transform: translateY(1rem);
	transition:
		opacity 260ms ease,
		transform 260ms ease,
		visibility 260ms ease;
	visibility: hidden;
}

.pipeline-newsletter-popup.is-open .pipeline-newsletter-popup__dialog {
	opacity: 1;
	transform: translateY(0);
	visibility: visible;
}

.pipeline-newsletter-popup__dialog::before {
	border: 4px solid color-mix(in srgb, var(--wp--preset--color--white, #fff) 22%, transparent);
	border-radius: 999px;
	block-size: 5.75rem;
	content: "";
	inline-size: 5.75rem;
	inset-block-start: -2.9rem;
	inset-inline-end: -2.9rem;
	position: absolute;
}

.pipeline-newsletter-popup__close {
	align-items: center;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 0;
	color: var(--wp--preset--color--white, #fff);
	cursor: pointer;
	display: inline-flex;
	inline-size: 2.75rem;
	inset-block-start: 0.75rem;
	inset-inline-end: 0.75rem;
	justify-content: center;
	min-block-size: 2.75rem;
	padding: 0;
	position: absolute;
	z-index: 2;
}

.pipeline-newsletter-popup__close:hover,
.pipeline-newsletter-popup__close:focus-visible {
	background: color-mix(in srgb, var(--wp--preset--color--white, #fff) 8%, transparent);
	border-color: var(--newsletter-popup-border);
	outline: none;
}

.pipeline-newsletter-popup__close span,
.pipeline-newsletter-popup__close span::after {
	background: currentcolor;
	block-size: 2px;
	content: "";
	display: block;
	inline-size: 1.25rem;
	position: absolute;
	transform: rotate(45deg);
}

.pipeline-newsletter-popup__close span::after {
	transform: rotate(90deg);
}

.pipeline-newsletter-popup__content {
	box-sizing: border-box;
	padding: clamp(1.75rem, 5vw, 2.5rem);
	position: relative;
}

.pipeline-newsletter-popup__logo {
	block-size: auto;
	display: block;
	inline-size: 7.25rem;
	margin-block-end: 1.75rem;
}

.pipeline-newsletter-popup__title {
	color: var(--wp--preset--color--white, #fff);
	font-family: var(--wp--preset--font-family--display, "Chakra Petch", sans-serif);
	font-size: clamp(1.75rem, 5vw, 2.25rem);
	font-weight: 700;
	letter-spacing: 0;
	line-height: 0.95;
	margin: 0;
	max-inline-size: 17rem;
	text-transform: uppercase;
}

.pipeline-newsletter-popup__desc {
	color: var(--newsletter-popup-muted);
	font-size: 0.95rem;
	font-weight: 500;
	line-height: 1.55;
	margin: 1rem 0 1.5rem;
}

.pipeline-newsletter-popup__form,
.pipeline-newsletter-popup__form .fluentform,
.pipeline-newsletter-popup__form .fluentform form,
.pipeline-newsletter-popup__form .fluentform fieldset {
	box-sizing: border-box;
	margin: 0;
	min-inline-size: 0;
	padding: 0;
	width: 100%;
}

.pipeline-newsletter-popup__form .fluentform fieldset {
	display: grid;
	gap: 0.75rem;
}

.pipeline-newsletter-popup__form .ff-el-group {
	margin: 0;
}

.pipeline-newsletter-popup__form .ff-el-input--label {
	border: 0;
	clip: rect(0 0 0 0);
	block-size: 1px;
	inline-size: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	white-space: nowrap;
}

.pipeline-newsletter-popup__form .ff-el-input--content {
	margin: 0;
}

.pipeline-newsletter-popup__form .ff-el-form-control {
	background: color-mix(in srgb, var(--wp--preset--color--white, #fff) 7%, transparent);
	border: 1px solid var(--newsletter-popup-border);
	border-radius: var(--wp--custom--radius--brand, 2px);
	box-shadow: none;
	box-sizing: border-box;
	color: var(--wp--preset--color--white, #fff);
	font-family: var(--wp--preset--font-family--mono, "IBM Plex Mono", monospace);
	font-size: 0.75rem;
	font-weight: 700;
	inline-size: 100%;
	letter-spacing: 0;
	min-block-size: 3rem;
	outline: none;
	padding: 0.85rem 1rem;
	text-transform: uppercase;
	transition:
		background-color 160ms ease,
		border-color 160ms ease,
		box-shadow 160ms ease;
}

.pipeline-newsletter-popup__form .ff-el-form-control::placeholder {
	color: color-mix(in srgb, var(--wp--preset--color--white, #fff) 62%, transparent);
	opacity: 1;
}

.pipeline-newsletter-popup__form .ff-el-form-control:focus {
	background: color-mix(in srgb, var(--wp--preset--color--white, #fff) 10%, transparent);
	border-color: var(--newsletter-popup-red);
	box-shadow: 0 0 0 1px var(--newsletter-popup-red);
}

.pipeline-newsletter-popup__form .ff_submit_btn_wrapper {
	margin: 0.25rem 0 0;
}

.pipeline-newsletter-popup__form .ff-btn-submit {
	align-items: center;
	background: var(--newsletter-popup-red);
	border: 1px solid var(--newsletter-popup-red);
	border-radius: var(--wp--custom--radius--brand, 2px);
	box-shadow: var(--wp--custom--shadow--btn, 0 1px 2px rgba(0, 0, 0, 0.06));
	color: var(--wp--preset--color--white, #fff);
	cursor: pointer;
	display: inline-flex;
	font-family: var(--wp--preset--font-family--display, "Chakra Petch", sans-serif);
	font-size: 0.875rem;
	font-weight: 700;
	gap: 0.5rem;
	justify-content: center;
	letter-spacing: 0;
	min-block-size: 3.125rem;
	padding: 0.85rem 1rem;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	transition:
		background-color 160ms ease,
		border-color 160ms ease,
		transform 160ms ease;
	width: 100%;
}

.pipeline-newsletter-popup__form .ff-btn-submit:hover,
.pipeline-newsletter-popup__form .ff-btn-submit:focus-visible {
	background: var(--wp--preset--color--brand-red-hover, #a81218);
	border-color: var(--wp--preset--color--brand-red-hover, #a81218);
	outline: none;
}

.pipeline-newsletter-popup__form .ff-btn-submit:active {
	transform: scale(0.98);
}

.pipeline-newsletter-popup__form .ff-btn-submit::after {
	background: currentcolor;
	block-size: 1em;
	content: "";
	display: inline-block;
	inline-size: 1em;
	mask: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='none' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke-linecap='square' stroke-linejoin='miter' stroke-width='2' d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") no-repeat center / contain;
	-webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='none' stroke='black' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke-linecap='square' stroke-linejoin='miter' stroke-width='2' d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") no-repeat center / contain;
}

.pipeline-newsletter-popup__form .ff-el-is-error .ff-el-form-control {
	border-color: var(--newsletter-popup-red);
}

.pipeline-newsletter-popup__form .error,
.pipeline-newsletter-popup__form .text-danger,
.pipeline-newsletter-popup__form .ff-el-help-message,
.pipeline-newsletter-popup__form .ff-errors-in-stack {
	color: color-mix(in srgb, var(--wp--preset--color--white, #fff) 88%, var(--newsletter-popup-red));
	font-size: 0.75rem;
	line-height: 1.35;
	margin: 0.35rem 0 0;
}

.pipeline-newsletter-popup__form .ff-message-success {
	background: color-mix(in srgb, var(--wp--preset--color--white, #fff) 8%, transparent);
	border: 1px solid var(--newsletter-popup-border);
	border-radius: var(--wp--custom--radius--brand, 2px);
	color: var(--wp--preset--color--white, #fff);
	font-size: 0.9rem;
	line-height: 1.45;
	margin: 0;
	padding: 1rem;
}

.pipeline-newsletter-popup__disclaimer {
	color: color-mix(in srgb, var(--wp--preset--color--white, #fff) 58%, transparent);
	display: block;
	font-family: var(--wp--preset--font-family--mono, "IBM Plex Mono", monospace);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.35;
	margin: 1rem 0 0;
	text-transform: uppercase;
}

@media (width >= 42rem) {
	.pipeline-newsletter-popup__form .fluentform fieldset {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.pipeline-newsletter-popup__form .ff-el-group:nth-child(n + 3),
	.pipeline-newsletter-popup__form .ff_submit_btn_wrapper {
		grid-column: 1 / -1;
	}
}

@media (width < 42rem) {
	.pipeline-newsletter-popup {
		align-items: end;
		background: rgba(17, 18, 19, 0);
		display: flex;
		transition: background-color 260ms ease;
	}

	.pipeline-newsletter-popup.is-open {
		background: rgba(17, 18, 19, 0.42);
	}

	.pipeline-newsletter-popup__backdrop {
		display: block;
		inset: 0;
		pointer-events: auto;
		position: absolute;
	}

	.pipeline-newsletter-popup__dialog {
		border-block-end: 0;
		border-end-end-radius: 0;
		border-end-start-radius: 0;
		inline-size: 100%;
		inset: auto 0 0;
		max-block-size: min(88vh, 42rem);
		overflow: auto;
		transform: translateY(100%);
	}

	.pipeline-newsletter-popup.is-open .pipeline-newsletter-popup__dialog {
		transform: translateY(0);
	}

	.pipeline-newsletter-popup__content {
		padding: 2rem clamp(1.25rem, 6vw, 2rem) max(2rem, env(safe-area-inset-bottom));
	}
}

@media (prefers-reduced-motion: reduce) {
	.pipeline-newsletter-popup,
	.pipeline-newsletter-popup__dialog {
		transition: none;
	}
}