/* ===================================
	Horizontal Portfolio
====================================== */
.horizontal-portfolio-wrapper {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	position: relative;
}
.horizontal-portfolio-wrapper .portfolio-item {
	padding-right: 40px;
	padding-left: 40px;
	position: relative;
	flex: 0 0 auto;
	width: auto;
}
.horizontal-portfolio-wrapper .portfolio-item .count {
	font-size: 2.5rem;
	line-height: 2.5rem;
	color: var( --e-global-color-secondary, #232323 );
	opacity: 0.6;
	position: absolute;
	top: 30px;
	left: 20px;
}
.horizontal-portfolio-wrapper .portfolio-item .count.text-stroke {
	color: transparent;
}
.horizontal-portfolio-wrapper .portfolio-item .menu-item-text {
	font-size: 8.75rem;
	line-height: 6.25rem;
	letter-spacing: -1px;
	color: var( --e-global-color-secondary, #232323 );
	position: relative;
	display: inline-block;
}
.horizontal-portfolio-wrapper .portfolio-item .menu-item-text:hover {
	color: var( --e-global-color-primary );
}
.horizontal-portfolio-wrapper .portfolio-item .menu-item-text .word {
	overflow: hidden;
	line-height: 120%;
}
.horizontal-portfolio-wrapper .portfolio-item .menu-item-text .words .char {
	transition: .8s cubic-bezier(.075, .82, .165, 1);
}
.horizontal-portfolio-wrapper .portfolio-item .menu-item-text .clone {
	position: absolute;
	top: 0;
	left: 0;
}
.horizontal-portfolio-wrapper .portfolio-item .menu-item-text .clone .char {
	-webkit-transform: translateY(-100px);
	transform: translateY(-100px);
	opacity: 0;
}
.horizontal-portfolio-wrapper .portfolio-item .hover-reveal {
	position: fixed;
	z-index: 9;
	width: 420px;
	height: 420px;
	top: 0;
	left: 0;
	pointer-events: none;
	opacity: 0;
	transform-origin: 100% 0;
	will-change: transform, filter;
	border-radius: 100%;
}
.horizontal-portfolio-wrapper .portfolio-item .hover-reveal .hover-reveal-inner {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
	border-radius: 100%;
}
.horizontal-portfolio-wrapper .portfolio-item .hover-reveal .hover-reveal-img {
	height: 100%;
	width: 100%;
	background-size: cover;
	background-position: 50% 50%;
	will-change: transform;
	border-radius: 100%;
}
.horizontal-portfolio-wrapper .portfolio-item .menu-item-text:hover .words:not(.clone) .char {
	-webkit-transform: translateY(100px);
	transform: translateY(100px);
	opacity: 0;
}
.horizontal-portfolio-wrapper .portfolio-item .menu-item-text:hover .clone .char {
	-webkit-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
}
.horizontal-portfolio-wrapper .portfolio-item .subtitle {
	display: block;
	color: var( --e-global-color-secondary, #232323 );
	font-size: 20px;
}

@media (max-width: 1199px) {
	.horizontal-portfolio-wrapper .portfolio-item .count {
		top: 10px;
		left: 0;
	}
	.horizontal-portfolio-wrapper .portfolio-item .hover-reveal {
		display: none;
	}
}

@media (max-width: 767px) {
	.horizontal-portfolio-wrapper {
		flex-direction: column;
		align-items: flex-start;
	}
}