Enviar dados do formulário HTML por PHP e Ajax

Galera, to com um entrave! To precisando enviar os dados de um formulário html por e-mail e estou usando o PHP pro server-side. Para enviar os dados do formulário para o PHP estou usando o Ajax (que tenho mais familiaridade com JS do que com PHP) e nele tenho duas funções que são ativas caso tenha sucesso e outra com erro. Eu já consigo ativar a função mail() no PHP porém a mensagem não chega com as variáveis que coloquei no PHP para enviar. Uso o Ajax para não haver o refresh da página e conseguir manipular as funções. Existe algum forma de fazer o 'no-refresh' e ativar as funções que preciso direto no PHP (criei um modal para a msg de sucesso e erro) ou devo fazer alguma alteração no meu código?

PHP

<?php

//Variáveis
$assunto = $_POST['assunto'];
$nome = $_POST['nome'];
$email = $_POST['email'];
$mensagem = $_POST['mensagem'];

$to = "afa00.papa@gmail.com";
$from = "afa00.papa@gmail.com";

//Headers config
$headers =  "Content-Type:text/html; charset=UTF-8\n";
$headers .= "From:  afaferz.ml <contato@afaferz.ml>\n";
$headers .= "X-Sender:  <contato@afaferz.ml>\n";
$headers .= "X-Mailer: PHP  v".phpversion()."\n";
$headers .= "X-IP:  ".$_SERVER['REMOTE_ADDR']."\n";
$headers .= "Return-Path:  <contato@afaferz.ml>\n";
$headers .= "MIME-Version: 1.0\n";

//Conteúdo e-mail
$subject = "Formulário Currículo - afaferz";
$templateHTML = '<table style="margin-top: 3em; margin-bottom: 3em; font-family: "Times New Roman", Times, serif;" align="left" border="0" cellpadding="0" cellspacing="0" width="600" height="auto">
<tr>
 <td style="padding: .75em">
  <span style="font-size: 1.25em; font-weight: bold; text-transform: uppercase;">Nome:</span>
  <span style="margin-left: .5em; font-size: 1.25em">'.$nome.'</span>
 </td>
</tr>
<tr>
 <td style="padding: .75em">
  <span style="font-size: 1.25em; font-weight: bold; text-transform: uppercase;">Email:</span>
  <span style="margin-left: .5em; font-size: 1.25em">'.$email.'</span>
 </td>
</tr>
<tr>
 <td style="padding: .75em">
  <span style="font-size: 1.25em; font-weight: bold; text-transform: uppercase;">Assunto:</span>
  <span style="margin-left: .5em; font-size: 1.25em">'.$assunto.'</span>  
</td>
</tr>
<tr>
 <td style="padding: .75em">
    <span style="font-size: 1.25em; font-weight: bold; text-transform: uppercase;">Mensagem:</span><br>
    <span style="display:block; padding-top: .75em; font-size: 1.25em">'.$mensagem.'</span>
 </td>
</tr>
</table>';
$body = $templateHTML;

mail($to, $subject, $body, $headers);
?>

JS

function animarSucesso(){
    const ok = document.querySelector('.ok');

    tituloModal.textContent = 'Enviado';
    tituloMensagem.textContent = 'Obrigado pelo contato :D';
    modal.style.display = 'block';
    modalConteudo.classList.add('sucess');

    setTimeout(()=>{
        loading.style.display = 'none'
        ok.style.display = 'block'
    }, 1000);
    return;
};

function animarErro(){
    const x = document.querySelector('.x');

    tituloModal.textContent = 'Erro ao enviar';
    tituloMensagem.textContent = 'Tente novamente por favor :(';

    modal.style.display = 'block';
    modalConteudo.classList.add('error');

    loading.style.display = 'none'
    setTimeout(()=>{
        x.style.display = 'block'
    }, 1000);
    return;
};

//Enviar formulário AJAX
const formulario = document.querySelector('[name="formularioOndeEstou"]');
const botaoFormulario = document.querySelector('[name="enviar"]')

jQuery(document).ready(function(){
    jQuery(formulario).submit(function(e){
        e.preventDefault();

        var assunto  = $('[name="option-selected"]');
        var nome  = $('[name="nome"]');
        var email = $('[name="email"]');
        var mensagem   = $('[name="mensagem"]');

        var urlData = 
        "&assunto=" + assunto 
        + "&nome=" + nome 
        + "&email=" + email 
        + "&mensagem=" + mensagem;

        jQuery.ajax({
            async: true,
            type: "POST",
            url: "./assets/php/sendEmail.php",
            dataType: "html",
            data: urlData,
            success: function(data)
            {
                animarSucesso();
                formulario.reset();
                setTimeout(()=>{
                    modal.style.display = 'none';
                }, 2000)
            },
            error: function()
            {
                animarErro();
                formulario.reset();
                setTimeout(()=>{
                    modal.style.display = 'none';
                }, 2000)
            }
        });
        return false;
    });
});