/*==================================================
EVER THEME
Contact
Version 2.0.0
==================================================*/

/* CARTE
==================================================*/

.wpcf7 {
	max-width: var(--content);
	margin-inline: auto;
	padding: var(--space-7);

	background: var(--color-surface);

	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);

	box-shadow: var(--shadow-sm);
}

/* MISE EN PAGE
   Nom + e-mail côte à côte, le reste pleine largeur
==================================================*/

.wpcf7-form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: var(--space-5);
}

.wpcf7-form > * {
	grid-column: 1 / -1;
}

.wpcf7-form > p:nth-of-type(-n+2) {
	grid-column: auto;
}

/* BOUTON D'ENVOI
==================================================*/

.wpcf7-form .wpcf7-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 54px;
	padding: 0 var(--space-7);

	font-family: var(--font-body);
	font-size: var(--fs-sm);
	font-weight: var(--fw-semibold);
	letter-spacing: .02em;

	color: var(--color-surface);
	background: var(--color-primary);

	border: 1px solid var(--color-primary);
	border-radius: var(--radius-round);

	box-shadow: var(--shadow-xs);

	cursor: pointer;

	transition:
		background var(--transition),
		border-color var(--transition),
		box-shadow var(--transition),
		transform var(--transition);
}

.wpcf7-form .wpcf7-submit:hover,
.wpcf7-form .wpcf7-submit:focus-visible {
	background: var(--color-primary-dark);
	border-color: var(--color-primary-dark);

	box-shadow: var(--shadow-sm);

	transform: translateY(-2px);
}

.wpcf7-form .wpcf7-submit:focus-visible {
	outline: none;

	box-shadow: 0 0 0 3px rgba(141, 119, 182, 0.25);
}

/* RESPONSIVE
==================================================*/

@media (max-width: 768px) {

	.wpcf7 {
		padding: var(--space-6);
	}

	.wpcf7-form {
		grid-template-columns: 1fr;
	}

	.wpcf7-form > p:nth-of-type(-n+2) {
		grid-column: 1 / -1;
	}

}

@media (max-width: 480px) {

	.wpcf7 {
		padding: var(--space-5);

		border-radius: var(--radius-md);
	}

	.wpcf7-form .wpcf7-submit {
		width: 100%;
	}

}