.soho-hero {
	position: relative;

	&.reduced-height {

		.soho-hero__wrapper {
			@media screen and (max-width: 767px) {
				height: 185px;
				padding-top: 0;
			}

			@media screen and (min-width: 768px) {
				height: 480px;
			}
		}

		.soho-hero__content {

			.title {
				font-size: 24px;

				@media screen and (min-width: 990px) {
					font-size: 58px;
				}
			}
		}

		.icon-soho-logo {
			display: none;
		}
	}
	
	.soho-hero__wrapper {
		@media screen and (max-width: 767px) {
			padding-top: 66%;
		}

		@media screen and (min-width: 768px) {
			height: calc(100vh - var(--soho-header-height));
		}
	}

	.soho-hero__content {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%,-50%);
		text-align: center;
		width: 100%;
		padding-top: 40px;
		padding-bottom: 60px;
		z-index: 1;
		padding-left: var(--container-padding);
		padding-right: var(--container-padding);

		.title {
			margin: 0;
			text-transform: uppercase;
			color: var(--soho-white);
			font-size: 14px;
			line-height: 1;

			@media screen and (min-width: 990px) {
				font-size: 35px;
			}

			svg {
				margin-top: 15px;
				max-width: 100%;
				height: auto;

				@media screen and (min-width: 990px) {
					margin-top: 30px;
				}
			}
		}
	}

	.icon-soho-logo {
		position: absolute;
		bottom: 40px;
		left: 50%;
		transform: translateX(-50%);

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

		svg {
			width: 81px;
			height: auto;

			@media screen and (max-width: 767px) {
				width: 60px;
			}
		}
	}

}