.block-personal-note {
	border-block: 4px solid var(--wp--preset--color--tertiary);
}

.block-personal-note.has-background,
.editor-styles-wrapper .block-personal-note.has-background,
.entry-content > .block-personal-note.has-background,
.entry-content > .block-personal-note.cwp-large.has-background:not(:last-child) {
	position: relative;
	margin-top: calc( 50px + var(--wp--custom--layout--block-gap-large));
	padding-top: calc( 50px + var(--wp--custom--layout--block-gap) );
}

.block-personal-note::before {
	background: #ccc url(photo.png) no-repeat center;
	background-size: cover;
	border-radius: 50%;
	content: '';
	display: block;
	width: 100px;
	height: 100px;
	position: absolute;
	top: -50px;
	left: calc( 50% - 50px );
}

.block-personal-note::after {
	content: "";
	display: block;
	width: 108px;
	height: 42px;
	background: url(signature.png) no-repeat left top;
	background-size: contain;
	margin-top: var(--wp--custom--layout--block-gap);
}


@media ( min-width: 768px ) {
	.block-personal-note.has-background {
		padding-inline: 24px;
		padding-bottom: 24px;
	}
}