[ruslan_mart]

<div class="col-md-6">
  <label for="inputState" class="form-label px-4">Должность</label>
  <select name="inputState" id="inputState" class="form-select px-4">
    <option></option>
    <option value="Должность 1">Должность 1</option>
    <option value="Должность 2">Должность 2</option>
    <option value="Должность 3">Должность 3</option>
    <option value="Должность 4">Должность 4</option>
    <option value="Должность 5">Должность 5</option>
    <option value="Другое">Другое</option>
  </select>
</div>
<div class="col-md-6 other-form" hidden>
  <label for="hand_input" class="form-label">Введите вашу должность</label>
  <input name="hand_input" type="text" class="form-control" id="hand_input" placeholder="Должность">
</div>
<div class="col-12">
  <button type="submit" class="btn btn-primary">Следующий шаг</button>
</div>

document.addEventListener('DOMContentLoaded', () => {
  const otherForm = document.querySelector('.other-form');

  document.getElementById('inputState').addEventListener('change', ({ currentTarget }) => {
    otherForm.hidden = currentTarget.value !== 'Другое';
  });
});