@charset "utf-8";

/* services */
.inner-lg-banner{position:relative;}
.inner-lg-banner::before{content: "";position:absolute;top: 0;left: 0;right: 0;bottom: 0;background:rgb(0 0 0 / 60%);z-index: 0;}

.service-land-banner{background:url(../images/services/service-land-banner.webp) no-repeat center; background-size:cover;}
.service-detail-banner{background:url(../images/services/service-detail/Residential-Design-banner.webp) no-repeat center; background-size:cover;}
.inner-banner-cont{height: 90vh;display: flex;align-items: end;position: relative;z-index: 1;}
.inn-banner-title{ display: block;margin: 0 0 30px;padding: 0;font-size: 52px;line-height: 1.2em;font-weight: var(--light);color: #fff;}
.inn-banner-title > b{ display: block;font-weight: inherit;}
.inn-banner-title > i{ display: block;font-weight: inherit;font-size: 22px;line-height: 1.5em;}
.sm-inn-banner{height: 400px;}
.sm-inn-banner .inn-banner-title{margin: 0 0 30px;}
.middle-banner-cont{ justify-content: center; text-align: center;}
.middle-banner-cont .inn-banner-title > i{margin-top: 20px;}

.service-section {padding:100px 0 200px;}
.service-content {display:flex;gap:50px;flex-direction: column;}
.service-card {display: flex;box-shadow:0px 3px 28px rgb(0 0 0 / 10%);padding:25px 35px 25px 20px;align-items:center;gap:55px;}
.service-img {border-radius:30px;overflow:hidden;flex: 1;}
.service-img > img {border-radius:30px;}
.service-card-cont {display:flex;flex-direction:column;gap:30px;flex: 1.5;}
.service-title {display:block; margin:0; padding:0; font-size:30px; line-height:1.5em; font-weight:var(--regular);}
.service-card-cont > p {display:block; margin:0; padding:0; font-size:16px; line-height:1.5em; font-weight:var(--light);}
.card-img-rgt .service-img{order: 1;}

.commercial-detail-banner{background:url(../images/services/commercial/commercial-land-banner.webp) no-repeat center; background-size:cover;}
.residential-detail-banner{background:url(../images/services/residential/residential-design-banner.webp) no-repeat center; background-size:cover;}
.turnkey-banner{background:url(../images/services/turnkey/turnkey-banner.webp) no-repeat center; background-size:cover;}
.renovation-banner{background:url(../images/services/renovation/renovation-banner.webp) no-repeat center; background-size:cover;}
.mep-banner{background:url(../images/services/mep/mep-banner.webp) no-repeat center; background-size:cover;}

.villa-banner{background:url(../images/services/residential/villa/villa-banner.webp) no-repeat center; background-size:cover;}
.apartment-banner{background:url(../images/services/residential/apartment/apartment-banner.webp) no-repeat center; background-size:cover;}
.penthouse-banner{background:url(../images/services/residential/penthouse/penthouse-banner.webp) no-repeat center; background-size:cover;}

/* service-detail */
.bd-rad-c-30 {border-radius:30px; overflow:hidden;}
.bd-rad-c-30 > img {border-radius:30px;}
.serv-show-section{padding:100px 0;background-color: #fff;}
.serv-show-wrapper { display:flex; gap:35px; position:relative;}
.show-sm-image {display:none; flex:1; height:fit-content; max-width:360px;}
.show-sm-image > img {}
.show-content {flex:1.5;display: flex;flex-direction: column;justify-content: center;gap: 20px;}
.comn-para-cont {display:block; margin:0; padding:0; font-size:18px; line-height:1.5em; font-weight:var(--light);}
.comn-para-cont > strong {font-weight:var(--regular);}
.show-lg-image {flex:2;height: fit-content;}
.show-lg-image > img {}
.intro-bg-icon {display:none; margin:0; padding:0; position:absolute; bottom:0; left:8%; width:150px;}
.intro-bg-icon.rght{ left: auto; bottom: auto; right: 8%; top: -5%;}

.service-sub-section{background-color: #E3E3E3; color: #000; padding: 80px 0;}
.layer-heading{display: block;margin: 0 0 50px;padding: 0;font-size: 32px;line-height: 1.5em;font-weight: var(--light);}
.layer-heading > b{display: block;margin: 0;padding: 0;font-size: 52px;font-weight: inherit;}

.sub-services {display:flex; justify-content:space-between; gap:50px; flex-wrap: wrap;}
.sub-service-box {max-width:450px; width:100%; color:#000; display:flex; flex-direction:column; flex: none;}
.sub-service-box > img {}
.sub-service-box > h3 {display:block; margin:30px 0 20px; padding:0; font-size:30px; font-weight:var(--light);}
.sub-service-box > p {display:block; margin:0 0 35px; padding:0; font-size:17px; line-height:1.5em;}
.sub-service-box > i {margin-top:auto;}

.show-design-2 .show-sm-image{align-self: center; margin-top: 5%;}

/* sub-detail */
.serv-sub-detail-banner{background:url(../images/services/service-detail/villa-banner.webp) no-repeat center; background-size:cover;}
.show-content-title{display:block;margin:0;padding:0;font-size:30px;font-weight:var(--light);line-height: 1.3em;}
.show-content-title > b{display: block;margin: 0;padding: 0;font-size: inherit;font-weight: var(--regular);}

.sub-view-section {background:#fff; padding:50px 0;}
.sub-view-wrap {display:flex; gap:50px;}
.sub-view-image {flex:1;height: fit-content;}
.sub-view-cont {flex:1; display:flex; flex-direction:column; justify-content:center; gap:30px;}
.sub-view-points {}
.sub-view-points > h3 {display:block; margin:0 0 15px; padding:0; font-size:30px; font-weight:var(--light); line-height:1.3em;}
.sub-view-description {display:flex; flex-direction:column; gap:40px; padding-top:80px;}

.office-banner{background:url(../images/services/commercial/office/office-hero-banner.webp) no-repeat center; background-size:cover;}
.f-b-banner{background:url(../images/services/commercial/f-b/f-b-banner.webp) no-repeat center; background-size:cover;}
.hospitality-banner{background:url(../images/services/commercial/hospitality/hospitality-banner.webp) no-repeat center; background-size:cover;}
.retail-banner{background:url(../images/services/commercial/retail/retail-banner.webp) no-repeat center; background-size:cover;}

/* Portfolio */
.portfolio-banner{background:url(../images/portfolio-banner.webp) no-repeat center; background-size:cover;}
.portfolio-category-section{padding: 100px 0 0;}
.port-view-sec{display: grid;grid-template-columns: 1fr 1fr;gap: 80px 40px;}
.project-box .work-box > b{color: #000;font-weight: var(--light);}
.project-box .work-box > b > i, 
.project-box .work-box > b > i::before, 
.project-box .work-box > b > i::after{background-color:#000;}
.project-box .work-box:hover > b > i, 
.project-box .work-box:hover > b > i::before, 
.project-box .work-box:hover > b > i::after{background-color: #E92E2D;}

.port-filter-btns {display:flex; justify-content:center; margin-bottom:75px; gap:18px; flex-wrap:wrap;}
.filter-btn {display:flex; border:1px solid #DFDFDF; min-height:64px; width:auto; max-width:245px; justify-content:center; align-items:center; padding:12px 20px; text-align:center; color:#787878; font-weight:var(--regular); font-size:16px; line-height:1.5em; text-transform:capitalize; cursor:pointer; transition:all 0.3s ease;}
.filter-btn.active {border:1px solid #E92E2D;}
.project-box {opacity:0; transform:translateY(20px); transition:opacity 0.4s ease, transform 0.4s ease;}
.project-box.show {opacity:1; transform:translateY(0);}

/* Portfolio View*/
.portfolio-view-banner{background:url(../images/portfolio-view-banner.webp) no-repeat center; background-size:cover;}
.portf-view-section{padding: 80px 0 0;}
.portf-view-title{display: flex;flex-direction: column;text-align: center;gap: 30px;}
.portf-view-title > h2{display: block;margin: 0;padding: 0;font-size: 35px;line-height: 1.3em;font-weight: var(--light);}
.portf-view-title > h2 > b{display: block;margin: 0;padding: 0;font-weight: inherit;}

.portfolio-gallery{margin-top: 60px;display: flex;flex-direction: column;gap: 30px;justify-self: center;}
.pf-gallery{display: flex;  gap: 30px;}
.pf-gallery > a{ margin: 0 auto;}
.pf-gallery > a > img{max-height: 70vh;}

/* About-us */
.about-land-banner{background:url(../images/about-banner.webp) no-repeat center; background-size:cover;}
.about-section{padding: 80px 0;}
.about-inn-wrap{display: flex;gap: 80px;}
.abt-inn-lft-cont{flex: 1.8;display: flex;flex-direction: column;gap: 25px;justify-content: center;}
.abt-inn-head{display: block;margin: 0;padding: 0;font-size: 36px;line-height: 1.3em;font-weight: var(--light);}
.abt-inn-head > b{display: block;margin: 0;padding: 0;font-weight: inherit;}
.since-icon{display: inline-block;width: fit-content;margin-bottom: 0;padding: 7px 13px 7px 44px;position: relative;border: 1px solid #707070;border-radius: 50px;font-weight: var(--regular);font-size: 17px;line-height: 1em;}
.since-icon::before{position:absolute;content:"";background:url(../images/link-red.svg)no-repeat center;width:18px;height:10px;background-size:contain;top: 50%;transform: translateY(-50%);left: 14px;}

.abt-inn-rght-cont{flex: 1;align-self: center;}
.abt-inn-img-wrap{ display: flex; gap: 55px;}
.abt-inn-img-wrap > div{}
.abt-inn-img-wrap > div:first-child{display: none; align-items: end;}
.abt-inn-img-wrap > div:last-child{display: flex;flex-direction: column;gap: 15px;}
.abt-inn-img{height: fit-content;}

.abt-year-icon{display: flex;justify-content: center;position: relative;padding-top: 65px;}
.abt-year-icon::before{content:"40";position:absolute;font-size: 250px;line-height:1em;font-weight:800;color:#F6F6F6;z-index:-1;left: 45%;top: 0;transform: translateX(-50%);}
.abt-year-icon .year-icon{ padding: 0;} 
.abt-year-icon .year-icon > b{ font-size: 150px;}
.abt-year-icon .year-icon > em{font-size: 33px;}
.abt-year-icon .year-icon > span{font-size: 48px;}

.abt-middle-banner-sec{background:url(../images/about/abt-view-banner.webp) no-repeat center; background-size:cover;position: relative;height: 120vh;}
.abt-middle-banner-sec::before{content: "";position: absolute;inset: 0;background: #000;background: linear-gradient(90deg, rgb(0 0 0 / 90%) 0%, rgb(255 255 255 / 0%) 100%);}
.abt-mid-wrap{color: #fff;position: relative;z-index: 1;padding: 80px 0 0;display: flex;flex-direction: column;gap: 40px;width: 60%;}
.mid-ban-title{display: block;margin: 0;padding: 0;font-size: 60px;line-height: 1.1em;font-weight: var(--regular);}
.mid-ban-title > b{display: block;margin: 0;padding: 0;font-weight: inherit;}
.abt-mid-wrap p{ display: block; margin: 0; padding: 0; font-size: 19px; line-height: 1.7em;  font-weight: var(--light);}

.objective-section{background-color: #000;padding: 150px 0 100px;position: relative;}
.objective-section .serv-title{color: #fff; font-weight: var(--regular);}
.objective-section .serv-left-sec > p{color: #fff;}
.objective-section .serv-box{cursor: default;min-height:450px;}
.objective-section .serv-box::after{display: none;}
.objective-section .sldr-nav-btn{background: #E3E3E3;}

.team-section {background:#fff; color:#000; padding:100px 0 0;}
.team-wrapper {display:flex; gap:50px; align-items:flex-start;}
.team-lft-wrap {flex:1;}
.team-photo-grid {display:grid; grid-template-columns:1fr 1fr; gap:30px 20px;}
.team-photo-box {display:flex; flex-direction:column; gap:20px;}
.team-img {overflow:hidden; height:fit-content;}
.team-img > img {filter:grayscale(100%); transition:all 0.5s ease;}
.team-photo-box:hover .team-img > img {filter:grayscale(0);}
.team-photo-box > b {display:block; margin:0; padding:0; font-weight:var(--light); font-size:16px; line-height:1em;}
.team-rght-wrap {flex:1; align-self:flex-start; position:sticky; top:120px; height:fit-content;}
.abt-sub-title {display:block; margin-bottom:30px; padding:0; font-weight:var(--ultra-light); font-size:25px;}
.abt-big-title {display:block; margin-bottom:40px; padding:0; font-size:50px; line-height:1.1em; font-weight:var(--light);}
.abt-big-title > b {display:block; margin:0; padding:0; font-weight:inherit;}
.team-rght-wrap > p {display:block; margin:0; padding:0; font-size:18px; line-height:1.5em;}


.milestone-section{padding: 100px 0;background: #fff;position: relative;}

.milestone-sec-wrap {position:relative;}
.milestone-box-wrapper {padding:80px 100px; position:relative;align-items: stretch;}
.milestone-box-wrapper .swiper-slide{height: auto;}
.milestone-box {flex:1; display:flex; flex-direction:column; justify-content:space-between; position:relative; padding-top:300px;height: 100%;}
.milestone-progress-dot {content:""; position:absolute; width:17px; height:17px; background-color:#fff; border-radius:50%; border:1px solid #E92E2D; left:0; top:50%; transform:translateY(-50%);transition: all 0.4s ease;}
.milestone-box.completed .milestone-progress-dot {background-color:#E92E2D;}
.img-milestone {width:160px; transition:all 0.5s ease; position:absolute; top:0; left:0;}
.img-milestone > img {}
.milestone-box.active .img-milestone {width:238px; transform:translateY(-80px);}
.milestone-content {display:flex; flex-direction:column; gap:25px;}
.milestone-content > b {display:block; margin:0; padding:0; font-size:30px; line-height:1em; font-weight:var(--bold);}
.milestone-content > p {display:block; margin:0; padding:0; font-size:19px;width: 70%;}

.mile-custom-nav {position:absolute; top:-10%; right:0; display:flex; gap:15px;z-index: 2;}
/* .milestone-slider .swiper-pagination-progressbar {top:50%; transform:translateY(-50%); left:4px; right:4px; z-index:-1; height:1px; background:rgb(0 0 0 / 25%);}
.milestone-slider .swiper-pagination-progressbar-fill {background:#E92E2D;}
.milestone-progress::before, .milestone-progress::after {content:""; position:absolute; width:8px; height:8px; background-color:#E92E2D; border-radius:50%; top:50%; transform:translateY(-50%); z-index:2;}
.milestone-progress::before {left:0;}
.milestone-progress::after {right:4px;} */

.milestone-mid-line{position: absolute; height: 1px;left: 0;right: 0;top: 50%;background-color: #E92E2D;}
.milestone-mid-line::before, .milestone-mid-line::after{content: "";position: absolute;width: 8px;height: 8px;background-color: #E92E2D;border-radius: 50%;top: 50%;transform: translateY(-50%);z-index: 2;}
.milestone-mid-line::before{left: 0;}
.milestone-mid-line::after{right: 0;} 

.milestone-mid-line {position:absolute; left:0; top:50%; width:100%; height:2px; background:#ddd; transform:translateY(-50%);}
.milestone-progress-line-fill {position:absolute; left:0; top:0; height:100%; width:0%; background:#E92E2D; transition:width 0.4s ease;}

/* career */
.career-banner{background:url(../images/career-banner.webp) no-repeat center; background-size:cover;}
.career-section{padding: 100px 0 0;background: #fff;}
.career-wrapper{display: flex;gap: 50px;}
.career-form-lft{flex: 1.5;}
.career-form-head{display: block;margin: 0 0 45px;padding: 0;font-size: 30px;line-height: 1.3em;font-weight: var(--regular);}
.career-form-head > b{display: block;margin: 0;padding: 0;font-weight: inherit;}
.career-form{display: flex;flex-direction: column;gap: 20px;}
.career-img-rght{flex: 1;}
.career-sm-img{display: none;}

/* Gallery */
.gallery-banner{background:url(../images/gallery-banner.webp) no-repeat center; background-size:cover;}
.gallery-section{background: #fff;color: #000;padding: 100px 0 0;}
.gallery-wrapper{display: grid; grid-template-columns: repeat(2, 1fr);  gap: 50px;justify-items: center;}
.gallery-box{ display: flex; flex-direction: column; gap: 15px;}
.gallery-box > a{overflow: hidden;position: relative;width: auto;height: 230px;min-width: 350px;}
.gallery-box > a::before{content: "+";position: absolute;bottom: 3px;right: 5px;color: #000;z-index: 1;font-size: 40px;line-height: 1em;transition: all 0.3s ease;}
.gallery-box > a:hover:before{color: #fff;}
.gallery-title{display: block;margin: 0;padding: 0;font-size: 16px;line-height: 1.7em;font-weight: var(--light);}
.gallery-box img{width: 100%;height: 100%;object-fit: cover;display: block;}
.gallery-videos .gallery-box > a::before{content: "";position: absolute;background: url(../images/play-btn.svg)no-repeat center;background-size: contain;width: 40px;height: 40px;left: 50%;top: 50%;transform: translate(-50%, -50%);}
.gallery-section .filter-btn{ width: 175px;}
.gallery-sec {opacity:0; transform:translateY(20px); transition:opacity 0.4s ease, transform 0.4s ease;}
.gallery-sec.show {opacity:1; transform:translateY(0);}

/* download */
.download-banner{background:url(../images/downloads-banner.webp) no-repeat center; background-size:cover;}
.download-section{background: #fff;color: #000;padding: 100px 0 0;}
.download-grid{ display: grid; grid-template-columns: 1fr 1fr;  gap: 3em;}
.download-title{display: block;margin: 0 0 15px;padding: 0;font-size: 24px;line-height: 1.3em;font-weight: var(--regular);}
.download-wrap{display: flex;flex-direction: column;gap: 1em;background: #fff;box-shadow: 1px 4px 12px 0px rgb(0 0 0 / 10%);padding: 3em;border-radius: 30px;}
.download-wrap > a{color: #000; border-color: #E92E2D;}

/* News */
.news-banner{background:url(../images/news-banner.webp) no-repeat center; background-size:cover;}
.news-section{background: #fff;color: #000;padding: 100px 0 0;}
.news-grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px 30px;}
.news-box{position: relative;background-color: #fff;color: #000;display: flex;flex-direction: column;padding: 22px 20px 60px;width: 100%;max-width: 410px;min-height: 475px;gap: 20px;box-shadow: 0px 3px 28px rgb(0 0 0 / 10%);}
.news-box::after{content: "+";position: absolute;background-color: #F3F3F3;width: 50px;height: 50px;color: #E92E2D;font-size: 30px;font-weight: var(--regular);bottom: 0;right: 0;display: flex;justify-content: center;align-items: center;border-top-left-radius: 15px;transition: all 0.3s ease;}
.news-box:hover:after{color: #000;}
.news-box-img{display: block;margin: 0;padding: 0;overflow: hidden; height: 267px;}
.news-box-img > img{  width: 100%; height: 100%;   object-fit: cover;}
.news-box-title{display: block;margin: 0;padding: 0;font-size: 20px;line-height: 1.3em;font-weight: var(--medium);}
.news-box-title > b{display: block;margin: 0;padding: 0;font-weight: inherit;}
.news-box > p{margin: 0;padding: 0;font-size: 16px;line-height: 1.3em;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.news-date{ display: block; padding: 0; font-size: 15px; line-height: 1em; margin: -5px 0; color: #838383;}

/* News Detail */
.news-detail-wrapper{width: 75%;margin: 0 auto;display: flex;flex-direction: column;gap: 30px;}
.news-detail-title{display: block;margin: 0;padding: 0;font-size: 20px;line-height: 1.3em;font-weight: var(--medium);}

/* fitout */
.fitout-banner{background:url(../images/fitout/fitout-banner.webp) no-repeat center; background-size:cover;}
.fitout-section{padding: 100px 0 0;}
.fitout-wrapper{text-align: center;display: flex;flex-direction: column;gap: 30px;}
.comn-sec-head{display: block;margin: 0 0 20px;padding: 0;font-size: 40px;line-height: 1.3em;font-weight: var(--light);}
.comn-sec-head > b{display: block;margin: 0;padding: 0;font-weight: inherit;}
.fitout-img-section{padding: 100px 0 0;}
.fiitout-img-wrapper{ display: flex; gap: 40px;}
.fiitout-img-wrapper > div{overflow: hidden;height: fit-content;}