/* Narres Immobilienbewertung – Kontaktformular (Frontend-Styles)
 *
 * Farben, Maße und Schriftgrößen wurden aus dem PDF-Export der
 * Kontaktseite ausgemessen (Feldhöhe 59 px, Rand #cac4cb,
 * Feldfüllung #faf6ef, Button #d8451f, Labels PT Serif 16,5 px).
 * Alles unter .nikf-wrap gekapselt, um Theme-Konflikte zu vermeiden.
 */

.nikf-wrap {
	--nikf-card: #ffffff;
	--nikf-field-bg: #faf6ef;
	--nikf-field-border: #cac4cb;
	--nikf-ink: #3b2f63;
	--nikf-body: #6e6683;
	--nikf-muted: #9c93b3;
	--nikf-orange: #d8451f;
	--nikf-orange-dark: #b6371a;
	--nikf-on-orange: #faf6ef;

	--nikf-success-bg: #eee8f7;
	--nikf-error-bg: #fdeee9;
	--nikf-error-ink: #8f2d12;

	--nikf-font: "PT Serif", Georgia, "Times New Roman", serif;

	max-width: 639px;
	margin: 0 auto;
	box-sizing: border-box;
	font-family: var(--nikf-font);
}

.nikf-wrap *,
.nikf-wrap *::before,
.nikf-wrap *::after {
	box-sizing: border-box;
}

/* --- Karte ---------------------------------------------------------- */
.nikf-form {
	background: var(--nikf-card);
	padding: 55px 54px;
	color: var(--nikf-ink);
	font-size: 16.5px;
	line-height: 1.5;
}

/* --- Optionaler Kopfbereich (nur bei titel="" / intro="") ----------- */
.nikf-head {
	margin-bottom: 32px;
}

.nikf-form__title {
	margin: 0;
	font-family: "Playfair Display", var(--nikf-font);
	font-weight: 600;
	font-size: 30px;
	line-height: 1.2;
	color: var(--nikf-ink);
}

.nikf-form__intro {
	margin: 12px 0 0;
	font-size: 17px;
	line-height: 1.55;
	color: var(--nikf-body);
}

/* --- Felder --------------------------------------------------------- */
.nikf-field {
	margin: 0 0 26px;
}

.nikf-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 24px;
}

.nikf-field label {
	display: block;
	margin-bottom: 10px;
	font-size: 16.5px;
	line-height: 1.3;
	color: var(--nikf-ink);
}

.nikf-field input[type="text"],
.nikf-field input[type="tel"],
.nikf-field input[type="email"],
.nikf-field textarea {
	display: block;
	width: 100%;
	background: var(--nikf-field-bg);
	border: 1px solid var(--nikf-field-border);
	border-radius: 0;
	padding: 0 16px;
	font-family: var(--nikf-font);
	font-size: 16.5px;
	line-height: 1.4;
	color: var(--nikf-ink);
	appearance: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.nikf-field input[type="text"],
.nikf-field input[type="tel"],
.nikf-field input[type="email"] {
	height: 59px;
}

.nikf-field textarea {
	height: 156px;
	padding: 15px 16px;
	resize: vertical;
}

.nikf-field input:focus,
.nikf-field textarea:focus {
	outline: none;
	border-color: var(--nikf-orange);
	box-shadow: 0 0 0 2px rgba(216, 69, 31, 0.18);
}

.nikf-field input::placeholder,
.nikf-field textarea::placeholder {
	color: var(--nikf-muted);
	opacity: 1;
}

/* --- Optionale Einwilligungs-Checkbox ------------------------------- */
.nikf-consent label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--nikf-body);
}

.nikf-consent input[type="checkbox"] {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin-top: 3px;
	accent-color: var(--nikf-orange);
}

/* --- Button --------------------------------------------------------- */
.nikf-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 230px;
	max-width: 100%;
	height: 63px;
	margin-top: 14px;
	padding: 0 20px;
	border: 0;
	border-radius: 0;
	background: var(--nikf-orange);
	color: var(--nikf-on-orange);
	font-family: var(--nikf-font);
	font-size: 19px;
	line-height: 1;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.nikf-submit:hover,
.nikf-submit:focus-visible {
	background: var(--nikf-orange-dark);
}

.nikf-submit:focus-visible {
	outline: 2px solid var(--nikf-ink);
	outline-offset: 3px;
}

/* --- Datenschutz-Hinweis unter dem Button --------------------------- */
.nikf-privacy-note {
	margin: 36px 0 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--nikf-muted);
}

.nikf-privacy-note a,
.nikf-consent a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.nikf-privacy-note a:hover,
.nikf-consent a:hover {
	color: var(--nikf-orange);
}

/* --- Statusmeldungen ------------------------------------------------ */
.nikf-notice {
	margin: 0 0 20px;
	padding: 18px 22px;
	font-size: 16px;
	line-height: 1.55;
	border-left: 3px solid;
}

.nikf-notice--success {
	background: var(--nikf-success-bg);
	border-left-color: var(--nikf-ink);
	color: var(--nikf-ink);
}

.nikf-notice--error {
	background: var(--nikf-error-bg);
	border-left-color: var(--nikf-orange);
	color: var(--nikf-error-ink);
}

/* --- Honeypot (für Menschen unsichtbar) ----------------------------- */
.nikf-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* --- Responsiv ------------------------------------------------------ */
@media (max-width: 700px) {
	.nikf-form {
		padding: 32px 24px;
	}

	.nikf-row {
		grid-template-columns: 1fr;
		column-gap: 0;
	}

	.nikf-field {
		margin-bottom: 22px;
	}

	.nikf-field input[type="text"],
	.nikf-field input[type="tel"],
	.nikf-field input[type="email"] {
		height: 54px;
	}

	.nikf-field textarea {
		height: 140px;
	}

	.nikf-submit {
		width: 100%;
		height: 58px;
	}

	.nikf-privacy-note {
		margin-top: 28px;
	}
}

/* --- Reduzierte Bewegung ------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.nikf-field input,
	.nikf-field textarea,
	.nikf-submit {
		transition: none;
	}
}