.soho-treatments-grid {
	
	.soho-treatments-grid__wrapper {
		max-width: 1020px;
		margin-left: auto;
		margin-right: auto;

		.section-title {
			font-size: 30px;
			text-decoration: underline;
			font-weight: 600;
			color: var(--soho-darkest-blue);
			text-underline-offset: 7.5px;
			text-decoration-thickness: 2px;
			margin: 0;

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

	.soho-treatments-grid__grid {
		display: grid;
		gap: 25px;
		margin-top: 40px;

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

		@media screen and (min-width: 992px) {
			grid-template-columns: repeat(3, 1fr);
		}

		&.horizontally-centered {

			@media screen and (min-width: 992px) {
				grid-template-columns: repeat(6, 1fr);	
			}

			.soho-treatments-grid__grid-item {
				@media screen and (min-width: 992px) {
					grid-column: span 2;
				}

				/* Dealing with 2 orphan items */

				&:last-child:nth-child(3n - 1) {
					@media screen and (min-width: 992px) {
	  					grid-column-end: -2;
	  				}
				}

				&:nth-last-child(2):nth-child(3n + 1) {
					@media screen and (min-width: 992px) {
	  					grid-column-end: 4;
	  				}
				}

				/* Dealing with single orphan */

				&:last-child:nth-child(3n - 2) {
					@media screen and (min-width: 992px) {
						grid-column-end: 5;
					}
				}
			}
		}

		.soho-treatments-grid__grid-item {
			padding: 36px 50px;
			background: var(--soho-grey);
			border-radius: 18px;
			text-align: center;

			@media screen and (min-width: 768px) {
				padding: 36px 30px;
			}

			&.pico {
				.description {
				    margin-left: -15px;
    				margin-right: -15px;
				}
			}

			.title {
				margin: 0;
				font-size: 24px;
				font-weight: 600;
				color: var(--soho-darkest-blue);
				text-underline-offset: 6px;
				text-decoration: underline;

				@media screen and (max-width: 767px) {
					font-size: 20px;
				}
			}

			.description {
			    line-height: 1.3;
			    margin: 0;
			    margin-top: 18px;
			}

			.button {
				margin-top: 30px;
				width: 100%;
			}
		}
	}

	.soho-treatments__slider {

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

		.slick-prev {
			left: 12px;
		}

		.slick-next {
			right: 12px;
		}
	}
}