@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');



:root {

  --primary-color: #fcfbf8;

  --primary-light-color: #101538;

  --secondary-color: #dcc081;

  --third-color: #896f36;

  --body-color: #2b2b2b;

  --blue: #003921;

  /* --logo-clr1: #f35ba2;

  --logo-clr2: #fde070;

  --logo-clr3: #6cc5ec; */

  --light: #f8fcff;

  --facebook: #4267B2;

  --twitter: #00acee;

  --linkedin: #0e76a8;

  --youtube: #FF0000;

  --whatsapp: #25D366;

  --instagram: #c92bb7;

  --primary-radius: 10px;

  --midsun: 'midsun', serif;

  --sans: "Roboto", sans-serif;

  --gradient: linear-gradient(89.69deg, var(--third-color) -108.92%, var(--secondary-color) -74.54%, var(--secondary-color) -32.86%, var(--third-color) -10.98%, var(--secondary-color) 52.66%, var(--third-color) 99.46%);

}



body {

  color: var(--body-color);

  background-color: var(--primary-color);

  font: 400 1rem "Roboto", sans-serif;

  overflow-x: hidden;

}



.rounded{

  border-radius: var(--primary-radius) !important;

}



.table td,

.table th{

  padding: 1.25rem 1rem 1rem;

}



.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{

  font-family: var(--midsun);

  letter-spacing: 1px;

}



p {

  line-height: 1.5;

}



.padding {

  padding-top:7rem;

  padding-bottom:7rem;

}



ul {

  padding-left: 0;

  margin-bottom: 0;

}



a,

a:hover {

  text-decoration: none;

}



img, video, iframe {

  width: 100%;

  display: block;

  /* border-radius: 0 1rem 0 0; */

}



.gap-row{

  row-gap: 30px;

}



.object-cover {

  object-fit: cover;

}



.container-fluid{

    padding-left: 2rem;

    padding-right: 2rem;

}



.filter-white {

  -ms-filter: brightness(70);

  filter: brightness(70);

}



.filter-dark {

  -ms-filter: grayscale(1) brightness(0.5);

  filter: grayscale(1) brightness(0.5);

}



.icon-circular {

    width: 40px;

    height: 40px;

    font-size: 14px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    color: var(--body-bg);

    background-color: var(--primary-color);

    transition: all 300ms ease-in-out;

}

.icon-circular:hover {

  background-color: #fff;

}



/*header*/

.header {

  padding: 5px;

  position: fixed;

  top: 0;

  z-index: 999;

  transition: all 300ms ease-in-out;

}



.header.fixed {

  padding-top: 5px;

  background-color: var(--primary-color);

  border-bottom: 1px solid hsla(0, 0%, 100%, 0.08);

  box-shadow: 0 10px 20px rgb(0 0 0 / 15%);

}



.header .d-grid{

  display: grid;

  grid-template-columns: 200px 1fr;

  justify-content: space-between;

  align-items: center;

  gap: 10px;

  transition: all 300ms ease-in-out;

}



.header.fixed .d-grid{

  grid-template-columns: 120px 1fr;

}



.header ul,

.topDetails ul {

  display: flex;

  align-items: center;

}

.topDetails ul{

  justify-content: flex-end;

}



.navi ul li {

  margin-right: 40px;

}



.navi ul li:last-child,

.topDetails ul li:last-child {

  margin-right: 0px;

}



.header li,

.menuBtn {

  text-transform: uppercase;

  font-size: 13px;

  letter-spacing: 1px;

  font-weight: 400;

}



.header a,

.menuBtn {

  display: table;

  color: #fff;

  height: 26px;

  overflow: hidden;

  padding-top: 5px;

  padding-bottom: 5px;

  transition: all 300ms ease-in-out;

  position: relative;

}



.header a div,

.menuBtn div {

  display: inline-block;

  position: relative;

  transition: all 300ms ease-in-out;

  color: #ffffff;

}



.header a .link-hover-hover,

.menuBtn .link-hover-hover {

  left: 0;

  position: absolute;

  transform: translateY(40px);

  color: #ffffff;

}

.fixed.header a .link-hover-hover, .fixed.header a div{

  color: #000;

}

.header a:hover .link-hover-text,

.menuBtn:hover .link-hover-text {

  transform: translateY(-40px);

}



.header a:hover .link-hover-hover,

.menuBtn:hover .link-hover-hover {

  transform: translateY(0px);

}



.menuBtn {

  border: none;

  background: none;

  padding: 0;

  position: relative;

  z-index: 1;

  text-align: left;

}



.menuBtn div {

  padding-right: 25px;

}



i.arrow-down {

  position: absolute;

  right: 5px;

  top: 2px;

  width: 8px;

  height: 8px;

  border-style: solid;

  border-width: 0 0 1px 1px;

  transform: rotate(-45deg);

}



i.arrow-down.arrow-up {

  transform: rotate(135deg);

  top: 5px;

}



.logo {

  position: relative;

  min-height: 1px;

  transition: all 300ms ease-in-out;

  overflow: hidden;

    filter: brightness(100.5);

}

.header.fixed .logo {

    filter:none;

}



.logo a {

  height: 100%;

  padding: 0;

  display: block;

}



.logo a img {

  transition: all 300ms ease-in-out;

}



.enqBtn a {

  padding: 0;

  border-radius: 40px;

  background: var(--gradient);

  color: #fff;

}

.enqBtn a div {

  padding: 10px 20px;

}



.header .enqBtn a div {

}



.topDetails ul li{

  margin-right: 10px;

}



.callBtn, .socialBtn{

  max-width: 40px;

  height: 40px;

  flex: 0 0 40px;

}

.callBtn a {

	display: block;

	width: 35px;

	height: 35px;

	line-height: 35px;

	border-radius: 50%;

	font-size: 20px;

	text-align: center;

	background: #faf7f2;

	color: var(--primary-color);

	box-shadow: 0 0 0 1px rgba(61, 251, 105, 0.45), 0 0 0 5px rgba(33, 164, 40, 0.63), 1rem 1rem 2rem rgb(0 0 0 / 25%);

	animation: enq 2s cubic-bezier(0.55, 0.76, 0.27, 1.29) infinite;

	position: relative;

	z-index: 1;

}



.callBtn a:nth-child(2) {

	animation-delay: 0.5s;

	margin-bottom: 0;

	box-shadow: 0 0 0 1px rgba(61, 127, 251, 0.45), 0 0 0 5px rgb(11 107 235 / 63%), 1rem 1rem 2rem rgb(0 0 0 / 25%);

}



@keyframes enq {

	50% {

		box-shadow: 0 0 0 1px rgba(61, 127, 251, 0.45),

			0 0 0 0px rgb(11 107 235 / 63%), 1rem 1rem 2rem rgb(0 0 0 / 25%);

	}

}

.statsBox p

{

  text-transform: uppercase;

}

.callBtn a,

.socialBtn,

.socialBtn ol li a {

  width: 40px;

  height: 40px;

  line-height: 38px;

  text-align: center;

  position: relative;

  border-radius: 50%;

  padding: 0;

  cursor: pointer;

}



.callBtn a{

    background-color: rgb(255 255 255);

    color: #4d3325;

}

.header.fixed .callBtn a {

    background-color: var(--blue);

    color: #ffffff;

}

.callBtn a:hover{

  color:#000;

  background-color: var(--light);

}



.socialBtn {

  background-color: var(--secondary-color);

  color: var(--body-color);

  transition: all 400ms ease;

}

.socialBtn:hover {

  background-color: #fff;

  color: var(--body-color);

}



.socialBtn ol {

  position: absolute;

  left: 0;

  width: 100%;

  pointer-events: none;

}



.socialBtn:hover ol {

  pointer-events: auto;

}



.socialBtn ol li {

  opacity: 0;

  visibility: hidden;

  transform: translateY(calc(10px * var(--i)));

  transition: all calc(150ms * var(--i)) ease-in-out;

}



.socialBtn:hover ol li {

  opacity: 1;

  visibility: visible;

  transform: translateY(0);

  margin: 5px 0;

}



.socialBtn ol li a {

  display: block;

  background-color: #fff;

  color: var(--body-color);

  transition: all 300ms ease-in-out;

  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.27);

}

.socialBtn ol li a:hover {

  background-color: var(--primary-color);

  color: #fff;

}

/*header*/



.banner {

  height: 100vh;

  position: relative;

  background: var(--primary-color);

  z-index: 1;

}



.banner .carousel-item::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  height: 100px;

  width: 100%;

  background: rgb(0 0 0 / 20%);

  background: linear-gradient(180deg, #0b3c6d, #4f779f, transparent);

  z-index: 1;

}



.banner .container{

  position: absolute;

  top: 0;

  left: 50%;

  transform: translateX(-50%);

  padding-top: 8rem;

  display: flex;

  flex-direction: column;

  justify-content: center;

  z-index: 9;

}



.bannerText {

  max-width: 600px;

  width: 75%;

  color: #fff;

}



.bannerText .h1 {

  font-size: 3.75rem;

  text-transform: uppercase;

  position: relative;

  padding: 1px 0;

}



.bannerBottom{

	position:absolute;

	bottom:20px;

	right:20px;

	display:flex;

	justify-content:space-between;

	align-items:center;

	z-index:9;

}



.bannerControlsContainer{

	display:flex;

	align-items:center;

}



.bannerControlsContainer .carousel-indicators{

	position:static;

	align-items:center;

	margin-right:0px;

	margin-left:0;

}



.bannerControlsContainer .carousel-indicators li{

	width:auto;

	height:auto;

	background-color:transparent;

	opacity:1;

	color:#fff;

	margin:0 20px;

	text-indent:inherit;

	border-top:1px solid transparent;

	border-bottom:1px solid transparent;

	font-weight:600;

	font-size:12px;

	transition:all 300ms ease-in-out;

}



.bannerControlsContainer .carousel-indicators li:hover, .bannerControlsContainer .carousel-indicators .active{

	border-bottom-color:#fff;

}



.bannerControlsContainer .bannerControl{

	display:flex;

	align-items:center;

	justify-content:center;

}



.bannerControlsContainer .bannerControl >span{

	width:120px;

}



.bannerControlsContainer .bannerControl .carousel-control-next.banner-next, 

.bannerControlsContainer .bannerControl .carousel-control-prev.banner-prev{

	position:static;

	top:auto;

	width:40px;

	height:40px;

	border-radius:5px;

	margin:0 5px;

	opacity:1;

	z-index:9;

}



.carousel-control-next.banner-next .carousel-control-next-icon, .carousel-control-prev.banner-prev .carousel-control-prev-icon{

	background-size:60%;

}



.carousel-control-next.banner-next:hover, .carousel-control-prev.banner-prev:hover{

	background-color:var(--facebook);

}



.scrollDown{

	position:absolute;

	left:calc(50% - 15px);

	bottom:20px;

	width:30px;

	cursor:pointer;

	z-index:9;

  animation: bounce 1s alternate infinite;

}



@keyframes bounce {

  100% {

    bottom:10px;

  }

}



/* overview */

.sideImg .inner{

  position: relative;

  width: 85%;

  margin-left: auto;

  margin-right: auto;

}



.sideImg .heading.position-absolute{

  left: 0;

  transform: translateX(-25%);

}



/* overview */



.banner-points > div + div{

  border-left: 1px solid rgb(255 255 255 / 15%);

}



.banner-points p{

  text-transform: uppercase;

  letter-spacing: 2px;

  line-height: 1.5;

  color: #fff;

}





.banner-points li + li{

  padding-left: 10px;

  margin-left: 10px;

}



.stats{

  margin-top: 4rem;

}



.stats li{

  flex: 1 0 0;

}



.stats li h2{

  font-weight: 700;

}



.stats li i{

  font-size: 1.25rem;

}



/* Characterstics */

.charBox:nth-child(2n-1) .inner{

  margin-top: 100%;

}



.charBox .heading h6{

    background-color: rgb(77 51 37);

    width: 30px;

    height: 30px;

    border-radius: 50%;

    color: #fff;

    text-align: center;

    align-items: center;

    display: flex;

    justify-content: center;

    display: none;

}



.charBox img{

  aspect-ratio: 1/1;

  object-fit: cover;

  box-shadow: 0 0 2px #ccc;

  border-radius: 0 1rem 0 0;

}

.sideImg img

{

  border-radius: 0 1rem 0 0;

}

.hm-project-section img

{

  border-radius: 1rem;



}

.characterSlider{

  padding-left: 3.75rem;

  padding-right: 3.75rem;

}



.charSlide{

  width: 40%;

}



.charSlide .img-fluid{

  padding: 0 8%;

  transform: scale(.75,.75);

  transition: all 300ms linear;

}



.charSlide.swiper-slide-active .img-fluid{

  transform: scale(1,1);

}



.swiper-slide-shadow-left, .swiper-slide-shadow-right{

  display: none;

}



.charSlide .imgBox{

  position: relative;

  overflow: hidden;

  z-index: 1;

}



.charSlide img{

  height: 500px;

  object-fit: cover;

}



.charSlide .caption{

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%,-50%);

  width: max-content;

  color: var(--secondary-color);

  font-family: initial;

  font-size: 4em;

  text-transform: uppercase;

  z-index: -1;

  opacity: 0;

  text-align: center;

  text-shadow: 0px 0px 13px #000;

}

.charSlide.swiper-slide-active .caption{

  opacity: 1;

}



.charSlide .imgBox .caption{

  color: #fff;

  z-index: 1;

  text-shadow: 0px 0px 16px #000;

}

/* Characterstics */



.random-section > .row{

  min-height: 450px;

}



/* Amenities */

.amenities-grid {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 30px;

}



.amenity-item {

    background-color: rgb(255 255 255 / 15%);

    backdrop-filter: blur(10px);

    padding: 25px;

    text-align: center;

    box-shadow: 0px 0px 1px #000;

    transition: all 0.3s;

}



.amenity-item:hover {

    transform: translateY(-3px);

    box-shadow: 0 0 0 1px var(--secondary-color);

    background-color:#4d3325;

    color: var(--body-color);

}



.amenity-icon {

    width: 50px;

    height: 50px;

    background-color: var(--primary-color);

    border-radius: 50%;

    padding: 8px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 0 auto 15px;

    font-size: 20px;

}



.amenity-item span {

    font-weight: 700;

    text-transform: capitalize;

    color: #fff;

}

/* Amenities */





/* Video and growth */

.modal-title{

  font-weight: 700;

  color: var(--primary-color);

}



/* Location */

.location-box .inside{

  padding-bottom: 1rem;

  border-bottom:1px solid rgb(0 0 0 / 15%);

}

/* Location */









.viewmore {

  width: 100%;

  margin-top: 1.25rem;

}



.viewmore a {

  text-transform: uppercase;

  color: var(--body-color);

  font-size: 75%;

  font-weight: 600;

}



.viewmore a i {

  color: var(--primary-color);

}



.viewmore a:hover {

  color: var(--primary-color);

}



.heading {

  position: relative;

  margin-bottom: 30px;

  z-index: 1;

  font-family: initial;

}



.heading.border-bottom{

  border-bottom-width: 2px !important;

}



.icon-dots{

  width: 40px;

  margin: 2rem 0;

}



.line{

  width: 40px;

  height: 1px;

  background-color: var(--secondary-color);

  margin: 2rem 0;

}



.heading h2,

.heading h4,

.heading h5,

.heading h6 {

  display: block;

}



.heading .h1 {

  color: var(--secondary-color);

  background: var(--gradient);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  font-size: 3.25rem;

  text-transform: uppercase;

  letter-spacing: 1px;

    letter-spacing: 3px;

}



.heading .h1.text-white {

  background: none;

  -webkit-background-clip: none;

  -webkit-text-fill-color: inherit;

}



.heading h3 {

  font-weight: 500;

    font-size: 2rem;

}



.heading h6 {

  font-weight: 400;

  letter-spacing: 2px;

}



.text-serif{

  font-family: var(--midsun);

  letter-spacing: 2px;

}



.text-sans{

  font-family: var(--sans);

  letter-spacing: normal;

}



.text-primary{

  color: var(--primary-color) !important;

}

.text-secondary{

	color:var(--secondary-color) !important;

}



.text-gradient {

  background: var(--gradient);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

}



.bgimhembrace

{

  position: relative;

    display: flex;

    align-items: center;

}



.bgimhembrace::before

{

  content: '';

  background: url(../images/jbg.webp) no-repeat;

  width: 100%;

  height: 60%;

  position: absolute;

  background-size: contain;

  background-position: bottom;

  opacity: 0.1;

  filter: grayscale(1);

  pointer-events: none;

  z-index: -1;

}

.bg-primary{

  background-color: var(--primary-color) !important;

}



.bg-secondary{

  background-color: var(--secondary-color) !important;

  color: var(--body-color);

}



.bg-blue{

  background-color: var(--blue) !important;

}



.bg-light{

    background-color: var(--light) !important;

}



.bg-light-gray{

  background-color: var(--light-gray) !important;

}



.bg-sec {

    background: url(../images/bg.png) center / cover;

}



.bg-image{

  background: center / cover no-repeat fixed;

}



.bg-image::before{

  content: '';

  position: absolute;

  inset: 0;

  background-color: rgb(0 0 0 / 70%);

  z-index: -1;

}



.scroller{

  overflow: auto;

}



.scroller::-webkit-scrollbar {

  width: 5px;

}



/* Track */

.scroller::-webkit-scrollbar-track {

  box-shadow: inset 0 0 5px var(--light);

  border-radius: 10px;

}



/* Handle */

.scroller::-webkit-scrollbar-thumb {

  background: var(--secondary-color);

  border-radius: 10px;

}



/* Handle on hover */

.scroller::-webkit-scrollbar-thumb:hover {

  background: #000;

}



.readmore {

  width: 100%;

  margin-top: 2rem;

}



.readmore .button {

  position: relative;

  z-index: 1;

  display: table;

  padding: 0.75rem 1.25rem;

  border-radius: 40px;

  background: var(--gradient);

  color: #fff;

  min-width: 140px;

  font-size: 13px;

  text-align: center;

  text-transform: uppercase;

  transition: all ease-in-out 0.3s;

}



.readmore button {

  width: 100%;

  background: none;

}



.readmore .button:hover {

  color: var(--body-color);

  background: var(--secondary-color);

  border-color: transparent;

}



.readmore .button.text-white{

  border-color: #fff;

}



.readmore .button.text-white:hover {

  color: var(--primary-color) !important;

  background-color: #fff;

  border-color: transparent;

}



.readmore .button.solid.white:hover,

.readmore .button.solid {

  background-color: var(--primary-color);

  color: var(--light);

  border: none;

}



.readmore .button.solid.white,

.readmore .button.solid:hover {

  background-color: var(--light-gray);

  color: var(--primary-color);

  border: none;

}



.controls {

  position: absolute;

  width: 110px;

  height: 40px;

  right: 10px;

  bottom: 10px;

  z-index: 9;

}



.controls a {

  position: static;

  display: table;

  width: 100%;

  height: 50px;

  line-height: 50px;

  cursor: pointer;

  text-align: center;

  color: var(--primary-color);

  font-size: 13px;

  border-bottom: 1px solid rgb(0 0 0 / 20%);

  opacity: 1;

}



.controls a:last-child {

  border-bottom: none;

}



.controls a:focus,

.controls a:hover {

  color: var(--primary-color) !important;

  opacity: 1;

}



.multiply{

  mix-blend-mode: multiply;

}



.position-relative{

  z-index: 1;

}



/* custom swiper controls */

div[class^='swiper-button']{

  width: 40px;

  height: 40px;

  margin-top: -20px;

  border-radius: 50%;

  background-color: transparent;

  color: #fff;

  background-color: var(--blue);

  transition: all 300ms ease-in-out;

}



div[class^='swiper-button']:hover{

  background-color: var(--body-color);

  color: #fff;

  box-shadow: 0 10px 2rem rgb(0 0 0 / 10%);

}



div[class^='swiper-button']:after{

  color: inherit;

  font-size: 13px;

}



div[class^='swiper-button'].lg{

  width: 60px;

  height: 60px;

  margin-top: -30px;

  color: #fff;

  border: 1px solid rgb(255 255 255 / 20%);

}



div[class^='swiper-button'].lg:hover{

  backdrop-filter: blur(5px) brightness(2);

  border-color: transparent;

}



div[class^='swiper-button'].lg:after{

  font-size: 1rem;

  font-weight: 100;

  color: #fff;

}



div[class^='swiper-button'].stroke{

  background-color: transparent;

  box-shadow: 0 0 0 1px rgb(255 255 255 / 50%) inset;

}



div[class^='swiper-button'].stroke:hover{

  box-shadow: 0 0 0 100px rgb(255 255 255 / 100%) inset;

  color: var(--body-color);

}



.swiper-controls{

  position: relative;

  margin: 2rem auto 0;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 10px;

}



.swiper-controls div[class^="swiper-"]{

  position: static;

  margin-top: 0;

}



.topBtn{

  top: 25%;

}



.bottomBtn{

  top: 80%;

}



.heading .d-flex{

  gap: 10px;

}

.heading .swiper-button-next, .heading .swiper-button-prev{

  position: static;

  margin-top: 0;

}



.swiper-button-next:hover, .swiper-button-prev:hover{

    scale: 1.2;

}



.bottom-control{

  top: calc(100% - 1.5rem);

}



.bottom-control.swiper-button-next{

  right: 13%;

}

.bottom-control.swiper-button-prev{

  left: 13%;

}



.swiper-pagination{

  bottom: 0 !important;

}



.swiper-pagination-bullet-active{

  background-color: var(--primary-color);

  width: 20px;

  border-radius: 10px;

}



.bar-controls{

  display: flex;

  position: relative;

  align-items: center;

  justify-content: space-between;

  padding: 10px;

}



.bar-controls .bar-arrows{

  position: relative;

  width: 100px;

  display: flex;

  align-items: center;

  gap: 10px;

}



.bar-controls .bar-arrows > div{

  position: static !important;

  margin-top: 0 !important;

  width: 40px;

  height: 40px;

  background-size: 22px;

}



.bar-controls .swiper-horizontal>.swiper-pagination-progressbar,

.bar-controls .swiper-pagination-progressbar.swiper-pagination-horizontal{

  position: static;

  width: calc(100% - 120px);

}



.bar-controls .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{

  background: linear-gradient(45deg,var(--secondary-color),var(--primary-color),var(--secondary-color));

}

/* custom swiper controls */



/* custom carousel controls */

button[class^='carousel-control']{

  width: 40px;

  height: 40px;

  top: 50%;

  bottom: auto;

  margin-top: -20px;

  border-radius: 50%;

  opacity: 1;

  background-color: var(--primary-color);

  color: #000;

  transition: all 300ms ease-in-out;

}

button[class^='carousel-control']:hover{

  background-color: var(--secondary-color);

}



button[class^='carousel-control'] span[class^='carousel-control']{

  filter: invert(1);

  width: 1.25em;

}



.carousel-control-next {

  right: 2rem;

}

.carousel-control-prev {

  left: 2rem;

}

/* custom carousel controls */



/*Footer*/

.footer-area {

  background-color: var(--blue);

  color: #fff;

}



.footer-area::before {

  content: '';

  height: 4px;

  width: 100%;

  position: absolute;

  top: 0;

  z-index: -1;

  background-image: var(--gradient);

}



.footer-area a {

  display: inline-block;

  color: #ffffff;

  font-size: .875rem;

  padding: 5px 0;

}



.footer-area p {

  font-size: .875rem;

  color: #ffffff;

}



.footer-area a:hover {

  color: var(--secondary-color);

}



.foot-logo img {

  max-width: 170px;

  margin-bottom: 1rem;

  filter: brightness(30.5);

}



.footer-links {

  margin: 5rem 0;

  position: relative;

  z-index: 1;

}



.footerSocial {

  display: flex;

  flex-wrap: wrap;

  gap: 5px;

}



.footer-bottom {

    padding: 10px 0;

    background-color: #fff;

    color: var(--body-color);

}

.footer-bottom>div {

    display: flex;

    justify-content: space-between;

    align-items: center;

}

.footer-bottom a {

  color: initial;

}

.footer-bottom p{

  color: #000;

}



.footer-bottom .d-flex {

  gap: 10px;

}



.copyrights {

  position: relative;

  z-index: 1;

  display: flex;

  justify-content: center;

}



.copyrights p {

  display: flex;

  align-items: center;

  margin-bottom: 0;

  font-size: 12px;

}



.copyrights p img {

  width: 13px;

  margin-left: 5px;

}



.button-top {

  background: rgba(255, 255, 255, 0.22);

  position: fixed;

  right: 20px;

  bottom: -40px;

  color: #ffffff;

  font-size: 13px;

  opacity: 0;

  width: 40px;

  height: 40px;

  line-height: 40px;

  border-radius: 50%;

  text-align: center;

  z-index: 99;

  cursor: pointer;

  transition: all 300ms ease-in-out;

}



.button-top:hover {

  background: var(--third-color);

}

/*Footer*/



/* Inside page */

.insideBanner{

  height: 370px;

  position: relative;

  overflow: hidden;

}

.insideBanner::before{

  content: '';

  position: absolute;

  inset: 0;

  background: linear-gradient(rgb(255 255 255 / 60%), rgb(0 0 0 / 0%));

  z-index: 1;

}



.pageHead{

  background-color: var(--primary-color);

  color: #fff;

}



.breadcrumb{

  background-color: transparent;

  margin-bottom: 0;

  border-radius: 0;

  padding-left: 0;

  padding-right: 0;

  font-size: 12px;

}



.breadcrumb li a, .breadcrumb-item+.breadcrumb-item::before{

  color: #fff;

}



.breadcrumb li a:hover{

  color: var(--secondary-color);

}



.breadcrumb li.active{

  color: var(--secondary-color);

}



/* our definition */

.tagline{

  padding: 1rem;

  border-left: 3px solid var(--primary-color);

}

/* our definition */



/* csr start */

.imgBox{

  margin: 15px 0;

}



.imgBox .inner iframe{

  outline: 2px solid var(--light-gray);

  overflow: hidden;

}



.newsBox {

  margin: 15px 0;

}



.newsBox a {

  color: var(--primary-color);

  display: block;

  background-color: var(--light-gray);

  transition: all 300ms ease;

}



.newsBox a .img-fluid img {

  height: 300px;

  object-fit: cover;

}



.newsBox a article {

  padding: 3rem 1.6rem 2rem;

  background-color: #fff;

  transition: all 300ms ease-in-out;

  box-shadow: 0 10px 20px rgb(0 0 0 / 6%);

  position: relative;

  z-index: 1;

}



.newsBox a:hover article {

  background-color: var(--primary-color);

  color: #fff;

}



.newsBox a article h4 {

  font-weight: 800;

}



.newsBox a article p {

  font-weight: 500;

  margin-bottom: 0px;

  color: var(--secondary-color);

}

.newsBox a:hover article p{

  color: #fff;

}

/* csr end */



/* Awards start */

.awards-card .award-card{

  margin: 15px 0;

}

.awards-card .award-card .card {

  text-align: center;

  border-radius: 5px;

  background: linear-gradient(to bottom right, #eff0f3, #ffffff);

  box-shadow: 3px 3px 3px #e8e6e6, -3px -3px 3px #ffffff;

  height: 100%;

  border: none;

  padding: 2rem 5rem;

  flex-direction: row;

  justify-content: space-between;

  align-items: center;

}



.awards-card .award-card .card .icon {

  position: absolute;

  width: 5rem;

}

.bgimages

{  

    background: #fefefe;

    padding-bottom: 0;

    color: #000;

}

/* -------------------------------------------

 amenities

 ------------------------------------------- */

.toggleBtnContainer {

    gap: 10px;

    margin-bottom: 2rem;

    overflow: hidden;

    display: flex;

    justify-content: center;

    flex-wrap: wrap;

}



.toggleBtnContainer .button {

  border: none;

  outline: none;

  cursor: pointer;

  padding: 7px 16px;

  transition: 0.3s;

  font-size: 0.9rem;

  background-color: inherit;

  background-color: rgba(255, 255, 255, 0.4);

  color: #fff;

  border: none;

  text-transform: uppercase;

  border-radius: 30px;

}



.toggleBtnContainer .button.active,

.toggleBtnContainer .button:hover {

  background-color: #fff;

  color: var(--blue);

}



.tabcontent:not(.show) {

  display: none;

}





.amenities {

    overflow: hidden;

}

.amenities-list

{

    display: flex;

    flex-wrap: wrap;

}

.amenities-list li {

    padding: 4px;

    flex: 0 0 50%;

    list-style: none;

}

.amenities-list-item {

    display: flex;

    align-items: center;

}

.amenities-icon {

    width: 46px;        

    flex: 0 0 auto;

    border-right: 1px solid rgba(206, 173, 83, 0.2);

    padding-right: 10px;

    margin-right: 10px;

}

.amenities h4 {

    color: var(--body-color);

    font-size: 2.1rem;

    font-family: 'Cinzel', serif;

}



.amenities .amenitiesBox {

    height: auto;

    position: relative;

}

.amenities .amenitiesBox .inner{

  border-radius: var(--primary-radius);

  overflow: hidden;

  position: relative;

}



.amenities .amenitiesBox .img img {

    width: 100%;

    height: 100%;

    object-fit: cover;

  border-radius: var(--primary-radius);

}



.amenities .amenitiesBox p {

    text-transform: uppercase;

    text-align: center;

    margin-top: 1rem;

    position: absolute;

    z-index: 99;

    bottom: 0;

    color: #fff;

    background: linear-gradient(to top, black, #00000042, #0000000a);

    left: 0;

    right: 0;

    padding: 3rem 1rem 1rem;

    /* font-size: 1.2rem; */

    letter-spacing: 1px;

}



.amenities .leftbtn {

    display: flex;

    gap: 12px;

    margin-left: 0;

    justify-content: right;

    position: absolute;

    bottom: 15px;

    background: #fff;

}

.amenities .leftbtn .swiper-button-prev {

    left: 20px;

}

.amenities .leftbtn .swiper-button-next  {

  left: 70px;

}



/* circular */

.swiper-button-next.circular,

.swiper-button-prev.circular {

    width: 35px;

    height: 35px;

    background-color: #c2a76a;

    border-radius: 50%;

    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);

    display: flex;

    justify-content: center;

    align-items: center;

    font-size: 30px;

    transition: all 0.3s ease;

}



.swiper-button-next:hover.circular,

.swiper-button-prev:hover.circular {

    background-color: var(--secondary-color);

    color: var(--white);

}



.swiper-button-next.circular i,

.swiper-button-prev.circular i {

    color: var(--body-color);

}



.swiper-button-next:hover.circular i,

.swiper-button-prev:hover.circular i {

    color: var(--white);

}



.swiper-pagination{

  display: flex;

  justify-content: center;

  gap: 2.5rem;

  margin-top: 2rem;

  bottom: 0;

}



.swiper-pagination .swiper-pagination-bullet{

  background-color: transparent;

  width: 1rem;

  height: 1rem;

  border-radius: 50%;

  border: 1px solid rgba(255, 255, 255, 0.5);

  opacity: 1;

  position: relative;

  margin: 0 !important;

  transition: all 300ms ease-in-out;

}

.swiper-pagination .swiper-pagination-bullet:hover{

  background-color: rgba(255, 255, 255, 0.75);

}



.swiper-pagination .swiper-pagination-bullet::before{

  content: '';

  position: absolute;

  border-bottom: 2px dotted rgba(255, 255, 255, 0.5);

  transition: all 300ms ease-in-out;

  width: calc(2.5rem * 1);

  top: calc(50% - 1px);

  right: 100%;

}



.swiper-pagination .swiper-pagination-bullet:first-child::before{

  display: none;

}



.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{

  background: var(--gradient);

}



.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before{

  border-bottom-color: var(--secondary-color);

}





.amenSlider 

{

  padding-bottom: 0rem;

}





/* floor plans */

.fpImgBox img{

  aspect-ratio: 16/9;

  object-fit: contain;

  background-color: var(--light);

  border-radius: var(--primary-radius);

}



.fpBox .inner{

	padding-bottom:1rem;

  border-radius: var(--primary-radius);

}

.enter-points ul{

	margin-bottom: 2rem;

}

.enter-points ul li{

	display:flex;

	align-items:center;

	padding:15px 0;

	border-bottom:1px solid rgba(255,255,255,0.50);

}

.enter-points ul li:first-child{

	border-top:1px solid rgba(255,255,255,0.50);

}

.enter-points ul li i{

	flex:0 0 30px;

	color:var(--secondary-color);

}

.enter-points ul li h6{

	margin-bottom:0;

	display:flex;

	justify-content:space-between;

	width: 100%;

	font-size:13px;

	text-transform:uppercase;

	font-weight:500;

}

/* floor plans */



/* .swiper-button-next {

    right: 10px;

}



.swiper-button-prev {

    left: 10px;

}*/

/* Infrastructure */

.hm-infra-section::before,

.hm-infra-section::after{

  content: '';

  position: absolute;

  inset: 0;

  z-index: -1;

}



.hm-infra-section::after{

  background-image: linear-gradient(#fff, transparent);

}



.hm-infra-section::before {

  background: url(../images/schoolbg.png);

  filter: invert(1) opacity(0.1);

}



.gallery-slide {

    width: 70%;

}



.gallery-slide .inner{

    position: relative;

    overflow: hidden;

    border-radius: var(--primary-radius, 10px);

}



.gallery-slide .inner::before{

    content: '';

    position: absolute;

    inset: 0;

    background-image: linear-gradient(rgba(0,0,0,0) 60%, rgba(0,0,0,0.5));

    z-index: 1;

    transition: all 300ms ease-in-out;

}



.gallery-slide img{

    width: 100%;

    aspect-ratio: 16/9;

    object-fit: cover;

}

.gallery-slide .caption{

    position: absolute;

    inset: auto 0 1.5rem;

    color: #fff;

    font-size: clamp(1.5rem, 2.5vw, 2.5rem);

    letter-spacing: 2px;

    padding: 0 2rem;

    text-transform: uppercase;

    font-weight: 700;

    line-height: 1;

    text-align: center;

    transition: all .3s linear 1.5s;

    transform: translateY(100%);

    opacity: 0;

    z-index: 2;

}

.gallery-slide.swiper-slide-active .caption{

    transform: translateY(0);

    opacity: 1;

}

/* Infrastructure */

/* ------------------------------------------------

 overview

 ------------------------------------------------ */

.overview {

  position: relative;

  z-index: 1;

}



/* .overview::before {

  content: "";

  position: absolute;

  z-index: -1;

  bottom: 0;

  width: 100%;

  height: 40%;

  background-color: var(--white);

} */



.overview .overMainContainer {

  max-width: 90%;

  margin: 0 auto;

}



.overview .overMainContainer h3 {

  padding: 1rem 0;

}



.overview .overMainContainer p {

  line-height: 1.6;

}



.overview .image-wrapper {

  height: 100vh;

  margin-top: 4rem;

}



.overview .image-wrapper img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: 0.08s linear;

  position: relative;

}



.overview .overCircleContent {

  position: absolute;

  bottom: 16%;

  left: 4%;

  width: 600px;

}



.overview .overCircleContent span {

  color: var(--white);

  line-height: 1.2;

  font-size: 2.5rem;

}



.overview .overCircleContent p {

  color: var(--white);

  margin: 2rem 0;

  line-height: 1.7;

}



.overview .overviewOpenArea {

  color: var(--white);

  font-weight: 300;

  text-transform: uppercase;

  font-size: 1.25rem;

}

.heading h2 {

   font-size: 2.25rem;

    color: #000;

    margin: 0px;

    letter-spacing: 3px;

}



/* Last item ko chhodkar sab par */

.iconMainContaner .iconBox:not(:last-child)::after {

  content: "";

  position: absolute;

  top: 15%;

  right: 0;

  width: 1px;

  height: 70%;



  background: linear-gradient(

    to bottom,

    transparent 0%,

    rgba(255, 0, 0, 0.2) 15%,

    rgb(70 21 37),

    rgba(255, 0, 0, 0.2) 85%,

    transparent 100%

  );

}



.iconBox .contentbox span {

  font-size: 1.75rem;

}

.iconMainContaner .iconBox:not(:last-child)::after {

    content: "";

    position: absolute;

    top: 15%;

    right: 0;

    width: 1px;

    height: 70%;

    background: linear-gradient(to bottom, transparent 0%, rgba(255, 0, 0, 0.2) 15%, rgb(70 21 37), rgba(255, 0, 0, 0.2) 85%, transparent 100%);

}

.iconMainContaner .iconBox {

    position: relative;

    text-align: center;

}

.iconBox .contentbox p {

  text-transform: uppercase;

  font-weight: 600;

  font-size: 0.75rem;

}



/* offers */

.offerBox{

  height: auto;

}

.offerBox .inner {

  height: 100%;

  padding: 20px;

  border-radius: 10px;

  text-align: center;

  background: #fff;

  color: #fff;

  border: 1px solid transparent;

  transition: all 300ms ease-in-out;

}

.offerBox .inner:hover {

  border-color: #efe9e9;

}



.offerBox .inner .count{

  display: block;

  font-size: 2.5rem;

  font-weight: 800;

  color: var(--primary);

  background-image: var(--secondary-gradient);

  -webkit-text-fill-color: transparent;

  -webkit-background-clip: text;

}



.offerBox .inner p{

  font-weight: 600;

  color: var(--blue);

  text-transform: uppercase;

  font-size: 0.875rem;

}



.offerBox .inner .img-fluid {

  width: 70px;

  margin: 0 auto 10px;

  padding: 10px;

  /* -webkit-filter: invert(1); */

  /* filter: invert(1); */

}



.modal-content {

  background-color: #fff;

  color: var(--body-color);

  border: none;

}



.modal-dialog {

  max-width: 700px;

}



.modal-content .modal-header {

  padding: 0;

  border: none;

}



.modal-content button.close {

  position: absolute;

  top: -10px;

  right: -10px;

  padding: 0;

  margin: 0;

  width: 40px;

  height: 40px;

  z-index: 1;

  text-shadow: none;

  color: var(--body-color);

  background-color: var(--secondary-color);

  opacity: 1;

  border-radius: 50%;

}





.modal-content .freePickmodal {

  margin-top: 10px;

  display: block;

  font-size: 13px;

  text-align: center;

}



.modal-header .close {

  color: #fff;

}



.modal-header {

  background: none;

  border: none;

}



.no-gutters .col-md-6:first-child {

  background: var(--secondary-color);

  border-radius: 1rem;

}



.modal-logo .inner {

  height: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-direction: column;

  text-align: center;

  gap: 1rem;

  padding: 1rem 0;

}



.modal-logo .bhk {

  font-size: 1rem;

  /* color: #ffffff; */

}



.modal-logo .bhk span {

  font-size: 200%;

  display: block;

  font-weight: 700;

  margin-bottom: 10px;

  /* color: #ffffff; */

  line-height: 1;

}



.modal-logo .price {

  width: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 10px;

  padding: 10px 0;

  border: solid rgb(255 255 255 / 20%);

  border-width: 1px 0;

  font-size: 1rem;

}



.modal-logo .price span {

  font-weight: 700;

  color: var(--vibrant-color);

  font-size: 200%;

  line-height: 1;

}



.modal-body {

  padding: 1.5rem;

}

/* Developer section */

.developer-section {

    border-top: 1px solid var(--primary-light-color);

  .developer-logo {

    width:274px;

    margin: 0 auto 1.5rem;

  }

  

  .statsContainer {

    .inner {

      border: solid rgb(0 0 0 / 20%);

      border-width: 1px 0;

      padding: 2rem 0;

      margin-top: 3rem;

      text-align: center;



      .statsBox{

        h2 {

          font-weight: 700;

          font-size: 2.5rem;

          color: var(--primary-light-color);

        }



        p {

          font-size: 0.875rem;

          text-transform: uppercase;

        }

      }

    }

  }

}



/* Developer section */

.paymentTabsMainbox {

    display: flex;

    gap: 10px;

    margin-bottom: 28px;

    flex-wrap: wrap;

    justify-content: center;

}



.paymentTab {

    padding: 9px 22px;

    border-radius: 999px;

    font-size: 14px;

    font-weight: 600;

    border: 1.5px solid #ddd;

    background: var(--primary-color);

    color: var(--white);

    cursor: pointer;

    transition: all 0.25s;

  border: 1px solid var(--primary-light-color);

}

.paymentTab.active

{

  background: var(--primary-light-color);

  color: #fff;

}

.paymentTab:hover {

  background: var(--primary-light-color);

  color: #fff;

}



.paymentTab.active.t0 {

  background: var(--primary-light-color);

  color: #fff;

}

.planPanel

{

  display: none;

}

.planPanel.active

{

  display: block;

}



/* customize modal */

/* offers */

@media only screen and (min-width: 1920px) {

  .awards-card .award-card .card .icon {

    width: 6rem;

  }

}

@media only screen and (max-width: 1400px) {

  .bannerText .h1 {

    font-size: 3.175rem;

  }

  .heading .h1 {

    font-size: 2.25rem;

  }

  .fpDetails h3

  {

    font-size: 1.5rem;

  }

}



.awards-card .award-card .card .icon:first-child {

  left: 1rem;

}



.awards-card .award-card .card .icon:last-child {

  right: 1rem;

}



.awards-card .award-card .card .card-body {

  padding: 0;

}



@media only screen and (max-width: 640px) {

  .awards-card .award-card .card .card-body br {

    display: none;

  }

}



.awards-card .award-card .card .card-body .award-title {

  font-weight: 700;

}



@media only screen and (min-width: 1920px) {

  .awards-card .award-card .card .card-body .award-title {

    font-size: 20px;

  }

}



.awards-card .award-card .card .card-body p {

  color: var(--secondary-color);

  font-weight: 500;

}



.awards-card .award-card .card .award-yr {

  font-weight: 600;

}

/* Awards end */



/* industries start */

.industriesContainer{

  overflow: hidden;

  border-radius: 5px;

  background: linear-gradient(to bottom right, #eff0f3, #ffffff);

  box-shadow: 3px 3px 3px #e8e6e6, -3px -3px 3px #ffffff;

}

.indusText .inner{

  padding: 3rem;

  height: 100%;

}

/* industries end */

/* Inside page */



.form-group {

  margin-bottom: 20px;

}



.form-group>div {

  margin-top: 15px;

}



.form-group label {

  margin-bottom: 0;

  font-size: 13px;

  font-weight: 500;

}



.form-control {

  border-radius: 0;

  border: none;

  border-bottom: 1px solid rgb(0 0 0 / 16%);

  background: none;

  outline: none;

  padding-left: 0;

  padding-top: 0;

}



.form-control[readonly] {

  background: none;

}



.form-control.form-control-dark{

  border-bottom-color: rgb(255 255 255 / 15%);

  color: #fff;

}



select.form-control.form-control-dark{

  background-color: var(--primary-color);

}



.form-control.form-control-dark::placeholder{

  color: #8f8f8f;

}



.form-control:focus {

  box-shadow: none;

  border-bottom-color: var(--primary-color);

  background: none;

}



/* Contact */

.contactBox .inner {

  background: var(--primary-color);

  color: #fff;

  height: 100%;

  padding: 2.5rem;

  border-radius: 5px;

}



@media only screen and (min-width: 1920px) {

  .contactBox .inner {

    padding-left: 4rem;

    padding-right: 4rem;

  }

}



@media only screen and (max-width: 360px) {

  .contactBox .inner {

    padding: 20px 10px;

  }

}



.contactBox h4 {

  margin-bottom: 1rem;

}



.contactBox ul li{

  display: flex;

  gap: 10px;

  margin-bottom: 10px;

}

.contactBox ul li:last-child{margin-bottom: 0;}



.contactBox ul li i{

  color: var(--secondary-color);

}



.contactBox ul li a{

  color: #fff;

}



.contactBox ul li a:hover{

  text-decoration: underline;

}

/* Contact us */



/* customize modal */

.modal-backdrop.show{

  opacity: 1;

  background: rgb(0 0 0 / 90%);

  background: linear-gradient(-42deg, rgb(153 19 19 / 90%), rgb(35 66 96 / 95%));

  backdrop-filter: blur(5px);

}

/* customize modal */



/*transformation Animation*/

.leftTranslate {

  -webkit-transform: translate(-200px, 0);

  transform: translate(-200px, 0);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.rightTranslate {

  -webkit-transform: translate(200px, 0);

  transform: translate(200px, 0);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.topTranslate {

  -webkit-transform: translate(0, -200px);

  transform: translate(0, -200px);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.bottomTranslate {

  -webkit-transform: translate(0, 200px);

  transform: translate(0, 200px);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.doneTranslate {

  -webkit-transform: translate(0, 0);

  transform: translate(0, 0);

  opacity: 1;

}



.fadeOut {

  opacity: 0;

  visibility: hidden;

  pointer-events: none;

  -webkit-transition: all 1000ms ease-in-out;

  transition: all 1000ms ease-in-out;

}



.fadeIn {

  opacity: 1;

  visibility: visible;

  pointer-events: auto;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.zoomOut{

  transform: scale(0);

  transition: all .8s ease-in-out;

}



.zoomIn{

  transform: scale(1);

}

/*transformation Animation*/



.list {

  padding-left: 0px;

}



.list li {

  margin-bottom: 10px;

  padding-left: 1rem;

  position: relative;

  border-left: 2px solid var(--secondary-color);

}



/*responsive*/

@media (min-width: 1300px) {

  .container{max-width: 1240px;}

}

@media (min-width: 1900px) {

  .container{max-width: 1800px;}

}



@media (min-height: 1024px) {

}



@media (min-height: 1280px) {

}



@media (max-width: 991.9px) {

  html {

    font-size: 87.5%;

  }

  .logo {width: 100px;}

}



@media (max-width: 767.9px) {

}



@media (max-width: 576px) {

}



@media (max-width: 575.9px) {

  .heading h2{font-size: 2rem;}
  .banner {
    height: auto;
  }
  button[class^='carousel-control'] {
    display: none;
  }
  .padding {
    padding-top: 3rem;
    padding-bottom: 3rem;
}
.heading .h1 {
        font-size: 1.625rem;
    }
    .heading {
    margin-bottom: 10px;
    }
    .animate-section4
    {
      padding-top: 0;
    }
    .gallery-slide img {
    aspect-ratio: 4 / 3;
}
.swiper-pagination
{ 
    gap: 1.5rem;
}
.footer-bottom>div
{
    flex-wrap: wrap;
    justify-content: center;

}
.header .d-grid {
    justify-content: center;
    align-items: center;
    gap: 10px;
    transition: all 300ms ease-in-out;
    display: flex !important;
}
}



@media (max-width: 480px) {

  .bg-circle::before{clip-path: circle(50% at 100% -10%);}

  .benefitBox section .img-fluid{width: 60px;}

}



@media (max-width: 425px) {

}



@media (max-width: 375px) {

}



@media (max-width: 320px) {

}


.footer-enquiryBtn {
  position: fixed;
  bottom: 0px;
  left: 0px;
  right: 0px;
  display: flex;
  justify-content: center;
  z-index: 99;
  background-color: #212842;
  border-top: 1px solid var(--accent);
  text-align: center;
}
.footer-enquiryBtn a {
	width: 100%;
	color: #fff;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	padding: 8px 5px;
	font-size: 11px;
	text-transform: uppercase;
}
.footer-enquiryBtn a:not(:first-child) {
  border-left: 1px solid #fff;
}
.footer-enquiryBtn a i{
  color: var(--accent);
}