/* form.css – Stile des Anfrageformulars. Zusammengeführt aus den früheren Plugin-Stylesheets. */

/* ===== Normalize + Basis (ehem. cf7-customizer/style.min.css) ===== */
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}
button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}
input[type="search"]{-webkit-appearance:textfield;box-sizing:content-box}
input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}
textarea{overflow:auto}optgroup{font-weight:bold}#cfc form{width:100%}#cfc form *,#cfc form *:after,#cfc form *:before{box-sizing:border-box;-webkit-font-smoothing:antialiased;font-smoothing:antialiased;text-rendering:optimizeLegibility}
#cfc form input[type="radio"],#cfc form input[type="checkbox"]{width:auto !important}
#cfc form input[type="number"],#cfc form input[type="tel"],#cfc form input[type="date"]{width:100%;cursor:pointer}
#cfc form .wpcf7-not-valid-tip{background-color:#f44336;color:#fff;font-size:14px;padding:10px;border:0}
#cfc form select{width:100% !important}#cfc form .wpcf7-validation-errors{background:#e57373;border:none !important;padding:25px;color:#fff !important;margin:10px 0;width:100%;font-size:14px}
#cfc form .wpcf7-mail-sent-ok{background:#35ad68;border:none !important;padding:25px;color:#fff !important;margin:10px 0;width:100%;font-size:14px}
#cfc form input[type="file"]{width:100% !important;padding:15px;border:0;cursor:pointer !important}
#cfc form input[type="file"]:focus,#cfc form input[type="file"]:active,#cfc form input[type="file"]:hover{border:none !important}
#cfc form .wpcf7-submit{margin-bottom:0 !important;transition:all .4s ease-in}

/* ===== Formular-Grundstile (ehem. contact-form-7/styles.css) ===== */
.wpcf7 .screen-reader-response {
	position: absolute;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	word-wrap: normal !important;
	word-break: normal !important;
}

.wpcf7 .hidden-fields-container {
	display: none;
}

.wpcf7 form .wpcf7-response-output {
	margin: 2em 0.5em 1em;
	padding: 0.2em 1em;
	border: 2px solid #00a0d2; /* Blue */
}

.wpcf7 form.init .wpcf7-response-output,
.wpcf7 form.resetting .wpcf7-response-output,
.wpcf7 form.submitting .wpcf7-response-output {
	display: none;
}

.wpcf7 form.sent .wpcf7-response-output {
	border-color: #46b450; /* Green */
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
	border-color: #dc3232; /* Red */
}

.wpcf7 form.spam .wpcf7-response-output {
	border-color: #f56e28; /* Orange */
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
	border-color: #ffb900; /* Yellow */
}

.wpcf7-form-control-wrap {
	position: relative;
}

.wpcf7-not-valid-tip {
	color: #dc3232; /* Red */
	font-size: 1em;
	font-weight: normal;
	display: block;
}

.use-floating-validation-tip .wpcf7-not-valid-tip {
	position: relative;
	top: -2ex;
	left: 1em;
	z-index: 100;
	border: 1px solid #dc3232;
	background: #fff;
	padding: .2em .8em;
	width: 24em;
}

.wpcf7-list-item {
	display: inline-block;
	margin: 0 0 0 1em;
}

.wpcf7-list-item-label::before,
.wpcf7-list-item-label::after {
	content: " ";
}

.wpcf7-spinner {
	visibility: hidden;
	display: inline-block;
	background-color: #23282d; /* Dark Gray 800 */
	opacity: 0.75;
	width: 24px;
	height: 24px;
	border: none;
	border-radius: 100%;
	padding: 0;
	margin: 0 24px;
	position: relative;
}

form.submitting .wpcf7-spinner {
	visibility: visible;
}

.wpcf7-spinner::before {
	content: '';
	position: absolute;
	background-color: #fbfbfc; /* Light Gray 100 */
	top: 4px;
	left: 4px;
	width: 6px;
	height: 6px;
	border: none;
	border-radius: 100%;
	transform-origin: 8px 8px;
	animation-name: spin;
	animation-duration: 1000ms;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

@media (prefers-reduced-motion: reduce) {
	.wpcf7-spinner::before {
		animation-name: blink;
		animation-duration: 2000ms;
	}
}

@keyframes spin {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

@keyframes blink {
	from {
		opacity: 0;
	}

	50% {
		opacity: 1;
	}

	to {
		opacity: 0;
	}
}

.wpcf7 [inert] {
	opacity: 0.5;
}

.wpcf7 input[type="file"] {
	cursor: pointer;
}

.wpcf7 input[type="file"]:disabled {
	cursor: default;
}

.wpcf7 .wpcf7-submit:disabled {
	cursor: not-allowed;
}

.wpcf7 input[type="url"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"] {
	direction: ltr;
}

.wpcf7-reflection > output {
	display: list-item;
	list-style: none;
}

.wpcf7-reflection > output[hidden] {
	display: none;
}

/* ===== Farben/Abstände (ehem. titan-framework-cfc-css.css) ===== */
#cfc,#cfc .wpcf7-quiz-label,#cfc p,#cfc label{color:#000;}#cfc{background-color:#fff;}#cfc,#cfc p{font-size:inherit;font-size:inheritpx;}#cfc{padding:0px;}#cfc{margin:0px;}#cfc{border:0px solid;}#cfc{border-radius:0px;}#cfc{border-color:#000;}#cfc input,#cfc textarea{color:#5b5b5b;}#cfc input,#cfc textarea{background-color:#fff;}#cfc form input,#cfc form textarea{padding:0px;}#cfc form input,#cfc form textarea{margin-bottom:0px;}#cfc form input,#cfc form textarea{font-size:inherit;font-size:inheritpx;}#cfc form input,#cfc form textarea{border:0px solid;}#cfc form input,#cfc form textarea{border-radius:0px;}#cfc form input,#cfc form textarea{border-color:#ccc;}#cfc .wpcf7-submit{color:#fff;}#cfc .wpcf7-submit{background-color:#000;}#cfc .wpcf7-submit:hover{color:#fff;}#cfc .wpcf7-submit:hover{background-color:#000;}#cfc .wpcf7-submit{border:0px solid;}#cfc .wpcf7-submit{border-radius:0px;}#cfc .wpcf7-submit{border-color:#000;}#cfc .wpcf7-submit:hover{border-color:#000;}

/* ===== Anfrageformular-Layout (ehem. divi-child/inc/cf7-anfrage.css) ===== */
/**
 * Premium-Styling fuer das CF7-Anfrageformular.
 * Wirkt nur, wenn der Wrapper .mk-anfrage am CF7-Form sitzt
 * oder die mk-form-* Klassen im Markup vorhanden sind.
 * Andere CF7-Formulare auf der Site bleiben unberuehrt.
 *
 * Markenfarbe: #95c11f (Mooskunst-Gruen)
 */

/* ============================================================
   1) Karte als ruhiger Rahmen
   ============================================================ */
.mk-anfrage {
	max-width: 760px;
	margin: 0 auto;
	padding: 48px 16px;
}

.mk-anfrage__card {
	background: #ffffff;
	border-radius: 14px;
	box-shadow: 0 24px 60px -28px rgba(35, 50, 20, 0.25),
		0 2px 8px rgba(35, 50, 20, 0.04);
	padding: 56px 64px 48px;
	position: relative;
}

.mk-anfrage__header {
	text-align: center;
	margin-bottom: 40px;
}

.mk-anfrage__title {
	font-size: 32px;
	font-weight: 300;
	letter-spacing: 0.08em;
	color: #2c3a1f;
	margin: 0 0 14px;
	text-transform: uppercase;
}

.mk-anfrage__title::after {
	content: "";
	display: block;
	width: 56px;
	height: 2px;
	background: #95c11f;
	margin: 18px auto 0;
}

.mk-anfrage__sub {
	font-size: 15px;
	color: #6b7560;
	line-height: 1.6;
	margin: 0;
	max-width: 480px;
	margin: 0 auto;
}

/* ============================================================
   2) Form-Layout (mk-form-row / mk-form-col / mk-form-row-full)
   ============================================================ */
.wpcf7 .mk-form-row {
	display: flex;
	flex-wrap: wrap;
	gap: 28px;
	margin-bottom: 26px;
}

.wpcf7 .mk-form-col {
	flex: 1 1 calc(50% - 14px);
	min-width: 220px;
	text-align: left;
}

.wpcf7 .mk-form-row-full {
	display: block;
	margin-bottom: 26px;
	text-align: left;
}

/* ============================================================
   3) Labels: dezent, Markenfarbe als Akzent
   ============================================================ */
.wpcf7 .mk-form-label {
	display: block;
	margin-bottom: 8px;
	color: #6b7560;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.wpcf7 .mk-form-label .mk-required {
	color: #95c11f;
	margin-left: 2px;
}

/* ============================================================
   4) Inputs: Underline-Style, klar und edel
   ============================================================ */
.mk-anfrage .wpcf7 input[type="text"],
.mk-anfrage .wpcf7 input[type="tel"],
.mk-anfrage .wpcf7 input[type="email"],
.mk-anfrage .wpcf7 textarea {
	width: 100%;
	padding: 12px 2px;
	background: transparent;
	border: none;
	border-bottom: 2px solid #e3e7dc;
	border-radius: 0;
	box-sizing: border-box;
	font-size: 16px;
	color: #2c3a1f;
	font-family: inherit;
	transition: border-color 0.25s ease, box-shadow 0.25s ease;
	box-shadow: none;
}

.mk-anfrage .wpcf7 input[type="text"]:focus,
.mk-anfrage .wpcf7 input[type="tel"]:focus,
.mk-anfrage .wpcf7 input[type="email"]:focus,
.mk-anfrage .wpcf7 textarea:focus {
	border-bottom-color: #95c11f;
	outline: none;
	box-shadow: 0 1px 0 0 #95c11f;
}

.mk-anfrage .wpcf7 input::placeholder,
.mk-anfrage .wpcf7 textarea::placeholder {
	color: #b6bdac;
}

.mk-anfrage .wpcf7 textarea {
	min-height: 180px;
	resize: vertical;
	border: 2px solid #e3e7dc;
	border-radius: 10px;
	padding: 16px 18px;
}

.mk-anfrage .wpcf7 textarea:focus {
	border-color: #95c11f;
	box-shadow: 0 0 0 4px rgba(149, 193, 31, 0.12);
}

/* ============================================================
   5) Drop-Zone fuer Datei-Uploads
   ============================================================ */
.wpcf7 .mk-dropzone {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 28px 20px;
	background: #fafbf6;
	border: 2px dashed #c8d0bc;
	border-radius: 12px;
	cursor: pointer;
	transition: border-color 0.25s ease, background 0.25s ease,
		transform 0.15s ease;
	text-align: center;
}

.wpcf7 .mk-dropzone:hover,
.wpcf7 .mk-dropzone.is-focus {
	border-color: #95c11f;
	background: #f5f9ea;
}

.wpcf7 .mk-dropzone.is-filled {
	border-style: solid;
	border-color: #95c11f;
	background: #f5f9ea;
}

.wpcf7 .mk-dropzone__icon {
	width: 36px;
	height: 36px;
	color: #95c11f;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.wpcf7 .mk-dropzone__icon svg {
	width: 100%;
	height: 100%;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.wpcf7 .mk-dropzone__text {
	color: #4f5a44;
	font-size: 14px;
	font-weight: 500;
}

.wpcf7 .mk-dropzone__hint {
	color: #97a18a;
	font-size: 12px;
}

.wpcf7 .mk-dropzone__filename {
	color: #2c3a1f;
	font-size: 13px;
	font-weight: 600;
	display: none;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.wpcf7 .mk-dropzone.is-filled .mk-dropzone__filename {
	display: inline-block;
}

.wpcf7 .mk-dropzone.is-filled .mk-dropzone__hint {
	display: none;
}

/* echtes File-Input unsichtbar ueber die ganze Drop-Zone legen */
.wpcf7 .mk-dropzone .wpcf7-form-control-wrap {
	position: absolute;
	inset: 0;
	display: block;
}

.wpcf7 .mk-dropzone input[type="file"] {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

/* ============================================================
   6) Submit-Button: prominent, Markengruen
   ============================================================ */
.wpcf7 .mk-form-submit {
	text-align: center;
	margin-top: 36px;
}

.wpcf7 .mk-form-submit input[type="submit"] {
	background: #95c11f;
	color: #ffffff;
	border: none;
	padding: 16px 56px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	cursor: pointer;
	border-radius: 999px;
	transition: background-color 0.25s ease, transform 0.2s ease,
		box-shadow 0.25s ease;
	box-shadow: 0 4px 14px rgba(149, 193, 31, 0.32);
}

.wpcf7 .mk-form-submit input[type="submit"]:hover,
.wpcf7 .mk-form-submit input[type="submit"]:focus {
	background: #7ea417;
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(149, 193, 31, 0.42);
	outline: none;
}

.wpcf7 .mk-form-submit input[type="submit"]:active {
	transform: translateY(0);
}

.wpcf7 .mk-form-note {
	text-align: center;
	color: #97a18a;
	font-size: 13px;
	margin: 16px 0 0;
	letter-spacing: 0.04em;
}

/* ============================================================
   7) Spinner und Statusmeldungen
   ============================================================ */
.wpcf7-spinner {
	margin: 0 12px;
	background-color: #95c11f;
}

.wpcf7-not-valid-tip {
	color: #c0392b;
	font-size: 12px;
	margin-top: 6px;
	letter-spacing: 0.02em;
}

.mk-anfrage .wpcf7 input.wpcf7-not-valid,
.mk-anfrage .wpcf7 textarea.wpcf7-not-valid {
	border-bottom-color: #e07a6c;
}

.mk-anfrage .wpcf7 textarea.wpcf7-not-valid {
	border-color: #e07a6c;
}

.wpcf7 form .wpcf7-response-output {
	margin: 24px 0 0;
	border-radius: 10px;
	padding: 14px 18px;
	font-size: 14px;
	border-width: 1px;
}

.wpcf7 form.sent .wpcf7-response-output {
	border-color: #95c11f;
	background: #f5f9ea;
	color: #4f5a44;
}

/* ============================================================
   8) Mobile
   ============================================================ */
@media (max-width: 768px) {
	.mk-anfrage {
		padding: 24px 8px;
	}

	.mk-anfrage__card {
		padding: 36px 24px 32px;
		border-radius: 10px;
	}

	.mk-anfrage__title {
		font-size: 26px;
	}

	.wpcf7 .mk-form-row {
		flex-direction: column;
		gap: 22px;
	}

	.wpcf7 .mk-form-col {
		flex-basis: 100%;
	}

	.wpcf7 .mk-form-submit input[type="submit"] {
		width: 100%;
		padding: 16px 24px;
	}
}

/* ===== Turnstile-Sicherheitsprüfung (wird erst bei Nutzung des Formulars geladen) ===== */
.mk-form-turnstile { margin: 8px 0 0; }
.mk-turnstile:empty { display: none; }
.mk-form-note { display: inline-block; margin-top: 6px; font-size: 12px; color: #6b7362; }