/**********************************************************
// Block >> Example
**********************************************************/
.Block-Testimonials-Grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
	margin-bottom: 20px;
}

/* Row 1: card 1 = 2/3, card 2 = 1/3 */
.Testimonial:nth-child(4n+1) { grid-column: span 2; }
.Testimonial:nth-child(4n+2) { grid-column: span 1; }

/* Row 2: card 3 = 1/3, card 4 = 2/3 */
.Testimonial:nth-child(4n+3) { grid-column: span 1; }
.Testimonial:nth-child(4n+4) { grid-column: span 2; }

.Testimonial {
	background: #fff;
	border-radius: 20px 20px 0 0;
	box-shadow: var(--Shadow);
	padding: 10px 30px 30px 30px;
	line-height: 1.5em;
	position: relative;
}

.Testimonial img { width: 80px; display: block; }
.Testimonial span {
	display: block;
	margin-top: 10px;
	font-weight: bold;
	font-size: .9em;
}

.Block-Testimonials-Grid.Masonry {
    display: block;
    columns: 2;
    column-gap: 24px;
}

.Block-Testimonials-Grid.Masonry .Testimonial {
    break-inside: avoid;
    margin-bottom: 24px;
    display: inline-block;
    width: 100%;
}

.Block-Testimonials-Grid.Masonry .Testimonial:nth-child(n) {
    grid-column: unset;
}

/**********************************************************
// Media Queries
**********************************************************/
@media
all and (max-width: 768px),
all and (max-device-width: 768px)
{
	.Block-Testimonials-Grid {
        grid-template-columns: 1fr;
    }

    .Testimonial:nth-child(n) {
        grid-column: span 1;
    }
	
	.Testimonial img { width: 50px; }
	
	.Block-Testimonials-Grid.Masonry {
        columns: 1;
    }
}
