.swiper {
width: 100%;
height: 300px;
overflow: visible !important;
overflow-x: hidden;
}
.swiper-slide {
display: flex !important;
justify-content: center;
align-items: center;
transition: all 0.3s ease-in-out;
opacity: 0.5;
}
.swiper-slide img {
object-fit: contain;
}
.swiper-slide-active {
opacity: 1;
}
.swiper-slide img {
transition: all 0.3s ease-in-out;
}
.swiper-slide-active img {
transform: scale(2);
}
.swiper-button-next,
.swiper-button-prev {
color: #F68A28 !important;
&::after {
font-size: 70px !important;
}
}
.swiper-button-next {
right: 75px !important;
}
.swiper-button-prev {
left: 75px !important;
}
.cc-container-reference {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
max-width: 1336px;
margin: 50px auto;
}
.cc-title-reference {
font-family: "Area", Sans-serif;
font-size: 60px;
font-weight: 900;
text-align: center; background-color: #f48623; background-image: linear-gradient(90deg, #F48623 30%, #F4AD23 60%); background-size: 100%;
background-repeat: repeat;  -webkit-background-clip: text;
-webkit-text-fill-color: transparent; 
-moz-background-clip: text;
-moz-text-fill-color: transparent;
padding-bottom: 30px;
}
.cc-text {
font-size: 24px;
line-height: 1.3;
color: #000;
font-family: "Area", Sans-serif;
font-weight: 700;
}
.cc-images {
display: flex;
margin-top: 40px;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 60px;
}
.cc-images img {
width: 100%;
aspect-ratio: 1 / 1;
border-radius: 70px!important;
object-fit: cover;
overflow: hidden;
margin-top: 80px;
margin-bottom: 40px;
}
.swiper-container {
width: 100%;
overflow-y: visible !important;
overflow-x: hidden !important;
}
@media (max-width: 1280px) {
.swiper-button-next,
.swiper-button-prev {
&::after {
font-size: 45px !important;
}
}
.swiper-button-next {
right: 10px !important;
}
.swiper-button-prev {
left: 10px !important;
}
}
@media (max-width: 1024px) {
.swiper-slide {
opacity: 1;
}
.swiper-slide-next img {
transform: scale(1);
}
.swiper-button-next,
.swiper-button-prev {
&::after {
font-size: 45px !important;
}
}
.swiper-button-next {
right: 10px !important;
}
.swiper-button-prev {
left: 10px !important;
}
}
@media (max-width: 600px) {
.cc-images {
display: flex;
margin-top: 20px;
display: grid;
grid-template-columns: auto;
grid-gap: 60px;
}
.cc-images img  {
margin-top: 20px;
margin-bottom: 10px;
}
}