/*=============
HOMEPAGE
=============*/

.hero-home{
	position:relative;
	min-height:80vh;
	overflow:hidden;
	background-color:var(--accent-2);
	background-image:linear-gradient(
		90deg,
		rgba(28,29,29,.98) 0%,
		rgba(28,29,29,.95) 31%,
		rgba(28,29,29,.62) 54%,
		rgba(28,29,29,.06) 77%
	);
}

.hero-home::before{
	content:"";
	position:absolute;
	inset:0;
	z-index:0;
	background-image:var(--hero-image);
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	animation:hero-zoom 8s ease-out forwards;
}

.hero-home::after{
	content:"";
	position:absolute;
	inset:0;
	z-index:0;
	background:
		radial-gradient(
			ellipse 42% 54% at 20% 51%,
			rgba(18,19,19,.78) 0%,
			rgba(18,19,19,.52) 45%,
			rgba(18,19,19,0) 100%
		),
		linear-gradient(0deg, rgba(0,0,0,.18), transparent 38%);
	pointer-events:none;
}

.hero-home .container{
	position:relative;
	z-index:1;
	display:flex;
	align-items:center;
	min-height:80vh;
}

.hero-home-content{
	width:100%;
	max-width:545px;
	padding:28px 0 22px 1rem;
}

@keyframes hero-zoom{
	from{
		transform:scale(1);
	}

	to{
		transform:scale(1.06);
	}
}

@media(max-width:991.98px){
	.hero-home,
	.hero-home .container{
		min-height:650px;
	}

	.hero-home::before{
		background-position:62% center;
	}

	.hero-home-content{
		padding-left:0;
	}
}

@media(max-width:575.98px){
	.hero-home,
	.hero-home .container{
		min-height:600px;
	}

	.hero-home::before{
		background-position:63% center;
	}

	.hero-home::after{
		background:
			radial-gradient(
				ellipse 90% 56% at 24% 51%,
				rgba(18,19,19,.82) 0%,
				rgba(18,19,19,.52) 48%,
				rgba(18,19,19,0) 100%
			),
			linear-gradient(0deg, rgba(0,0,0,.2), transparent 38%);
	}
}