Estou tentando colocar o item img class="imagem-chamada-principal" ao lado de h1 class="chamada-principal" e p id="sub-titulo", sendo que os textos deveriam ficar horizontalmente no centro da imagem. Estou usando o float, como pode ver, mas ainda não consigo, não da certo. Alguém pode me ajudar?

 <aside id="cabecalho">
            <img class="logo" src="img/logo-branco.png" alt="Logo">

            <nav class="menu">
                <ul>
                    <li><a href="#">Planos e Preços</a></li>
                    <li><a href="#">Faça um Teste</a></li>
                    <li><a href="#">Blog</a></li>
                </ul>
            </nav>

            <div class="chamada">
                <h1 class="chamada-principal">Sistema para <strong>artes marciais</strong></h1>

                <p id="sub-titulo">Controle de alunos, aulas e graduações do seu CT de lutas. Teste grátis por 15 dias e veja todos os recursos!</p>

                <img class="imagem-chamada-principal" src="img/computer-dashboard1.png" alt="Computador com Dashboard">
            </div>

        </aside>


#cabecalho {
    background-color: #5939D3;

    padding-top: 20px;
    padding-left: 10%;
    padding-right: 10%;
}

.menu {
    margin-top: -4rem;
}

.menu li a {
    text-decoration: none;
    color: #fff;   
    font-family: arial, sans-serif;
}

.menu ul {
    list-style: none;
}

.menu ul li {
    display: inline;
    padding: 1.5em; 
    float: right; 
}

.chamada {
    clear: both;
    padding-top: 40px;
    padding-bottom: 50px;
    align-items: center;
}

.chamada-principal {
    font-size: 2em;
    font-family: arial, sans-serif;
    color: #fff;
}

.chamada-principal strong {
    font-weight: bold;
}

#sub-titulo {
    font-family: arial, sans-serif;
    color: #fff;
}

.imagem-chamada-principal {
    float: right;
    display: inline;
    margin-top: -5%;
}