/* TESTIMONIAL CARD */
.testimonial-card {
    background-color: var(--col3);
    border-radius: 7px;
    box-shadow: 5px 5px 12px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    padding: 18px 32px;
    margin: 0 24px 24px 24px;
    width: max-content;
}

.testimonial-card {
    width: 300px;
    margin-left: auto;
    margin-right: auto;
}

.testimonial-card img {
    border-radius: 50%;
    margin-top: -56px;
    margin-left: auto;
    margin-right: auto;
    width: 72px;
}

@media screen and (max-width: 991px) {
    .testimonial-card {
        margin-bottom: 63px;
	}
}

/* WEB-SOLUTION-CARD */
.web-solution-card {
	background-color: var(--col3);
	border-radius: 12px;
	box-shadow: 0 0 15px #d1d1d193;
	padding: 28px 20px;
    backdrop-filter: blur(10px);
  	-webkit-backdrop-filter: blur(10px);
}

.web-solution-card .material-symbols-outlined {
    color: var(--col1);
    font-size: 44px;
}

.web-solution-card h4 {
    color: var(--col5);
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    padding-top: 8px;
}

/* WEB PROJECT CARD */
.web-project-card {
    background-color: var(--col3);
    border: solid 2px var(--col1);
    width: 360px;
    padding: 24px;
    margin: 0 24px 50px 24px;
    text-align: left;
}

.web-project-card img {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}


/* Lazy Loading Effects */

.card--1,
.card--2,
.card--3 {
    opacity: 0;
    transform: translateY(20px); 
    transition: transform 0.35s ease-out, opacity 0.35s ease-out;
}

.card--1.visible,
.card--2.visible,
.card--3.visible {
    opacity: 1;
    transform: translateY(0);
}