.contact-new
{
	.container
	{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		text-align: center;
		margin: auto;
		width: 70%;
		border: 6px solid #f3d361;
		transform: skew(-15deg);
		padding-inline: 8rem;
		position: relative;
		margin-bottom: 8rem;
		margin-top: 5rem;
		padding-top: 1rem;

		h3
		{
			transform: skew(15deg) translateX(-50px);
			font-size: 3.5rem;
			font-weight: 600;
			color: #263153;
			padding: 1rem;
			padding-bottom: 0;
			padding-top: 2rem;
			margin: auto;
			line-height: 1.3;
		}

		.wpcf7
		{
			form
			{
				display: grid;
				grid-template-columns: 1fr 1fr 1fr;
				grid-template-rows: 1fr;
				transform: skew(15deg);
				padding-bottom: 60px;

				p
				{
					margin-inline: 1rem;

					span
					{

						input,
						textarea
						{
							border-bottom: 1px solid #263153 !important;
							height: 25px !important;
							min-height: 0;
							color: #263153;
							max-width: 20vw;
							resize: none;
						}

						input::placeholder,
						textarea::placeholder
						{
							color: rgba(0, 0, 0, 0.5);
						}
					}

					label
					{
						display: flex;
						/* justify-content: left; */
						align-items: center;

						/* gap: 14px; */
						input
						{
							margin-right: 14px;
						}

						label
						{
							font-size: .6rem;
							line-height: 1.5;
						}
					}
				}

				p:has(textarea.full-width)
				{
					grid-column-start: 1;
					grid-column-end: 4;
				}

				p:has(input.checkbox)
				{
					grid-column-start: 1;
					grid-column-end: 4;
					text-align: left;
					margin-top: .4rem;
					margin-bottom: .4rem;
					/*
					.c-tooltip
					{
						font-size: .6rem;
						line-height: 0.5;
					} */

					input
					{
						height: 100% !important;
					}

				}

				p:has(.wpcf7-submit)
				{
					grid-column-start: 2;
					grid-column-end: 3;
					background-color: #263153;
					font-weight: 600;
					transform: translateY(45px) skew(-15deg) translateX(-60%);
					transition: filter 200ms;
					min-width: 300px;
					/* width: 100%; */
					position: absolute;
					bottom: 0;
					left: 50%;

					input
					{
						transition: color 200ms;
						color: white !important;
						transform: skew(15deg);
						width: 100%;
						height: 100%;
						font-size: 1rem;
					}

					input:hover
					{
						color: #f3d361 !important;
					}
				}

				p:has(.wpcf7-submit):hover
				{
					filter: brightness(1.5);
				}
			}

		}

		.wpcf7::before
		{
			/* content: url("./assets/img/form-before.svg"); */
			background-image: url("./assets/img/form-before.svg");
			background-repeat: no-repeat;
			width: 200px;
			height: 300px;
			position: absolute;
			z-index: 999;
			bottom: 0;
			left: 0;
			transform: translateX(-140px) translateY(40px) skew(15deg) scale(0.85);
			pointer-events: none;
			content: "";
		}

		.wpcf7::after
		{
			/* content: url("./assets/img/form-after.svg"); */
			background-image: url("./assets/img/form-after.svg");
			background-repeat: no-repeat;
			width: 200px;
			height: 300px;
			position: absolute;
			z-index: 999;
			top: 0;
			right: 0;
			transform: translateX(140px) translateY(-40px) skew(15deg) scale(0.85);
			pointer-events: none;
			content: "";


		}
	}
}

.buttons-row
{
	padding-top: 1rem;
	margin-bottom: 3rem;

	.container
	{
		border-bottom: 1px solid #dbdbdb;
		padding-bottom: 1.5rem;
	}
}

.technical-details .container
{
	border-bottom: 0px !important;
}


@media screen and (max-width: 1303px)
{

	.contact-new
	{
		.container
		{
			h3
			{
				font-size: 2.8rem;
			}
		}
	}
}


@media screen and (max-width: 1025px)
{

	.contact-new
	{
		.container
		{
			margin-bottom: 2rem;
			transform: skew(-5deg);

			h3
			{
				transform: skew(5deg) translateX(-30px);
				line-height: 1.5;
			}

			.wpcf7
			{
				form
				{
					transform: skew(5deg);
					grid-template-columns: 1fr;

					p
					{
						span
						{

							input,
							textarea
							{
								max-width: 100%;
								width: 100%;
							}
						}
					}

					label
					{
						gap: 0 !important;

						input
						{
							min-width: 2vw;
							margin-inline: .5rem;
						}
					}


					p:has(textarea.full-width)
					{
						grid-column-start: 1;
						grid-column-end: 2;
					}

					p:has(input.checkbox)
					{
						grid-column-start: 1;
						grid-column-end: 2;
					}

					p:has(.wpcf7-submit)
					{
						grid-column-start: 1;
						grid-column-end: 2;
					}
				}
			}

			.wpcf7::before
			{
				transform: translateX(-110px) translateY(100px) skew(5deg) scale(.6);
			}

			.wpcf7::after
			{
				transform: translateX(110px) translateY(-100px) skew(5deg) scale(.6);

			}
		}
	}
}

@media screen and (max-width: 770px)
{

	.contact-new
	{
		.container
		{
			width: 85%;
			transform: skew(0deg);
			padding-inline: 1rem;

			h3
			{
				transform: skew(0deg);
				line-height: 1.5;
				padding: 0;
				font-size: 2.7rem;
				width: 100%;
			}

			.wpcf7
			{
				form
				{
					transform: skew(0deg);
					grid-template-columns: 1fr;

					p
					{
						span
						{

							input,
							textarea
							{
								max-width: 100%;
								width: 100%;
							}
						}
					}

					label
					{
						gap: 0 !important;

						input
						{
							min-width: 2vw;
							margin-inline: .5rem;
						}
					}


					p:has(textarea.full-width)
					{
						grid-column-start: 1;
						grid-column-end: 2;
					}

					p:has(input.checkbox)
					{
						grid-column-start: 1;
						grid-column-end: 2;
					}

					p:has(.wpcf7-submit)
					{
						grid-column-start: 1;
						grid-column-end: 2;
						/* width: 70%; */
						min-width: 300px;
						margin: auto;
						font-size: .9rem;
						transform: translateY(30px) skew(-15deg) translateX(-50%);

					}
				}
			}

			.wpcf7::before
			{
				transform: translateX(-100px) translateY(100px) skew(0deg) scale(.3);

			}

			.wpcf7::after
			{
				transform: translateX(100px) translateY(-130px) skew(0deg) scale(.3);
			}
		}
	}

	@media screen and (max-width: 610px)
	{

		.contact-new
		{
			.container
			{
				h3
				{
					font-size: 2rem;
				}
			}
		}
	}

	@media screen and (max-width: 466px)
	{

		.contact-new
		{
			.container
			{

				h3
				{
					font-size: 1.3rem;
				}
			}
		}
	}
}