Customised Testimonial Carousel - needs code update

I'm trying to create a testimonial carousel for my client's website. In all honesty I'm very new to code but I'm eager to learn!

This is what I want to achieve:

This is where I'm at currently:

The code I've currently put together is this:

a {
text-decoration: none !important;
}

.list-item-content{
  padding:4rem;
  background:#F3F7FE;
  border-radius: 20px;
  margin-top:-25%;
  margin-bottom:5%
}

@media only screen and (min-width:640px){.user-items-list-carousel__media-container{transform:translate(-2rem);  }}

.user-items-list-carousel__arrow-icon-background-area {
opacity: 0!important
}

.user-items-list-carousel__arrow-icon-path {
  stroke-width: 2px
}

Can anyone help me understand how to adjust the code to achieve this?

Can you share the website URL and the page this is on?

What is your current setup?

https://orange-calliope-t6c4.squarespace.com/ and it's on the home page. By current set up I'm not sure what you mean but these are the settings of the carousel I've chosen.

By setup I was wondering if you had this as a summary block, or a list section.

Can you add a site wide password as you site is currently private.

This may be an alternative way to set up this section:
https://www.will-myers.com/articles/super-easy-image-slider-in-squarespace-71-squarespace-70-brine-template