/* ========================================== */
/* ARTICLE POSTS */
/* ========================================== */

.single-post {
	background: #fff;
}
.single-post .globalNav {
	background: rgba(22, 36, 56, 1);
	backdrop-filter: blur(10px);
}

.article-layout {
	background: var(--color-grey-300, #F1F3FB);
	width: 100%;
	overflow: hidden;
	position: relative;
	z-index: 1;
}
.article--header {
	width: 100%;
	max-width: var(--max-width-base);
	margin: 0 auto;
	padding: var(--space-250, 2.5rem) var(--space-175, 1.25rem);
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.article--header h1 {
	margin: 0;
	font-size: var(--font-size-225, 2rem);
	max-width: 33rem;
	width: 100%;
}
.article--header-info {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	align-items: start;
}
.article--header-info .button.blogTag {
	margin-bottom: var(--space-100, 0.5rem);
}
.article--content {
	width: 100%;
	max-width: 55rem;
	margin: 0 auto;
	padding: 2.5rem 1.5rem;
	position: relative;
	z-index: 1;
}
/*


.single-post h2 {
	font-size: var(--font-size-225, 2rem);
	line-height: var(--line-height-200, 1.2);	
	margin:1.5rem 0 1rem;
}
.single-post h3 {
	font-size: var(--font-size-175, 1.75rem);
	line-height: var(--line-height-200, 1.2);
	margin:1.5rem 0 1rem;
}

*/

.article--content h2 {
	font-size: 2rem;
	margin: 1.5rem 0 1rem;
}
.article--content h3 {
	font-size: 1.5rem;
	margin: 1.5rem 0 1rem;
}
.article--content h4, .article--content h5 {
	font-size: var(--font-size-100, 1rem);
	margin: 1rem 0 1rem;
}
.article--content h2:first-child, .article--content h3:first-child, .article--content h4:first-child {
	margin-top: 0;
}
.article--content p+h2, .article--content p+h3, .article--content p+h4 {
	margin-top: 2rem;
}
.article--excerpt {
	margin: 0 0 var(--space-150, 1rem) 0;
	max-width: 30rem;
	width: 100%;
}
.article--excerpt p:first-of-type {
	margin-top: 0;
}
.article--content strong,
.article--content b,
.article--content h1,
.article--content h2,
.article--content h3,
.article--content h4,
.article--content h5,
.article--content h6 {
  color: var(--color-primary, #162438);
}

.article--content strong span,
.article--content b span,
.article--content h1 span,
.article--content h2 span,
.article--content h3 span,
.article--content h4 span,
.article--content h5 span,
.article--content h6 span {
  color: inherit !important;
}


.article--meta {
	font-size: var(--font-size-75, 0.875rem);
}
.article--socials {
	width: 100%;
	border-top: 1px solid #BABEC4;
	padding-top: 1rem;
	margin-top: auto;
	height: 3rem;
}
.article--hero-img {
	width: 100%;
	aspect-ratio: 3 / 2;
}
.article--hero-img picture {
	width: 100%;
	height: 100%;
	display: block;
}
.article--hero-img img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	box-shadow: 0px 12px 30px -10px rgba(22, 36, 56, 0.35);
}
.layout-client-logo {
	box-shadow: 0px 12px 30px -10px rgba(22, 36, 56, 0.35);
}
.layout-client-logo img {
	box-shadow: none;
	border-radius: 0;
}
@media (max-width: 48rem) {
	.article--excerpt {
		margin: 0;
		max-width: 100%;
		width: 100%;
	}
}
@media (min-width: 48rem) {
	.article--content {
		padding: 3rem 1.5rem 4rem;
	}
	.article--header {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 3rem;
	}
	.article--header h1 {
		font-size: var(--font-size-300, 2.75rem);
		line-height: var(--line-height-150, 1.1);
	}
}

/* ========================================== */
/* BLOCKQUOTE */
/* ========================================== */

.article--content blockquote {
	background: #fff;
	box-shadow: 0px 12px 30px -10px rgba(22, 36, 56, 0.35);
	border-radius: var(--space-125, 0.75rem);
	border-top: 6px solid var(--color-secondary);
	overflow: hidden;
	margin: 2.5rem 0;
	padding: 1.25rem 1.5rem 1.5rem 1.5rem;
	gap: 0.75em;
	display: flex;
	flex-direction: column;
	position: relative;
}
.article--content blockquote p {
	margin: 0;
}
.article--content blockquote::before {
	content: "";
	display: inline-block;
	width: 2.4rem;
	height: 1.76rem;
	margin-bottom: var(--space-100, 0.5rem);
	vertical-align: middle;
	background-color: var(--color-secondary);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54 40'%3E%3Cpath fill='%23000' d='M5.667 36.659C2.745 33.444.991 29.937.991 24.092.991 13.864 8.297 4.805 18.526.13l2.63 3.799C11.512 9.188 9.466 15.91 8.882 20.293c1.46-.876 3.507-1.169 5.552-.876 5.26.584 9.352 4.675 9.352 10.228 0 2.63-1.17 5.26-2.923 7.306-2.045 2.045-4.383 2.922-7.306 2.922-3.214 0-6.137-1.461-7.89-3.214Zm29.224 0c-2.923-3.215-4.676-6.722-4.676-12.567 0-10.228 7.306-19.287 17.534-23.963l2.63 3.799c-9.643 5.26-11.69 11.982-12.274 16.365 1.462-.876 3.507-1.169 5.553-.876 5.26.584 9.352 4.675 9.352 10.228 0 2.63-1.17 5.26-2.923 7.306-1.753 2.045-4.384 2.922-7.306 2.922-3.214 0-6.137-1.461-7.89-3.214Z'/%3E%3C/svg%3E");
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54 40'%3E%3Cpath fill='%23000' d='M5.667 36.659C2.745 33.444.991 29.937.991 24.092.991 13.864 8.297 4.805 18.526.13l2.63 3.799C11.512 9.188 9.466 15.91 8.882 20.293c1.46-.876 3.507-1.169 5.552-.876 5.26.584 9.352 4.675 9.352 10.228 0 2.63-1.17 5.26-2.923 7.306-2.045 2.045-4.383 2.922-7.306 2.922-3.214 0-6.137-1.461-7.89-3.214Zm29.224 0c-2.923-3.215-4.676-6.722-4.676-12.567 0-10.228 7.306-19.287 17.534-23.963l2.63 3.799c-9.643 5.26-11.69 11.982-12.274 16.365 1.462-.876 3.507-1.169 5.553-.876 5.26.584 9.352 4.675 9.352 10.228 0 2.63-1.17 5.26-2.923 7.306-1.753 2.045-4.384 2.922-7.306 2.922-3.214 0-6.137-1.461-7.89-3.214Z'/%3E%3C/svg%3E");
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
}
@media (min-width: 48rem) {
	.article--content blockquote {
		padding: 2rem 2rem 2rem 5rem;
	}
	.article--content blockquote::before {
		position: absolute;
		top: 2.25rem;
		left: 1.5rem;
	}
}
/* ========================================== */

/* SUCCESS STORIES */

/* ========================================== */

.single-success-stories .heroBannerInner::before {
	background: var(--color-primary, #162438);
}
.single-success-stories .heroBanner.heroWhite {
	background: unset
}