.soho-treatment-pre-post {

	.title,
	.results-title {
		font-size: 24px;
		line-height: 1;
		color: var(--soho-darkest-blue);
		margin: 0;

		@media screen and (max-width: 989px) {
			text-align: center;
			margin-bottom: 20px;
			line-height: 1.4;
		}
	}
	
	.soho-treatment-pre-post__wrapper {
		max-width: 1020px;
		margin-left: auto;
		margin-right: auto;

		.soho-treatment-pre-post__grid {
			display: grid;
			margin-top: 30px;

			@media screen and (max-width: 767px) {
				margin-left: -16px;
				margin-right: -16px;
				gap: 10px;
			}

			@media screen and (min-width: 768px) {				
				gap: 7px;
				grid-template-columns: repeat(2, 1fr);
			}

			.pre-treatment-content,
			.post-treatment-content {
				border: 1px solid var(--soho-darkest-blue);
				background: var(--soho-grey);

				.top {
					padding: 10px 24px 5px;
					border-bottom: 1px solid var(--soho-darkest-blue);
				}

				.bottom {
					padding: 20px 25px 25px 25px;

					@media screen and (min-width: 768px) {
						padding: 32px 55px 45px 35px;	
					}

					ul {
						margin: 0;
						padding-left: 10px;
						line-height: 1.5;
					}
				}

				.subtitle {
					margin: 0;
					color: var(--soho-darkest-blue);
					line-height: 1;
					font-size: 25px;
				}
			}
		}
	}

	.soho-treatment-pre-post__results-section {
		margin-top: 45px;

		.results-content {
			max-width: 800px;
			margin-top: 15px;

			@media screen and (max-width: 767px) {
				text-align: center;
			}
		}
	}
}