Crispy forms label inside of field

Using Bootstrap5, Django and Crispy Forms to create a calculator application.
Application works as expected however I want to make changes to the appearance of the forms.

I've already removed the required field asterisk by simply adding the following to the CSS file:

.asteriskField {
  display: none;
}

But now I want to place the label inside the field which requires a different approach that I'm currently unable to understand despite extensive research.
Having used Inspect in Chrome I can see that the label is of course a separate element but one housed within the field to achieve the given effect.

Current Form

Desired result

Settings.py (excerpt)

CRISPY_TEMPLATE_PACK = 'bootstrap5'

Forms.py (excerpt)

class InvestmentForm(forms.Form):
    starting_amount = forms.ChoiceField(choices=STARTING_AMOUNT)
    deposit_amount = forms.FloatField()
    trade_in_value = forms.FloatField()
    number_of_years = forms.FloatField()
    credit_score = forms.ChoiceField(choices=CREDIT_SCORE)
    state = forms.ChoiceField(
        label='State',
        choices=[(zipcode, zipcode) for zipcode in StateTax.objects.values_list('zipcode', flat=True).distinct()]
    ) 

Index.html (excerpt)

<div class="col-md-4 border bg-light">

<div class="row justify-content-center">
        <h5 class="text-center"> Enter details below to see your estimate</h5>
        </div>
        <div class="col-md-8 mx-auto">
    <form action="" method="POST">
        {% csrf_token %}
        {{ form|crispy }}
        <br>
        <button class="btn btn-primary" type="submit">Calculate</button>                
    </form>
    <br>
</div>

</div>

You could use crispy-bootstrap5 which introduces floating labels. Just follow the installation guidelines and add a floating input field in your crispy Layout like:

FloatingField("first_name"),