* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

body {
	font-family: sans-serif;
}


.manrope-normal {
	font-family: "Manrope", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
}


.header-main {
	position: fixed;
	top: 10vh;
  	left: 3vw;
	z-index: 10000;
}

/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on June 16, 2025 */
@font-face {
	font-family: 'balkistlight';
	src: url('../fonts/balkist-light-webfont.woff2') format('woff2'),
		url('../balkist-light-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;

}

@font-face {
	font-family: 'balkistlight_italic';
	src: url('../fonts/balkist-lightitalic-webfont.woff2') format('woff2'),
		url('../fonts/balkist-lightitalic-webfont.woff') format('woff');
}

.header-main h1 img {
	/* Initial filter state for the logo: retains its original color. */
	/* This will be smoothly animated by GSAP to turn white. */
	filter: brightness(1) invert(0);
}


.coming-soon {
	position: absolute;
	right: 130px;
	bottom: 40px;
	text-transform: uppercase;
	color: white;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	z-index: 10;
	opacity: 0;
}

.coming-soon2 {
	position: absolute;
	right: 0px;
	bottom: -40px;
	text-transform: uppercase;
	color: #1E1C2A;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	z-index: 10;
}

.coming-soon span {
	letter-spacing: 2px;
}

.mt-icon {
	background: url('../../assets/img/morris-tate-icon.svg');
	width: 80px;
	height: 80px;
	background-size: 80px;
	background-repeat: no-repeat;
	bottom: 30px;
	right: 20px;
	position: absolute;
	z-index: 100;
}

.video-hero {
	position: relative;
	margin-bottom: 230px;
}

@media screen and (max-width: 768px) {
	.coming-soon {
		top: 9%;
		display: none;
	}

	.mt-icon {
		display: none;
	}

	.video-hero {
		margin-bottom: 20px;
	}

}

.video-sticky-wrapper {
	position: sticky;
	top: 0;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

.video-wrapper {
	overflow: hidden;
	position: relative;
	align-content: center;
}


@media screen and (max-width: 768px) {
	.video-wrapper {
		width: 75vw;
		height: 80vh;
		overflow: hidden;
	}
}

.video-wrapper {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
	pointer-events: none;
}

.video-overlay h2 {
	z-index: 100000;
	position: absolute;
	bottom: 0%;
	/* left: 2%; */
	left: 4vw;
	color: white;
	font-size: 4.5vw;
	font-weight: normal;
	line-height: 1.5;
	font-family: 'balkistlight';
}

.video-overlay h2 span {
	font-family: 'balkistlight_italic';
	font-weight: normal;
	font-size: 4.5vw;
}



.video-container {
  position: relative;
  /* width: 100%; */
  height: auto;
  /* overflow: hidden; */
}

.video-wrapper {
  width: 100%;
  height: auto;
  display: block;
  z-index: 1;
}

.video-overlay {
  position: absolute;
  bottom: 0;
  
  width: 100%;
  height: 100%;
  z-index: 2;
  pointer-events: none; /* overlay won't block clicks */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.video-overlay h2,
.video-overlay .mt-icon,
.video-overlay .coming-soon {
  position: absolute;
  /* Place individually with GSAP or CSS */
}
.video-overlay h2 {
	left: 3vw;
	bottom: 0;
}

.content {
	color: #1E1C2A;
	margin-bottom: 300px;
}

.content p {
	font-size: 1.46vw;
	color: #1E1C2A;
	font-family: "Manrope", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
}

.primary {
	color: #6243C4;
}

@media screen and (max-width: 768px) {
	.video-container {
		position: relative;
		max-width: 100%;
		overflow: hidden;
	}
	.video-wrapper h2 {
		font-size: 8vw;
		top: 70%;
	}

	.video-wrapper h2 span {
		font-size: 8vw;
	}
	.content {

		margin-bottom: 30px;
	}
	.content p {
		font-size: 1rem;
	}
}

.content p a {
	color: #6243C4;
	/* text-decoration: none; */

	font-family: "Manrope", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
}

.content p a:hover {
	text-decoration: underline;
}

.scroll-info {
	position: fixed;
	bottom: 5vh;
	left: 50%;
	transform: translateX(-50%);
	z-index: -1;
}

.scroll-info p {
	color: #1E1C2A;
	font-family: "Manrope", sans-serif;
	font-weight: 300;
	font-size: 1.75rem;
}


span.icon-mail {
	width: 30px;
	height: 30px;
	display: inline-block;
	margin-right: 10px;
	top: 14px;
	position: relative;
	background-image: url('../../assets/img/mail_outline.svg');
	background-size: contain;
	background-repeat: no-repeat;
}

.footer {
	/* margin-top: 310px; */
	padding-top: 67px;
	padding-bottom: 67px;
}
footer.container-fluid {
	padding: 2%
}
@media screen and (max-width: 768px) {
	.footer {
		/* margin-top: 310px; */
		padding-top: 4px;
		padding-bottom: 4px;
	}
}

@media screen and (max-width: 768px) {
	.video-wrapper iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 300%;
		/* height: 100vh; */
		border: none;
		pointer-events: none;
	}
}

footer p {
	color: #727272;
}


/* Style the video: 100% width and height to cover the entire window */
#myVideo {
  position: relative;
  width: 60vw;
  height: 60vh;
  object-fit: cover;
  z-index: -1;
  margin-bottom: 100px;
  display: block;
  margin: 0 auto;
}


.header-main h1 img {
	/* Initial filter state for the logo: retains its original color. */
	/* This will be smoothly animated by GSAP to turn white. */
	filter: brightness(1) invert(0);
}


.content {
	color: #1E1C2A;
	margin-bottom: 300px;
}

.content p {
	font-size: 1.46vw;
	color: #1E1C2A;
	line-height: 1.75;

	font-family: "Manrope", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
}

.content p a {
	color: #6243C4;
	/* text-decoration: none; */

	font-family: "Manrope", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
}

@media screen and (max-width: 768px) {
	.header-main {
		position: fixed;
		top: 30px;
  left: 7%;
  z-index: 10000;
	}
	.video-wrapper {
		width: 100%;
		height: 100vh;
		overflow: visible;
	}
.video-wrapper h2 {
	left: 7%
}
	.video-wrapper h2,
	.video-wrapper h2 span {
		font-size: 10vw;
	}
.content {
		margin-bottom: 30px;
		padding: 7%;
	}
	.content p {
		font-size: 1rem;
	}

	.coming-soon {
		position: absolute;
		right: 0rem;
		left: 0;
		bottom: -20px;
		text-transform: uppercase;
		color: black;
		display: flex;
		align-items: center;
		gap: 0.5rem;
		z-index: 10;
	}

	.coming-soon span {
		text-align: center;
		width: 100%;
		color: white;
	}

	.mt-icon {
		display: none;
	}

	.row.mb-5 {
		padding: 7%
	}

}