/* Sample order form component: stable grid without absolute overlaps. */

#section-sample.order.order--sample.container {
	width: 100%;
	max-width: none;
	padding: clamp(52px, 5vw, 76px) clamp(20px, 4vw, 64px);
	overflow: clip;
	isolation: isolate;
}

#section-sample,
#section-sample * {
	box-sizing: border-box;
}

#section-sample .order__inner {
	display: grid;
	grid-template-areas:
		"sample-header sample-image"
		"sample-content sample-image";
	grid-template-columns: minmax(0, 620px) minmax(360px, 1fr);
	grid-template-rows: auto auto;
	align-items: center;
	column-gap: clamp(40px, 5vw, 76px);
	row-gap: 30px;
	width: 100%;
	max-width: 1320px;
	margin: 0 auto;
}

#section-sample .order__header {
	grid-area: sample-header;
	width: 100%;
	max-width: 620px;
	min-width: 0;
	margin: 0;
}

#section-sample .order__title,
#section-sample .order__text {
	max-width: 100%;
	text-wrap: balance;
}

#section-sample .order__title.order-title {
	font-family: "Inter", Arial, sans-serif;
	font-weight: 200;
	color: #41dbf8;
}

#section-sample .order__title.order-title .order-title__bold {
	font-weight: 700;
	color: #fff;
}

#section-sample .order__text {
	font-family: "Inter", Arial, sans-serif;
	font-size: clamp(16px, 0.584795vw + 11.5088px, 20px);
	font-weight: 300;
	line-height: 1.44;
	color: #fff;
}

#section-sample .order__content {
	grid-area: sample-content;
	width: 100%;
	max-width: 620px;
	min-width: 0;
	margin: 0;
}

#section-sample .order__image {
	grid-area: sample-image;
	position: static;
	inset: auto;
	z-index: auto;
	display: block;
	justify-self: end;
	align-self: center;
	width: 100%;
	max-width: 700px;
	height: auto;
	margin: 0;
	transform: none;
	overflow: hidden;
}

@media (min-width: 1101px) {
	#section-sample .order__image {
		align-self: end;
		transform: translateY(clamp(52px, 5vw, 76px));
	}
}

#section-sample .order__image picture,
#section-sample .order__image img {
	position: static;
	inset: auto;
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	transform: none;
	object-fit: contain;
}

#section-sample .wpcf7,
#section-sample .wpcf7-form,
#section-sample .order-form,
#section-sample .order-form__row {
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

#section-sample .order-form__row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: stretch;
	gap: 16px;
}

#section-sample .order-form__label,
#section-sample .order-form__button {
	width: 100%;
	max-width: none;
	min-width: 0;
	margin: 0;
}

#section-sample .order-form__input {
	display: block;
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

#section-sample .rospan-legal-consent {
	width: 100%;
	max-width: 100%;
	margin: 16px 0 0;
}

#section-sample .order__form.order-form {
	margin-bottom: 28px;
	padding-bottom: 22px;
}

#section-sample .order-connect {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 24px;
	width: 100%;
	min-width: 0;
	margin: 0;
}

#section-sample .order-connect__item,
#section-sample .order-phone,
#section-sample .order-socials {
	min-width: 0;
}

#section-sample .wpcf7-not-valid-tip,
#section-sample .wpcf7-response-output {
	position: static;
	max-width: 100%;
	transform: none;
}

@media (max-width: 1100px) {
	#section-sample.order.order--sample.container {
		padding: 56px clamp(20px, 4vw, 40px);
	}

	#section-sample .order__inner {
		grid-template-areas:
			"sample-header"
			"sample-image"
			"sample-content";
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: auto;
		gap: 0;
		max-width: 760px;
	}

	#section-sample .order__header,
	#section-sample .order__content {
		max-width: 700px;
		justify-self: center;
	}

	#section-sample .order__header {
		margin-bottom: 30px;
	}

	#section-sample .order__title,
	#section-sample .order__text {
		text-align: center;
	}

	#section-sample .order__image {
		width: min(86%, 620px);
		max-width: 620px;
		justify-self: center;
		margin: 0;
	}
}

@media (max-width: 767px) {
	#section-sample.order.order--sample.container {
		padding: 48px 20px 16px;
	}

	#section-sample .order__inner {
		gap: 0;
	}

	#section-sample .order-form__row {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
	}

	#section-sample .order__image {
		width: min(94%, 520px);
		margin-top: 24px;
	}
}

@media (max-width: 560px) {
	#section-sample.order.order--sample.container {
		padding: 44px 16px;
	}

	#section-sample .order-connect {
		flex-direction: row;
		align-items: flex-start;
		gap: 24px;
	}

	#section-sample .order-connect__item,
	#section-sample .order-socials {
		width: 100%;
	}

	#section-sample .order-connect__item:has(.order-socials) {
		align-items: flex-start;
	}

	#section-sample .order-connect__item:has(.order-socials) .order-connect__label {
		text-align: left;
	}

	#section-sample .order-socials {
		justify-content: flex-start;
	}
}

@media (max-width: 480px) {
	#section-sample .order-phone {
		display: flex;
		flex-direction: column;
		align-items: start;
		gap: 10px;
		line-height: 1;
	}

	#section-sample .order-connect__item:has(.order-socials) {
		align-items: flex-end;
	}

	#section-sample .order-socials {
		justify-content: flex-end;
	}
}
