/* Service Page Redesign */

#service-page-redesign {
	background-color: #FFF;

	.bg-white {
		background-color: #FFF;
	}

	.bg-gray {
		background-color: #F7F7F8;
	}

	.bg-dark {
		background-color: #212224;
	}

	.flex-row {
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		gap: 30px;
	}

	.section-padding {
		padding: 60px 0;
	}

	.section-margins {
		margin: 60px 0;
	}

	.section-padding + .section-padding,
	.bg-white + .bg-white {
		padding-top: 0;
	}

	@media (min-width: 1200px) {
		.flex-row {
			align-items: center;
		}

		.section-padding {
			padding: 90px 0;
		}

		.section-margins {
			margin: 90px 0;
		}
	}

	h2 {
		color: #212224;
		font-size: 2.25rem;
		font-weight: 400;
		margin-bottom: 30px;
	}

	.bg-dark h2 {
		color: #FFFFFF;
	}

	h2 strong,
	h2 span {
		color: #212224;
		font-family: open_sans_bold, sans-serif;
		font-weight: 800;
	}

	p {
		font-size: 16px;
		margin-bottom: 30px;
	}

	p:last-child {
		margin-bottom: 0;
	}

	.cta-buttons {
		display: flex;
		gap: 15px;
		margin-top: 30px;
		margin-bottom: 30px;
	}

	.cta-buttons:last-child {
		margin-bottom: 0;
	}

	.btn {
		color: #FFFFFF;
		font-family: open_sans, sans-serif;
		font-size: 18px;
		font-style: normal;
		font-weight: 700;
		line-height: 1;
		border-radius: 5px;
		border: none;
		padding: 12px 20px;
	}

	.btn-secondary {
		background: #434448;
	}

	@media (min-width: 1200px) {
		h2 {
			font-size: 40px;
		}
	}

	/* Half Text/Half Images */

	.half-image-block {
		position: relative;
		padding: 60px 0;
	}

	.half-image-content {
		position: relative;
		width: 100%;
	}

	.half-image-media {
		position: relative;
		width: 100%;
	}

	.half-image-main-image {
		padding-bottom: 70px;
	}

	.half-image-main-image img {
		width: 100%;
		object-fit: cover;
		border-radius: 10px;
	}

	.half-image-second-image {
		position: absolute;
		top: unset;
		bottom: 0;
		right: 0;
		width: auto;
		height: auto;
	}

	.half-image-second-image img {
		width: 200px;
		height: 200px;
		object-fit: contain;
		object-position: bottom;
	}

	@media (min-width: 768px) {
		.half-image-main-image img {
			height: 660px;
		}

		.half-image-second-image {
			width: auto;
			height: auto;
		}

		.half-image-second-image img {
			width: 300px;
			height: 300px;
		}
	}
	
	@media (min-width: 1200px) {
		.half-image-block {
			padding: 90px 0;
		}

		.half-image-content {
			max-width: calc(100% - 480px);
			padding-right: 20px;
		}

		.half-image-media {
			max-width: 450px;
		}

		.half-image-main-image img {
			height: auto;
		}

		.half-image-second-image {
			width: 100%;
			left: 155px;
			right: unset;
		}

		.media-left .half-image-second-image {
			max-width: 318px;
			left: -120px;
		}
	}

	/* WYSIWYG */

	.wysiwyg {
		padding: 60px 0;
	}

	.bg-white .wysiwyg-content a:not(.btn) {
		color: #465A9D;
		text-decoration-line: underline;
	}

	@media (min-width: 1200px) {
		.wysiwyg {
			padding: 90px 0;
		}
	}

	/* Cards 2 */

	.cards-2-block {
		padding: 60px 0;
	}

	.cards-2-container {
		background: unset;
		padding: 0;
	}

	.cards-2-grid {
		margin-bottom: 30px;
	}

	.cards-2-text {
		max-width: 1125px;
		text-align: center;
	}

	.card-2-item {
		flex: 1 1 354px;
		max-width: 354px;
	}

	.card-2-text {
		text-align: center;
	}

	.card-2-cta {
		margin-top: 30px;
	}
	
	@media (min-width: 1200px) {
		.cards-2-block {
			padding: 90px 0;
		}
	}

	/* CTA */

	.cta-container {
		width: 100%;
		max-width: 1125px;
	}

	.cta-content {
		max-width: 100%;
	}

	.cta-text {
		margin-bottom: 0;
	}

	.cta-text h2 {
		color: #FFFFFF;
		font-family: open_sans, sans-serif;
		font-size: 35px;
		font-style: normal;
		font-weight: 600;
		line-height: normal;
		margin-bottom: 8px;
	}

	.cta-button-primary {
		color: #212224;
	}

	.cta-button-primary:hover {
		color: #FFFFFF;
	}

	.cta-has-bg-image.cta-bg-gradient .cta-overlay {
		background: linear-gradient(90deg, #D1232D 0%, #8C0032 100%);
	}

	.cta-background-image {
		z-index: 2;
  		mix-blend-mode: multiply;
	}

	/* CTA 2 */

	.cta-2-block {
		padding: 60px 20px;
	}

	.cta-2-content {
		flex-direction: column;
	}

	.cta-2-text {
		text-align: center;
	}

	.cta-2-text h2,
	.cta-2-text h2 * {
		color: #FFFFFF;
	}

	.cta-2-button {
		color: #212224;
	}

	.cta-2-button:hover {
		color: #FFFFFF;
	}

	@media (min-width: 1200px) {
		.cta-2-block {
			padding: 80px 20px;
		}
	}
}