.page-template-page-home-animated,
.page-template-page-home-animated-php {
	background-image: url("../images/homebgstrip.png");
	background-repeat: repeat-x;
	background-size: auto;
	background-position: center top;
	background-attachment: scroll;
}

.page-template-page-home-animated .main-navigation .menu a,
.page-template-page-home-animated .site-tagline,
.page-template-page-home-animated-php .main-navigation .menu a,
.page-template-page-home-animated-php .site-tagline {
	color: #fff;
}



.page-template-page-home-animated .site-header {
	opacity: 0;
	transition: opacity 900ms ease;
}

.page-template-page-home-animated .site-header.home-nav-visible {
	opacity: 1;
}




.home-page--animated {
	--intro-logo-width: min(620px, 48vw);
	--intro-logo-exit-x: 0px;
	--intro-logo-exit-y: 0px;

	font-family: "Montserrat", sans-serif;
	padding: 45px 20px;
	position: relative;
	min-height: 850px;
	overflow: hidden;
}

.home-page--animated .home-page__inner {
	position: relative;
	z-index: 2;
	width: 100%;
	margin: 0;

	opacity: 0;
	transform: translateX(-22px);
	transition:
		opacity 900ms ease,
		transform 900ms ease;
}

.home-page--animated.home-intro-complete .home-page__inner {
	opacity: 1;
	transform: translateX(0);
}

.home-intro {
	position: fixed;
	inset: 0;
	z-index: 1;
	pointer-events: none;
}

.home-page--animated .about-page__geometry {
	position: fixed;
	inset: 0;

	width: 100vw;
	height: 100vh;

	z-index: 1;
	pointer-events: none;
}

.home-page--animated .about-page__geometry canvas {
	display: block;
	width: 100%;
	height: 100%;
}


.home-intro__logo {
	position: fixed;
	left: 50%;
	top: 48%;
	z-index: 2;
	width: var(--intro-logo-width);
	height: auto;
	transform: translate(-50%, -50%) perspective(1000px) scale(.02);
	transform-origin: center center;
	opacity: 0;
	filter: drop-shadow(0 10px 28px rgba(0, 0, 0, .08));
	will-change: transform, opacity;
}

.home-page--animated.home-logo-revealed .home-intro__logo {
	opacity: 1;
	transform: translate(-50%, -50%) perspective(1000px) scale(1);
	transition: transform 4300ms cubic-bezier(.16, .78, .16, 1), opacity 700ms ease;
}

.home-page--animated.home-logo-exit .home-intro__logo {
	opacity: 0;
	transform: translate(calc(-50% + var(--intro-logo-exit-x)), calc(-50% + var(--intro-logo-exit-y))) perspective(1000px) rotateY(0deg) scale(.12);
	transition: transform 1300ms ease, opacity 900ms ease;
}

.home-section {
	padding-top: 50px;
	margin-bottom: 20px;
	margin-left: 20px;
	max-width: 725px;
}
	.home-section ul {
		list-style:none;
		padding-left: 0px;
		margin-left: 0;
	}
.home-section ul li{
	margin-bottom:13px;
}

.home-page--animated .about-section__headline {
	margin: 0;
	font-size: 55px;
	font-weight: 300;
	line-height: 1.1;
	color: #ffffff;
}

.home-page--animated .about-section__headline-text {
	max-width: 75%;
	font-size: 32px;
	line-height: 1.6;
	color: #ffffff;
	font-weight: 200;
	margin-bottom: 25px;
}

.home-page--animated .about-section__headline-text p,
.home-page--animated .about-section__subhead-text p,
.home-page--animated .about-section__paragraph-body p {
	margin: 0;
}

.home-page--animated .about-section__subhead {
	margin: 10px 0 0;
	max-width: 650px;
	font-size: 28px;
	font-weight: 300;
	line-height: 1.1;
	color: #c7c4ba;
}

.home-page--animated .about-section__subhead-text {
	font-size: 32px;
	line-height: 1.6;
	color: #ffffff;
	font-weight: 200;
}

.home-page--animated .about-section__paragraphs {
	display: flex;
	flex-direction: column;
	gap: 22px;
	margin-top: 35px;
}

.home-page--animated .about-section__paragraph-heading {
	margin: 0 0 5px;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	text-transform: uppercase;
	color: #ffffff;
}

.home-page--animated .about-section__paragraph-body {
	font-size: 16px;
	font-weight: 300;
	line-height: 1.2;
	color: #dad7d0;
	max-width: 650px;
}

.home-page--animated .about-section__paragraph-body strong{
	font-weight: 600;
	color:#fff;
}



.home-intro__tagline {
	position: fixed;
	white-space: nowrap;
	left: 50%;
	top: calc(50% + 90px);
	z-index: 2;

	font-family: "Montserrat", sans-serif;
	font-size: 25px;
	font-weight: 400;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #fff;

	transform: translate(-50%, -18px) scale(.5);
	opacity: 0;

	transition:
		opacity 900ms ease,
		transform 1200ms ease;

	pointer-events: none;
}

.home-page--animated.home-tagline-revealed .home-intro__tagline {
	opacity: 1;
	transform: translate(-50%, 0) scale(1);
}

.home-page--animated.home-logo-exit .home-intro__tagline {
	opacity: 0;
	transform: translate(-50%, 18px);
}

/* Home content build animation */
.home-animate-item {
	opacity: 0;
	will-change: opacity, transform;
}

.home-animate-headline {
	transform: translateX(46px) rotateY(70deg);
	transform-origin: left center;
	transition:
		opacity 1200ms ease,
		transform 1100ms cubic-bezier(.22, .7, .2, 1);
}
.home-animate-subhead {
	transform: translateX(38px);
	transition:
		opacity 900ms ease,
		transform 1000ms cubic-bezier(.22, .7, .2, 1);
}

.home-animate-heading {
	transform: translateX(24px) rotateY(58deg);
	transform-origin: left center;
	transition:
		opacity 700ms ease,
		transform 850ms cubic-bezier(.22, .7, .2, 1);
}

.home-animate-body {
	transform: translateX(38px);
	transition:
		opacity 700ms ease,
		transform 850ms cubic-bezier(.22, .7, .2, 1);
}

/* List items: the li handles slide-in; its children handle the staged fade. */
.home-animate-list-item {
	opacity: 0;
	transform: translateX(138px);
	transition:
		opacity 700ms ease,
		transform 850ms cubic-bezier(.22, .7, .2, 1);
}


.home-animate-list-item strong {
	display: inline-block;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
	opacity: 0;
	transition: opacity 650ms ease;
}
/*
.home-animate-list-item .li-detail {
	opacity: 0;
	transition: opacity 650ms ease;
}
	*/


.home-animate-list-item .li-detail {
	opacity: 0;
	transition: opacity 650ms ease;
}

.home-animate-list-item .li-detail::before {
	content: " ";
	white-space: normal;
}


/* Reveal non-list items using the normal stagger. */
.home-page--animated.home-content-revealed .home-animate-item:not(.home-animate-list-item) {
	opacity: 1;
	transform: translateX(0) rotateY(0deg);
	transition-delay: var(--home-item-delay, 0ms);
}

/* Reveal each list row using the row stagger. */
.home-page--animated.home-content-revealed .home-animate-list-item {
	opacity:1;
	transform: translateX(0);
	transition-delay: var(--home-item-delay, 0ms);
}

/* Within each row, reveal the strong text first, then the detail text. */
.home-page--animated.home-content-revealed .home-animate-list-item strong {
	opacity: 1;
	transition-delay: var(--home-item-delay, 0ms);
}

.home-page--animated.home-content-revealed .home-animate-list-item .li-detail {
	opacity: 1;
	transition-delay: calc(var(--home-item-delay, 0ms) + 350ms);
}

@media (max-width: 800px) {
	.home-page--animated {
		--intro-logo-width: min(420px, 72vw);
		--sphere-size-final: 900px;
		--sphere-final-right: -520px;
		--sphere-final-bottom: -80px;
		padding: 60px 20px;
	}

	.home-page--animated .about-section__headline {
		font-size: 42px;
	}

	.home-page--animated .about-section__headline-text,
	.home-page--animated .about-section__subhead-text {
		font-size: 24px;
	}

	.home-intro__tagline {
		font-size:16px;
		top: calc(50% + 70px);
	
	}
}

@media (max-width: 800px) {
	html,
	body {
		overflow-x: hidden;
	}

	.home-page--animated {
		min-height: auto;
		padding: 40px 18px 64px;
		overflow: hidden;
	}

	.home-page--animated .home-page__inner {
		width: 100%;
		max-width: 100%;
	}

	.home-section {
		width: 100%;
		max-width: none;
		margin: 0;
		padding-top: 32px;
	}

	.home-page--animated .about-section__headline {
		font-size: clamp(34px, 10vw, 42px);
		line-height: 1.05;
		max-width: 100%;
	}

	.home-page--animated .about-section__headline-text,
	.home-page--animated .about-section__subhead-text {
		max-width: 100%;
		font-size: clamp(20px, 6.2vw, 24px);
		line-height: 1.35;
	}

	.home-page--animated .about-section__paragraphs {
		gap: 18px;
		margin-top: 28px;
	}

	.home-page--animated .about-section__paragraph-heading,
	.home-page--animated .about-section__paragraph-body {
		max-width: 100%;
	}

	.home-page--animated .about-section__paragraph-body {
		font-size: 15px;
		line-height: 1.35;
	}

	.home-section ul {
		list-style:none;
		padding-left: 0px;
		margin-left: 0;
	}

	.home-animate-list-item {
		transform: translateX(40px);
	}

	.home-page--animated .about-page__geometry {
		width: 100%;
		max-width: 100vw;
		overflow: hidden;
	}

	.home-intro__tagline {
		font-size:12px;
		top: calc(50% + 50px);

	}

	.menu-toggle .material-symbols-outlined {
	font-size: 38px;
	color: #fff;
	line-height: 1;

	transition: transform 250ms ease;
}
}
