/* ==========================================================================
	Home: Hero
========================================================================== */

.home .hero {	
	background-color: #000000;
}

.home .hero .title {
	color: #FFFFFF;
	font-family: 'plak';
	margin-bottom: 40px;
}

.home .hero .subtitle {
	color: #F6EB61;
}

.home .hero .info {
	color: #FFFFFF;
}

@media (max-width: 1280px), (orientation: portrait) {

	.home .hero > .wp-block-group__inner-container {
		backdrop-filter: brightness(40%);
	}

	.home .hero .title {
		position: relative;
		margin-bottom: 13vw;
	}

	.home .hero .title::after {
		content: "";
		position: absolute;
		bottom: -2.5vw;
		left: calc(50% - 40vw);
		width: 80vw;
		height: .2vw;
		background-color: #67686A;
	}

	.home .hero .title::before {
		content: "";
		position: absolute;
		bottom: -4vw;
		left: calc(50% - 1.5vw);
		width: 3vw;
		height: 3vw;
		background-color: #67686A;
		border-radius: 100%;
	}
}

/* ==========================================================================
	Home: Contents
========================================================================== */

.home-contents {
	background-color: #FAF7EC;
}

.home-contents > .wp-block-group__inner-container {
	padding-top: 80px;
	padding-bottom: 80px;
}

.home-contents .info-column {
	padding-top: 40px;
	padding-right: 96px;
}

.home-contents .info-column .title {
	position: relative;
	color: #000000;
	font-family: 'plak';
	font-size: 64px;
	font-stretch: condensed;
	letter-spacing: 5.33px;
	text-transform: uppercase;
	margin-bottom: 52px;
}

.home-contents .info-column .title::after {
	content: "";
	position: absolute;
	bottom: -22px;
	left: 0;
	width: 100%;
	height: 1px;
	background-color: #67686A;
}

.home-contents .info-column .title::before {
	content: "";
	position: absolute;
	bottom: -28px;
	left: 0;
	width: 12px;
	height: 12px;
	background-color: #67686A;
	border-radius: 100%;
}

.home-contents .info-column .info {
	color: #000000;
	font-size: 20px;
	font-weight: 300;
	line-height: 1.4;
	margin-bottom: 56px;
}

.home-contents .info-column .button a {
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 1.75px;
	text-transform: uppercase;
	background-color: #1E2023;
	padding: 21px 116px;
}

.home-contents .info-column .button a:hover {
	background-color: #F6EB61;
	color: #000000;
}

.home-contents .info-column .button a:active {
	background-color: #1E2123;
	color: #FFFFFF;
}

.home-contents .info-column .button,
.home-contents .info-column .button a {
	width: 100%;
}

@media (max-width: 1280px), (orientation: portrait) {

	.home-contents .wp-block-columns {
		flex-direction: column;
		margin-bottom: 0;
	}

	.home-contents .wp-block-columns .wp-block-column {
		width: 100%;
	}

	.home-contents .wp-block-columns > .wp-block-column:not(:last-child) {
		margin-bottom: 10vw;
	}

	.home-contents .wp-block-columns > .wp-block-column:not(:first-child) {
		margin-left: 0;
	}

	.home-contents > .wp-block-group__inner-container {
		padding-top: 15vw;
		padding-bottom: 13vw;
	}

	.home-contents .info-column {
		padding-top: 0;
		padding-bottom: 0;
		padding-right: 0;
	}


	.home-contents .info-column .title {
		position: relative;
		font-size: 7vw;
		line-height: 1.2;
		letter-spacing: 1.5vw;
		margin-bottom: 15vw;
	}

	.home-contents .info-column .title::after {
		bottom: -6vw;
		left: 0;
		width: 100%;
		height: .2vw;
	}

	.home-contents .info-column .title::before {
		bottom: -7.5vw;
		left: 0vw;
		width: 3vw;
		height: 3vw;
	}

	.home-contents .info-column .info {
		font-size: 4vw;
		margin-bottom: 6vw;
	}

	.home-contents .info-column .button {
		width: 100%;
	}

	.home-contents .info-column .button a {
		font-size: 5vw;
		padding: 3vw;
		width: 100%;
	}
}

/* ==========================================================================
	Home: Product
========================================================================== */

.home-product {
	position: relative;
	background-color: hsla(0, 0%, 0%, 0.4);
}

.home-product > .wp-block-group__inner-container {
	padding-top: 64px;
	padding-bottom: 68px;
}

.home-product .background {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	filter: brightness(50%);
}

.home-product .background img {
	height: 100%;
}

.home-product .subtitle {
	width: 587px;
	color: #F6EB61;
	font-size: 20px;
	font-weight: bold;
	font-stretch: normal;
	font-style: normal;
	line-height: normal;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin-bottom: 40px;
}

.home-product .title {
	position: relative;
	width: 587px;
	color: #FFFFFF;
	font-family: 'plak';
	font-size: 90px;
	font-weight: 500;
	font-stretch: condensed;
	font-style: normal;
	line-height: normal;
	letter-spacing: 8px;
	text-transform: uppercase;
	margin-bottom: 52px;
}

.home-product .title::after {
	content: "";
	position: absolute;
	bottom: -22px;
	left: 0;
	width: 587px;
	height: 1px;
	background-color: #faf7ec;
}

.home-product .info {
	width: 817px;
	color: #FFFFFF;
	font-size: 22px;
	font-weight: 300;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.45;
	letter-spacing: normal;
	margin-bottom: 56px;
}

.home-product .button a {
	width: 306px;
	color: #000000;
	font-size: 16px;
	font-weight: 500;
	font-stretch: normal;
	font-style: normal;
	line-height: normal;
	letter-spacing: 2px;
	text-transform: uppercase;
	background-color: #FFFFFF;
	padding: 20px 82px 20px 83px;
}

.home-product .button a:hover {
	background-color: #F6EB61;
	color: #000000;
}

.home-product .button a:active {
	background-color: #1E2123;
	color: #FFFFFF;
}

@media (max-width: 1280px), (orientation: portrait) {

	.home-product {
		background-position: top left;
		background-size: 100%;
	}

	.home-product > .wp-block-group__inner-container {
		padding-top: 13vw;
		padding-bottom: 13vw;
	}

	.home-product .subtitle {
		width: 100%;
		font-size: 4.5vw;
		letter-spacing: .5vw;
		margin-bottom: 0;
	}

	.home-product .title {
		width: 100%;
		font-size: 16vw;
		letter-spacing: 1.3vw;
		margin-bottom: 10vw;
	}

	.home-product .title::after {
		display: none;
	}

	.home-product .info {
		width: 100%;
		font-size: 6vw;
		margin-bottom: 8vw;
	}

	.home-product .button {
		width: 100%;
	}

	.home-product .button a {
		font-size: 5vw;
		padding: 3vw;
		width: 100%;
	}
}

/* ==========================================================================
	Home: Products List
========================================================================== */

.home-products {
	padding-top: 48px;
	padding-bottom: 52px;
	background-color: #FAF7EC;
}

.home-products .frame {
	padding: 47px 75px 48px 76px;
	border: solid 1px #1E2023;
}

.home-products .subtitle {
	color: #000000;
	font-size: 24px;
	font-weight: normal;
	line-height: normal;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin-bottom: 20px;
}

.home-products .title {
	font-size: 97px;
	letter-spacing: 9px;
	text-align: left;
	text-transform: uppercase;
	white-space: nowrap;
}

.home-products .meet-the-legends {
	position: relative;
	font-size: 72px;
	font-weight: 900;
	font-stretch: condensed;
	font-style: normal;
	line-height: normal;
	letter-spacing: 6px;
	text-transform: uppercase;
	margin-bottom: 23px;
}

.home-products .meet-the-legends img {
	height: 50px;
}

.home-products .separator {
	margin-bottom: 45px;
}

.home-products .separator::after {
	left: calc(50% - 204px);
	width: 408px;
}

@media (max-width: 1280px), (orientation: portrait) {

	.home-products .frame {
		padding: 10vw 5vw 6vw;
		margin-right: 5vw;
		margin-left: 5vw;
	}

	.home-products .subtitle {
		font-size: 5.5vw;
		margin-bottom: 1vw;
	}

	.home-products .title {
		font-size: 11vw;
		letter-spacing: 1.1vw;
		margin-bottom: 6vw;
	}

	.home-products .meet-the-legends {
		font-size: 11vw;
		letter-spacing: 1.1vw;
		margin-bottom: 6vw;
	}

	.home-products .meet-the-legends img {
		height: 8vw;
	}

	.home-products {
		left: 0;
		width: 100%;
	}

	.home-products .separator {
		margin-bottom: 10vw;
	}

	.home-products .separator::after {
		left: 0;
		width: 100%;
	}
}

/* ==========================================================================
	Home: Links
========================================================================== */

.home-links {
	background-color: #FAF7EC;
}

.home-links > .wp-block-group__inner-container {
	padding-bottom: 30px;
}

.home-links .link {
	position: relative;
	height: 320px;
}

.home-links .link {
	overflow: hidden;
}

.home-links .link img {
	filter: grayscale(100%);
	transition: var(--zoom-transition) ease-in-out;
}

.home-links .link:hover img {
	filter: grayscale(0%);
	transform: scale(var(--zoom-scale));
	-ms-transform: scale(var(--zoom-scale));
}

.home-links .link .overlay {
	position: absolute;
	top: 0;
	width: 100%;
	height: 320px;
	pointer-events: none;
}

.home-links .link .overlay .wp-block-group__inner-container {
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}

.home-links .link .overlay .subtitle a {
	color: #F6EB61;
	font-size: 16px;
	font-weight: bold;
	font-stretch: normal;
	font-style: normal;
	line-height: 1.75;
	letter-spacing: 0.8px;
	text-transform: uppercase;
}

.home-links .link:hover .overlay .subtitle a {
	color: #FFFFFF;
}

.home-links .link .overlay .title a {
	color: #F6EB61;
	font-family: 'plak';
	font-size: 44px;
	font-weight: 500;
	font-stretch: condensed;
	font-style: normal;
	line-height: normal;
	letter-spacing: 3px;
	text-transform: uppercase;
}

.home-links .link:hover .overlay .title a {
	color: #FFFFFF;
}

@media (max-width: 1280px), (orientation: portrait) {

	.home-links > .wp-block-group__inner-container {
		padding-bottom: 5vw;
	}

	.home-links .wp-block-columns {
		flex-direction: column;
		margin-bottom: 0;
	}

	.home-links .wp-block-image img {
		filter: grayscale(0%);
		height: 52vw;
	}

	.home-links .link:hover img {
		transform: scale(1);
		-ms-transform: scale(1);
	}

	.home-links .link {
		height: 52vw;
		margin-bottom: 5vw;
		margin-left: 0;
		overflow: unset;
	}

	.home-links .link .overlay {
		height: 52vw;
	}

	.home-links .link .overlay .subtitle a {
		font-size: 5vw;
		letter-spacing: .5vw;
	}

	.home-links .link .overlay .title a {
		font-size: 12vw;
		letter-spacing: .6vw;
	}
}

/* ==========================================================================
	Home: Register
========================================================================== */

.home-register {
	background-color: #FAF7EC;
}

.home-register > .wp-block-group__inner-container {
	padding-bottom: 80px;
}

.home-register .button {
	min-width: 31.5%;
}

.home-register .button a {
	text-transform: uppercase;
	width: 100%;
}

@media (max-width: 1280px), (orientation: portrait) {

	.home-register > .wp-block-group__inner-container {
		padding-bottom: 5vw;
	}

	.home-register .button {
		width: 100%;
	}
}