/* Banner */
.fixed-banner {
	height: 100vh;
	width: 100vw;
}

#logo {
	animation: fadeInDown 400ms ease;
	animation-fill-mode: forwards;
}

.header__cities-list {
	position: relative;
    z-index: 1;
}

.section--home-banner {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.section.section--home-banner {
	padding-bottom: 0;
	height: 100vh;
}

@media only screen and (min-width: 122.5em) { /* 1960px */
	.section.section--home-banner {
		width: 1960px;
		margin-left: auto;
		margin-right: auto;
		border-left: 1px solid #333333;
		border-right: 1px solid #333333;
	}
}

.home-banner-content-wrapper {
    padding-top: calc(50vh - 148px);
    padding-bottom: calc(50vh - 200px);
}

.home-banner-logo {
	animation: fadeInUp 400ms ease;
    animation-fill-mode: forwards;
}

.btn-more {
	top: calc(100vh - 260px);
	left: calc(50% - 18px);
	animation: fadeInUp 400ms ease;
    animation-fill-mode: forwards;
}

.btn-more__circle {
	width: 36px;
	height: 24px;
}

@media screen and (max-width: 1235px) {
	.btn-more {
		display: block;
	}
}
/* Welcome Content */
.content {
	position: relative;
	z-index: 1;
}


.section--welcome {
	position: relative;
	z-index: -1;
	margin-top: -200px;
	margin-bottom: 80px;

	animation: fadeInUp 400ms 100ms ease;
    animation-fill-mode: forwards;
}

.section--welcome:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 200px;
	left: 0;
	right: 0;
	bottom: -440px;
	background-color: #000;
}

.section--welcome > div {
	padding-top: 40px;
	padding-bottom: 40px;
	padding-left: 40px;
	padding-right: 40px;
	box-shadow: 0 5px 20px rgba(0,0,0,0.25);
}

.heading-two-lines {
	display: block;
	font-size: 2.4rem;
	color: #B7A58C;
	margin-bottom: 0.2em;
}

.heading-two-lines span {
	display: block;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: normal;
	text-transform: lowercase;
	letter-spacing: 2px;
	font-size: 4rem;
}

header.text-align--center p {
	margin-top: 24px;
}

.branded-title {
	width: 100%;
	height: auto;
}

.section--welcome .branded-title {
	margin-bottom: 16px;
}

.button.button-large {
	font-size: 1.6rem;
	width: 100%;
	display: block;
}

@media only screen and (min-width: 35em) { /* 560px */
	.button.button-large {
		width: auto;
		display: inline-block;
	}
}

@media only screen and (min-width: 48em) { /* 768px */
	.section--welcome > div {
		padding-left: 60px;
		padding-right: 60px;
		padding-top: 60px;
		padding-bottom: 60px;
	}

	.home-banner-content-wrapper {
		padding-top: calc(50vh - 100px);
	}

	.heading-two-lines {
		font-size: 3.6rem;
		margin-bottom: 20px;
	}

	.branded-title {
		width: 420px;
	}

	.heading-two-lines span {
		font-size: 5rem;
	}
}

.section--why {
	position: relative;
	z-index: 2;
	margin-bottom: 120px;
}

.section--why:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 250px;
	left: 50%;
	bottom: -70px;
	width: 250vw;
	background-color: rgba(196,170,145,1);
	transform: rotate(3deg) translateX(-50%);
	transform-origin: top center;
}

.section--why .section {
	padding-bottom: 0;
}

.platform-promos {
	margin: 0;
	padding: 0;
	list-style-type: none;

	box-sizing: border-box;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex: 0 1 auto;
    -webkit-box-flex: 0;
    flex: 0 1 auto;
    -ms-flex-direction: row;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.platform-promo__item {
	color: #fff;
	padding: 0 32px;
	margin: 20px 0;
	box-sizing: border-box;
    -ms-flex: 0 0 100%;
    -webkit-box-flex: 0;
	flex: 0 0 100%;
	max-width: 100%;
}

.platform-promos h3 {
	margin-top: 0;
	text-align: center;
	text-transform: none;
	margin-bottom: 0.2em;
	font-size: 2rem;
	white-space: nowrap;
}

.platform-promos p {
	margin-top: 0;
	text-align: center;
	margin-bottom: 0;
}

.platform-promos li > *:last-child {
	margin-bottom: 0;
}

.platform-promos ul {
	list-style-type: disc;
	margin-top: 0;
}

.platform-promos__icon {
	width: 132px;
	height: 132px;
	padding: 32px;
	background-color: #F3F2EE;
	box-shadow: 8px 8px 12px rgba(64,61,57,0.1);
	margin: 0 auto 2rem;
	display: block;
	border-radius: 76px;
	opacity: 1;
	transition: opacity 400ms ease-in-out;
}

.platform-promos__icon,
.js .platform-promos__icon {
	opacity: 0;
}

.no-js .platform-promos__icon {
	opacity: 1;
}

.icon-fade-in .platform-promos__icon,
.js .icon-fade-in .platform-promos__icon {
	opacity: 1;
}

@media only screen and (min-width: 26.875em) { /* 430px */
	.section--why:before {
		top: 212px;
	}
}

@media only screen and (min-width: 35em) { /* 560px */
	.section--why:before {
		width: 200vw;
	}

	.platform-promo__item {
		margin: 32px 0;
	}

	.platform-promos p,
	.platform-promos ul {
		max-width: 280px;
		margin: 0 auto;
	}
}

@media only screen and (min-width: 48em) { /* 768px */
	.section--why {
		padding-bottom: 60px;
		margin-bottom: 100px;
	}

	.section--why:before {
		top: 340px;
		bottom: -60px;
	}

	.platform-promos {
		margin: 0 -20px;
	}

	.platform-promo__item {
		color: inherit;
		margin: 20px;
		-ms-flex: 0 0 50%;
		-webkit-box-flex: 0;
		flex: 0 0 50%;
		max-width: calc(50% - 40px);
		background-color: #F3F2EE;
		padding: 40px;
		box-shadow: 16px 16px 16px rgba(64,61,57,0.1);
	}

	.platform-promo__item,
	.js .platform-promo__item {
		opacity: 0;
		transform: translateX(30px);
		transition: all 400ms ease-in-out;
	}

	.no-js .platform-promo__item {
		opacity: 1;
		transform: translateX(0px);
	}

	.platform-promo__item.is-showing,
	.js .platform-promo__item.is-showing {
		opacity: 1;
		transform: translateX(0px);
	}

	.platform-promos__icon,
	.js .platform-promos__icon,
	.no-js .platform-promos__icon {
		animation: none;
		opacity: 1;
		transform: none;
	}

	.platform-promos p,
	.platform-promos ul {
		max-width: none;
		max-width: unset;
	}
}


@media only screen and (min-width: 75em) { /* 1200px */
	.section--why:before {
		top: 380px;
	}

	.platform-promo__item {
		color: inherit;
		margin: 20px;
		-ms-flex: 0 0 33.33%;
		-webkit-box-flex: 0;
		flex: 0 0 33.33%;
		max-width: calc(33.33% - 40px);
	}
}


@media only screen and (min-width: 100em) { /* 1600px */
	.section--why {
		padding-bottom: 5vw;
	}
}


.section--signup {
	position: relative;
	z-index: 0;
	padding-bottom: 120px;
	background-color: #403D39;
}

.section--signup:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: -300px;
	left: 50%;
	bottom: -300px;
	width: 250vw;
	background-color: #403D39;
	transform: rotate(3deg) translateX(-50%);
	transform-origin: top center;
}

.js--section-signup,
.js .js--section-signup {
    opacity: 0;
    transform: translateY(30px);
    transition: all 400ms ease-in-out;
}

.no-js .js--section-signup {
	opacity: 1;
	transform: translateY(0px);
}

.js--section-signup.is-showing,
.js .js--section-signup.is-showing {
	opacity: 1;
	transform: translateY(0px);
}

.section--signup > div {
	padding-top: 40px;
	padding-bottom: 40px;
	padding-left: 40px;
	padding-right: 40px;
	box-shadow: 0 5px 20px rgba(0,0,0,0.25);
}

.section--signup .section--small {
	padding-bottom: 0;
}

section.section--footer-links {
	position: relative;
	z-index: 1;
}

@media only screen and (min-width: 35em) { /* 560px */
	.section--pricing:before {
		width: 200vw;
	}
}

@media only screen and (min-width: 48em) { /* 768px */
	.section--signup > div {
		padding-left: 60px;
		padding-right: 60px;
		padding-top: 60px;
		padding-bottom: 60px;
	}
}

.section--pricing {
	position: relative;
	z-index: 1;
	padding-bottom: 80px;
}

@media only screen and (min-width: 100em) { /* 1600px */
	.section--pricing {
		padding-bottom: 5vw;
	}
}

.section--pricing:before {
	content: "";
	position: absolute;
	top: -300px;
	left: 50%;
	bottom: 0;
	width: 250vw;
	background-color: #F3F2EE;
	transform: rotate(3deg) translateX(-50%);
	transform-origin: top center;
}

.section--platform-pricing {
	position: relative;
	z-index: 2;
}

.pricing-pitch span {
	font-size: 2.4rem;
	display: block;
	color: #000;
}

.platform-pricing {
	margin: 0 -12px;
	padding: 0;
	list-style-type: none;

	box-sizing: border-box;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex: 0 1 auto;
    -webkit-box-flex: 0;
    flex: 0 1 auto;
    -ms-flex-direction: row;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-direction: row;
    -ms-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content: center;
}

@media only screen and (min-width: 35em) { /* 560px */
	.pricing-pitch {
		font-size: 2rem;
	}

	.pricing-pitch span {
		font-size: 3.2rem;
	}
}


@media only screen and (min-width: 48em) { /* 768px */

}
