$fURWForm: 'URW Form', sans-serif;

strong {
	font-weight: 700;
}

.main-page {
	padding-top: 100px;
}

.breadcrumbs {
	margin-bottom: 45px;
}

.box-1 {
	padding-top: 95px;
	padding-bottom: 125px;
	background: #2e2d2c;

	box-shadow: 6px 6px 15px rgba(0, 0, 0, 0.25);

	.contact-form {
		display: flex;
		flex-direction: row;
		column-gap: 60px;

		._left {
			width: 100%;
			max-width: 350px;

			h1 {
				color: #fff;
				font-size: 50px;
				font-family: $fURWForm;
				letter-spacing: 2px;
				text-transform: uppercase;

				margin-bottom: 64px;
				padding-bottom: 31px;
				border-bottom: 1px solid #fff;
			}

			.contact-form-tiles {
				.tile {
					&:not(:last-child) {
						margin-bottom: 60px;
					}

					h2.tile-title {
						color: #fff;
						font-size: 24px;
						font-weight: 700;
						font-family: $fURWForm;
						letter-spacing: 2px;
						text-transform: uppercase;
						margin-bottom: 50px;

						&._title_border {
							padding-bottom: 25px;
							margin-bottom: 30px;
							margin-left: 45px;
							border-bottom: 1px solid #fff;
						}
					}
					.tile-data {
						.c-row {
							display: flex;
							flex-direction: row;
							column-gap: 20px;

							&:not(:last-child) {
								margin-bottom: 20px;
							}

							._icon {
								img {
									filter: brightness(0) saturate(100%) invert(79%) sepia(84%)
										saturate(367%) hue-rotate(356deg) brightness(104%)
										contrast(104%);
								}
							}
							._text {
								color: #fff;
								font-size: 16px;
								font-weight: 300;
								font-family: $fURWForm;
								margin-bottom: 0;

								a {
									color: #fff;
									font-size: 16px;
									font-weight: 300;
									font-family: $fURWForm;
									line-height: 1;
									text-decoration: underline;
								}

								&._mails {
								}
								&._phones {
								}
							}
						}
					}
				}
			}
		}
		._right {
			width: 100%;

			#map {
				outline: none;
			}
		}
	}
}

.box-2 {
	padding-top: 50px;
	padding-bottom: 40px;

	h2 {
		color: #1d1d1e;
		font-size: 45px;
		font-weight: 300;
		font-family: $fURWForm;
		letter-spacing: 2px;
		text-transform: uppercase;
		text-align: center;

		margin: 0;

		strong {
			position: relative;
			font-weight: 800;

			&::before {
				content: '';
				position: absolute;
				bottom: 0;
				left: 0;
				width: 100%;
				height: 6px;
				background: #fff246;
				transform: translateY(100%);

				box-shadow: 0 4px 4px rgba(0, 0, 0, 0.11);
			}
		}
	}
}

.box-3 {
	background: #f5f5f5;
	padding-top: 40px;
	padding-bottom: 40px;

	.c-row {
		&-1 {
			margin-bottom: 40px;

			p {
				color: #1d1d1e;
				font-size: 16px;
				font-weight: 300;
				font-family: $fURWForm;
				text-align: center;
				margin-bottom: 0;
			}
		}

		&-2 {
			width: 100%;
			max-width: 900px;
			margin-left: auto;
			margin-right: auto;

			input {
				&[type='text'],
				&[type='email'] {
					padding: 13px 14px 11px 14px;
					border-radius: 20px;
					width: 100%;
					border: none;
					background: #fff;

					color: #3f3f3f;
					font-size: 14px;
					font-family: $fURWForm;
					line-height: 1;
					font-weight: 300;

					outline: none;
				}
				&[type='radio'],
				&[type='checkbox'] {
					position: relative;
					appearance: none;
					width: 11px;
					min-width: 11px;
					height: 11px;
					border-radius: 100%;
					border: 1px solid #dfdfdf;
					transition: all 250ms ease-in-out;
					outline: none;

					&::before {
						content: '';
						position: absolute;
						top: 50%;
						left: 50%;
						width: 0;
						height: 0;
						border-radius: 100%;
						background: #1d1d1e;
						transform: translate(-50%, -50%);
						visibility: hidden;
						transition: all 250ms ease-in-out;
					}

					&:checked {
						border-color: #1d1d1e;

						&::before {
							width: 6px;
							height: 6px;
							visibility: visible;
						}
					}
				}
			}
			textarea {
				padding: 13px 14px 11px 14px;
				border-radius: 20px;
				width: 100%;
				border: none;
				background: #fff;
				min-height: 100px;

				color: #3f3f3f;
				font-size: 14px;
				font-family: $fURWForm;
				line-height: 1;
				font-weight: 300;

				outline: none;
				resize: none;
			}
			select {
				padding: 13px 14px 11px 14px;
				border-radius: 20px;
				width: 100%;
				border: none;
				background: #fff;

				color: #3f3f3f;
				font-size: 14px;
				font-family: $fURWForm;
				line-height: 1;
				font-weight: 300;

				outline: none;
			}

			._radios {
				display: flex;
				flex-direction: row;
				column-gap: 35px;
				justify-content: center;
			}

			._radio,
			._checkbox {
				display: flex;
				flex-direction: row;
				align-items: center;
				gap: 8px;

				label {
					color: #1d1d1e;
					font-size: 12px;
					font-family: $fURWForm;
					font-weight: 300;
					line-height: 1;
					padding-top: 2px;
					margin-bottom: 0;
					cursor: pointer;
				}
			}

			._1_column {
				display: flex;
				flex-direction: row;
				margin-bottom: 14px;

				> * {
					width: 100%;
				}
			}

			._2_columns {
				display: flex;
				flex-direction: row;
				column-gap: 26px;
				margin-bottom: 14px;

				> * {
					width: 50%;
				}
			}

			._text {
				color: #1d1d1e;
				font-size: 16px;
				font-weight: 300;
				font-family: $fURWForm;
				margin-bottom: 14px;
			}

			._file {
				padding: 29px;
				margin: 0 0 14px 0;
				border-radius: 20px;
				width: 100%;
				border: none;
				background: #fff;

				color: #3f3f3f;
				font-size: 14px;
				font-family: $fURWForm;
				line-height: 1;
				font-weight: 300;
				border: none;

				.fileuploader-input {
					width: fit-content;
					margin: 0 auto;

					.fileuploader-input-caption {
						span {
							padding-top: 3px;
							display: inline-block;

							color: #1d1d1e;
							font-size: 16px;
							font-family: $fURWForm;
							font-weight: 300;
						}
					}
					button.fileuploader-input-button {
						background: #1d1d1e;
						border-radius: 25px;
						padding: 10px 36px;

						display: flex;
						flex-direction: row;
						align-items: center;
						gap: 10px;

						color: #fff;
						font-family: $fURWForm;
						font-size: 14px;
						font-weight: 700;
						letter-spacing: 2px;
						text-transform: uppercase;
					}
				}
			}

			button[type='submit'] {
				background: #fbf27a;
				width: fit-content;
				margin-left: auto;
				border: none;

				color: #1d1d1e;
				font-size: 14px;
				font-family: $fURWForm;
				font-weight: 800;
				letter-spacing: 2px;
				text-transform: uppercase;

				padding: 12px 37px;
				box-shadow: 0 4px 4px rgba(0, 0, 0, 0.11);
				outline: none;
				cursor: pointer;

				&:active {
					background: #f0e875;
				}

				img {
					margin-left: 10px;
				}
			}
		}
	}
}