How to fit the width of 2 different line elements within a block to fit the width of the block in CSS?

Question

I am attempting to, within a divblock element,containing 2 helement, the justify the content to fit the width of the box/block.

I have those 2 elements

.m3aatitle {
    display: block;
    text-align: justify;
    border: 1px solid black;
    margin: auto;
}

<div class="m3aa">
        <div class="m3aatitle">
            <h1>M3AA</h1>
            <h3>Athletic Academy</h3>
        </div>
        <p>Empowering motivated individuals to reach their athletic potential</p>
</div>

How do I justify the content and the spacing letter of M3AA to fit the width of Athletic Academy, being inside the same block? I was able to center them on my page, but so far I am not able to find a way unless I use the letter-spacing parameter, which I believe there should be a way to make it work?

This is what I tried so far in my CSS script. I'd also like the border the fit the width of the text. which is not the case now.