.pull-quote {
	--quote-bg:
		url(/includes/public/assets/shared/quote-mark.svg) no-repeat top left;
	--quote-bg-size: 42px;

	position: relative;
	padding: 0 10px;
	margin-bottom: var(--space-10);

	.inner {
		position: relative;
		width: 100%;
		max-width: 920px;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin: 0 auto;

		&::after,
		.quote::after {
			position: absolute;
			inset: 0;
			background: var(--quote-bg);
			background-size: var(--quote-bg-size);
			pointer-events: none;
			rotate: 180deg;
		}

		.badge {
			max-width: 175px;
			margin-bottom: var(--space-8);
		}
	}
	
	.quote {
		padding: 12px 48px 16px;
		background: var(--quote-bg);
		background-size: var(--quote-bg-size);
		font-family: var(--font-serif);
		font-weight: var(--font-weight-bold);
		position: relative;
		z-index: 2;
		font-size: 1.125rem;
		font-style: italic;
		line-height: 1.4;
		text-align: center;
		color: var(--blue-dark);

		&::after {
			content: '';
		}
	}

	.author {
		margin: 13px auto 0;
		color: var(--text-dark);
		font-size: calc(13rem/16);
		font-weight: var(--font-weight-bold);
		line-height: calc(22/13);
		padding-inline: 10px;
		text-align: center;
		background-color: var(--beige);
		display: block;
		width: fit-content;
		text-transform: uppercase;
	}

	@media (min-width: 40em) {
		 .inner {
			width: calc(100% - 200px);
		}
	}

	@media (min-width: 64em) {
		--quote-bg-size: 84px;
		margin-bottom: 100px;

		.inner{
			flex-direction: row;
			align-items: center;
			gap: 54px;
			padding-bottom: 19px;

			&::after {
				content: ''
			}

			.badge {
				min-width: 175px;
				margin-bottom: 0;
			}
		}

		.quote {
			padding: 18px 113px 0;
			font-size: var(--text-2xl);

			&::after {
				display: none;
			}
		}
	
		.author {
			margin-top: 23px;
			font-size: .875rem;
			line-height: calc(22/14);
		}
	}

	@media (min-width: 90em) {
		.inner {
			.badge {
				min-width: 227px;
				max-width: 227px;
			}
		}
		
	}
}

.pull-quote.show-badge,
.pull-quote.has-image {
	.inner {
		max-width: 1163px;
	}

	@media (min-width: 64em) {
		.quote {
			padding: 18px 110px 0;
		}
	}

	@media (min-width: 90em) {
		.quote {
			padding: 18px 125px 0;
		}
	}
}


:is(.core-styles, .contentRender_name_plugins_core_textbox) .pull-quote blockquote {
	border: none
}

.blog-detail .blog-single .pull-quote .author {
	padding: unset;
	padding-inline: 10px;
}