:root{
	--clr-p: #e31837;
	--clr-p-t: #ffffff;
	--clr-s: #03045E;
	--clr-s-t: #ffffff;
}


body {
  overflow: overlay;
}

/*Defaults*/
::selection {
  color: var(--clr-p-t);
  background: var(--clr-p);
}

::-webkit-scrollbar
{
	width: 10px;
	background-color: rgba(0, 0, 0, 0.2);
}

::-webkit-scrollbar-thumb
{
	background-image: -webkit-gradient(linear,
									   left bottom,
									   left top,
									   color-stop(0.44, var(--clr-p)),
									   color-stop(0.72, var(--clr-s)));
}


/* LP */
.lp{
	position: relative;
	width: 100%;
	height: 70dvh;
	overflow: hidden;
}
@media(min-width: 800px){
	.lp{
		height: 100dvh;
	}
}
@media(max-width: 768px){
	.lp{
		height: 35dvh;
	}
}
.lp img.bg,
.lp video.bg{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	z-index: -1;
}
.lp .content{
	position: absolute;
	inset: 0;

	display: flex;
	justify-content: center;
	align-items: center;

	background: hsl(from var(--clr-s) h calc(s * 2) calc(l / 5) / 0.6);

	color: var(--clr-s-t);
	text-align: center;
}
.lp .content h1{
	font-weight: 700;
	font-size: clamp(3rem, calc(4vw + 1px), 6rem);
	/* margin-top: 15vw; */
}
@media(min-width: 800px){
	.lp .content h1{
		margin-top: unset;
	}
}

/* LP Scroll Icon */
.container--scoll-icon {
  position: absolute;
  bottom: 80px;
  left: 50%;
  transform: translateX(-50%);
  width: 24px;
  height: 24px;
  text-decoration: none;
}

.chevron {
  position: absolute;
  width: 28px;
  height: 8px;
  opacity: 0;
  transform: scale3d(0.5, 0.5, 0.5);
  animation: move 3s ease-out infinite;
}

.chevron:first-child {
  animation: move 3s ease-out 1s infinite;
}

.chevron:nth-child(2) {
  animation: move 3s ease-out 2s infinite;
}

.chevron:before,
.chevron:after {
  content: ' ';
  position: absolute;
  top: 0;
  height: 100%;
  width: 51%;
  background: var(--clr-p);
}

.chevron:before {
  left: 0;
  transform: skew(0deg, 30deg);
}

.chevron:after {
  right: 0;
  width: 50%;
  transform: skew(0deg, -30deg);
}

@keyframes move {
  25% {
    opacity: 1;

  }
  33% {
    opacity: 1;
    transform: translateY(30px);
  }
  67% {
    opacity: 1;
    transform: translateY(40px);
  }
  100% {
    opacity: 0;
    transform: translateY(55px) scale3d(0.5, 0.5, 0.5);
  }
}

.text {
  display: block;
  margin-top: 75px;
  margin-left: -30px;
  font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
  font-size: 12px;
  color: #fff;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: .25;
  animation: pulse 2s linear alternate infinite;
}

@keyframes pulse {
  to {
    opacity: 1;
  }
}


/* Manu */
.menu{
	position: fixed;
	width: 100%;
	background-color: transparent;
	z-index: 10;
/*	border-bottom: 1px solid #ffffff;*/
	transition: background-color 250ms ease-in,
							color 250ms ease-in;
}
@media(min-width: 800px){
	.menu{
		max-height: calc(6.5vw + 1px);
	}
}
.menu.active{
	background-color: #ffffff;
	color: #000000;
}
.menu .container{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
@media(min-width: 800px){
	.menu .container{
		justify-content: center;
	}
}
.menu .container nav{
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	gap: 20px;
	background-color: #ffffff;
	padding: 1.5rem;
	height: 0;
	overflow: hidden;
	position: absolute;
	top: 70px;
	right: 20px;
	opacity: 0;
	transition: opacity 250ms ease-in,
							height 250ms ease-in;
}
.menu .container nav.active{
	height: auto;
	opacity: 1;
  box-shadow: var(--bs-box-shadow);
}
@media(min-width: 800px){
	.menu .container nav{
		position: relative;
		top: unset;
		right: unset;
		height: auto;
		opacity: unset;
		overflow: visible;
		flex-direction: row;
		align-items: center;
		width: 100%;
		max-height: calc(6.5vw + 1px);
		background-color: transparent;
		padding: unset;
	}
	.menu .container nav.active{
		box-shadow: none;
	}
}
nav a{
	color: #000000;
	text-decoration: none;
	font-size: 1.1rem;
	font-weight: 600;
	text-transform: uppercase;
}
@media(min-width: 800px){
	nav a{
		color: #ffffff;
		font-weight: 400;
	}
}
.menu.active nav a{
	color: #000000;
}
nav a.active,
.menu.active nav a.active{
	color: var(--clr-p);
	font-weight: 600;
}
.logo{
	padding-top: 10px;
	padding-bottom: 0;
	height: 50px;
	transition: padding-top 250ms ease-in,
/*							padding-bottom 500ms ease-in,*/
							height 250ms ease-in;

}
@media(min-width: 800px){
	.logo{
		padding-top: calc(1vw + 1px);
		height: calc(5vw + 1px);
	}
}
.menu.active .logo{
	padding-top: 3px;
	padding-bottom: 3px;
	height: 60px;
}
@media(min-width: 800px){
	.menu.active .logo{
		padding-top: calc(0.3vw + 1px);
		padding-bottom: calc(0.3vw + 1px);
		height: calc(4vw + 1px);
	}
}
.menu-btn{
	background-color: transparent;
	border: none;
}
.menu-btn svg{
	width: 30px;
	height: 30px;
	fill: var(--clr-p);
}



/* Section */
.section-heading{
	text-align: center;
	position: relative;
	color: var(--clr-p);
	font-weight: 700;
	font-size: 2rem;
	padding-bottom: calc(0.75vw + 1px);
	margin-top: calc(2vw + 1px);
}
.section-heading::before,
.section-heading::after{
	content: '';
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	margin-inline: auto;
	height: 2px;
}
.section-heading::before{
	width: calc(40vw + 1px);
	max-width: 300px;
	background-color: var(--clr-strip-bg);
}
.section-heading::after{
	width: calc(10vw + 1px);
	max-width: 100px;
	background-color: var(--clr-strip);
}
@media(min-width: 800px){
	.section-heading::before{
		width: calc(12vw + 1px);
	}
	.section-heading::after{
		width: calc(2vw + 1px);
	}
}


/* Buttons */
.site-btn{
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: transparent;
	padding: 4px 4px 4px 15px;
	border: 2px solid var(--clr-btn);
	border-radius: 500px;
	font-size: 1rem;
	color: var(--clr-btn);
	font-weight: 600;
}
.site-btn .icon{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 25px;
	height: 25px;
	background-color: rgba(0, 0, 0, 0.1);
	border-radius: 50%;
	 margin-left: 0.75rem;
}
.site-btn .icon svg{
	width: 15px;
	height: 15px;
}


/* Scroller Form */
.scroll-form{
	position: fixed;
	display: flex;
	z-index: 15;
}
.btn-scroll-form{
	background-color: var(--clr-p);
	color: var(--clr-p-t);
	border: 0;
	padding: 0.8rem 1.5rem;
	font-size: clamp(14px, calc(1vw + 1px), 2rem);
	text-transform: uppercase;
}
.scroll-form form{
	width: 350px;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	background-color: #ffffff;
	padding: 1.5rem 1rem;
}
.scroll-form svg{
	display: none;
}
@media(max-width: 799px){
	.scroll-form{
		bottom: 10px;
		left: 50%;
		transform: translateX(-50%);

		flex-direction: column;
    align-items: center;
	}
	.scroll-form.active{
		align-items: unset;
		bottom: unset;
		top: 5%;
		left: 50%;
		transform: translate(-50% -50%);
		box-shadow: 0px 0px 30px 50pc rgba(0, 0, 0, 0.9);
	}
	.btn-scroll-form{
		border-radius: 500px;
		font-weight: 600;
		height: 45px;
	}
	.scroll-form.active .btn-scroll-form{
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-radius: 15px 15px 0 0;
	}
	.scroll-form form{
		display: none;
	}
	.scroll-form.active form{
		display: flex;
		border-radius: 0 0 15px 15px;
	}
	.scroll-form.active svg{
		display: inline-block;
		width: 15px;
		height: 15px;
	}
}
@media(min-width: 800px){
	.scroll-form{
		top: 15%;
		right: -350px;
		align-items: flex-start;
		align-items: center;

	  transition: right 250ms ease-in;
	}
	.scroll-form.active{
		right: 0;
	}
	.btn-scroll-form{
		padding: 1.2rem 0.5rem;
		writing-mode: vertical-rl;
		font-weight: 400;
	}
}


/* Partners */
.partners{
	width: 100%;
	background-image: linear-gradient(to bottom, hsl(from var(--clr-s) calc(h / 1.2) s 90% / 0.8), rgba(255, 255, 255, 0.6) 80%, hsl(from var(--clr-s) calc(h / 1.2) s 90% / 0.8)), url(../img/op-bg.webp);
	background-size: cover;
	background-position: center center;
}
.partner-slider{ margin-block: 3rem 0; }
@media(min-width: 800px){
	.partner-slider{ margin-block: 6rem 3rem; }
}
.partner-slider .glide__slide img{
	max-width: 50%;
	height: auto;
/*	height: clamp(1rem, calc(1.2vw + 1px), 3rem);*/
	filter: contrast(0);
	transition: transform 250ms ease-in,
							filter 400ms ease-in;
}
.partner-slider .glide__slide span{
	display: block;
	font-size: 1.2rem;
	font-weight: 600;
	margin-top: 1.6rem;
	color: var(--clr-s);
	opacity: 0;
	transition: opacity 400ms ease-in;
}
.partner-slider .glide__slide--active img{
/*	max-width: 50%;*/
	filter: unset;
	transform: scale(1.1);
}
.partner-slider .glide__slide--active span{
	opacity: 1;
}
.partner-slider .glide__arrows{
	position: absolute;
	top: 15%;
	left: 0;
	width: 100%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.partner-slider .glide__arrow{
	border: none;
	background: transparent;
}
.partner-slider .glide__arrow img{
	display: block;
	width: 50px;
	height: 50px;
}
.partner-slider .glide__arrow--left img{
	transform: rotateY(180deg);
}


/* Why Invest */
.why{
	width: 100%;
	min-height: 350px;
	background-image: linear-gradient(145deg, hsl(from var(--clr-s) h s l / 0.8) 10%, hsl(from #000000 h s l / 0.8)), url(../img/why-bg.webp);
	background-size: cover;
	background-position: top center;
	background-attachment: fixed;
}
.why-block{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: baseline;
	text-align: center;
	gap: 1rem;
}
.why-block .why-icon{
	display: inline-block;
	height: 5rem;
/*	height: calc(4vw + 1px) clamp(3rem, calc(1vw + 1px), 2rem);*/
}
.why-block p{
	font-size: 1.2rem;
	font-weight: 400;
	color: #ffffff;
}


/* About Expo */
.about-expo .about-expo-img{
	position: relative;
	width: 90%;
	height: 90%;
	--border-r: 20px 20px 80px 20px;
}
.about-expo .about-expo-img img{
	display: block;
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	object-position: bottom center;
	border-radius: var(--border-r);
	margin-left: 5%;
	margin-top: 5%;
}
.about-expo .about-expo-img::before{
	content: '';
	position: absolute;
	border: 2px solid var(--clr-p);
	width: 100%;
	height: 100%;
	margin-top: -5%;
	z-index: -1;
	border-radius: var(--border-r);
}


/* Chart */
.section-chart{
	background-color: #F2F2F2;
}
.chart{
	width: 100%;
	height: 300px;
}


/* Section Enquiry Form */
.open-form{
	border: 2px solid var(--clr-p);
	border-radius: 25px;
	padding: 4vw 4vw 2vw 4vw;
}
.form-layout{
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	grid-gap: 2vw;
}
@media(min-width: 800px){
	.form-layout{
		grid-template-columns: repeat(3, 1fr);
	}
}
input,
.form-layout input,
.form-select{
	padding: 1rem;
	font: inherit;
	font-size: 1.1rem;
	border: none;
	background-color: hsl(from var(--clr-p) h s l / 0.1);
	border-radius: 10px;
}


/* Footer */
footer{
	background-color: #191919;
	color: #ffffff;
	background-image: linear-gradient(to top, hsl(from #191919 h s l / 0.95), hsl(from #191919 h s l / 0.95)), url(../img/comman/ft-bg.png);
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: bottom center;
	background-attachment: fixed;
	font-family: 'Arial';
}
.footer-grid{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 2rem;
}
.footer-grid:first-child{
	grid-column: span 3;
}
@media(min-width: 800px){
	.footer-grid{
		grid-template-columns: 2fr 1fr 1fr 2fr;
	}
}
.footer-links{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: baseline;
	gap: 1rem;
	list-style: none;
	padding: 0;
	margin: 0;
	font-size: 1rem;
}
.footer-links-heading{
	color: var(--clr-p);
	font-weight: 600;
}
.footer-links a{
	text-decoration: none;
	color: #ffffff;
}
.footer-links a:hover{
	color: var(--clr-p);
}
.footer-lpara{
	text-align: center;
}
@media(min-width: 800px){
	.footer-lpara{
		text-align: left;
	}
}
@media(max-width: 799px){
	footer{
		padding-bottom: 40px;
	}
}


/* Mobile Action Panel */
.mob-action{
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-inline: 15px;
	padding-bottom: 10px;
	background: linear-gradient(to top, #000000, transparent);
}
.mob-action a{
	text-decoration: none;
	background-color: var(--clr-p);
	color: var(--clr-p-t);
	border-radius: 50%;
	width: 45px;
	height: 45px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.mob-action a svg{
	display: inline-block;
	width: 25px;
	height: 25px;
	fill: var(--clr-p-t);
}
@media(min-width: 800px){
	.mob-action{
		display: none;
	}
}



.iti__tel-input { width: 100%; }}
.scrollSpy {
	padding: 10rem 0;
}


.footer-logo{
	max-width: 80%;
}