.editor-styles-wrapper .team{
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 0 40px;

	@media (min-width: 992px){
		.person:nth-child( 3n + 2 ){
			padding-top: 100px;
		}
	}

	@media (max-width: 991px){
		grid-template-columns: repeat( 2, 1fr );

		.person:nth-child( 2n + 2 ){
			padding-top: 100px;
		}
	}

	@media (max-width: 767px){
		gap: 50px;
		grid-template-columns: 1fr;

		.person:nth-child( 2n + 2 ){
			padding-top: 0;
		}
	}

	.person{
		max-width: 400px;
	}

	.photo{
		overflow: hidden;
		position: relative;
		aspect-ratio: 400/532;
		border-radius: 30px;
		background: var(--wp--preset--color--farbe-5);

		img{
			width: 100%;
			height: 100%;
			object-fit: cover;
		}

		video{
			cursor: pointer;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			object-fit: cover;
			opacity: 0;
			transition: all .2s ease;
		}
		@media (hover: hover){
			&:hover video{
				opacity: 1;
			}
		}
		@media (hover: none){
			&:has(button.pause) video{
				opacity: 1;
			}
		}

		button{
			display: none;
		}
	}

	.name{
		margin: 30px 0 0;
	}
	.job{
		margin: 0;
	}
	.links{
		display: flex;
		align-items: center;
		gap: 5px;
		margin: 10px 0 0;

		a{
			font-size: 0;
			line-height: 1;
		}
	}

	@media (hover: none){
		.photo:has(video) button{
			display: block;
			position: absolute;
			z-index: 2;
			bottom: 20px;
			right: 20px;
			width: 54px;
			aspect-ratio: 1;
			background: var(--wp--preset--color--farbe-2) var(--cursor-play) center no-repeat;
			border: 0;
			border-radius: 50%;
			font-size: 0;
			line-height: 1;

			&.pause{
				background-image: var(--cursor-pause);
			}
		}
	}
}