.dm-newsletter {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.dm-newsletter input {
	flex: 1;
	min-width: 0;
	height: 42px;
	padding: 0 14px;
	border: 1px solid var(--border-strong);
	background: var(--surface);
	color: var(--text);
	border-radius: var(--r-md);
	font-size: var(--fs-400);
}

.dm-newsletter button {
	height: 42px;
	padding: 0 16px;
	border: none;
	background: var(--accent);
	color: var(--accent-fg);
	border-radius: var(--r-md);
	font-weight: 600;
}

.dm-newsletter--dark {
	background: #0b0b0c;
	border-radius: var(--r-3xl);
	padding: clamp(40px, 5vw, 64px);
	text-align: center;
	position: relative;
	overflow: hidden;
}

.dm-newsletter--dark::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 50% 0%, rgba(58, 77, 255, 0.15), transparent 60%);
	pointer-events: none;
}

.dm-newsletter--centered {
	position: relative;
	z-index: 1;
}

.dm-newsletter--inline {
	justify-content: center;
	max-width: 440px;
	margin: 0 auto;
}

.dm-newsletter--inline input {
	height: 52px;
	border-radius: var(--r-pill);
	border-color: #2e2e32;
	background: #141416;
	color: #fff;
}

.dm-newsletter--inline button {
	height: 52px;
	padding: 0 26px;
	border-radius: var(--r-pill);
	font-size: var(--fs-500);
	white-space: nowrap;
}

.dm-newsletter--stack {
	flex-direction: column;
	flex-wrap: nowrap;
	gap: 8px;
}

.dm-newsletter--stack input {
	width: 100%;
	flex: none;
	height: 40px;
	border-radius: var(--r-md);
}

.dm-newsletter--stack button {
	width: 100%;
	height: 40px;
	background: var(--text);
	color: var(--bg);
	border-radius: var(--r-md);
	font-weight: 600;
}

.dm-newsletter--stack button:hover {
	opacity: 0.9;
}

.dm-newsletter__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
}

.dm-newsletter__status {
	flex: 1 1 100%;
	margin: 0;
	font-size: var(--fs-300);
	line-height: 1.4;
}

.dm-newsletter.is-success .dm-newsletter__status {
	color: var(--accent);
}

.dm-newsletter.is-error .dm-newsletter__status {
	color: #c0392b;
}

.dm-newsletter.is-pending button {
	opacity: 0.7;
	cursor: wait;
}

.dm-newsletter.is-success input,
.dm-newsletter.is-success button {
	display: none;
}

.dm-blog-post-newsletter {
	margin-top: 32px;
	padding-top: 32px;
	border-top: 1px solid var(--border);
}