html{
	font-size: 13.5px;
}
body{
	font-family: system-ui, sans-serif;
	font-size: 1rem;
	letter-spacing: 0.3px;
	line-height: 1.7;
	color: rgb(0, 0, 0, 0.9);
}
body.pg-loaded{
	font-family: "Poppins", sans-serif;
}


.pg-container{
	max-width: 1320px;
	margin-inline: auto;
	overflow-x: hidden;
}

.pp-bg-light{
	background-color: #FFF6ED;
	color: rgb(0, 0, 0, 0.95);
}
.project-bg-light{
	background-color: #EDF7EF;
	color: rgb(0, 0, 0, 0.95);
	background-color: color-mix(in lab, var(--colorProject) 10%, #ffffff);
}
.sec-pd{
	padding-block: 5rem;
	padding-inline: 2rem;
}
.text-clr-primary{
	color: var(--colorPrimary);
	font-weight: 300;
	text-align: center;
	
}
.sec-title{
	font-size: 1.8rem;
	font-weight: 400;
	text-align: center;
}
@media screen and (min-width: 768px) {
	.sec-title{
		font-size: 3.2rem;
	}
}
p{
	white-space: pre;           /* CSS 2.0 */
    white-space: pre-wrap;      /* CSS 2.1 */
    white-space: pre-line;      /* CSS 3.0 */
    white-space: -pre-wrap;     /* Opera 4-6 */
    white-space: -o-pre-wrap;   /* Opera 7 */
    white-space: -moz-pre-wrap; /* Mozilla */
    white-space: -hp-pre-wrap;  /* HP Printers */
    word-wrap: break-word;
    -moz-hyphens:auto; 
    -webkit-hyphens:auto; 
    -o-hyphens:auto; 
    hyphens:auto;
    text-align: justify; 
    margin-bottom: 0;  
    margin-block-start: 0.1rem;
    margin-block-end: 0.1rem;
}
.title-line{
	position: relative;
	display: inline-block;
}
.title-line::before, .title-line::after{ content: ''; position: absolute;
 width: 60%; height: 3px; background-color: var(--colorProject); }
.title-line::before{
	left: 0;
	bottom: -0.5rem;
}
.title-line::after{
	top: -0.5rem;
	right: 0;
}

.slick-dots li button:before{
	color: var(--colorPrimary);
	font-size: 0.8rem;
}
.slick-dots li.slick-active button:before{
	color: var(--colorPrimary);
}

nav{
	display: block;
	position: fixed;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.75);
	backdrop-filter: blur(2px);
	padding: 0.5rem 1rem;
	z-index: 9;
}
@media screen and (min-width: 768px) {
	nav{
		padding: 0.5rem 2rem;
	}
	nav .pg-container{
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
}

nav .con{
	display: flex;
	gap: 2rem;
	height: 4rem;
	align-items: center;
	justify-content: space-between;
}

nav .sub{
	display: flex;
	align-items: center;
	gap: 10px;
}

.logo{
	display: block;
	height: 3.2rem;
}
.logo-pp{
	display: block;
	height: 1.6rem;
}
@media screen and (min-width: 768px) {
	.logo{
		height: 3.5rem;
	}
	.logo-pp{
		height: 2.2rem;
	}
}

.my-5{
    margin-left: 3rem;
}



.menu{
	display: flex;
	flex-direction: column;
	margin-block: 2rem;
	gap: 3rem;
	align-items: center;
	justify-content: center;
}
.menu a{
	text-decoration: none;
	color: #ffffff;
}
.nav-icon{
	display: block;
	border: 1px solid rgba(255, 255, 255, 0.3);
	padding: 0.3rem;
	border-radius: 0.3rem;
}
@media screen and (min-width: 768px) {
	.menu{
		flex-direction: row;
		margin-block: 0;
	}
}
@media screen and (max-width: 768px) {
	.menu{
		display: none;
	}
	.menu.active{
		display: flex;
	}
}



.lp{
	overflow: hidden;
}
#lp-slider{
	overflow: hidden;
}
#lp-slider img{
	display: block;
	width: 100%;
	object-fit: cover;
	object-position: center;
	height: 80svh;
	border-end-start-radius: 3rem;
	border-end-end-radius: 3rem;
}


.lp-bp-container{
	position: absolute;
	bottom: 20svh;
	background-color: rgba(0, 0, 0, 0.75);
	backdrop-filter: blur(2px);
	padding: 0.8rem 2rem;
	width: 100%;
	border-end-start-radius: 3rem;
	border-end-end-radius: 3rem;

}
.lp-bp{
	display: block;
	color: #ffffff;
}
@media screen and (min-width: 768px) {
	#lp-slider img{
		height: 80svh;
	}
	.lp-bp{
		display: flex;
		align-items: center;
		justify-content: space-between;

	}
}


.lp-bp .price{
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--colorPrimary);
	color: var(--colorPrimary-text);
	padding: 0.1rem 1rem;
	font-size: 1.2rem;
	border-radius: 50rem;
}
.lp-bp .price span{
	font-size: 2rem;
	font-weight: 600;
	padding-left: 0.5rem;
}
.lp-highlights{
	margin: 0;
	padding: 0;
}
@media screen and (min-width: 769px) {
	.lp-bp .price{
		padding: 0.1rem 2rem;
	}
	.lp-highlights{
		width: 60%;
	}	
	.lp-bp .price span{
		font-size: 2.3rem;
	}
}
@media screen and (min-width: 1150px) {
	.lp-highlights{
		width: 70%;
	}
}
.lp-highlights div{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	font-size: 0.9rem;
}
.lp-highlights img{
	height: 3rem;	
}
.lp-highlights p{
	margin: 0;
	padding: 0;
}
.lp-pp-pick-line{
	position: absolute;
	bottom: 55%;
	width: 100%;
	display: block;
	padding-inline: 1rem;
	padding-right:5svw;
	font-weight: 600;
	text-align: right;
	font-size: 1.3rem;
	color: #ffffff;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
@media screen and (min-width: 768px) {
	.lp-pp-pick-line{
		bottom: 37svh;
		font-size: 1.8rem;
		padding-right:10svw;
	}
}
@media screen and (min-width: 1215px) {
	.lp-pp-pick-line{
		bottom: 32svh;
	}
}


.as-sec{
	padding-block: 3rem;
}
.asl{
	height: 4.5rem;
}
.asl-m{
	height: 3rem;
}
.asif{
	width: 100%;
	height: 100%;
	min-height: 20rem;
	border-radius: 1.5rem;
	overflow: hidden;
}
@media screen and (min-width: 768px) {
	.asif{
		width: 90%;
		height: 100%;
		aspect-ratio: 16/9;
	}
}
.pp-services{
	display: flex;
}
.pp-services .info{
	display: flex;
	flex: 1;
	gap: 1rem;
	flex-direction: column;
	align-items: center;
	font-weight: 500;
	text-transform: capitalize;
	padding: 0.5rem;
	text-align: center;
	font-size: 0.9rem;
}
.pp-services .info:first-child{
	padding-left: 0;
}
.pp-services .info:not(:last-child){
	border-right: 2px solid var(--colorPrimary);
}
.pp-services .info img{
	max-height: 3rem;
}
@media screen and (min-width: 768px) {
	.pp-services{
		flex-direction: column;
		margin-top: 1rem;
	}
	.pp-services .info{
		flex-direction: row;
	}
	.pp-services .info:first-child{
		padding-left: 0.5rem;
	}
	.pp-services .info:not(:last-child){
		border: none;
	}
	.pp-services .info img{
		max-width: 2rem;
	}
}


.about-card iframe{
	display: block;
	margin-inline: auto;
	width: 90%;
	height: 100%;
	aspect-ratio: 9/16;
	max-height: 45rem;
	border-radius: 1.5rem;
}

/* Virtaul Tour */
.vt{
	max-width: 100%;
	aspect-ratio: 16/9;
	border-radius: 1.5rem;
	overflow: hidden;
	cursor: pointer;
	min-height: 20rem;

	position: relative;
}
.vt img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.vt iframe, .vt div{
	width: 100%;
	height: 100%;
}
.vt .head{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 0.75rem;
	background-color: rgba(0, 0, 0, 0.6);
	backdrop-filter: blur(5px);
	color: #ffffff;
	text-align: center;
	font-size: 1.2rem;
}
.vt .icon{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	background-color: rgba(0, 0, 0, 0.6);
	backdrop-filter: blur(5px);
	padding: 0.3rem;
	border-radius: 100%;
}
.vt .icon img{
	width: 3rem;
	aspect-ratio: 1;
	border-radius: 100%;
	padding: 0.8rem;
	outline: 1px solid #ffffff;
	min-height: unset;
}
@media screen and (min-width: 768px) {
	.vt{
		max-width: 90%;
	}
}


.location-list{
	list-style: none;
	margin: 0;
	padding: 0;
	margin-top: 3rem;
}
.location-list li{
	display: flex;
	justify-content: space-between;
	margin-block: 1.5rem;
}
.loc-img {
	border-radius: 1.5rem;
	overflow: hidden;
/*	height: 100%;*/
}
.loc-img img{
	display: block;
	width: 100%;
	height: 20rem;
	object-fit: cover;
	object-position: center;
	cursor: zoom-in;
}
@media screen and (min-width: 768px) {
	.loc-img img{
		height: 75svh;
	}
}
.acc-loc-head.collapsed{
	background-color: transparent;
	color: var(--colorProject);
	border: 1px solid var(--colorProject);
	font-weight: 600;
}
.acc-loc-head:not(.collapsed){
	background-color: color-mix(in lab, var(--colorProject) 25%, #ffffff);
	color: var(--colorProject);
	border: 1px solid var(--colorProject);
	font-weight: 600;
}
.acc-loc-head img{
	height: 2.5rem;
	aspect-ratio: 1;
	margin-right: 1rem;
}


.fp-sec .nav-pills{
	border: 1px solid var(--colorProject);
	border-radius: 100rem;
	padding: 0.5rem 1rem 1rem;
	justify-content: space-evenly;
}
.fp-sec .nav-pills .nav-link{
	background-color: transparent;
	color: inherit;
	font-weight: 500;
	font-size: 1.8rem;
	border-radius: 0;
	padding-bottom: 0;
}
.fp-sec .nav-pills .nav-link.active{
	color: var(--colorPrimary);
	border-bottom: 3px solid var(--colorPrimary);
}
@media screen and (max-width: 768px){
	.fp-sec.sec-pd{
		padding-inline: 0;
	}
	.fp-sec .nav-pills{
		flex-direction: row;
		gap: 0;
	}
	.fp-sec .nav-pills .nav-link{
		font-size: 1.2rem;
	}
}

.fp-img{
	position: relative;
	width: 95%;
	margin-inline: auto;
	border-radius: 1.5rem;
	overflow: hidden;
}


.fp-img img{
	width:100%;
	object-fit: 100%;
	object-position: center;
	height:20rem;
    cursor: zoom-in;
}
.fp-img .fp-title{
	position: absolute;
	left: 1rem;
	bottom: 1rem;
	font-weight: 600;
	font-size: 1.4rem;
	text-transform: capitalize;
	background-color: rgba(255, 255, 255, 0.8);
	backdrop-filter: blur(5px);
	padding: 0.4rem 1.2rem;
}
@media screen and (min-width: 768px){
	.fp-img img{
		height:70svh;
	}
}


.sec-price .table{
	max-width: 70rem;
	margin-inline: auto;
	border-radius: 1.5rem;
	overflow: hidden;
	outline: 1px solid var(--colorProject);
	margin-top: 2rem;
}

.sec-price .table{
	text-align: center;
	--bs-table-striped-bg: #ffffff;
	--bs-table-bg: color-mix(in lab, var(--colorProject) 10%, #ffffff);
	
}
.sec-price .table thead th{
	background-color: var(--colorProject);
	color: var(--colorProject-text);
	font-size: 1.1rem;
	font-weight: 500;
	padding: 0.8rem 0.5rem;
}
.sec-price .table td{
	padding: 1.4rem 0.5rem;
    width: 25%;
}
.sec-price .table td.price{
	font-weight: 600;
	font-size: 1.2rem;
}
.sec-price .table .price-btn{
	text-transform: uppercase;
	font-size: 10px;
	font-weight: 600;
}


.ami-icon{
	display: flex;
	align-items: center;
	gap: 1rem;
	text-transform: capitalize;
}

.ami-icon .icon{
	background-color: color-mix(in lab, var(--colorProject) 10%, #ffffff);
	border-radius: 100%;
	width: 6rem;
	aspect-ratio: 1;

	display: flex;
	align-items: center;
	justify-content: center;	
}

.ami-icon .icon img{
	width: 5rem;
	max-height: 5.5rem;
}
.ami-list{
	list-style: none;
	margin: 0;
	padding: 0;
	text-transform: capitalize;
}
.ami-list li{
	display: flex;
	justify-content: space-between;
	margin-block: 1.5rem;
}
.ami-icon span{
	display: block;
	width: 100%;
}


.gal-img{
	display: block;
	width: 100%;
	height: 125px;
	object-fit: cover;
	object-position: center;
	border-radius: 1.5rem;
	cursor: zoom-in;
}
@media screen and (min-width: 768px){
	.gal-img{
		height: 35svh;
		max-height: 25rem;
	}
}
.gal-sec .nav-pills{
	border: 1px solid var(--colorProject);
	border-radius: 100rem;
	max-width: 70rem;
	margin-inline: auto;
}
.gal-sec .nav-pills .nav-item{
	flex: 1;
	border-radius: 100rem;
	display: flex;
	justify-content: center;
	align-items: center;
}
.gal-sec .nav-pills .nav-item:has(> .nav-link.active) {
	background-color: var(--colorProject);
}
.gal-sec .nav-pills .nav-link{
	background-color: transparent;
	color: inherit;
	font-weight: 500;
	font-size: 1.8rem;
	border-radius: 0;
	padding-bottom: 0;
	text-align: center;
	padding: 0;
	text-transform: uppercase;
	padding-block: 0.3rem;
	color: var(--colorProject);
}
.gal-sec .nav-pills .nav-link.active{
	color: var(--colorProject-text);
}
@media screen and (max-width: 768px){
	.gal-sec .nav-pills{
		flex-direction: row;
		gap: 0;
	}
	.gal-sec .nav-pills .nav-link{
		font-size: 1.2rem;
	}
}
.btn-colorPrimary{
	background-color: var(--colorPrimary);
	color: var(--colorPrimary-text);
	font-weight: 500;
	padding: 0.5rem 2.5rem;
	border-color: transparent;
}



.rera-sec .accordion-item{
	border: none;
}
.rera-sec .head{
	font-weight: 600;
	font-size: 1.6rem;
}

.rera-sec .accordion-button.collapsed::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170.667' height='170.667' fill='Darkorange' viewBox='0 0 128 128' preserveAspectRatio='xMidYMid meet'><path d='M56 28v28H28 0v8 8h28 28v28 28h8 8v-28-28h28 28v-8-8h-28-28V28 0h-8-8v28z'/%3E%3C/svg%3E");
}
.rera-sec .accordion-button:not(.collapsed){
	background-color: color-mix(in lab, var(--colorPrimary) 10%, #ffffff);
	color: var(--colorPrimary);
}
.rera-sec .accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='85.333' height='85.333' fill='Darkorange' viewBox='0 0 64 64' preserveAspectRatio='xMidYMid meet'><path d='M0 32v4h32 32v-4-4H32 0v4z'/%3E%3C/svg%3E");
}
.rera-p{
	font-weight: 600;
	text-align: center;
}
.disclaimer-p{
	font-size: 9px;
	letter-spacing: 0;
	color: rgba(0, 0, 0, 0.8);
}

#qr-slider{
	max-width: 50rem;
	margin-inline: auto;
}



/* LP Form */
@media screen and (min-width: 768px){
	.lp-form{
		position: absolute;
		top: 35%;
		right: calc(3svw + 5%);
		transform: translateY(-50%);
		background-color: rgba(255, 255, 255, 0.85);
		backdrop-filter: blur(5px);
		border-radius: 1.5rem;
		max-width: 20rem;
	}
}


/* Form */
.pg-form{
	display: flex;
	padding: 0.5rem;
	text-align: center;
	gap: 0.5rem;
	border-radius: 1.2rem;
}
.lp-form .pg-form form{
	border-radius: 1rem;
	border: 1px solid var(--colorProject);
	padding: 1rem;
}
@media screen and (max-width: 768px){
	.lp-form form{
		margin-inline: auto;
		background-color: #ffffff;
		margin-top: 1.5rem;
		width: 95%;
	}
}
.pg-form .head{
	font-weight: 700;
	color: var(--colorProject);
}
.pg-form input{
	background-color: transparent;
	border-radius: 0;
	border: none;
	border-bottom: 1px solid;
}
.pg-form button{
	letter-spacing: 1.5px;
}
.modal .pg-form .pp-services .info{
	text-align: left;
}
@media only screen and (max-width: 768px) {
	.modal .pg-form .pp-services .info{
		text-align: center;
	}
}


/* Pricing table fix */
@media only screen and (max-width: 991px) {
	table.table-pricing , .table-pricing thead, .table-pricing tbody, .table-pricing th, .table-pricing td, .table-pricing tr {
		display: block;
	}
	.table-pricing thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	.table-pricing tr {
	  margin: 0;
	  padding: 10px 0;
	} 
	.table-pricing tr:nth-child(odd) {
	  background: #fff;
	}
	.table-pricing td {
		border: none;
		position: relative;
		text-align: center;
		padding: 3px;
	}
	.table-pricing td:before {
		position: absolute;
		top: 0;
		left: 6px;
		width: 45%;
		padding-right: 10px;
		white-space: nowrap;
	}

	.sec-price .table td{
	    padding: 0;
	    font-size: 1.2rem;
	    width: 100%;
	}
	.sec-price .table td:nth-child(1){
		font-size: 1.8rem;
	}
	.sec-price .table td:nth-child(3){
		font-size: 1.8rem;
		font-weight: 600;
	}
}




@media screen and (max-width: 1280px), 
       screen and (max-height: 680px) {

  #lp-slider img{
  	height: 95svh;
  }

  .lp-bp-container{
  	bottom: 5svh;
  }

  .lp-form{
    top: 47%;
  }

  .lp-pp-pick-line{
  	bottom: 28svh;
  }

}

.iti { width: 100%; }




.floter-actions{
	position: fixed;
	right: 0.5rem;
	bottom: 1rem;

	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	justify-content: center;
	z-index: 9;

	transition: bottom 2s;
}
.floter-actions a{
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 1rem;
	border-radius: 3rem;
	text-decoration: none;
	color: #ffffff;
	background-color: var(--colorPrimary);
	font-weight: 700;
	text-transform: uppercase;
	width: 4rem;
	height: 4rem;
	overflow: hidden;
	transition: width 2s ease-in;
}
.floter-actions a:hover{
	width: auto;
}
.floter-actions a img{
	display: block;
	width: 2rem;
	aspect-ratio: 1;
}
.floter-actions a:hover .title{
	display: block;
}
@media only screen and (min-width: 768px) {
	
	.floter-actions.desk-pos{
		bottom: 35%;
	}
}


.blur{
	filter: blur(5px);
}