:root {
  --color-primary: #004aad;
  --color-primary-dark: #00337a;
  --color-bg: #fff;
  --color-text: #333;
  --color-text-light: #666666;
  --color-input-bg: rgba(11, 97, 172, 0.05);
  --color-input-focus-shadow: #004aad33;
  --color-placeholder: rgba(102, 102, 102, 0.5);

  --font-family-main: "Gilroy", Arial, sans-serif;
  --font-size-heading: 2.5rem;
  --font-size-description: 1.125rem;
  --font-size-input: 18px;
  --font-size-placeholder: 0.875rem;

  --border-radius-main: 0.625rem;

  --gap-large: 5rem;
  --gap-medium: 2rem;
  --gap-small: 0.5rem;
}

.contact_form {
  width: 100%;
}

.form_wrapper {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: var(--gap-small);
  width: 100%;
}

@media (max-width: 963px) {
  .form_wrapper {
    max-width: 100%;
  }
}

.form_group {
  width: 100%;
}
.form_label {
  font-weight: 600;
}

.form_input {
  border-radius: var(--border-radius-main);
  background: var(--color-input-bg);
  width: 100%;
  height: 3.75rem;
  border: none;
  font-size: var(--font-size-input);
  padding: 0 20px;
  margin-bottom: 10px;
  color: var(--color-text);
  box-sizing: border-box;
  outline: none;
  transition: box-shadow 0.2s;
  font-family: var(--font-family-main);
  font-weight: 400;
}
.form_input:focus {
  box-shadow: 0 0 0 2px var(--color-input-focus-shadow);
  border: 1px solid var(--color-primary);
  background: var(--color-bg);
  color: var(--color-primary);
}

.form_input::placeholder {
  color: var(--color-placeholder);
  font-family: var(--font-family-main);
  font-size: var(--font-size-placeholder);
  font-style: normal;
  font-weight: 400;
  line-height: var(--font-size-placeholder);
}

.message_input {
  height: 10rem;
  font-family: var(--font-family-main);
  font-size: var(--font-size-input);
  padding: 20px;
  margin-block: 2rem;
  color: var(--color-text);
  box-sizing: border-box;
  outline: none;
}

.form_button {
  font-family: var(--font-family-main);
  font-size: var(--font-size-input);
  font-weight: 600;
  width: 100%;
  height: 3.75rem;
  border-radius: var(--border-radius-main);
  background: var(--color-primary);
  color: var(--color-bg);
  border: none;
  cursor: pointer;
  transition: background 0.2s;
  margin-top: 1.5rem;
}

.form_button:hover {
  background: var(--color-primary-dark);
}

.iti {
  width: 100%;
}

.form-message_link {
  color: var(--color-primary);
  text-decoration: underline;
  font-weight: 600;
}

.form-message_link:hover {
  color: var(--color-primary-dark);
}