/**
 * Orphit Newsletter-Formular — fest auf die Landingpage-Typografie gesetzt.
 * Werte gespiegelt aus /orphit-lp/theme.json + assets/css/vars.css (literale
 * Fallbacks, damit kein anderes Theme (Bricks) die Fonts/Größen überschreibt).
 *   Fonts:   Golos Text (Body), Signika (Display)
 *   Schrift: clamp-Skala step--1 / step-0 / step-1
 */

.orphit-nl-form,
.orphit-nl-popup .orphit-nl-form {
	--orphit-nl-font-body: "Golos Text", system-ui, -apple-system, "Segoe UI",
		Roboto, sans-serif;
	--orphit-nl-font-display: "Signika", system-ui, sans-serif;
	--orphit-nl-step--1: 13px;
	--orphit-nl-step-0: 15px;
	--orphit-nl-step-1: 22px;
	--orphit-nl-text: var(--text, #25211f);
	--orphit-nl-muted: var(--textmuted, #5e676b);
	--orphit-nl-cta: var(--cta, #36787b);
	--orphit-nl-cta-dark: var(--cta-dark, #2b6b6b);
	--orphit-nl-primary: var(--primary, #3c8c8c);
	--orphit-nl-surface: var(--surface, #faf7f2);
	--orphit-nl-surface2: var(--surface2, #e2ddd5);
	--orphit-nl-bg: var(--bg, #fff8f0);

	max-width: 440px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: var(--space-3, 0.75rem);
	font-family: var(--orphit-nl-font-body);
	font-size: var(--orphit-nl-step-0);
	line-height: 1.5;
	color: var(--orphit-nl-text);
}

.orphit-nl-form .orphit-nl-heading {
	margin: 0 0 var(--space-1, 0.25rem);
	font-family: var(--orphit-nl-font-display);
	font-size: var(--orphit-nl-step-1);
	font-weight: 600;
	line-height: 1.25;
	color: var(--orphit-nl-text);
}

.orphit-nl-row {
	display: flex;
	flex-direction: column;
	gap: var(--space-2, 0.5rem);
}

.orphit-nl-row--split {
	flex-direction: row;
	gap: var(--space-3, 0.75rem);
}

.orphit-nl-row--split .orphit-nl-input {
	flex: 1 1 0;
}

.orphit-nl-form .orphit-nl-label {
	font-family: var(--orphit-nl-font-body);
	font-size: var(--orphit-nl-step--1);
	font-weight: 500;
	color: var(--orphit-nl-muted);
}

.orphit-nl-form input.orphit-nl-input,
.orphit-nl-form .orphit-nl-input {
	width: 100%;
	padding: 13px 16px;
	border: 1px solid var(--orphit-nl-surface2);
	border-radius: var(--radius-md, 12px);
	background: var(--orphit-nl-surface);
	font-family: var(--orphit-nl-font-body) !important;
	font-size: var(--orphit-nl-step-0) !important;
	line-height: 1.3;
	color: var(--orphit-nl-text);
	box-sizing: border-box;
	transition: border-color var(--duration-fast, 150ms) ease,
		box-shadow var(--duration-fast, 150ms) ease;
}

.orphit-nl-form .orphit-nl-input::placeholder {
	color: var(--orphit-nl-muted);
	opacity: 0.7;
}

.orphit-nl-form .orphit-nl-input:focus {
	outline: none;
	border-color: var(--orphit-nl-primary);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--orphit-nl-primary) 25%, transparent);
}

.orphit-nl-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.orphit-nl-form .orphit-nl-consent {
	display: flex;
	gap: var(--space-3, 0.75rem);
	align-items: flex-start;
	font-family: var(--orphit-nl-font-body);
	font-size: var(--orphit-nl-step--1);
	line-height: 1.5;
	color: var(--orphit-nl-muted);
	cursor: pointer;
}

.orphit-nl-form .orphit-nl-consent input {
	margin-top: 2px;
	accent-color: var(--orphit-nl-cta);
}

.orphit-nl-form button.orphit-nl-submit {
	margin-top: var(--space-1, 0.25rem);
	padding: 15px 32px;
	border: 0;
	border-radius: var(--radius-full, 999px);
	background: var(--orphit-nl-cta);
	color: #fff;
	font-family: var(--orphit-nl-font-body) !important;
	font-size: var(--orphit-nl-step-0) !important;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background var(--duration-fast, 150ms) ease,
		opacity var(--duration-fast, 150ms) ease;
}

.orphit-nl-form .orphit-nl-submit:hover,
.orphit-nl-form .orphit-nl-submit:focus-visible {
	background: var(--orphit-nl-cta-dark);
}

.orphit-nl-form .orphit-nl-submit:disabled {
	opacity: 0.6;
	cursor: default;
}

.orphit-nl-form .orphit-nl-status {
	margin: 0;
	min-height: 1.2em;
	font-family: var(--orphit-nl-font-body);
	font-size: var(--orphit-nl-step--1);
}

.orphit-nl-status.is-success {
	color: #0a7a5c;
}

.orphit-nl-status.is-error {
	color: #b32d2e;
}

/* Cloudflare Turnstile (interaction-only): reservierten Platz entfernen,
   solange keine Challenge angezeigt wird (kein iframe im Widget). Sobald
   Cloudflare einen iframe rendert, greift die Regel nicht mehr. */
.cf-turnstile[data-appearance="interaction-only"]:not(:has(iframe)) {
	height: 0;
	min-height: 0;
	margin: 0;
	overflow: hidden;
}