#section_contact {
  background-image: url("/wp-content/uploads/2025/11/bkg_contact-page-O.webp");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 11rem 2rem 5rem;
  color: var(--white-200);

  & .contact_info {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    text-align: center;
    margin-bottom: 2rem;

    & i {
      color: var(--green-100);
    }

    & h1 {
      font-weight: bold;
      font-size: 4rem;
      line-height: 1.08;
    }

    & span {
      display: flex;
      align-items: center;
      gap: 12px;
      font-weight: 500;
      font-size: 1.5rem;
    }

    & .contact_phones {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 1rem;
    }

    & .contact_location {
      display: flex;
      flex-direction: column;
      gap: 1rem;

      & i {
        font-size: 1.5rem;
      }

      & h4 {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
      }

      & span {
        font-size: 1rem;
      }

      & .contact_button {
        display: inline-block;
        border: 0;
        padding: 10px;
        color: var(--white-200);
        border-radius: 5px;
        background-color: var(--green-100);

        font-size: 1.125rem;

        &:hover {
          background-color: var(--green-300);
          color: inherit;
        }
      }
    }
  }

  & .form {
    gap: 1.25rem;

    & input,
    textarea {
      padding: 1.25rem;
      border: 0;
      background-color: var(--white-200);

      &:focus {
        box-shadow: 0 0 0 0.25rem rgb(106 184 88 / 25%);
      }
    }

    & .btn_site {
      width: 100%;
      padding-block: 1rem;
      font-size: 1.125rem;
      font-weight: 500;
    }
  }
}

@media (min-width: 992px) {
  #section_contact {
    padding-bottom: 14.5rem;

    & .contact_info {
      text-align: start;
      align-items: start;

      & span {
        font-size: 1.25rem;
      }
      & .contact_phones {
        flex-direction: row;
        /* gap: 3.25rem; */
        gap: 1rem;
      }

      & .contact_location {
        flex-direction: row;
        align-items: end;

        & > div {
          /* max-width: 260px; */
          max-width: 220px;
          display: flex;
          align-items: start;
          gap: 10px;
        }

        & h4 {
          justify-content: start;
        }

        & .contact_button {
          font-size: 0.875rem;
        }
      }
    }

    & .form {
      gap: initial;

      & > div {
        margin-bottom: 1rem;
      }
    }
  }
}

@media (min-width: 1400px) {
  #section_contact {
    & .contact_info {
      & span {
        font-size: 1.5rem;
      }
      & .contact_phones {
        gap: 3.25rem;
      }

      & .contact_location {
        & > div {
          max-width: 260px;
        }

        & .contact_button {
          font-size: 1.125rem;
        }
      }
    }
  }
}