/* =========================================
   AI.door PROJECT
   Hero
   ========================================= */

#aidoor,
.aidoor-hero {
	width: 100%;
}


/* -----------------------------------------
   Hero base
   ----------------------------------------- */

#banner.aidoor-hero {
	display: flex;
	align-items: center;
	justify-content: center;

	min-height: 72vh;

	padding: 7em 3em 8em 3em;

	border-bottom: solid 1px rgba(80, 80, 80, 0.18);
}


/* -----------------------------------------
   Inner
   ----------------------------------------- */

.aidoor-hero-inner {
	width: 100%;
	max-width: 900px;

	margin: 0 auto;

	text-align: center;
}


/* -----------------------------------------
   Title
   ----------------------------------------- */

.aidoor-hero-header {
	margin: 0;
}

.hero-title {
	margin: 0;

	color: #292929;

	font-size: 5.2em;
	font-weight: 600;
	line-height: 0.98;

	letter-spacing: -0.035em;
}

.hero-title span {
	display: block;
}

.hero-title span:first-child {
	font-weight: 400;
}

.hero-title span:last-child {
	margin-top: 0.12em;
}


/* -----------------------------------------
   Divider
   ----------------------------------------- */

.hero-divider {
	width: 72px;
	height: 1px;

	margin: 3em auto;

	background: #a9a9a5;
}

.hero-divider-small {
	width: 42px;

	margin-top: 3.3em;
	margin-bottom: 3em;
}


/* -----------------------------------------
   Description
   ----------------------------------------- */

.hero-description {
	margin: 0 auto;

	color: #555552;

	font-size: 1.15em;
	font-weight: 400;
	line-height: 2.15;

	letter-spacing: 0.04em;
}


/* -----------------------------------------
   Blake quote
   ----------------------------------------- */

.hero-quote {
	margin: 0 auto;
	padding: 0;

	border: 0;

	color: #474744;

	font-family: Georgia, "Times New Roman", serif;

	text-align: center;
}

.hero-quote p {
	margin: 0;

	font-size: 1.05em;
	font-style: italic;
	font-weight: 400;
	line-height: 1.9;

	letter-spacing: 0.025em;
}

.hero-quote footer {
	margin-top: 1.5em;

	font-family: inherit;

	font-size: 0.78em;
	line-height: 1.7;

	letter-spacing: 0.08em;
}

.hero-quote footer span,
.hero-quote footer cite {
	display: block;
}

.hero-quote footer span {
	color: #303030;
	font-weight: 600;
}

.hero-quote footer cite {
	color: #858580;
	font-style: italic;
}


/* =========================================
   Tablet
   ========================================= */

@media screen and (max-width: 980px) {

	#banner.aidoor-hero {
		min-height: auto;

		padding: 6em 2.5em 6.5em 2.5em;
	}

	.aidoor-hero-inner {
		max-width: 760px;
	}

	.hero-title {
		font-size: 4.4em;
	}

}


/* =========================================
   Smartphone
   ========================================= */

@media screen and (max-width: 736px) {

	#banner.aidoor-hero {
		padding: 5em 1em 5.5em 1em;
	}

	.aidoor-hero-inner {
		max-width: 100%;
	}

	.hero-title {
		font-size: 3.3em;
		line-height: 1;
	}

	.hero-divider {
		margin-top: 2.4em;
		margin-bottom: 2.4em;
	}

	.hero-description {
		font-size: 1em;
		line-height: 2;
		letter-spacing: 0.02em;
	}

	.hero-divider-small {
		margin-top: 2.7em;
		margin-bottom: 2.4em;
	}

	.hero-quote p {
		font-size: 0.92em;
		line-height: 1.8;
	}

	.hero-quote footer {
		font-size: 0.72em;
	}

}