/*////////////////////////////////////////////////////////
/// BEGIN: Customer Stories Landing
////////////////////////////////////////////////////////*/
.page_customer-stories .site-inner {
	padding-top: 1.75em;
}

.page_customer-stories .entry-header,
.page_customer-stories .fg-custom-content > .wp-block-group {
	/* width: calc(100% + 5%);
	margin-left: -2.5%; */
	padding-inline: 5%;
	background: #fdfaf6;
	text-align: center;
}

.page_customer-stories .entry-header {
	margin-bottom: 0;
	padding-top: 2.5em;
}

.page_customer-stories .fg-custom-content > .wp-block-group {
	padding-bottom: 2.5em;
}

.page_customer-stories .wp-block-group header {
	width: 700px;
	max-width: 100%;
	margin: 0 auto 30px;
}

.entry-header .title-wrap {
	width: 100%;
}

.page_customer-stories h1 {
	margin-bottom: 0;
	color: var(--mg-primary);
	font-family: var(--mg-body-font);
	font-size: 14px;
	letter-spacing: 0.15em;
	font-weight: bold;
	text-transform: uppercase;
}

.page_customer-stories h2 {
	font-size: clamp(40px, 8.25vw, 84px);
}

.page_customer-stories h2 em {
	display: inline-block;
	color: var(--mg-primary);
}

.page_customer-stories .breadcrumb,
.page_customer-stories .return-block {
	display: none;
}

.wp-block-columns {
	margin-bottom: 0;
}

.wp-block-column {
	padding: 40px 32px;
	background-color: rgb(255, 255, 255);
	border: 1px solid rgba(226, 217, 134, 0.5);
}

.wp-block-column h3 {
	font-family: var(--mg-heading-font);
	font-size: 24px;
}

.wp-block-column p {
	color: rgb(153, 153, 153);
	font-size: 14px;
}

.post-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
}

.post-grid__item {
	border: 1px solid rgba(226, 217, 134, 0.5);
	transition: transform 0.3s ease;
}

.post-grid__item .image-container a {
	display: flex;
	position: relative;
	flex-wrap: nowrap;
	/* height: 300px; */
	border: 1px solid rgba(226, 217, 134, 0.5);
}

.post-grid__item .image-container img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/*.post-grid__item .image-container a:before,
.post-grid__item .image-container a:after {
	content: 'Before';
	position: absolute;
	top: 8px;
	left: 8px;
	padding: 5px 8px 3px;
	background-color: rgba(20, 8, 12, 0.55);
	color: var(--mg-white);
	font-size: 11px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
}

.post-grid__item .image-container a:after {
	content: 'After';
	left: auto;
	right: 8px;
	background-color: rgba(125, 36, 62, 0.85);
}*/

.post-grid__item .content-container {
	padding: 20px;
}

.post-grid__item .eyebrow {
	margin-bottom: 10px;
	color: var(--mg-primary);
}

.post-grid__item h3 {
	margin-bottom: 10px;
	font-size: 26px;
}

/*////////////////////////////////////////////////////////
/// BEGIN: Customer Story
////////////////////////////////////////////////////////*/
.single-customer-story .site-inner {
	width: 100%;
	max-width: 100%;
	padding-top: 2em;
}

.single-customer-story .return-block,
.single-customer-story .breadcrumb {
	display: none;
}

.single-customer-story section {
   padding: 80px 0;
}

.single-customer-story .section-wrapper {
	width: 1440px;
	max-width: 95%;
	margin: 0 auto;
}

.single-customer-story .section-header--center {
	text-align: center;
}

.single-customer-story .section-hero {
	padding: 0;
}

.section-hero .content-container {
	display: flex;
	width: 50%;
	padding: 80px 0;
	justify-content: center;
	flex-direction: column;
}

.section-hero .content-container .eyebrow {
	color: var(--mg-primary);
}

.section-hero .image-container {
	width: 50%;
	margin-right: -2.5%;
	text-align: right;
}

.section-hero .image-container img {
	background: #f7f7f7;
	mix-blend-mode: multiply;
}

/* Quote */
.section-quote {
	padding: 80px 0;
	background: var(--mg-primary);
	color: var(--mg-white);
}

.section-quote .section-header {
	width: 300px;
	max-width: 35%;
}

.section-quote .eyebrow {
	color: var(--mg-green);
}

.section-quote .section-content {
	position: relative;
	width: 768px;
	max-width: 60%;
}

.section-quote .section-content .quotation {
	opacity: 0.6;
	position: absolute;
	top: -45px;
	left: -60px;
	width: 90px;
	fill: var(--mg-green);
}

.section-quote .section-content .quotation--right {
	top: auto;
	left: auto;
	bottom: -20px;
	right: -10px;
}

.section-quote .section-content p {
	position: relative;
	color: var(--mg-white);
	font-family: var(--mg-heading-font);
	font-size: 46px;
	line-height: 1.2;
	margin-bottom: 0;
}

/* B4After */
.section-transformation {

}

.section-transformation .section-wrapper {
	width: 960px;
}

.section-transformation .section-header {
	margin-bottom: 2em;
}

.section-transformation .eyebrow {
	margin-bottom: 0;
	color: var(--mg-primary);
}

.section-transformation .transformations {
	gap: 20px;
}

.section-transformation .transformations .image-container--main {
	position: relative;
	height: 470px;
	mix-blend-mode: multiply;
	background: #f7f7f7;
	border: 1px solid var(--mg-light-gray);
}

.section-transformation .transformations .image-container > img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.section-transformation .transformations .image-container--caption {
	display: block;
	padding: 10px;
	min-height: 60px;
	font-size: 16px;
	text-align: center;
}

.section-transformation .transformations .image-container--caption .eyebrow {
	
}

.section-transformation .transformation-extras {
	margin-top: 20px;
	gap: 20px;
}

.section-transformation .transformation-extras img {
	aspect-ratio: 1/1;
	background: #d8d8d8;
	border: 1px solid #f7f7f7;
}

/* Story */
.section-story .eyebrow {
	color: var(--mg-primary);
	font-family: var(--mg-body-font);
}

.section-story .section-content p:first-child {
	font-size: 32px;
}

.section-story .section-content > p:first-child:first-letter {
	initial-letter: 2;
	padding-right: 8px;
	color: var(--mg-primary);
	font-family: var(--mg-heading-font);
	font-size: 25px;
}

.section-story .section-wrapper {
	width: 720px;
}

.section-content_quote {
	margin-top: 50px;
	padding: 30px 0;
	border-top: 2px solid var(--mg-primary);
	border-bottom: 2px solid var(--mg-primary);
}

.section-content_quote p {
	color: var(--mg-primary);
	font-family: var(--mg-heading-font);
	font-size: 36px;
	font-style: italic;
}

/* CTA */
.section-cta {
	background: #fdfaf6;
	text-align: center;
}

.section-cta .addbutton {
	background: var(--mg-primary);
}

.single-customer-story .site-footer {
	margin-top: 0;
}

/*////////////////////////////////////////////////////////
/// BEGIN: Media Queries
////////////////////////////////////////////////////////*/
@media only screen and (min-width: 768px) {

	.post-grid__item:hover {
		transform: translateY(-10px);
	}

	.section-cta .addbutton:hover {
		background: var(--mg-black);
	}
}

@media only screen and (max-width: 992px) {

   .post-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media only screen and (max-width: 767px) {

   .post-grid {
		grid-template-columns: 1fr;
	}
}
/* FIN */
