  
    

  
  



</div>

<style class="transform-overrides-vars">
  
</style>

</div></div></div></div></div>
          </div>
        </main>

        <div id="preFooter">
          <div class="pre-footer-inner with-custom">
  <div class="sqs-layout sqs-grid-12 columns-12" data-layout-label="Pre-Footer Content" data-type="block-field" data-updated-on="1786042646640" id="preFooterBlocks"><div class="row sqs-row"><div class="col sqs-col-12 span-12"><div class="sqs-block image-block sqs-block-image" data-block-type="5" data-sqsp-block="image-classic" id="block-yui_3_17_2_1_1786041986787_4952"><div class="sqs-block-content">










































  

    
  
    <div
        class="
          image-block-outer-wrapper
          layout-caption-below
          design-layout-inline
          combination-animation-none
          individual-animation-none
          individual-text-animation-none
        "
        data-test="image-block-inline-outer-wrapper"
        data-sqsp-image-classic-block-layout="inline"
    >

      

      
        <figure
            class="
              sqs-block-image-figure
              intrinsic
            "
            style="max-width:1350px;"
        >
          
        
        

        
          
            
          <div
              
              
              class="image-block-wrapper"
              data-animation-role="image"
              
  

          >
            <div data-sqsp-image-classic-block-image-container class="sqs-image-shape-container-element
              
          
        
              has-aspect-ratio
            " style="
                position: relative;
                
                  padding-bottom:37.03703689575195%;
                
                overflow: hidden;-webkit-mask-image: -webkit-radial-gradient(white, black);
              "
              >
                
                
                
                
                
                
                
                <img data-stretch="false" data-src="https://images.squarespace-cdn.com/content/v1/57f03f5ad482e918dc2dc031/6ab2295c-7f08-4dd2-8594-3d34cee87544/Hub++MC+Embalo.gif" data-image="https://images.squarespace-cdn.com/content/v1/57f03f5ad482e918dc2dc031/6ab2295c-7f08-4dd2-8594-3d34cee87544/Hub++MC+Embalo.gif" data-image-dimensions="1350x500" data-image-focal-point="0.5,0.5" alt="" data-load="false" elementtiming="system-image-block" data-sqsp-image-classic-block-image src="https://images.squarespace-cdn.com/content/v1/57f03f5ad482e918dc2dc031/6ab2295c-7f08-4dd2-8594-3d34cee87544/Hub++MC+Embalo.gif" width="1350" height="500" alt="" sizes="(max-width: 640px) 100vw, (max-width: 767px) 100vw, 100vw" style="display:block;object-fit: cover; width: 100%; height: 100%; object-position: 50% 50%" onload="this.classList.add(&quot;loaded&quot;)" srcset="https://images.squarespace-cdn.com/content/v1/57f03f5ad482e918dc2dc031/6ab2295c-7f08-4dd2-8594-3d34cee87544/Hub++MC+Embalo.gif?format=100w 100w, https://images.squarespace-cdn.com/content/v1/57f03f5ad482e918dc2dc031/6ab2295c-7f08-4dd2-8594-3d34cee87544/Hub++MC+Embalo.gif?format=300w 300w, https://images.squarespace-cdn.com/content/v1/57f03f5ad482e918dc2dc031/6ab2295c-7f08-4dd2-8594-3d34cee87544/Hub++MC+Embalo.gif?format=500w 500w, https://images.squarespace-cdn.com/content/v1/57f03f5ad482e918dc2dc031/6ab2295c-7f08-4dd2-8594-3d34cee87544/Hub++MC+Embalo.gif?format=750w 750w, https://images.squarespace-cdn.com/content/v1/57f03f5ad482e918dc2dc031/6ab2295c-7f08-4dd2-8594-3d34cee87544/Hub++MC+Embalo.gif?format=1000w 1000w, https://images.squarespace-cdn.com/content/v1/57f03f5ad482e918dc2dc031/6ab2295c-7f08-4dd2-8594-3d34cee87544/Hub++MC+Embalo.gif?format=1500w 1500w, https://images.squarespace-cdn.com/content/v1/57f03f5ad482e918dc2dc031/6ab2295c-7f08-4dd2-8594-3d34cee87544/Hub++MC+Embalo.gif?format=2500w 2500w" loading="lazy" decoding="async" data-loader="sqs">

            </div>
          </div>
        
          
        

        
      
        </figure>
      

    </div>
  


  


</div></div></div></div></div>
</div>

        </div>

        <footer id="footer" role="contentinfo">
          <div class="footer-inner">
            <div class="nav-wrapper back-to-top-nav"><nav><div class="back-to-top"><a href="#header">Back To Top</a></div></nav></div>
            <div id="secondaryNavWrapper" class="nav-wrapper desktop-nav-wrapper">
  <nav id="secondaryNavigation" data-content-field="navigation" >
    
      
        

        
        <div class="folder" id="id5e3983f0ac93d1256a33d5b4">
          <input type="checkbox" name="folder-toggle-5e3983f0ac93d1256a33d5b4" id="folder-toggle-5e3983f0ac93d1256a33d5b4" class="folder-toggle-box hidden" />
          <label for="folder-toggle-5e3983f0ac93d1256a33d5b4" class="folder-toggle-label" onclick data-href="/campanhas">Campaigns</label>
          <div class="subnav">
          

            
            <div class="collection" id="id5d85073bf6cdad589e27c5a2">
              <a href="/blackfriday2019">
                <span>[19.2] Black Friday 2019</span>
              </a>
            </div>
            
            
          

            
            <div class="collection" id="id5cd5ff534e17b6757a991b77">
              <a href="/black-friday">
                <span>[18.2] Black Friday</span>
              </a>
            </div>
            
            
          
          </div>
        </div>
        
      
      

    
  </nav>
</div>


            <div id="siteInfo"><a href="mailto:contato@aiesec.org.br" class="site-email">contato@aiesec.org.br</a></div>
            <div class="sqs-layout sqs-grid-12 columns-12" data-layout-label="Footer Content" data-type="block-field" data-updated-on="1570503482449" id="footerBlocks"><div class="row sqs-row"><div class="col sqs-col-12 span-12"><div class="sqs-block html-block sqs-block-html" data-block-type="2" data-sqsp-block="text" id="block-713fe491a2c303b33937"><div class="sqs-block-content">

<div class="sqs-html-content" data-sqsp-text-block-content>
  <p style="text-align:center;white-space:pre-wrap;" class="">Powered by <a href="http://www.squarespace.com" target="_blank">Squarespace</a></p>
</div>






















</div></div></div></div></div>
          </div>
        </footer>

        
        <div class="sqs-custom-cart custom-cart empty">
          <a href="/cart" class="custom-cart-button">Cart (<span class="sqs-cart-quantity">0</span>)</a>
        </div>
        

      </div>
    </div>

    <script src="https://static1.squarespace.com/static/ta/52e968b5e4b04d2aa2a3bba3/1142/scripts/site-bundle.js" type="text/javascript"></script>

    <script>
// =================== FUNÇÕES REUTILIZÁVEIS =================== //

/**
 * Pausa a execução por uma quantidade específica de milissegundos.
 * Usado em validações assíncronas ou feedback temporário.
 * @param {number} ms - Tempo em milissegundos para pausar.
 * @returns {Promise<void>} Promise resolvida após o tempo especificado.
 * @nota Segurança: Usar apenas para UX; não bloqueia thread principal.
 */
function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

/**
 * Cria um modal simples de popup com título, mensagem e logo opcional.
 * 
 * @param {string} titulo - Título do modal.
 * @param {string} mensagem - Mensagem a ser exibida no corpo do modal.
 * @param {string} [urlLogo] - URL opcional da imagem da logo a ser exibida no modal.
 */
function criarModalPopUp(titulo, mensagem, urlLogo) {
    // Criação do overlay (fundo semitransparente) do modal
    const modalOverlay = document.createElement('div');
    modalOverlay.classList.add('modal-overlay');

    // Criação da caixa do modal
    const modalBox = document.createElement('div');
    modalBox.classList.add('modal-box');
    modalBox.style.position = 'relative'; // Necessário para posicionar a logo corretamente

    // ------------------- Cabeçalho (Header) ------------------- //
    const modalHeader = document.createElement('div');
    modalHeader.classList.add('modal-header');

    const h2 = document.createElement('h2');
    h2.textContent = titulo;

    // Botão de fechar o modal
    const btnFechar = document.createElement('span');
    btnFechar.innerHTML = '&times;';
    btnFechar.classList.add('btn-fechar');

    // Adiciona título e botão de fechar ao cabeçalho
    modalHeader.appendChild(h2);
    modalHeader.appendChild(btnFechar);

    // ------------------- Corpo (Body) ------------------- //
    const modalBody = document.createElement('div');
    modalBody.classList.add('modal-body');

    // Divide a mensagem em linhas e adiciona ao corpo
    mensagem.split('\n').forEach(linha => {
        const texto = linha.trim() + (!/[.!?]$/.test(linha.trim()) ? '.' : '');
        const p = document.createElement('p');
        p.textContent = texto;
        modalBody.appendChild(p);
    });

    // ------------------- Logo ------------------- //
    

    // ------------------- Rodapé (Footer) ------------------- //
    const modalFooter = document.createElement('div');
    modalFooter.classList.add('modal-footer');

    // ------------------- Eventos ------------------- //
    // Evento para fechar o modal ao clicar no botão de fechar
    btnFechar.addEventListener('click', () => modalOverlay.remove());

    // Não adiciona o evento de clique fora para fechar o modal (não será fechado ao clicar fora)

    // ------------------- Montagem ------------------- //
    // Adiciona as partes do modal à estrutura
    modalBox.appendChild(modalHeader);
    modalBox.appendChild(modalBody);
    modalBox.appendChild(modalFooter);
    modalOverlay.appendChild(modalBox);

    // Adiciona o modal ao corpo do documento
    document.body.appendChild(modalOverlay);
}

/**
 * Cria um modal de confirmação para o usuário, exibindo os dados fornecidos e permitindo confirmar ou voltar.
 * 
 * @param {Object} dados - Objeto contendo os dados do usuário a serem exibidos no modal (nome, sobrenome, email, etc).
 * @param {Function} onConfirm - Função callback que é executada após a confirmação do usuário.
 * @param {string} [urlLogo] - URL opcional da imagem da logo a ser exibida no modal.
 */
function criarModalConfirmacao(dados, onConfirm, urlLogo) {
    // Criação do overlay (fundo semitransparente) do modal
    const modalOverlay = document.createElement('div');
    modalOverlay.classList.add('modal-overlay');

    // Criação da caixa do modal
    const modalBox = document.createElement('div');
    modalBox.classList.add('modal-box');
    modalBox.style.position = 'relative';

    // ------------------- Cabeçalho (Header) ------------------- //
    const modalHeader = document.createElement('div');
    modalHeader.classList.add('modal-header');

    const h2 = document.createElement('h2');
    h2.textContent = "Confirme seus dados";

    // Botão de fechar o modal
    const btnFechar = document.createElement('span');
    btnFechar.innerHTML = '&times;';
    btnFechar.classList.add('btn-fechar');

    // Adiciona título e botão de fechar ao cabeçalho
    modalHeader.appendChild(h2);
    modalHeader.appendChild(btnFechar);

    // ------------------- Corpo (Body) ------------------- //
    const logo = "./assets/img/Logo-Aiesec.png";
    const modalBody = document.createElement('div');
    modalBody.classList.add('modal-body');
    modalBody.innerHTML = `
        <p><strong>Nome:</strong> ${dados.nome}</p>
        <p><strong>Sobrenome:</strong> ${dados.sobrenome}</p>
        <p><strong>Email institucional:</strong> ${dados.emailGerado}</p>
        ${dados.emailPessoal ? `<p><strong>Email pessoal:</strong> ${dados.emailPessoal}</p>` : ""}
        ${dados.telefone ? `<p><strong>Telefone:</strong> ${dados.telefone}</p>` : ""}
        ${dados.foto.base64 !== "" ? `<img src="${dados.foto.base64}" class="imagem_usuario">` : ""}
        <p>---------------------------------------------------</p>
        <p>Pode levar um tempo até a inserção de seu dados, após o fechamento do Pop Up!</p>
        <p>Por favor, aguarde e recebera suas crendenciais também!</p>
    `;

    // ------------------- Rodapé (Footer) ------------------- //
    const modalFooter = document.createElement('div');
    modalFooter.classList.add('modal-footer');

    // Botão de voltar
    const btnVoltar = document.createElement('button');
    btnVoltar.textContent = "Voltar";
    btnVoltar.classList.add('btn-cancelar');
    btnVoltar.style.left = '5%';
    btnVoltar.style.position = "absolute";

    // Botão de confirmar
    const btnConfirmar = document.createElement('button');
    btnConfirmar.textContent = "Confirmar";
    btnConfirmar.classList.add('btn-confirmar');

    modalFooter.appendChild(btnVoltar);
    modalFooter.appendChild(btnConfirmar);

    // ------------------- Logo ------------------- //

    let confirmado = false;

    // ------------------- Eventos ------------------- //
    // Evento para voltar (fecha o modal)
    btnVoltar.addEventListener('click', () => modalOverlay.remove());

    // Evento para confirmar dados
    btnConfirmar.addEventListener('click', () => {
        // Exibe o ícone de "check" de sucesso
        modalBody.innerHTML = `
            <div class="check-container">
                <svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52">
                    <circle class="checkmark-circle" cx="26" cy="26" r="25" fill="none"/>
                    <path class="checkmark-check" fill="none" d="M14 27l7 7 16-16"/>
                </svg>
                <p>Dados confirmados com sucesso!</p>
            </div>
        `;
        // Remove botões do rodapé
        modalFooter.innerHTML = "";
        confirmado = true;
    });

    const fecharModal = () => {
        modalOverlay.remove();
        // Chama a função de confirmação, se fornecida
        if (confirmado && typeof onConfirm === "function") {
            onConfirm();
            // Aguarda o spinner fechar e então gera o TXT
            esperarESpinnerFechar(dados);
        }
    };

    // Evento para fechar o modal ao clicar no botão de fechar
    btnFechar.addEventListener('click', fecharModal);

    // Não adiciona o evento de clique fora para fechar o modal
    // modalOverlay.addEventListener('click', e => {
    //     if (e.target === modalOverlay) modalOverlay.remove();
    // });

    // ------------------- Montagem ------------------- //
    // Adiciona as partes do modal à estrutura
    modalBox.appendChild(modalHeader);
    modalBox.appendChild(modalBody);
    modalBox.appendChild(modalFooter);
    modalOverlay.appendChild(modalBox);

    // Adiciona o modal ao corpo do documento
    document.body.appendChild(modalOverlay);
}
/**
 * Validar o campo de codigo de membresia
 * Remove carcteres invalidos e atualiza estado visual e mensagem de erro
 * @param {HTMLInputElement} input - Input de texto.
 * @param {HTMLElement} erroElemento - Elemento para exibir mensagens de erro.
 * @nota Segurança: Remove caracteres especiais para prevenir injeção.
 */
async function validarCodigoMembresia(input, erroElemento) {
    input.value = input.value.replace(/[^0-9\s]/g, '');
    const regex = /^[0-9\s]+$/;
    if (regex.test(input.value) && input.value.length === 5 && input.value !== "") {
        input.classList.add('valid');
        input.classList.remove('invalid');
        erroElemento.textContent = " ";
        return true
    } else {
        input.classList.add('invalid');
        input.classList.remove('valid');
        erroElemento.textContent = "O codigo de membresia deve conter 5 digitos";
        if (input.value === "") {
            await sleep(2000);
            input.classList.remove('valid', 'invalid');
            erroElemento.textContent = "Informe seu codigo de Membresia";
            return false
        }
        return false
    }
}
  
function removerAcentos(texto) {
    return texto
        .normalize("NFD")
        .replace(/[\u0300-\u036f]/g, "");
}

/**
 * Valida um campo de texto (nome ou sobrenome).
 * Remove caracteres inválidos e atualiza estado visual e mensagem de erro.
 * @param {HTMLInputElement} input - Input de texto.
 * @param {HTMLElement} erroElemento - Elemento para exibir mensagens de erro.
 * @param {string} tipo - Tipo de dado (nome/sobrenome) para a mensagem.
 * @nota Segurança: Remove caracteres especiais para prevenir injeção.
 */
async function validarTexto(input, erroElemento, tipo) {
    input.value = removerAcentos(input.value).replace(/[^A-Za-z\s]/g, '');
    const regex = /^[A-Za-z\s]+$/;
    if (regex.test(input.value) && input.value !== "") {
        input.classList.add('valid');
        input.classList.remove('invalid');
        erroElemento.textContent = " ";
        return true
    } else {
        input.classList.add('invalid');
        input.classList.remove('valid');
        erroElemento.textContent = `Deve ser um ${tipo} próprio`;
        if (input.value === "") {
            await sleep(2000);
            input.classList.remove('valid', 'invalid');
            erroElemento.textContent = `Informe seu ${tipo}(se tiver 2 ou 3 também informar)`;
            return false
        }
        return false
    }
}

async function validarCampos({
  nome,
  sobrenome,
  senha,
  codigoMembresia,
  emailSecundario,
  telefone,
  erroNome,
  erroSobrenome,
  erroSenha,
  erroCodigo,
  erroTelefone,
  logo
}) {
  // Validações
  const nomeValido = await validarTexto(nome, erroNome, 'nome');
  const sobrenomeValido = await validarTexto(sobrenome, erroSobrenome, 'sobrenome');
  const senhaValida = await validarSenha(senha, erroSenha); // <-- senha é input
  const codigoValido = await validarCodigoMembresia(codigoMembresia, erroCodigo);
  const emailSecValido = true /*await validarEmailSecundario(emailSecundario.value.trim());*/ 
  const telefoneValido = await validarTelefone(telefone, erroTelefone);

  // Mensagens
  const nomeOK = nomeValido ? "" : "- Nome\n";
  const sobrenomeOK = sobrenomeValido ? "" : "- Sobrenome\n"; 
  const senhaOK = senhaValida.codicao ? "" : `- Senha (${senhaValida.mensagem})\n`;
  const codigoOK = codigoValido ? "" : "- Código de Membresia\n";
  const emailSecOK = emailSecValido ? "" : "- Email Pessoal\n";
  const telefoneOK = telefoneValido ? "" : "- Telefone\n";

  // Verifica se todos os campos estão válidos
  if (!nomeValido || !sobrenomeValido || !senhaValida.codicao || !codigoValido || !emailSecValido || !telefoneValido) {
    esconderSpinner();
    criarModalPopUp(
      "Atenção",
      `Campos obrigatórios não preenchidos ou incorretos:\n${nomeOK}${sobrenomeOK}${senhaOK}${codigoOK}${emailSecOK}${telefoneOK}`,
      logo
    );
    return false;
  }

  return true;
}



/**
 * Valida a senha de acordo com critérios de segurança.
 * @param {HTMLInputElement} input - Campo de senha.
 * @param {HTMLElement[]} erros - Lista de elementos que exibem regras de senha.
 * @returns {boolean} True se todos os critérios forem atendidos.
 * @nota Segurança: Não armazene senhas em texto puro; apenas valida visualmente.
 */
async function validarSenha(input, erros) {
    const valor = input.value;
    const minimo = valor.length >= 8 && !/\s/.test(valor);
    const minusculo = /[a-z]/.test(valor);
    const maiusculo = /[A-Z]/.test(valor);
    const caracterEspecial = /\d/.test(valor) && /[@$!%*?&]/.test(valor);

    if (valor !== "") {
        erros[0].style.color = minimo ? 'green' : 'red';
        erros[1].style.color = minusculo ? 'green' : 'red';
        erros[2].style.color = maiusculo ? 'green' : 'red';
        erros[3].style.color = caracterEspecial ? 'green' : 'red';
    } else {
        erros.forEach(e => e.style.color = 'black');
        input.classList.remove('valid');
    }

    const allOk = minimo && minusculo && maiusculo && caracterEspecial;
    const resultado = {
        codicao: allOk,
        mensagem: valor === "" ? "Uma ou mais das condições da senha não foi atendida": ""
    }
    input.classList.toggle('valid', allOk);
    input.classList.toggle('invalid', !allOk);
    if (valor === "") input.classList.remove('invalid');

    return resultado;
}

/**
 * Alterna a visibilidade de um campo de senha.
 * @param {HTMLInputElement} input - Campo de senha.
 * @param {boolean} mostrar - true para mostrar senha, false para ocultar.
 * @param {HTMLElement} olhoAberto - Ícone de olho aberto.
 * @param {HTMLElement} olhoFechado - Ícone de olho fechado.
 */
function toggleSenha(input, mostrar, olhoAberto, olhoFechado) {
    input.type = mostrar ? 'text' : 'password';
    olhoAberto.style.display = mostrar ? 'inline' : 'none';
    olhoFechado.style.display = mostrar ? 'none' : 'inline';
}

/**
 * Verifica se o e-mail informado pertence a domínios permitidos.
 * @param {string} email - E-mail informado.
 * @returns {boolean} True se válido, false caso contrário.
 */
async function validarEmailSecundario(email) {
    const dominiosPermitidos = ['gmail.com', 'hotmail.com', 'outlook.com', 'yahoo.com'];
    const regexEmail = /^[\w.-]+@([\w-]+\.)+[\w-]{2,4}$/;
    if (email !== "") {
        if (!regexEmail.test(email)) return false;
        const dominio = email.split('@')[1].toLowerCase();
        return dominiosPermitidos.includes(dominio);
    } else {
        return true;
    }
}

/**
 * Valida telefone brasileiro no formato (DDD) 9XXXX-XXXX
 * @param {HTMLInputElement} input - Campo do telefone
 * @param {HTMLElement} erroElemento - Elemento para mostrar a mensagem de erro
 * @returns {boolean} true se o telefone for válido
 */
async function validarTelefone(input, erroElemento) {
    // Remove espaços e caracteres não numéricos para validação

    input.value = formatarTelefone(input)
    // Regex: DDD (2 dígitos) + 9 + 4 ou 5 dígitos + 4 dígitos
    const regex = /^\(?[1-9]{2}\)\s?9\d{4}-\d{4}$/;
    if (regex.test(input.value)) {
        input.classList.add('valid');
        input.classList.remove('invalid');
        erroElemento.textContent = '';
        return true;
    } else {
        input.classList.add('invalid');
        input.classList.remove('valid');
        erroElemento.textContent = 'Digite um telefone válido no formato (DDD) 9XXXX-XXXX';
        if (input.value === "") {
            await sleep(500);
            input.classList.remove('valid', 'invalid');
            erroElemento.textContent = 'Informe seu telefone';
            return true;
        }
        return false;
    }
}

/**
 * Formata um número de telefone no padrão (99) 9 9999-9999
 * @param {string} valor - Apenas números do telefone
 * @returns {string} Telefone formatado
 */
function formatarTelefone(input) {
    // Remove tudo que não for número
    let valor = input.value.replace(/\D/g, '');

    // Limita a 11 dígitos
    if (valor.length > 11) valor = valor.slice(0, 11);

    let resultado = '';

    if (valor.length > 0) resultado += '(' + valor.substring(0, 2);
    if (valor.length >= 3) resultado += ') ' + valor.substring(2, 3);
    if (valor.length >= 4) resultado += valor.substring(3, 7);
    if (valor.length >= 8) resultado += '-' + valor.substring(7);

    return resultado;
}

function normalizarTelefone(numero) {
    let apenasNumeros = numero.value.replace(/\D/g, "");

    if (apenasNumeros.startsWith("0")) {
        apenasNumeros = apenasNumeros.substring(1);
    }
    return "+55" + apenasNumeros
}

/**
 * Formata um nome completo, colocando a primeira letra de cada palavra em maiúscula
 * e o restante em minúsculas.
 *
 * Exemplo:
 *  - Entrada: "joÃO da silVA"
 *  - Saída: "João Da Silva"
 *
 * @param {string} nomeCompleto - Nome completo a ser formatado.
 * @returns {string} Nome formatado com capitalização correta.
 */
function formatarNome(nomeCompleto) {
    return nomeCompleto
        .toLowerCase()                            // Deixa tudo em minúsculas
        .trim()                                   // Remove espaços nas bordas
        .split(/\s+/)                             // Separa por qualquer quantidade de espaços
        .map(palavra =>
            palavra.charAt(0).toUpperCase() +     // Primeira letra maiúscula
            palavra.slice(1)                      // Restante minúsculo
        )
        .join(" ");                               // Junta as palavras com espaço
}

/**
 * Exibe o spinner de carregamento.
 */
function mostrarSpinner() {
    document.getElementById('spinner').style.display = 'flex';
}

/**
 * Oculta o spinner de carregamento.
 */
function esconderSpinner() {
    document.getElementById('spinner').style.display = 'none';
}

async function downloadCredenciais(dados, duracao = 2500) {
    await sleep(duracao)
    const conteudo = `Email institucional: ${dados.emailGerado}\nSenha: ${dados.senha}`;
    const blob = new Blob([conteudo], { type: "text/plain" });
    const url = URL.createObjectURL(blob);

    const link = document.createElement('a');
    link.href = url;
    link.download = `${dados.nome}_credenciais.txt`;
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
    URL.revokeObjectURL(url);
}

// Exemplo de uso depois que o spinner fechar
async function esperarESpinnerFechar(dados) {
    // Aguarda enquanto o spinner estiver visível
    while (document.getElementById('spinner').style.display !== 'none') {
        await sleep(500); // checa a cada 500ms ou 0,5s
    }


    // Depois que o spinner desaparecer, faz o download
    downloadCredenciais(dados);

}

/**
 * Mostra uma notificação flutuante no canto superior direito.
 * @param {string} mensagem - Texto da notificação.
 * @param {'sucesso'|'erro'} tipo - Tipo da notificação: sucesso (verde) ou erro (vermelho).
 * @param {number} duracao - Tempo em ms que a notificação ficará visível.
 */
function mostrarNotificacao(mensagem, tipo = 'sucesso', duracao = 3000) {
    // Cria container principal caso ainda não exista
    let container = document.getElementById('notificacaoContainer');
    if (!container) {
        container = document.createElement('div');
        container.id = 'notificacaoContainer';
        container.style.position = 'fixed';
        container.style.top = '20px';
        container.style.right = '20px';
        container.style.zIndex = 9999;
        container.style.display = 'flex';
        container.style.flexDirection = 'column';
        container.style.gap = '10px';
        document.body.appendChild(container);
    }

    // Cria a notificação
    const noti = document.createElement('div');
    noti.style.padding = '10px 20px';
    noti.style.borderRadius = '8px';
    noti.style.color = '#fff';
    noti.style.fontWeight = 'bold';
    noti.style.boxShadow = '0 2px 8px rgba(0,0,0,0.2)';
    noti.style.opacity = '0';
    noti.style.transform = 'translateY(-20px)';
    noti.style.transition = 'all 0.3s ease';

    // Define cor conforme o tipo
    if (tipo === 'sucesso') {
        noti.style.backgroundColor = '#28a745'; // verde
        noti.textContent = `E-mail: ${mensagem} Gerado com Sucesso!`;
    } else if (tipo === 'erro') {
        noti.style.backgroundColor = '#dc3545'; // vermelho
        noti.textContent = `E-mail: ${mensagem} Não foi possivel ser gerado!`;
    }

    container.appendChild(noti);

    // Anima entrada
    requestAnimationFrame(() => {
        noti.style.opacity = '1';
        noti.style.transform = 'translateY(0)';
    });
    // Volta a página para o topo
    window.scrollTo({
        top: 0,
        left: 0,
        behavior: 'smooth' // remove se quiser instantâneo
    });

    // Remove após duracao
    setTimeout(() => {
        noti.style.opacity = '0';
        noti.style.transform = 'translateY(-20px)';
        setTimeout(() => container.removeChild(noti), 5000);
    }, duracao);
}

/**
 * Restaura a imagem padrão do usuário.
 * Usada no reset do formulário.
 * @param {HTMLImageElement} preview - Elemento de preview da foto.
 */
function limpar(nome, sobrenome, senha, olhoFechado, olhoAberto, emailSecundario, telefone, erroNome, erroSobrenome, erroTelefone, erroSenha, codigo, erroCodigo) {
    const image = document.querySelector("#imagemTemp");
    if (image){
        image.remove();
    }
    nome.classList.remove('invalid', 'valid');
    codigo.classList.remove('invalid', 'valid');
    sobrenome.classList.remove('invalid', 'valid');
    senha.classList.remove('invalid', 'valid');
    emailSecundario.classList.remove('invalid', 'valid');
    telefone.classList.remove('invalid', 'valid');
    erroNome.textContent = "Informe seu nome(se tiver 2 ou 3 também informar)";
    erroSobrenome.textContent = "Informe seu Sobrenome(se tiver 2 ou 3 também informar)";
    erroTelefone.textContent = "Informe seu telefone";
    erroCodigo.textContent = "Informe seu codigo de membresia";
    erroSenha[0].style.color = "black";
    erroSenha[1].style.color = "black";
    erroSenha[2].style.color = "black";
    erroSenha[3].style.color = "black";
    toggleSenha(senha, false, olhoAberto, olhoFechado)
}

/**
 * Limpa palavras removendo conectores e vogais soltas.
 * @param {string} nomeCompleto - Nome completo do usuário.
 * @returns {string[]} - Array de palavras limpas.
 */
function limparPalavras(nomeCompleto) {
    const conectores = ["de", "da", "di", "do", "du"];
    const vogaisSoltas = ["a", "e", "i", "o", "u"];

    let palavras = nomeCompleto.toLowerCase().trim().split(/\s+/);

    // Filtra palavras que não são conectores nem vogais soltas
    palavras = palavras.filter(p => !conectores.includes(p) && !vogaisSoltas.includes(p));
    return palavras;
}

/**
 * Função que converte uma imagem selecionada em um campo de input para Base64.
 * 
 * Esta função recebe um arquivo de imagem de um campo de input, lê o arquivo de forma assíncrona 
 * e retorna um objeto com os dados da imagem (Base64 e tipo de arquivo).
 * 
 * @param {HTMLInputElement} imagem - O campo de input que contém o arquivo de imagem selecionado.
 * @returns {Promise<Object>} Retorna uma Promise que resolve com um objeto contendo os dados da imagem:
 *    - `base64` {string}: O conteúdo da imagem convertido para Base64.
 *    - `tipo` {string}: O tipo MIME do arquivo (ex: "image/png").
 * 
 * @throws {string} Caso nenhum arquivo seja selecionado, a Promise será rejeitada com a mensagem "Nenhuma imagem selecionada".
 * 
 * @example
 * const inputImagem = document.querySelector('input[type="file"]');
 * DadosImagem(inputImagem).then(({ base64, tipo }) => {
 *    console.log("Base64:", base64);
 *    console.log("Tipo:", tipo);
 * }).catch(error => {
 *    console.log("Erro:", error);
 * });
 */
function dadosImagem(imagem) {
    return new Promise((resolve) => {
        const file = imagem.files[0];
        if (!file) return resolve({ base64: '', tipo: '' });
        
        const reader = new FileReader();
        reader.onload = (e) => resolve({ base64: e.target.result, tipo: file.type });
        reader.onerror = () => resolve({ base64: '', tipo: '' });
        reader.readAsDataURL(file);
    });
}


/**
 * Gera um e-mail único verificando se já existe no sistema via POST.
 * Testa todas as combinações possíveis e, se necessário, adiciona um número incremental.
 * @param {string} nome - Nome do usuário.
 * @param {string} sobrenome - Sobrenome do usuário.
 * @returns {Promise<string>} - E-mail único gerado.
 */
async function gerarEmail(nome, sobrenome, erroNome, erroSobrenome, url) {
    // Limpa as palavras do nome e sobrenome
    const ultimoSobrenome = limparPalavras(sobrenome.value); // Corrigido para acessar .value
    const primeiroNome = limparPalavras(nome.value); // Corrigido para acessar .value

    // Exibe o spinner (indicador de carregamento)
    mostrarSpinner();

    const combinacoes = [];

    for (let nomeComeco = 0; nomeComeco < primeiroNome.length; nomeComeco++) {
        for (let sobrenomeFinal = ultimoSobrenome.length - 1; sobrenomeFinal >= 0; sobrenomeFinal--) {
            const emailTeste = `${primeiroNome[nomeComeco]}.${ultimoSobrenome[sobrenomeFinal]}@aiesec.org.br`;
            combinacoes.push(emailTeste);
        }
    }

    // Verifica todas as combinações em paralelo
    const respostas = await Promise.all(combinacoes.map(email => buscarUsuario(url, email)));
    for (let i = 0; i < respostas.length; i++) {
        const existe = respostas[i];
        if (existe && Object.keys(existe).length === 1) {
            esconderSpinner();
            return combinacoes[i]; // Retorna o primeiro que não existe
        }
    }
    // Adiciona classe de erro (invalid) e remove a classe de sucesso (valid)
    nome.classList.add('invalid');
    nome.classList.remove('valid');
    sobrenome.classList.add('invalid');
    sobrenome.classList.remove('valid');

    // Exibe mensagem de erro
    erroNome.textContent = "Já existe um e-mail gerado com esse nome.";
    erroSobrenome.textContent = "Já existe um e-mail gerado com esse sobrenome.";
    esconderSpinner();  // Esconde o spinner depois de tudo
    // Volta a página para o topo
    window.scrollTo({
        top: 0,
        left: 0,
        behavior: 'smooth' // remove se quiser instantâneo
    });
    
    return criarModalPopUp("Erro", "Usuario já Cadastrado", "./assets/img/Logo-Aiesec.png")

}

/**
 * Função para buscar dados através de uma requisição POST.
 * 
 * @param {string} url - A URL para a qual a requisição será feita.
 * @param {string} email - O e-mail que será enviado no corpo da requisição.
 * 
 * @returns {Object|null} Retorna os dados da resposta no formato JSON, ou null se ocorrer um erro.
 * 
 * @throws {Error} Lança um erro caso a requisição falhe ou a resposta não seja bem-sucedida.
 */
async function buscarUsuario(url, email) {
    // Criando um objeto com o e-mail para enviar na requisição
    const dados = { email: email };

    try {
        // Utilizando fetch para fazer a requisição POST
        const response = await fetch(url, {
            method: 'POST', // Método HTTP
            headers: {
                'Content-Type': 'application/json', // Definindo o tipo de conteúdo como JSON
              
            },
            body: JSON.stringify(dados) // Convertendo o objeto 'dados' para uma string JSON
        });
        // Verificando se a resposta foi bem-sucedida
        if (!response.ok) {
            // Se a resposta não for 2xx, lança um erro
            throw new Error(`Falha: ${response.status} - ${response.statusText}`);
        }

        // Parseando a resposta para JSON e retornando os dados
        const data = await response.json();
        return data;

    } catch (error) {
        // Tratando os erros, caso algo dê errado
        console.error("Erro ao buscar dados:", error.message);
        return null; // Retorna null em caso de erro
    }
}

async function inserirUsuarios(url, dados) {
    const data = {
        nome: dados.nome,
        sobrenome: dados.sobrenome,
        senha: dados.senha,
        emailGerado: dados.emailGerado,
        emailPessoal: dados.emailPessoal,
        telefone: dados.telefone,
        foto: { 
            base64: dados.foto.base64 !== "" ? dados.foto.base64.split(',')[1] : "" ,
            tipo: dados.foto.tipo !== "" ? dados.foto.tipo : ""
        },
        codigo: dados.codigo
    }
    try {
        // Utilizando fetch para fazer a requisição POST
        const response = await fetch(url, {
            method: 'POST', // Método HTTP
            headers: {
                'Content-Type': 'application/json', // Definindo o tipo de conteúdo como JSON
            },
            body: JSON.stringify(data) // Convertendo o objeto 'dados' para uma string JSON
        });

        // Verificando se a resposta foi bem-sucedida
        if (!response.ok) {
            // Se a resposta não for 2xx, lança um erro
            throw new Error(`Falha: ${response.status} - ${response.statusText}`);
        }

        // Parseando a resposta para JSON e retornando os dados
        const retorno = await response.json();
        if (Object.keys(retorno).length > 2) {
            esconderSpinner();
            mostrarNotificacao(data.emailGerado)
        } else {
            esconderSpinner();
            return criarModalPopUp("Falha", retorno.message, "./assets/img/Logo-Aiesec.png");
        }
    } catch (error) {
        // Tratando os erros, caso algo dê errado
        console.error("Erro ao buscar dados:", error.message);
        return null; // Retorna null em caso de erro
    }
}

  
// ------------------- Seleção do formulário e elementos ------------------- //

/**
 * Seleciona o formulário principal de cadastro de usuário.
 * Usado para controlar eventos de validação e envio.
 * @type {HTMLFormElement}
 */
const form = document.querySelector('#email');

/**
 * Seleciona os campos de entrada de nome e sobrenome do usuário.
 * @type {HTMLInputElement}
 */
const nome = document.querySelector('#nome');
const sobrenome = document.querySelector('#sobrenome');

/**
 * Seleciona os elementos relacionados à senha:
 * - Campo de senha.
 * - Ícone de olho aberto (mostrar senha).
 * - Ícone de olho fechado (ocultar senha).
 */
const senha = document.querySelector("#senha");
const olhoAberto = document.querySelector("#mostrarSenha");
const olhoFechado = document.querySelector("#esconderSenha");

//Codigo de Membresia
const codigoMembresia = document.querySelector("#codigo");

//Url Base
const urlBase = "https://BaziAiesec.pythonanywhere.com";
//Url com rotas
const urlBuscarUsuarios = `${urlBase}/buscarUsuario`;
const urlInserirUsuario = `${urlBase}/inserirUsuario`;

/**
 * Seleciona o ícone de ajuda referente ao e-mail secundário.
 * Define título e texto exibidos dentro do modal de explicação.
 */
const modalEmailSecundario = document.querySelector('#helperIconEmailSec');
const tituloModalEmailSec = "E-mail Pessoal";
const textoModalEmailSec = "Campo não obrigatório\nCaso deseje preencher esse campo, digite um e-mail válido\nEste e-mail receberá seu endereço AIESEC e sua senha.";

// Evento para validar em tempo real
const telefone = document.querySelector('#telefone');
const erroTelefone = document.querySelector('#erro_telefone');

const modalTelefone = document.querySelector('#helperIconTelefone');
const tituloModalTelefone = "Telefone";
const textoModalTelefone = "Campo não obrigatório\nCaso deseje preencher esse campo, digite um telefone válido.";

/**
 * Seleciona elementos destinados a exibir mensagens de erro ou ajuda
 * relacionados ao preenchimento de nome, sobrenome e senha.
 */
const erroNome = document.querySelector("#erro_nome");
const erroSobrenome = document.querySelector("#erro_sobrenome");

/**
 * Seleciona mensagens de validação da senha:
 * - erro_senha1: mínimo de 8 caracteres e sem espaços.
 * - erro_senha2: pelo menos 1 letra minúscula.
 * - erro_senha3: pelo menos 1 letra maiúscula.
 * - erro_senha4: pelo menos 1 número e 1 caractere especial.
 * @type {HTMLElement[]}
 */
const erroSenha = [
  document.querySelector('#erro_senha1'),
  document.querySelector('#erro_senha2'),
  document.querySelector('#erro_senha3'),
  document.querySelector('#erro_senha4')
];

//erro do codio
const erroCodigo = document.querySelector("#erro_codigo")

/**
 * Seleciona o campo de e-mail secundário e os elementos que exibem
 * a lista de domínios de e-mail permitidos.
 */
const emailSecundario = document.querySelector('#email_sec');
const emailsValidos = [
  document.querySelector('#erro_email_sec'),
  document.querySelector('#erro_email_sec1'),
  document.querySelector('#erro_email_sec2'),
  document.querySelector('#erro_email_sec3'),
  document.querySelector('#erro_email_sec4')
];

/**
 * Seleciona os elementos relacionados à foto do usuário:
 * - Input do tipo "file".
 * - Imagem de pré-visualização.
 * - Mensagem de erro para formato inválido.
 */
const modalFoto = document.querySelector('#helperIconFoto');
const tituloModalFoto = "Imagem";
const textoModalFoto = "Campo não obrigatório\nCaso deseje preencher esse campo, Insira uma imagens nos formatos PNG,JPG ou JPGE.";
const fotoInput = document.querySelector('#foto');
const erroFoto = document.querySelector('#erro_foto');
const logo = "./assets/img/Logo-Aiesec.png";

// ------------------- Mensagens iniciais ------------------- //

/**
 * Define mensagens de orientação para os inputs logo no carregamento da página.
 * Inclui instruções para nome, sobrenome, senha e e-mail secundário.
 */
erroNome.textContent = "Informe seu nome(se tiver 2 ou 3 também informar)";
erroSobrenome.textContent = "Informe seu Sobrenome(se tiver 2 ou 3 também informar)";
erroTelefone.textContent = "Informe seu telefone";
erroCodigo.textContent = "Informe seu codigo de membresia"
/*emailsValidos[0].textContent = "E-mails válidos:";
emailsValidos[1].textContent = "- @gmail.com";
emailsValidos[2].textContent = "- @hotmail.com";
emailsValidos[3].textContent = "- @outlook.com";
emailsValidos[4].textContent = "- @yahoo.com";*/

erroSenha[0].textContent = 'Mínimo de 8 caracteres e sem espaços';
erroSenha[1].textContent = 'Pelo menos 1 letra minúscula (a-z)';
erroSenha[2].textContent = 'Pelo menos 1 letra maiúscula (A-Z)';
erroSenha[3].textContent = 'Pelo menos 1 número (0-9) e 1 caractere especial (@$!%*?&)';


// ------------------- EVENT LISTENERS ------------------- //

/**
 * Aplica validação em tempo real aos inputs de nome e sobrenome.
 */
nome.addEventListener('input', () => validarTexto(nome, erroNome, 'nome'));
sobrenome.addEventListener('input', () => validarTexto(sobrenome, erroSobrenome, 'sobrenome'));

/**
 * Valida a senha conforme o usuário digita.
 */
senha.addEventListener('input', async () => await validarSenha(senha, erroSenha));

codigoMembresia.addEventListener('input',async () => await validarCodigoMembresia(codigoMembresia,erroCodigo));

/**
 * Alterna a visibilidade da senha (mostrar/ocultar) ao clicar nos ícones.
 */
olhoFechado.addEventListener('click', () => toggleSenha(senha, true, olhoAberto, olhoFechado));
olhoAberto.addEventListener('click', () => toggleSenha(senha, false, olhoAberto, olhoFechado));

/**
 * Abre modal de ajuda explicando sobre o e-mail secundário.
 */
modalEmailSecundario.addEventListener('click', () => {
  criarModalPopUp(tituloModalEmailSec, textoModalEmailSec, logo);
});

modalTelefone.addEventListener('click', () => {
  criarModalPopUp(tituloModalTelefone, textoModalTelefone, logo)
})

modalFoto.addEventListener('click', () => {
  criarModalPopUp(tituloModalFoto, textoModalFoto, logo)
})

/**
 * Valida o domínio do e-mail secundário em tempo real.
 * Aceita apenas domínios definidos em validarEmailSecundario().
 */
emailSecundario.addEventListener('input', () => {
  const valor = emailSecundario.value.trim();

  if (valor === '') {
    emailSecundario.classList.remove('valid', 'invalid');
    return;
  }

  if (validarEmailSecundario(valor)) {
    emailSecundario.classList.add('valid');
    emailSecundario.classList.remove('invalid');
  } else {
    emailSecundario.classList.add('invalid');
    emailSecundario.classList.remove('valid');
  }
});

/**
 * Restaura a imagem padrão ao clicar no botão de reset do formulário.
 */
form.addEventListener("reset", () => {
  setTimeout(() => limpar(nome, sobrenome, senha,olhoFechado,olhoAberto, emailSecundario, telefone, erroNome, erroSobrenome, erroTelefone, erroSenha,codigoMembresia,erroCodigo), 0);
});

telefone.addEventListener('input', () => validarTelefone(telefone, erroTelefone));

// ------------------- Envio do formulário ------------------- //

/**
 * Controla o envio do formulário:
 * - Evita envio automático.
 * - Exibe spinner de carregamento.
 * - Valida os campos obrigatórios.
 * - Gera e exibe o e-mail institucional.
 * - Reseta o formulário após envio.
 */
form.addEventListener('submit', async function (event) {
  event.preventDefault();
  // 🔹 Só mostra spinner DEPOIS da confirmação
  mostrarSpinner();

const valido = await validarCampos({
  nome,
  sobrenome,
  senha,
  codigoMembresia,
  emailSecundario,
  telefone,
  erroNome,
  erroSobrenome,
  erroSenha,
  erroCodigo,
  erroTelefone,
  logo
});

if (valido){
const dados = {
    nome: formatarNome(nome.value),
    sobrenome: formatarNome(sobrenome.value),
    senha: senha.value,
    emailGerado: await gerarEmail(nome, sobrenome, erroNome, erroSobrenome, urlBuscarUsuarios),
    emailPessoal: emailSecundario.value.trim(),
    telefone: telefone.value === ""?"":normalizarTelefone(telefone),
    foto: await dadosImagem(fotoInput),// já pega a preview atual
    codigo : codigoMembresia.value
  };
  // 🔹 Aguardando o email ser gerado
  if (dados.emailGerado) {
    // 🔹 Abre modal de confirmação
    criarModalConfirmacao(dados, async () => {
      // 🔹 Só mostra spinner DEPOIS da confirmação
      mostrarSpinner();
      await inserirUsuarios(urlInserirUsuario, dados)
      form.reset();
      limpar(nome, sobrenome, senha,olhoFechado,olhoAberto, emailSecundario, telefone, erroNome, erroSobrenome, erroTelefone, erroSenha,codigoMembresia,erroCodigo);
    }, logo);
  }
}
  
});
document.addEventListener("DOMContentLoaded", function () {
  const headerNav = document.querySelector("#headerNav");

  // ❗ Mantenha APENAS a classe que você realmente quer
  headerNav.classList.add("positioned");
});

</script><script data-sqs-type="imageloader-bootstrapper">if(window.ImageLoader) window.ImageLoader.bootstrap({}, document);</script><script>Squarespace.afterBodyLoad(Y);</script><svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="display:none" data-usage="social-icons-svg"><symbol id="instagram-unauth-icon" viewBox="0 0 64 64"><path d="M46.91,25.816c-0.073-1.597-0.326-2.687-0.697-3.641c-0.383-0.986-0.896-1.823-1.73-2.657c-0.834-0.834-1.67-1.347-2.657-1.73c-0.954-0.371-2.045-0.624-3.641-0.697C36.585,17.017,36.074,17,32,17s-4.585,0.017-6.184,0.09c-1.597,0.073-2.687,0.326-3.641,0.697c-0.986,0.383-1.823,0.896-2.657,1.73c-0.834,0.834-1.347,1.67-1.73,2.657c-0.371,0.954-0.624,2.045-0.697,3.641C17.017,27.415,17,27.926,17,32c0,4.074,0.017,4.585,0.09,6.184c0.073,1.597,0.326,2.687,0.697,3.641c0.383,0.986,0.896,1.823,1.73,2.657c0.834,0.834,1.67,1.347,2.657,1.73c0.954,0.371,2.045,0.624,3.641,0.697C27.415,46.983,27.926,47,32,47s4.585-0.017,6.184-0.09c1.597-0.073,2.687-0.326,3.641-0.697c0.986-0.383,1.823-0.896,2.657-1.73c0.834-0.834,1.347-1.67,1.73-2.657c0.371-0.954,0.624-2.045,0.697-3.641C46.983,36.585,47,36.074,47,32S46.983,27.415,46.91,25.816z M44.21,38.061c-0.067,1.462-0.311,2.257-0.516,2.785c-0.272,0.7-0.597,1.2-1.122,1.725c-0.525,0.525-1.025,0.85-1.725,1.122c-0.529,0.205-1.323,0.45-2.785,0.516c-1.581,0.072-2.056,0.087-6.061,0.087s-4.48-0.015-6.061-0.087c-1.462-0.067-2.257-0.311-2.785-0.516c-0.7-0.272-1.2-0.597-1.725-1.122c-0.525-0.525-0.85-1.025-1.122-1.725c-0.205-0.529-0.45-1.323-0.516-2.785c-0.072-1.582-0.087-2.056-0.087-6.061s0.015-4.48,0.087-6.061c0.067-1.462,0.311-2.257,0.516-2.785c0.272-0.7,0.597-1.2,1.122-1.725c0.525-0.525,1.025-0.85,1.725-1.122c0.529-0.205,1.323-0.45,2.785-0.516c1.582-0.072,2.056-0.087,6.061-0.087s4.48,0.015,6.061,0.087c1.462,0.067,2.257,0.311,2.785,0.516c0.7,0.272,1.2,0.597,1.725,1.122c0.525,0.525,0.85,1.025,1.122,1.725c0.205,0.529,0.45,1.323,0.516,2.785c0.072,1.582,0.087,2.056,0.087,6.061S44.282,36.48,44.21,38.061z M32,24.297c-4.254,0-7.703,3.449-7.703,7.703c0,4.254,3.449,7.703,7.703,7.703c4.254,0,7.703-3.449,7.703-7.703C39.703,27.746,36.254,24.297,32,24.297z M32,37c-2.761,0-5-2.239-5-5c0-2.761,2.239-5,5-5s5,2.239,5,5C37,34.761,34.761,37,32,37z M40.007,22.193c-0.994,0-1.8,0.806-1.8,1.8c0,0.994,0.806,1.8,1.8,1.8c0.994,0,1.8-0.806,1.8-1.8C41.807,22.999,41.001,22.193,40.007,22.193z"/></symbol><symbol id="instagram-unauth-mask" viewBox="0 0 64 64"><path d="M43.693,23.153c-0.272-0.7-0.597-1.2-1.122-1.725c-0.525-0.525-1.025-0.85-1.725-1.122c-0.529-0.205-1.323-0.45-2.785-0.517c-1.582-0.072-2.056-0.087-6.061-0.087s-4.48,0.015-6.061,0.087c-1.462,0.067-2.257,0.311-2.785,0.517c-0.7,0.272-1.2,0.597-1.725,1.122c-0.525,0.525-0.85,1.025-1.122,1.725c-0.205,0.529-0.45,1.323-0.516,2.785c-0.072,1.582-0.087,2.056-0.087,6.061s0.015,4.48,0.087,6.061c0.067,1.462,0.311,2.257,0.516,2.785c0.272,0.7,0.597,1.2,1.122,1.725s1.025,0.85,1.725,1.122c0.529,0.205,1.323,0.45,2.785,0.516c1.581,0.072,2.056,0.087,6.061,0.087s4.48-0.015,6.061-0.087c1.462-0.067,2.257-0.311,2.785-0.516c0.7-0.272,1.2-0.597,1.725-1.122s0.85-1.025,1.122-1.725c0.205-0.529,0.45-1.323,0.516-2.785c0.072-1.582,0.087-2.056,0.087-6.061s-0.015-4.48-0.087-6.061C44.143,24.476,43.899,23.682,43.693,23.153z M32,39.703c-4.254,0-7.703-3.449-7.703-7.703s3.449-7.703,7.703-7.703s7.703,3.449,7.703,7.703S36.254,39.703,32,39.703z M40.007,25.793c-0.994,0-1.8-0.806-1.8-1.8c0-0.994,0.806-1.8,1.8-1.8c0.994,0,1.8,0.806,1.8,1.8C41.807,24.987,41.001,25.793,40.007,25.793z M0,0v64h64V0H0z M46.91,38.184c-0.073,1.597-0.326,2.687-0.697,3.641c-0.383,0.986-0.896,1.823-1.73,2.657c-0.834,0.834-1.67,1.347-2.657,1.73c-0.954,0.371-2.044,0.624-3.641,0.697C36.585,46.983,36.074,47,32,47s-4.585-0.017-6.184-0.09c-1.597-0.073-2.687-0.326-3.641-0.697c-0.986-0.383-1.823-0.896-2.657-1.73c-0.834-0.834-1.347-1.67-1.73-2.657c-0.371-0.954-0.624-2.044-0.697-3.641C17.017,36.585,17,36.074,17,32c0-4.074,0.017-4.585,0.09-6.185c0.073-1.597,0.326-2.687,0.697-3.641c0.383-0.986,0.896-1.823,1.73-2.657c0.834-0.834,1.67-1.347,2.657-1.73c0.954-0.371,2.045-0.624,3.641-0.697C27.415,17.017,27.926,17,32,17s4.585,0.017,6.184,0.09c1.597,0.073,2.687,0.326,3.641,0.697c0.986,0.383,1.823,0.896,2.657,1.73c0.834,0.834,1.347,1.67,1.73,2.657c0.371,0.954,0.624,2.044,0.697,3.641C46.983,27.415,47,27.926,47,32C47,36.074,46.983,36.585,46.91,38.184z M32,27c-2.761,0-5,2.239-5,5s2.239,5,5,5s5-2.239,5-5S34.761,27,32,27z"/></symbol><symbol id="instagram-unauth-icon" viewBox="0 0 64 64"><path d="M46.91,25.816c-0.073-1.597-0.326-2.687-0.697-3.641c-0.383-0.986-0.896-1.823-1.73-2.657c-0.834-0.834-1.67-1.347-2.657-1.73c-0.954-0.371-2.045-0.624-3.641-0.697C36.585,17.017,36.074,17,32,17s-4.585,0.017-6.184,0.09c-1.597,0.073-2.687,0.326-3.641,0.697c-0.986,0.383-1.823,0.896-2.657,1.73c-0.834,0.834-1.347,1.67-1.73,2.657c-0.371,0.954-0.624,2.045-0.697,3.641C17.017,27.415,17,27.926,17,32c0,4.074,0.017,4.585,0.09,6.184c0.073,1.597,0.326,2.687,0.697,3.641c0.383,0.986,0.896,1.823,1.73,2.657c0.834,0.834,1.67,1.347,2.657,1.73c0.954,0.371,2.045,0.624,3.641,0.697C27.415,46.983,27.926,47,32,47s4.585-0.017,6.184-0.09c1.597-0.073,2.687-0.326,3.641-0.697c0.986-0.383,1.823-0.896,2.657-1.73c0.834-0.834,1.347-1.67,1.73-2.657c0.371-0.954,0.624-2.045,0.697-3.641C46.983,36.585,47,36.074,47,32S46.983,27.415,46.91,25.816z M44.21,38.061c-0.067,1.462-0.311,2.257-0.516,2.785c-0.272,0.7-0.597,1.2-1.122,1.725c-0.525,0.525-1.025,0.85-1.725,1.122c-0.529,0.205-1.323,0.45-2.785,0.516c-1.581,0.072-2.056,0.087-6.061,0.087s-4.48-0.015-6.061-0.087c-1.462-0.067-2.257-0.311-2.785-0.516c-0.7-0.272-1.2-0.597-1.725-1.122c-0.525-0.525-0.85-1.025-1.122-1.725c-0.205-0.529-0.45-1.323-0.516-2.785c-0.072-1.582-0.087-2.056-0.087-6.061s0.015-4.48,0.087-6.061c0.067-1.462,0.311-2.257,0.516-2.785c0.272-0.7,0.597-1.2,1.122-1.725c0.525-0.525,1.025-0.85,1.725-1.122c0.529-0.205,1.323-0.45,2.785-0.516c1.582-0.072,2.056-0.087,6.061-0.087s4.48,0.015,6.061,0.087c1.462,0.067,2.257,0.311,2.785,0.516c0.7,0.272,1.2,0.597,1.725,1.122c0.525,0.525,0.85,1.025,1.122,1.725c0.205,0.529,0.45,1.323,0.516,2.785c0.072,1.582,0.087,2.056,0.087,6.061S44.282,36.48,44.21,38.061z M32,24.297c-4.254,0-7.703,3.449-7.703,7.703c0,4.254,3.449,7.703,7.703,7.703c4.254,0,7.703-3.449,7.703-7.703C39.703,27.746,36.254,24.297,32,24.297z M32,37c-2.761,0-5-2.239-5-5c0-2.761,2.239-5,5-5s5,2.239,5,5C37,34.761,34.761,37,32,37z M40.007,22.193c-0.994,0-1.8,0.806-1.8,1.8c0,0.994,0.806,1.8,1.8,1.8c0.994,0,1.8-0.806,1.8-1.8C41.807,22.999,41.001,22.193,40.007,22.193z"/></symbol><symbol id="instagram-unauth-mask" viewBox="0 0 64 64"><path d="M43.693,23.153c-0.272-0.7-0.597-1.2-1.122-1.725c-0.525-0.525-1.025-0.85-1.725-1.122c-0.529-0.205-1.323-0.45-2.785-0.517c-1.582-0.072-2.056-0.087-6.061-0.087s-4.48,0.015-6.061,0.087c-1.462,0.067-2.257,0.311-2.785,0.517c-0.7,0.272-1.2,0.597-1.725,1.122c-0.525,0.525-0.85,1.025-1.122,1.725c-0.205,0.529-0.45,1.323-0.516,2.785c-0.072,1.582-0.087,2.056-0.087,6.061s0.015,4.48,0.087,6.061c0.067,1.462,0.311,2.257,0.516,2.785c0.272,0.7,0.597,1.2,1.122,1.725s1.025,0.85,1.725,1.122c0.529,0.205,1.323,0.45,2.785,0.516c1.581,0.072,2.056,0.087,6.061,0.087s4.48-0.015,6.061-0.087c1.462-0.067,2.257-0.311,2.785-0.516c0.7-0.272,1.2-0.597,1.725-1.122s0.85-1.025,1.122-1.725c0.205-0.529,0.45-1.323,0.516-2.785c0.072-1.582,0.087-2.056,0.087-6.061s-0.015-4.48-0.087-6.061C44.143,24.476,43.899,23.682,43.693,23.153z M32,39.703c-4.254,0-7.703-3.449-7.703-7.703s3.449-7.703,7.703-7.703s7.703,3.449,7.703,7.703S36.254,39.703,32,39.703z M40.007,25.793c-0.994,0-1.8-0.806-1.8-1.8c0-0.994,0.806-1.8,1.8-1.8c0.994,0,1.8,0.806,1.8,1.8C41.807,24.987,41.001,25.793,40.007,25.793z M0,0v64h64V0H0z M46.91,38.184c-0.073,1.597-0.326,2.687-0.697,3.641c-0.383,0.986-0.896,1.823-1.73,2.657c-0.834,0.834-1.67,1.347-2.657,1.73c-0.954,0.371-2.044,0.624-3.641,0.697C36.585,46.983,36.074,47,32,47s-4.585-0.017-6.184-0.09c-1.597-0.073-2.687-0.326-3.641-0.697c-0.986-0.383-1.823-0.896-2.657-1.73c-0.834-0.834-1.347-1.67-1.73-2.657c-0.371-0.954-0.624-2.044-0.697-3.641C17.017,36.585,17,36.074,17,32c0-4.074,0.017-4.585,0.09-6.185c0.073-1.597,0.326-2.687,0.697-3.641c0.383-0.986,0.896-1.823,1.73-2.657c0.834-0.834,1.67-1.347,2.657-1.73c0.954-0.371,2.045-0.624,3.641-0.697C27.415,17.017,27.926,17,32,17s4.585,0.017,6.184,0.09c1.597,0.073,2.687,0.326,3.641,0.697c0.986,0.383,1.823,0.896,2.657,1.73c0.834,0.834,1.347,1.67,1.73,2.657c0.371,0.954,0.624,2.044,0.697,3.641C46.983,27.415,47,27.926,47,32C47,36.074,46.983,36.585,46.91,38.184z M32,27c-2.761,0-5,2.239-5,5s2.239,5,5,5s5-2.239,5-5S34.761,27,32,27z"/></symbol></svg>

  </body>
</html>