themes-wordpress/quadrat/sass/block-styles/_query.scss

.is-style-quadrat-diamond-posts {
	.post-meta {
		justify-content: flex-start;
	}

	.wp-block-post-title,
	.wp-block-query-pagination,
	.post-meta {
		a {
			text-decoration: none;
			&:hover {
				text-decoration: underline;
			}
		}
	}
	.wp-block-column {
		flex-basis: auto;
		@include break-small() {
			&:last-child {
				max-width: 300px;
				flex-shrink: 0;
			}
			&:first-child {
				padding-right: 2em;
			}
		}
	}
	.wp-block-post-featured-image {
		width: 300px;
		@include break-small-only() {
			width: 100%;
		}
		img {
			object-fit: cover;
			width: 100%;
			height: 300px;
		}
	}
	.wp-block-post-template {
		li {
			display: flex;
			align-items: center;
			min-height: 400px;
			position: relative;
			& > * {
				flex-basis: 100%;
			}
			&:before {
				content: "";
				background: var(--wp--preset--color--tertiary);
				width: 375px;
				height: 375px;
				position: absolute;
				top: 0;
				left: 0;
				z-index: -1;
				opacity:0;
				transition: all 0.4s ease-in-out; 
			}
			&:hover:before {
				opacity:1;
			}
			&:nth-child(2n+1):before {
				transform: rotate(16deg) translate(-130px, -20px);
			}
			&:nth-child(2n+1):hover:before {
				transform: rotate(-8deg) translate(-110px, 0);
			}
			&:nth-child(2n+2):before {
				transform: rotate(24deg) translate(-130px, 20px);
			}
			&:nth-child(2n+2):hover:before {
				transform: rotate(16deg) translate(-110px, 40px);
			}
		}
	}
}