.contact {
	position: relative;
	padding: 70px 0 322px;
	background: #26305f;
	color: #fff;
}

.contact > .wrapper {
	position: relative;
	z-index: 2;
	padding: 40px 30px;
}

.contact-content {
	margin-bottom: 40px;
}

.contact-content > .intro {
	margin-bottom: 40px;
}

.contact-content > .intro > .title.is-medium {
	font-weight: 400;
}

.contact-content-location {
	display: flex;
	align-items: flex-start;
}

.contact-content-location > .sprite {
	margin: 2px 15px 0 0;
}

.contact-content-location > .title {
	font-weight: 200;
}

.contact-form {
	transition: opacity 0.25s;
}

.contact-form > .text {
	display: none;
	margin-bottom: 20px;
}

.contact-form > .text.is-error {
	color: lightcoral;
}

.contact-form > .text.is-success {
	color: greenyellow;
}

.contact-form > .list {
	margin: -15px;
}

.contact-form > .list > .list-item {
	width: 100%;
	padding: 15px;
}

.contact-form.is-loading {
	opacity: 0.5;
}

.contact-form-radios {
	margin: 30px 0;
}

.contact-form-radios > .text {
	margin-bottom: 30px;
}

.contact-form-radios > .list {
	gap: 20px 30px;
}

.contact-form--radio {
	display: flex;
	align-items: center;
	cursor: pointer;
	padding: 5px;
	margin: -5px;
}

.contact-form--radio > .layer {
	pointer-events: none;
	flex-shrink: 0;
	display: block;
	width: 14px;
	height: 14px;
	margin-right: 10px;
	border-radius: 7px;
	appearance: none;
	background: transparent;
	border: 1px solid #9466f9;
	transition: background-color 0.25s;
}

.contact-form--radio > .layer:checked {
	background-color: #9466f9;
}

.contact-form--radio > .text {
	font-size: 14px;
	line-height: 1;
	color: #9466f9;
}

.contact-form-radios > label.error {
	display: block;
	font-size: 14px;
	font-weight: 600;
	color: indianred;
	margin-top: 20px;
}

.contact > .diamond {
	position: absolute;
	z-index: 1;
}

.contact > .diamond.no-1 {
	right: -460px;
	bottom: 0;
}

.contact > .diamond.no-2 {
	bottom: 450px;
	right: -260px;
}

.contact > .diamond.no-3 {
	left: -160px;
	bottom: -300px;
}

@media (min-width: 600px) and (max-width: 999px) {
	.contact-form > .list > .list-item:not(:first-child) {
		width: 50%;
	}
}

@media (min-width: 500px) {
	.contact {
		padding-bottom: 211px;
	}
}

@media (min-width: 800px) {
	.contact {
		display: flex;
		align-items: center;
		padding: 70px 0 200px;
	}
	.contact > .wrapper {
		padding: 50px 60px;
	}
	.contact-content {
		margin-bottom: 50px;
	}
	.contact-content > .intro {
		margin-bottom: 45px;
	}
	.contact-form-radios {
		margin: 35px 0;
	}
	.contact > .diamond.no-1 {
		bottom: -200px;
	}
	.contact > .diamond.no-2 {
		bottom: 300px;
	}
	.contact > .diamond.no-3 {
		left: -180px;
		bottom: -400px;
	}
}

@media (min-width: 1000px) {
	.contact {
		padding: 70px 0 200px;
	}
	.contact-form > .list > .list-item {
		width: 33.33333%;
	}
}

@media (min-width: 1200px) {
	.contact {
		min-height: 100vh;
		padding: 70px 0 146px;
	}
	.contact > .wrapper {
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 60px 90px;
	}
	.contact-content {
		margin-bottom: 0;
		padding-right: 80px;
		width: 50%;
	}
	.contact-content > .intro {
		margin-bottom: 50px;
	}
	.contact-form {
		width: 50%;
		padding-left: 80px;
	}
	.contact-form > .list > .list-item {
		width: 100%;
	}
	.contact-form-radios {
		margin: 40px 0;
	}
	.contact > .diamond.no-1 {
		bottom: -600px;
	}
	.contact > .diamond.no-2 {
		bottom: -60px;
	}
	.contact > .diamond.no-3 {
		left: -200px;
		bottom: -500px;
	}
}

@media (min-width: 1500px) {
	.contact-content {
		padding-right: 120px;
	}
	.contact-form {
		padding-left: 120px;
	}
}
