How to display 8 posts in four columns and 2 rows on a carousel slide?

Its very difficult to understand from the HTML code example what you are trying to achieve but going by the php you could do the following.

<?php
$posts = new WP_Query([
    'post_type'      => 'services',
    'posts_per_page' => -1,
    'order'          => 'ASC'
]);

if ($posts->have_posts()) :
?>
<ul class="slider-container">
    <?php
    $loop_position = 1;
    while ($posts->have_posts()) {
        $posts->the_post();

        // if loop position is greater than our threshold (8) reset to initial position (1)
        if ($loop_position > 8) $loop_position = 1;

        // if we are in the first loop (loop position 1) itiration create the slide open tag
        if ($loop_position === 1) echo '<li class="single-slide">';

        // if we are in the first/fifth loop (loop position 1/5) itiration create the row open tag
        if (in_array($loop_position, [1,5])) echo '<div class="row">';

        // here we can simply output each loop itiration html as we need
        echo '<div class="col-md-3">';
        echo     '<div class="box-desc">';
        echo         "<h4>Some title {$loop_position}</h4>";
        echo     '</div>';
        echo '</div>';

        // if we reached the end of the loop (no more post) we need to close all the tags
        // starting from row than single-slide
        if ($posts->found_posts == $loop_position) {
           echo '</div></li>';
           
           // to prevent the rest of the code from executing we exit out of the loop, using break
           break;
        }

        // if we are in the fourth/eighth loop (loop position 4/8) itiration create the row closing tag
        if (in_array($loop_position, [4,8])) echo '</div>';

        // if we are in the last loop (loop position 8) itiration create the slide closing tag
        if ($loop_position === 8) echo '</li>';

        // increate loop position by 1
        $loop_position++;
    }
    ?>
</ul>
<?php
endif;
wp_reset_postdata();
?>

The HTML output would be the following

<ul class="slider-container">
    <li class="single-slide">
        <div class="row">
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 1</h4>
                </div>
            </div>
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 2</h4>
                </div>
            </div>
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 3</h4>
                </div>
            </div>
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 4</h4>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 5</h4>
                </div>
            </div>
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 6</h4>
                </div>
            </div>
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 7</h4>
                </div>
            </div>
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 8</h4>
                </div>
            </div>
        </div>
    </li>
    <li class="single-slide">
        <div class="row">
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 1</h4>
                </div>
            </div>
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 2</h4>
                </div>
            </div>
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 3</h4>
                </div>
            </div>
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 4</h4>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 5</h4>
                </div>
            </div>
            <div class="col-md-3">
                <div class="box-desc">
                    <h4>Some title 6</h4>
                </div>
            </div>
        </div>
    </li>
</ul>

As we decided every eight (8) posts receive their own slick slide, in every slick slide, every four (4) posts are wrapped with a <div class="row">...</div> tag.

I personally think that this is a bit of overkill and over complication, you could achieve the same result without using bootstrap for layout and instead use css grid.

If you would like I could edit my answer to include the non bootstrap layout