/* ==========================================================================
   KEYWEB FLATSOME KIT — moduli
   Si attiva con il contenitore kw-form attorno al markup di Contact Form 7.
   ========================================================================== */

.kw-site .kw-form { padding: clamp(28px, 4vw, 56px); background: var(--kw-carta); }

.kw-site .kw-form__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(22px, 3vw, 40px);
}

.kw-site .kw-campo--full { grid-column: 1 / -1; }

.kw-site .kw-form label {
	display: block;
	margin: 0 0 10px;
	color: var(--kw-titolo-scuro);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.kw-site .kw-form input[type="text"],
.kw-site .kw-form input[type="email"],
.kw-site .kw-form input[type="tel"],
.kw-site .kw-form textarea,
.kw-site .kw-form select {
	width: 100%;
	height: auto;
	padding: 10px 2px;
	border: 0;
	border-bottom: 1px solid var(--kw-filetto);
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--kw-inchiostro);
	font-family: var(--kw-sans);
	font-size: 1rem;
	transition: border-color .3s var(--kw-curva);
}

.kw-site .kw-form input:focus,
.kw-site .kw-form textarea:focus,
.kw-site .kw-form select:focus {
	border-bottom-color: var(--kw-secondario-sc);
	box-shadow: none;
}

.kw-site .kw-form textarea { min-height: 150px; resize: vertical; }

/* L'elenco nativo è l'unico elemento di sistema in una pagina disegnata. */
.kw-site .kw-form select {
	padding-right: 30px;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%23333' stroke-width='1.4'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
	background-position: right 4px center;
	background-repeat: no-repeat;
	background-size: 12px;
	cursor: pointer;
}

.kw-site .kw-consenso {
	margin: clamp(24px, 3vw, 36px) 0 0;
	color: var(--kw-testo);
	font-size: .92rem;
}

.kw-site .kw-consenso label {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin: 0;
	font-size: inherit;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	cursor: pointer;
}

.kw-site .kw-consenso input[type="checkbox"] {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
	margin: 2px 0 0;
	border: 1px solid var(--kw-filetto);
	border-radius: 0;
	appearance: none;
	background: transparent;
	cursor: pointer;
	transition: background .25s var(--kw-curva), border-color .25s var(--kw-curva);
}

.kw-site .kw-consenso input[type="checkbox"]:checked {
	border-color: var(--kw-secondario-sc);
	background: var(--kw-secondario-sc)
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 12' fill='none' stroke='%23fff' stroke-width='2'%3E%3Cpath d='M1 6.5 5 10.5 13 1.5'/%3E%3C/svg%3E")
		center / 10px no-repeat;
}

.kw-site .kw-form__invio { position: relative; display: inline-block; margin-top: clamp(24px, 3vw, 36px); }

.kw-site .kw-form input[type="submit"] {
	min-height: 54px;
	padding: 15px 56px 15px 28px;
	border: 1px solid var(--kw-secondario-sc);
	border-radius: var(--kw-raggio);
	background: var(--kw-secondario-sc);
	box-shadow: none;
	color: #fff;
	cursor: pointer;
	font-family: var(--kw-sans);
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	transition: background .35s var(--kw-curva), border-color .35s var(--kw-curva);
}

.kw-site .kw-form input[type="submit"]:hover {
	border-color: var(--kw-scuro);
	background: var(--kw-scuro);
}

/* La freccia non si può generare su un input: sta sul contenitore. */
.kw-site .kw-form__invio::after {
	position: absolute;
	top: 50%;
	right: 26px;
	color: #fff;
	content: '→';
	pointer-events: none;
	transform: translateY(-50%);
	transition: transform .35s var(--kw-curva);
}

.kw-site .kw-form__invio:hover::after { transform: translate(5px, -50%); }

.kw-site .wpcf7-not-valid-tip { margin-top: 8px; color: #b32d2e; font-size: .82rem; }
.kw-site .wpcf7-not-valid { border-bottom-color: #b32d2e; }

.kw-site .wpcf7-response-output {
	margin: 24px 0 0 !important;
	padding: 16px 20px !important;
	border: 1px solid var(--kw-filetto) !important;
	border-left: 3px solid var(--kw-secondario-sc) !important;
	background: #fff;
	font-size: .92rem;
}

.kw-site .wpcf7-form.invalid .wpcf7-response-output,
.kw-site .wpcf7-form.failed .wpcf7-response-output { border-left-color: #b32d2e !important; }

@media (max-width: 720px) {
	.kw-site .kw-form__grid { grid-template-columns: minmax(0, 1fr); }
	.kw-site .kw-form__invio,
	.kw-site .kw-form input[type="submit"] { width: 100%; }
}