Másca dual para telefone/celular

mask.html

<!-- no formulário -->
<input type="tel" id="phone" class="phone" name="phone" placeholder="Seu Telefone ou Whatsapp" autocomplete="off" required>

<!-- biblioteca importante -->
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.mask.js"></script>

<!-- js para funcionar -->
<script type="text/javascript">
  (function($) {
    $(function() {
      var SPMaskBehavior = function (val) {
        return val.replace(/\D/g, '').length === 11 ? '(00) 00000-0000' : '(00) 0000-00009';
      },
      spOptions = {
        onKeyPress: function(val, e, field, options) {
            field.mask(SPMaskBehavior.apply({}, arguments), options);
          }
      };
      $('.phone').mask(SPMaskBehavior, spOptions);
    });
  })(jQuery);
</script>