/* CONTACT SECTION */

.hero-image--contact {
  background-image: url("../../images/about_us/contact/contact-service.55b0b20d6551.jpg");
}

.section-contact > * {
  grid-column: 2 / 3;
}

.section-contact--links div:first-child,
.section-contact h4 {
  margin-bottom: var(--margin-small);
}

.section-contact--links .contact-link span:hover,
.section-contact--links a:hover {
  color: var(--color-quaternary);
  border-bottom-color: currentColor;
}

/* CONTACT FORM */
.contactform-box {
  background-color: var(--color-light-grey--1);
  border-radius: var(--radius-default);
  box-shadow: var(--shadow-light);
  overflow: hidden;
}

.contactform-textbox {
  padding: var(--padding-form-textbox);
}

.contactform-textbox p:not(.required-text) {
  color: var(--color-accent);
  margin-bottom: var(--margin-small);
}

.contactform-form {
  column-gap: var(--gap-normal);
  row-gap: calc(var(--gap-normal) / 2);
}

.required {
  justify-content: flex-end;
  gap: var(--gap-xsmall);
  position: relative;
}

.contactform-radio {
  position: relative;
}

.form-radio-group {
  gap: var(--gap-normal);
  margin-top: var(--margin-default);
}

.form-radio--item {
  gap: var(--gap-xsmall);
  align-items: baseline;
}

.form-radio--input {
  height: calc(var(--size-checkbox) - 0.2rem);
}

.contactform-form input,
.contactform-form select,
.contactform-form textarea {
  width: 100%;
  padding: var(--padding-small);
  border-radius: calc(var(--radius-small) / 2);
  border: var(--border-default);
  font-style: inherit;
}

input.form-checkbox-input {
  height: var(--size-checkbox);
  width: var(--size-checkbox);
  align-self: anchor-center;
}

.form-checkbox-label {
  display: flex;
  gap: calc(var(--gap-xsmall) + 0.3rem);
  background-color: var(--color-light-grey--2);
  padding: calc(var(--padding-small) / 2) calc(var(--padding-normal) / 2);
  border-radius: var(--radius-small);
}

.contactform-checkbox {
  margin-top: var(--margin-small);
}

.contactform-form label {
  display: block;
  font-size: inherit;
  font-weight: var(--weight-medium);
  margin-bottom: var(--margin-small);
  position: relative;
}

.contactform-checkbox label {
  display: flex;
}

.form-button {
  justify-self: end;
}

.btn.contactform-btn {
  background-color: var(--color-accent);
}

.btn.contactform-btn:hover {
  background-color: var(--color-background-complementary);
}

.contactform-form input:active,
.contactform-form input:focus,
.contactform-form textarea:active,
.contactform-form textarea:focus,
.contactform-form select:active,
.contactform-form select:focus {
  outline: none;
  border-color: var(--color-light-grey--2);
}

.contactform-img-box {
  background-image: url("../../images/legacy/map.ae596d8c9564.webp");
}