.form-section {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}
.form-wrapper {
	height: 100%;
    display: flex;
    flex-direction: column;
}

.form-section h3 {
  font-size: 2rem;
  font-weight: 600;
  line-height: 130%;
  margin-bottom: 2rem;
  color: #141416;
  flex: 0 0 auto;
}


.form-wrapper-code {
	flex: 1 1 auto;
}

.form-wrapper-code form {
	height: 100%;
	display: flex;
	flex-direction: column;
}

.form-content {
	flex: 0 0 auto;
}

.form-row {
  display: flex;
  gap: 1.25rem;
  margin-bottom: 1.5rem;
}

.form-row:last-of-type {
  margin-bottom: 0;
}

/* form text fields */

.text-field {
  padding: 1.25rem 0;
  position: relative;
  width: 100%;
}

.text-field label {
  pointer-events: none;
  position: absolute;
  z-index: 9;
  cursor: text;
  transition: all 0.1s linear;
  margin-top: 0;
  font-size: 1.25rem;
  line-height: 140%;
  font-weight: 500;
  display: block;
  left: 0;
  top: 1.3rem;
  opacity: 1;
  color: #9999A4 !important;
  margin-bottom: 0;
}

.text-field input, .text-field input:focus, .text-field input:focus-visible {
	height: 1.75rem;
}

.text-field input, .text-field input:focus, .text-field input:focus-visible, .text-field textarea {
  display: inline-block;
  font-family: 'Gilroy', sans-serif;
  border: none;
  outline: none;
  border-bottom: 1px solid #200C45;
  color: #141416;
  padding: 0;
  font-size: 1.25rem;
  line-height: 140%;
  font-weight: 500;
  transition: all 0.2s linear 0s;
  width: 18.43rem;
  padding-bottom: 0.5rem;
  -webkit-appearance: none; /* Removes default iOS styling */
  border-radius: 0; /* Ensures square corners */
}

.text-field.hasValue label,
.text-field.error.hasValue label {
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 130%;
  top: 0.1rem;
  left: 0;
  margin: 0;
}

.text-field input.placeholder::placeholder {
  color: #9999A4;
  opacity: 0;
}

.text-field.hasValue input.placeholder::placeholder {
  opacity: 1;
}

/* textarea */

.text-area-field {
  width: 100%;
}

.text-field textarea {
  padding-top: 0;
  width: 100%;
  color: #141416;
  outline: none;
  resize: none;
  overflow: auto;
  border: none;
  border-bottom: 1px solid #200C45;
}

.text-field textarea::-webkit-scrollbar, .form-container::-webkit-scrollbar {
  width: 0.25rem;
}

.text-field.text-area-field label {
  top: 1rem;
}

.text-field.text-area-field.hasValue label,
.text-field.text-area-field.error.hasValue label {
  top: 0.1rem;
}

.text-field textarea::-webkit-scrollbar-track, .form-container::-webkit-scrollbar-track {
  border: 0;
  background-color: #fff;
}

.text-field textarea::-webkit-scrollbar, .form-container::-webkit-scrollbar {
  -webkit-appearance: none;
}

.text-field textarea::-webkit-scrollbar-thumb, .form-container::-webkit-scrollbar-thumb {
  border-radius: 0;
  border: 0;
  background-color: #2F127B;
  height: 4rem;
}

/* Attch file */

.file-row {
  display: block;
}

.file-field {
  background: #2F127B;
  transition: all 0.3s;
  position: relative;
  width: 100%;
}

.file-box {
  position: relative;
  cursor: pointer;
  background: #2F127B;
}

.file-box:hover {
  opacity: 0.8;
}

.file-field label {
  font-size: 1.25rem;
  color: #F5F3F8;
  font-weight: 600;
  line-height: 130%;
  padding: 1rem 0 1rem 1rem;
  display: block;
  text-align: center;
}

.file-field label strong {
  color: #F5F3F8;
  cursor: pointer;
  font-weight: 600;
}

.file-field label strong:before {
  display: inline-block;
  content: "" !important;
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="17" height="18" viewBox="0 0 17 18" fill="none"><path d="M15.9485 8.51061C16.0789 8.64052 16.1521 8.81664 16.1519 9.00024C16.1518 9.18384 16.0784 9.35987 15.9479 9.48962L8.81276 16.5808C8.36055 17.0308 7.82371 17.3877 7.23289 17.6312C6.64207 17.8747 6.00884 18 5.36935 18C4.07785 17.9999 2.83928 17.4893 1.9261 16.5805C1.01291 15.6716 0.499932 14.439 0.5 13.1538C0.500068 11.8686 1.01318 10.636 1.92646 9.72725L10.5586 1.01748C10.8812 0.695418 11.2645 0.439789 11.6865 0.265204C12.1085 0.0906198 12.5609 0.000502165 13.0179 2.09272e-06C13.4749 -0.00049798 13.9276 0.0886292 14.3499 0.26229C14.7723 0.43595 15.1561 0.69074 15.4795 1.0121C15.8029 1.33345 16.0595 1.71508 16.2346 2.13516C16.4097 2.55524 16.4999 3.00554 16.5 3.46032C16.5001 3.91511 16.4102 4.36546 16.2354 4.78564C16.0605 5.20583 15.8042 5.5876 15.481 5.90915L6.84884 14.619C6.65532 14.8123 6.42543 14.9657 6.17229 15.0706C5.91916 15.1754 5.64775 15.2295 5.37358 15.2299C5.0994 15.2304 4.82783 15.177 4.57439 15.0729C4.32094 14.9688 4.09059 14.8161 3.8965 14.6234C3.7024 14.4307 3.54837 14.2018 3.44319 13.9498C3.33802 13.6978 3.28377 13.4277 3.28355 13.1549C3.28332 12.882 3.33713 12.6118 3.44188 12.3597C3.54664 12.1075 3.7003 11.8784 3.89408 11.6854L11.1342 4.36065C11.2636 4.22976 11.44 4.15538 11.6245 4.15388C11.809 4.15237 11.9865 4.22386 12.118 4.35262C12.2496 4.48138 12.3243 4.65686 12.3258 4.84046C12.3273 5.02406 12.2555 5.20074 12.1261 5.33163L4.8819 12.6604C4.81651 12.7243 4.76446 12.8004 4.72873 12.8844C4.693 12.9684 4.67429 13.0586 4.67369 13.1498C4.67308 13.2409 4.69059 13.3314 4.7252 13.4158C4.75982 13.5002 4.81086 13.5771 4.87539 13.6418C4.93992 13.7066 5.01667 13.758 5.10124 13.7931C5.1858 13.8283 5.27651 13.8464 5.36815 13.8466C5.4598 13.8468 5.55057 13.8289 5.63525 13.794C5.71993 13.7592 5.79686 13.708 5.86161 13.6435L14.4938 4.93352C14.6882 4.74097 14.8425 4.51218 14.948 4.26024C15.0535 4.00829 15.108 3.73812 15.1085 3.46519C15.1089 3.19225 15.0554 2.9219 14.9508 2.6696C14.8462 2.41729 14.6926 2.18797 14.4989 1.99475C14.3052 1.80154 14.0751 1.64822 13.8218 1.54355C13.5685 1.43889 13.297 1.38494 13.0227 1.38479C12.7484 1.38464 12.4768 1.43828 12.2234 1.54266C11.97 1.64704 11.7397 1.80011 11.5458 1.99311L2.91364 10.7029C2.59 11.024 2.33312 11.4054 2.15768 11.8254C1.98224 12.2453 1.89168 12.6955 1.89118 13.1503C1.89068 13.6051 1.98024 14.0556 2.15475 14.4759C2.32927 14.8962 2.5853 15.2782 2.90823 15.6C3.23116 15.9218 3.61466 16.1772 4.03679 16.3514C4.45893 16.5257 4.91143 16.6154 5.36845 16.6156C5.82546 16.6157 6.27802 16.5262 6.70026 16.3522C7.1225 16.1782 7.50615 15.9231 7.82927 15.6015L14.9647 8.51002C15.0293 8.44576 15.106 8.3948 15.1905 8.36005C15.2749 8.3253 15.3654 8.30744 15.4567 8.3075C15.5481 8.30755 15.6385 8.32552 15.7229 8.36037C15.8073 8.39522 15.884 8.44627 15.9485 8.51061Z" fill="%23F5F3F8"/></svg>');
  background-repeat: no-repeat;
  width: 1rem;
  height: 1.125rem;
  position: relative;
  top: 0.2rem;
  margin-right: 0.5rem;
  background-size: contain;
}

.file-field label.hasFile {
  text-align: left;
  padding: 0rem 2rem 2rem 2rem;
}

.file-field label.hasFile strong:before {
  display: none;
}

.file-field label.hasFile strong:after {
  display: inline-block;
  content: "" !important;
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M12.6701 11.3299V3.47771H11.3299V11.3299L3.47771 11.3299L3.47771 12.6701H11.3299L11.3299 20.5223H12.6701L12.6701 12.6701H20.5223L20.5223 11.3299L12.6701 11.3299Z" fill="%23F5F3F8"/></svg>');
  background-repeat: no-repeat;
  width: 1.5rem;
  height: 1.5rem;
  position: relative;
  top: 0.4rem;
  margin-left: 0.5rem;
  background-size: contain;
}

.file-field input {
    width: 100%;
    height: 100%;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
    z-index: 2;
}

.fileList-wrapper {
  font-size: 0.875rem;
  color: #A99FC1;
  font-weight: 500;
  line-height: 130%;
  padding: 2rem;
}

.fileList-wrapper p {
  margin: 0 0 0.5rem 0;
  color: white;
}

.fileList-wrapper ul {
  margin: 0;
  padding-left: 0;
}

/* Для Chrome требуется особый подход */
::-webkit-file-upload-button {
  cursor: pointer;
}

.file-block {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
}

.file-delete {
  display: flex;
  color: transparent;
  cursor: pointer;
  width: 1.5rem;
  height: 1.5rem;
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M12 10.943L5.807 4.75L4.75 5.807L10.943 12L4.75 18.193L5.807 19.25L12 13.057L18.193 19.25L19.25 18.193L13.057 12L19.25 5.807L18.193 4.75L12 10.943Z" fill="%23A99FC1"/></svg>');
  background-size: contain;
}

/* checkboxes */

.form-row .checkbox-field {
  position: relative;
}

.form-row .checkbox-field input, .form-row .radio-field input {
  position: absolute;
  z-index: -1;
  opacity: 0;
  float: left;
  top: 1px;
  margin: 0;
}

.form-row .checkbox-field label, .form-row .checkbox-field label a, 
.form-row .radio-field label {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 130%;
  font-family: 'Gilroy', sans-serif !important;
  color: #9999A4;  
  padding: 0;
  display: block;
}

.form-row .checkbox-field label a {
  display: inline;
  text-decoration: underline;
}

.form-row .checkbox-field label span {
  display: block;
  margin: 0 0 0 1.8rem;
}

.form-row .checkbox-field label {
    display: flex;
	align-items: center;
	gap: 0.5rem;
  }
  
  .form-row .checkbox-field label, .form-row .checkbox-field label a, .form-row .radio-field label {
	margin-bottom: 0;
  }

.form-row .checkbox-field label::before {
  content: '';
  display: inline-block;
  width: 1.375rem;
  height: 1.375rem;
  margin: 0;
  border: 1px solid #9999A4;
  flex-shrink: 0;
  flex-grow: 0;
  border-radius: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 50% 50%;
  box-sizing: border-box;
  position: absolute;
  cursor: pointer;
}

.form-row .checkbox-field input:checked+label::before {
  border-color: #2F127B;
  background-color: #2F127B;
  background-image: url('data:image/svg+xml,<svg width="12" height="10" viewBox="0 0 12 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4 9.4L0 5.4L1.4 4L4 6.6L10.6 0L12 1.4L4 9.4Z" fill="white"/></svg>');
  background-size: 0.75rem 0.75rem;
}

/* errors*/

.text-field div.error {
  display: block;
  font-weight: 500 !important;
  font-size: 0.875rem !important;
  line-height: 130% !important;
  bottom: 0 !important;
  margin: 0;
  position: absolute;
  z-index: 10;
  color: #F15B50;
}

.text-field.text-area-field div.error {
  bottom: 0.5rem !important;
}

.file-row div.error-text {
  display: none;
}

.file-row.error-row div.error-text {
  background: #F15B50;
  color: #fff;
  height: 1.5rem;
  font-size: 0.875rem !important;
  line-height: 130% !important;
  width: 100%;
  margin: 0;
  text-align: center;
  display: block;
  margin-top: 0.5rem;
  padding: 0.2rem 0;
}

.checkbox-field div.error {
  background: #F15B50;
  color: #fff;
  height: 1.5rem;
  padding: 0 0.5rem;
  display: inline-flex;
  align-items: center;
  position: relative;
  margin-left: 1.85rem;
  font-size: 0.875rem !important;
    line-height: 130% !important;
}

.form-section input.error, .form-section textarea.error  {
  border-bottom: 1px solid #F15B50;
}

/* button */

.form-row.button-row, .response-btn-wrapper {
  display: flex;
  justify-content: flex-end;
  flex: 1 1 auto;
  align-items: flex-end;
  margin-bottom: 2.5rem;
}

.form-row.button-row button.btn-form, .response-wrapper button.btn-form {
    position: relative;
    width: 10rem;
    height: 10rem;
    z-index: 0;
    padding: 0;
    border: none;
    border-radius: 100%;
    background: #2F127B;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 130%;
    transition: all .3s ease-in-out;
    color: #fff;
    cursor: pointer;
    font-family: 'Gilroy', sans-serif;
}

.form-row.button-row button.btn-form div.btn-formtext, .response-wrapper button.btn-form div.btn-formtext {
  display: flex;
  flex-direction: column;
  height: 1.625rem;
  overflow: hidden;
}

.form-row.button-row button.btn-form span, .response-wrapper button.btn-form span {
  transition: all 0.3s ease-in-out;
}

.form-row.button-row button.btn-form:hover span, .response-wrapper button.btn-form:hover span {
  transform: translate(0, -100%);
}

/* on send btn animation */
.form-wrapper .btn-dots {
	display: none !important;
}
.form-wrapper.sending .btn-dots {
	display: flex !important;
    position: relative;
    align-items: center;
    justify-content: center;
}
.form-wrapper.sending .btn-formtext {
	display: none !important;
}
.form-section .loader {
  position: absolute;
  display: inline-block; 
  width: 4.26rem;
  height: 1rem;
}
.form-section .loader span, .form-section .loader:before, .form-section .loader:after {
    width: 1rem;
    height: 1rem;
    border-radius: 100%;
    background: #fff;
    color: #fff;
    opacity: 0.5;	
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: pulse-dot 1.8s infinite ease-in-out;
    animation: pulse-dot 1.8s infinite ease-in-out;
}
.form-section .loader span {
    position: absolute;    
    -webkit-animation-delay: -0.5s;
    animation-delay: -0.5s;
    vertical-align: middle;
    display: inline-block;
	left: 1.56rem;
}
.form-section .loader:before, .form-section .loader:after {
    content: "";
    position: absolute;
}

.form-section .loader:before {   
    left: 0rem;
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
}

.form-section .loader:after {  
    left: 3.12rem;
}

@keyframes pulse-dot {
    0%, 80%, 100% {
        transform: scale(0.25);
        -webkit-transform: scale(0.25);
        opacity: 0.5;
    }    
    40% {
        transform: scale(1);
        -webkit-transform: scale(1);
        opacity: 1;
    }    
}

/* response */

.response-wrapper, .send-error, .form-wrapper.hide {
  display: none;
}

.send-error.failed, .response-wrapper.success {
	display: flex;
    height: 100%;
    flex-direction: column;
    justify-content: space-between;
}

.send-error.failed {
	color: red;
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 140%;
	margin-bottom: 2rem;
}

.response-wrapper img {
	width: 5rem;
	height: 5rem;
}

.response-wrapper-text {
	margin-top: 2.5rem;
	max-width: 35rem;
	font-size: 2rem;
	font-weight: 600;
	line-height: 130%;
}

.response-wrapper.success .arrows-wrapper {
	overflow: hidden;
	height: 5rem;
}
.response-wrapper.success img {
 position: relative;
 animation: successMove 1s cubic-bezier(0.5, 0, 0, 1) both;
}
.response-wrapper.success h2.response-wrapper-text {
 position: relative;
 animation: successMovePx 1s cubic-bezier(0, 0, 0, 1) 0.2s both, successOpacity 1s ease-in-out 0.2s both;
}
.response-wrapper.success .response-button-block {
	animation: successOpacity 0.6s ease-in-out 0.8s both;
}
@keyframes successMove {
 0% {
  top: 100%;
 }
 100% {
  top: 0%;
 }
}

@keyframes successMovePx {
 0% {
  top: 40px;
 }
 100% {
  top: 0px;
 }
}

@keyframes successOpacity {
 0% {
  opacity: 0%;
 }
 100% {
  opacity: 100%;
 }
}

.grecaptcha-badge {
	display: none !important;
}

@media (max-width: 1200px) {
  .text-field label {
    font-size: 1rem;
    top: 1.5rem;
  }

  .text-field input,
  .text-field input:focus,
  .text-field input:focus-visible,
  .text-field textarea, .file-field label {
    font-size: 1rem;
  } 

  .file-field label strong:before {
    width: 0.83331rem;
    height: 0.9375rem;
  }

  .form-row.button-row button.btn-form, .response-wrapper button.btn-form {
    width: 8.75rem;
    height: 8.75rem;
    font-size: 1rem;
  }

  .form-row.button-row button.btn-form div.btn-formtext, .response-wrapper button.btn-form div.btn-formtext {
    height: 1.3rem;
  }
}

@media (max-width: 767px) {
  .form-wrapper h3 {
    font-size: 1.5rem;
    margin-bottom: 1rem;
  }
  
  .form-row.button-row, .response-btn-wrapper {
	  margin-bottom: 1.5rem;
	}

  .form-row {
    flex-direction: column;
    gap: 0;
    margin-bottom: 0;
  }

  .text-field {
    padding: 0.81rem 0 1rem 0;
    position: relative;
  }

  .text-field label {
    font-size: 0.75rem;
    top: 1.2rem;
  }

  .text-field.text-area-field label {
    top: 0.8rem;
  }

  .text-field input,
  .text-field input:focus,
  .text-field input:focus-visible,
  .text-field textarea {
    font-size: 0.75rem;
    width: 100%;    
  }
  
	.text-field input, .text-field input:focus, .text-field input:focus-visible {
		height: 1.05rem;
	}

  .text-field.hasValue label,
  .text-field.error.hasValue label {
    font-size: 0.625rem;
    top: 0.6rem;
  }

  .text-field div.error {
    font-size: 0.625rem !important;
    bottom: auto !important;
  }
  .file-row {
    margin-top: 1rem;
  }
  .file-field label {
    padding: 0.75rem;
    font-size: 0.75rem;
  }
  .file-row .error {
    background: #F15B50;
    color: #fff;
    height: auto;
    font-size: 0.625rem !important;
    line-height: 130% !important;
    width: 100%;
    margin: 0;
    text-align: center;
    margin-top: 0.25rem;
    padding: 0.25rem 0;
  }
  .form-row .checkbox-field {
    margin-top: 1rem;
  }  
  .form-row .checkbox-field label, .form-row .checkbox-field label a, .form-row .radio-field label {
    font-size: 0.625rem;
  }
  .form-row .checkbox-field label::before {
    width: 1rem;
    height: 1rem;
    position: relative;
    top: 0rem;
  }
  .form-row .checkbox-field label span {
    margin: 0;
  }
  .form-row.button-row, .response-btn-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1rem;
  }
  .form-row.button-row button.btn-form, .response-wrapper button.btn-form {
    width: 7.5rem;
    height: 7.5rem;
    font-size: 0.75rem;
  }
  .form-row.button-row button.btn-form div.btn-formtext, .response-wrapper button.btn-form div.btn-formtext {
    height: 0.975rem;
  }
  .fileList-wrapper {
    padding: 1rem 1rem 0 1rem;
    font-size: 0.625rem;
  }
  .file-delete {
    width: 1rem;
    height: 1rem;
    background-repeat: no-repeat;
  }
  .fileList-wrapper p {
    margin: 0 0 0.25rem 0;
  }
  .file-field label.hasFile {
    text-align: left;
    padding: 0rem 1rem 1rem 1rem;
  }
  .checkbox-field div.error {
    height: 1.8rem;
    font-size: 0.625rem !important;
    margin-left: 1.5rem;
  }  
	.response-wrapper img {
		width: 3rem;
		height: 3rem;
	}
	.response-wrapper-text {
		margin-top: 1rem;
		font-size: 1.5rem;
		line-height: 130%;
	}
	.response-wrapper button.btn-form {
        margin: 0 auto;
    }
	.response-wrapper.success .arrows-wrapper {
		height: 3rem;
	}
}