I added custom class for the last row of grid with checking loop count

@forelse($activeAreaGuides as $activeAreaGuide)

    <div class="col-xl-4 col-md-6">

        <div

            class="th-team team-grid

            {{ $loop->remaining < ($loop->count % 3 == 0 ? 3 : $loop->count % 3)

                ? 'custom-margin-last-row'

                : 'custom-margin-team-grid' }}">

            <div class="team-img2">

                <img src="{{ env('FILESYSTEM_URL') . $activeAreaGuide->photograph }}" >

            </div>

            <div class="team-content">

                <div class="media-body">

                    <h3 class="box-title custom-title-font-size">

                        {{ $activeAreaGuide->name_with_initials }}

                    </h3>

                    <span class="team-desig mb-0 custom-body-font-size">SLDA No:

                        {{ $activeAreaGuide->sltda_no }}</span>

                    <span class="team-desig mb-0 custom-body-font-size">City:

                        {{ $activeAreaGuide->city->name }}</span>

                    <span> dynamic value {{ $loop->remaining }} </span>

                    <span> static value {{ $loop->count }} </span>

                </div>

            </div>

        </div>

    </div>

@empty

    <div class="col-12 text-center">

        <p>No active area guides found.</p>

    </div>

@endforelse

.custom-margin-team-grid {

    margin-bottom: 110px;

}

.custom-margin-last-row {

    margin-bottom: 0;

}

.custom-title-font-size {

    font-size: 20px;

    margin-bottom: 5px;

}

.custom-body-font-size {

    font-size: 14px;

}

.custom-area-guide {

    margin-top: 120px;

    margin-bottom: 30px;

}