:root {

    /* Colors */

    --primary-color: #048BCC;

    --secondary-color: #939393;

    --light-text: rgba(0,0,0,0.79);



    /* Typography */

    --font-family: "Bricolage Grotesque", sans-serif;



    --white: #fff;

    --black: #000000;

    

    --light-bg: #F5F5F5;

    --dark-bg: #3E2D0B;

    

    --transparent: transparent;

    --border-color: #939393;



    --radius: 12px;



    /* Shadows */

    --box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);

    --box-shadow-none: 0 2px 5px rgba(0, 0, 0, 0);



    /* font size  */

    --h1-size: clamp(3.75rem, 2.232vw + 2.321rem, 5rem); /* 80 > 68 */

    --h2-size: clamp(3rem, 2.237vw + 1.565rem, 4.25rem); /* 68 > 48 */

    --font-55: clamp(2.5rem, 1.678vw + 1.424rem, 3.438rem); /* 68 > 48 */

    --font-45: clamp(2.188rem, 1.119vw + 1.47rem, 2.813rem); /* 45 > 35 */

    --font-40: clamp(2.063rem, 0.783vw + 1.56rem, 2.5rem); /* 40 > 33 */

    --font-34: clamp(1.688rem, 0.783vw + 1.185rem, 2.125rem); /* 34 > 27 */

    --font-30: clamp(1.563rem, 0.559vw + 1.204rem, 1.875rem); /* 30 > 25 */

    --font-28: clamp(1.438rem, 0.559vw + 1.079rem, 1.75rem); /* 28 > 23.5 */

    --font-26: clamp(1.375rem, 0.447vw + 1.088rem, 1.625rem); /* 26 > 22 */

    --font-20: clamp(1.125rem, 0.224vw + 0.982rem, 1.25rem); /* 20 > 18 */

    --font-22: clamp(1.188rem, 0.336vw + 0.972rem, 1.375rem); /* 22 > 19 */

    --font-18: clamp(1rem, 0.224vw + 0.857rem, 1.125rem); /* 18 > 16*/



    --font-light: 300;

    --font-regular: 400;

}



/* CSS Reset */

* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}



img{max-width: 100%; height: auto;

    display: block;

}



html{font-size: 1em;}

body {

    color: var(--black);

    scroll-behavior: smooth;

    font: normal 1em/1.5 var(--font-family);

    color: var(--black);

    min-width: 320px;

}



a { text-decoration: none;

    color: inherit;

}



ul {

    list-style: none;

}



strong{font-weight: 600;}



button, a {

    cursor: pointer;

}



/* Global Typography */

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

    line-height: 1.2;

    margin-bottom: 20px;

    font-family: var(--font-family);

}



h1{font-size: var(--h2-size);}

h2{font-size: var(--h2-size);

    font-weight: 800;

}



.text-center{

    text-align: center !important;

}



p { margin-bottom: 20px;}



.mb-0{margin-bottom: 0px !important;}

.mb-1{margin-bottom: 10px !important;}

.mb-2{margin-bottom: 20px !important;}

.mb-3{margin-bottom: 30px !important;}

.mb-4{margin-bottom: 40px !important;}

.mb-5{margin-bottom: 50px !important;}

.mb-7{margin-bottom: 70px !important;}





.breadcrumb{display: flex; gap: 30px;

    justify-content: center;

    font-family: var(--font-family);

    font-size: var(--font-18);

}

.breadcrumb a{ position: relative; 

    color: var(--white);

}

.breadcrumb a::after {

    content: "/";

    position: absolute;

    right: -20px;

    color: var(--white);

}



.breadcrumb a:hover{

    text-decoration: underline;

}



.breadcrumb span{

    color: var(--secondary-color);

 }



 /* button global  */



 .buttons-set {display: inline-flex; gap: 25px;}



.btn {

    display: inline-block;

    padding: 16px 55px 14px 20px;

    background: var(--white);    

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

    color: var(--secondary-color);

    transition: all 0.2s ease;

    border-radius: 35px;

    position: relative;

    font-size: var(--font-18);

    line-height: 1.2;

    white-space: nowrap;

}



.btn::after {

    content: "";

    position: absolute;

    height: 40px;

    width: 40px;

    left: calc(100% - 46px) ;

    top: 5px;

    background: url(../images/btn-arrow-blue.svg) center center no-repeat;

    background-size: contain;

    transition: all 0.2s ease;

}



.btn:hover { 

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

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

    color: var(--white);

    padding-left: 55px;

    padding-right: 20px;

}



.btn:hover::after {

    left: 6px;

    background-image: url(../images/btn-arrow-white.svg);

 }



 /* button transparent */



.btn.btn-transparent {

    background-color: var(--transparent);

}

.btn.btn-transparent:hover {

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

 }



/* button secondary */

.btn.btn-secondary {

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

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

    color: var(--white);

}



.btn.btn-secondary::after {

    background-image: url(../images/btn-arrow-white.svg);

 }



.btn.btn-secondary:hover{

    background-color: var(--white);

    border-color: var(--white);

    color: var(--secondary-color);

}



.btn.btn-secondary:hover::after {

    background-image: url(../images/btn-arrow-blue.svg);

 }



 /* Tag Line  */



.tag-line{font-size: 15px;

    color: var(--secondary-color);

    font-family: var(--font-family);

    margin-bottom: 6px;

    display: block;

}



/* Container */

.container {

    width: 96%;

    max-width: 1600px;

    margin: 0 auto;

    padding: 0 20px; 

}



/* Header Styles */

.header {

    position: sticky;

    top: 0;

    left: 0;

    width: 100%;

    background: var(--white);

    z-index: 1000;

    transition: all 0.3s ease;

    box-shadow: var(--box-shadow);

}



.header .container {

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 5px 20px;

}



.header .nav{display: flex;}



.nav-list {

    display: flex;

    gap: 30px 40px;

    flex: 1;

}



.nav-list li {

    position: relative;

}



.nav-list li a {

    padding:10px 5px;

    transition: color 0.3s ease;

    color: var(--black);

    transition: all 0.2s ease;

    font-size: 1rem;

    font-family: var(--font-family);

}



.nav-list li a:hover,
.nav-list li.current-menu-item a {

    color: var(--primary-color);

}


/* Hamburger Menu */

.hamburger {

    display: none;

    flex-direction: column;

    gap: 5px;

    background: none;

    border: none;

    padding:10px;

}



.hamburger span {

    width: 25px;

    height: 3px;

    background: var(--secondary-color);

    transition: all 0.3s ease;

}



.hamburger.active span:nth-child(1) {

    transform: rotate(45deg) translate(5px, 5px);

}



.hamburger.active span:nth-child(2) {

    opacity: 0;

}



.hamburger.active span:nth-child(3) {

    transform: rotate(-45deg) translate(7px, -7px);

}

/* header end  */



.pageWrapper{

    min-height: 100vh;

    display: flex;

    flex-direction: column;

}



.pageWrapper > main{

    flex: 1;

}



.tagline{

    border: solid 1px #B4B4B4;

    border-radius: 18px;

    font-size: var(--font-18);

    display: inline-flex;

    gap: 8px;

    align-items: center;

    padding: 0 12px;

    margin-bottom: 16px;

    white-space: nowrap;

 }



 .tagline::before{

    content: "";

    height: 5px;

    width: 5px;

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

    border-radius: 50%;

    display: block;

 }



 /* interior img */



 .interior-img{

    padding: 70px 0;

 }

 

/* Form's style  */



.form-row{

    display: flex;

    gap: 20px;

    flex-wrap: wrap;

    margin-bottom: 15px;

    position: relative;

}



.form-row .form-col{

    min-width: 250px;

    flex: 1;

}



.form-row .form-col label{

    display: block;

    margin-bottom: 6px;

}



.form-row .form-col label em{

    color: red;

}



.default-input{

    background-color: #f5f5f5;

    border: solid 2px #ededed;

    padding: 20px;

    display: block;

    width: 100%;

    resize: none;

    font-family: var(--font-family);

    font-size: 15px;

    border-radius: 10px;

}



.default-input::placeholder,

.custom-dropdown .placeholder {

  color: #CBCBCB;         

  font-size: 15px;     

  opacity: 1;          

}



textarea.default-input{

    height: 120px;

}



/* Hide real select */



.caracterLeft{

    padding: 2px 0;

    position: absolute;

    right: 0;

    top: 100%;

}



select {

  display: none;

}



.custom-dropdown {

  position: relative;

}



.custom-dropdown .selected {

  padding: 20px 40px 20px 20px;

    font-size: 15px;

    border-radius: 10px;

    background-color: #f5f5f5;

    border: solid 2px #ededed;

    padding: 20px;

  cursor: pointer;

  position: relative;

}



/* custom arrow */

.custom-dropdown .selected::after {

  content: "";

  position: absolute;

  top: 50%;

  right: 12px;

  width: 14px;

  height: 14px;

  background: url("../images/down-arrow.png") no-repeat center;

  background-size: contain;

  pointer-events: none;

  transform: translateY(-50%);

}



.custom-dropdown .options {

  position: absolute;

  top: 100%;

  left: 0;

  right: 0;

  background: #fff;

  border: 1px solid #ccc;

  border-radius: 6px;

  margin-top: 4px;

  display: none;

  z-index: 1;

  max-height: 200px;

  overflow-y: auto;

}



.custom-dropdown .options div {

  padding: 10px 12px;

  cursor: pointer;

}



.custom-dropdown .options div:hover {

  background: #f1f1f1;

}



/* Home Top Banner  */



.topBanner-item{

    min-height: calc(100vh - 76.1px);

    background-size: cover;

    background-position: center center;

    position: relative;

    display: flex !important;

    align-items: center;

}

.topBanner-item::before{

    content: "";

    background-color: rgba(0, 0, 0, 0.5);

    position: absolute;

    width: 100%;

    height: 100%;

    left: 0;

    top: 0;

    z-index: 0;

}

.topBanner-item .container{

    padding-top: 130px;

    padding-bottom: 70px;

    position: relative;

    z-index: 1;

    padding-right: 70px;

}



.darkBG-section .container *{

    color: var(--white);

}



.topBanner-item h2{

    max-width: 833px;

    width: 56%;

}



.topBanner-item .section-content{

    display: flex;

    padding-left: 10%;

    gap: 30px 10%;

    font-size: var(--font-18);

}



.topBanner-item .content-left{

    position: relative;

    padding-top: 20px;

    max-width: 628px;

    width: 46%;

}



.topBanner-item .content-left p{

    font-size: var(--font-18);

    font-weight: var(--font-light);

    margin-bottom: 40px;

}



.topBanner-item .content-left::before{

    content: "";

    width: 60px;

    height: 3px;

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

    position: absolute;

    left: 0;

    top: 0;

}



.topBanner-item .content-right{

    flex: 1;

}



.banner-thumbs{

    display: flex;

    gap: 30px;

}

.banner-thumbs .thumb-item{

    aspect-ratio: 283 / 303;

    width: 100%;

    object-fit: cover;  

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

    backdrop-filter: blur(10px);          

    -webkit-backdrop-filter: blur(10px);  

    border-radius: 1.438rem;

    overflow: hidden;

    display: flex;

}



.banner-thumbs .thumb-item > img{

    width: 100%;

    object-fit: cover;  

}



.banner-thumbs .thumb-item .thumb-content{

    padding: 20px;

    border: solid 1px var(--white);

    border-radius: 1.438rem;

    width: 100%;

}



.banner-thumbs .thumb-item h3{

    font-size: var(--font-45);

    margin-bottom: 5px;

}



.banner-thumbs .thumb-item strong{

    display: block;

    margin-bottom: 40px;

    font-weight: var(--font-light);

}



.banner-thumbs .thumb-item .link-list{

    display: flex;

    flex-direction: column;

    font-weight: var(--font-light);

}



.topBanner{

    position: relative;

}



.topBanner .custom-nav{

    position: absolute;

    top: 0;

    right: 20px;

    height: 100%;

    display: flex;

    flex-direction: column;

    gap: 10px;

    align-items: center;

    justify-content: center;

    padding-bottom: 30px;

}



.topBanner .custom-nav .custom-dots button{

    font-size: 0;

    height: 27px;

    width: 27px;

    border: solid 1px var(--transparent);

    border-radius: 50%;

    background-color: var(--transparent);

    position: relative;

}



.topBanner .custom-nav .custom-dots button::before{

    content: "";

    display: block;

    position: absolute;

    left: 50%;

    top: 50%;

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

    height: 5px;

    width: 5px;

    background-color: var(--white);

    border-radius: 3px;

}



.topBanner .custom-nav .custom-dots .slick-active button{

    border-color: var(--white);

}



.topBanner .custom-nav .custom-arrows{

    display: flex;

    gap: 10px;

    flex-direction: column;

}



.topBanner .custom-nav .custom-arrows .slick-arrow{

    background-size: contain;

    background-repeat: no-repeat;

    height: 55px;

    width: 55px;

    background-color: transparent;

    border-radius: 9px;

    border: 0 none;

    font-size: 0;

}

.topBanner .custom-nav .custom-arrows .slick-arrow:hover,

.topBanner .custom-nav .custom-arrows .slick-arrow:focus{

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

}

.topBanner .custom-nav .custom-arrows .slick-prev{

    background-image: url(../images/slider-arrow-prev.svg);

    order: 2;

}

.topBanner .custom-nav .custom-arrows .slick-next{

    background-image: url(../images/slider-arrow-next.svg);

}



/* whoWeAre section  */


.whoWeAre-section{

    position: relative;
    padding: 70px 0;
    background-position: center top;
    background-repeat: no-repeat;
    background-color: #fafafa;
    overflow: hidden;
    z-index: 1;

}
.whoWeAre-section p{

    color: var(--light-text);

}



.section .section-head{

    display: flex;

    padding: 0 7%;

    margin-bottom: 30px;

}



.section .section-head .col-left{

    position: relative;

    width: 25%;

    padding: 30px 30px 0 30px;

}

.section .section-head .col-left::before,

.section .section-head .col-left::after{

    content: "";

    position: absolute;

}



.section .section-head .col-left::before{

    left: 0;

    top: 0;

    width: calc(100% + 80px);

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

}



.section .section-head .col-left::after{

    right: 0;

    top: -20px;

    height: 100%;
    max-height: 190px;

    border-right: solid 1px var(--secondary-color) ;

}



.section .section-head h2{

    margin-bottom: 8px;

}



.section-head h2{ color: var(--secondary-color);}

.section-head h2 b{

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

    font-weight: inherit;

}



.section .section-head p{

    max-width: 570px;

}



.section .section-head .col-right{

    position: relative;

    max-width: 792px;

    padding: 16px 30px;

}



/* whoWeAre carousel */

.whoWeAre-carousel .slick-list {overflow: visible !important;}



.whoWeAre-carousel .slick-slide{

    padding: 0 15px;

}



.whoWeAre-item{

    padding: 20px;

    border-radius: 25px;

    background-color: var(--white);

}

.whoWeAre-item .item-head{

    display: flex;

    justify-content: space-between;

    gap: 30px;

    border-bottom: solid 1px rgba(0, 0, 0, 0.1);

    padding-bottom: 40px;

    margin-bottom: 30px;

}



.whoWeAre-item .item-head h3{

    font-size: var(--font-30);

    margin: 0;

    flex: 1;

}



.whoWeAre-item .item-head .item-icon{

    width: 55px;

    min-width: 45px;

}



/* Why Choose Us Section */

.whyChooseUs-section{

    padding: 70px 0;

    background-repeat: no-repeat;

    background-size: cover;

    position: relative;

    overflow: hidden;

}



.overlay-text{

    position: absolute;

    left: 0;

    bottom: 0;

    width: 100%;

    text-align: center;

    color: rgba(255, 255, 255, 0.07);

    font-size: clamp(17.5rem, 34.452vw - 4.592rem, 36.75rem);

    line-height: 0.17;

    font-weight: 800;

    z-index: 0;

}



.whyChooseUs-section .container{

    display: flex;

    gap: 40px 15%;

}



.whyChooseUs-section .section-left{

    width: 45%;

    position: relative;

    z-index: 1;

}



.checkList {

    display: flex;

    flex-wrap: wrap;

    gap: 10px;

    margin-bottom: 20px;

}



.checkList li{

    width: calc(50% - 5px);

    min-width: 280px;

    display: flex;

    gap: 8px;

}



.checkList li::before{

    content: "";

    background: url(../images/check-mark.png) no-repeat;

    width: 25px;

    height: 25px;

    margin-top: -2px;

}



.whyChooseUs-section .section-left .checkList {

    max-width: 500px;

    margin-bottom: 30px;

}



.whyChooseUs-section .section-left .checkList li {

     min-width: 220px;

}



.whyChooseUs-section .section-left p{

    margin-bottom: 40px;

}



.whyChooseUs-section .section-right{

    flex: 1;

}

.whyChooseUs-section .section-right .image-warpper{

    border-radius: 20px;

    overflow: hidden;

}



.whyChooseUs-section .section-right .image-warpper img{

    width: 100%;

}



/* Our service Section */



.ourServices-section{

    padding: 80px 0 0;

    background-position: right top;

    background-repeat: no-repeat;

}



/* ourServices slider */

.ourServices-slider-Wrapper{

    position: relative;

}



.ourServices-slider-Wrapper .custom-nav{

    position: absolute;

    bottom: 20px;

    right: 20px;

    display: flex;

    flex-direction: column;

    gap: 10px;

}



.ourServices-slider-Wrapper .custom-arrows{

    display: inline-flex;

    gap: 10px;

}

.ourServices-slider-Wrapper .slick-arrow{

    font-size: 0;

    width: 43px;

    height: 43px;

    border-radius: 50%;

    background: white url(../images/grey-arrowNext-circle.svg) center center no-repeat;

    transition: all 0.2s ease;

    border: solid 1px var(--secondary-color);

}



.ourServices-slider-Wrapper .slick-arrow.slick-prev{

    background-image: url(../images/grey-arrowPrev-circle.svg);

}



.ourServices-slider-Wrapper .slick-arrow:hover{

    background-image: url(../images/btn-arrowRight-white-circle.svg);

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

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

}

.ourServices-slider-Wrapper .slick-arrow.slick-prev:hover{

    background-image: url(../images/btn-arrowLeft-white-circle.svg);

}



.ourServices-item{

    display: flex !important;

}



.ourServices-item > .section-left{width: 50%;}

.ourServices-item > .section-left .img-wrapper img{

    width: 100%;

}



.ourServices-item > .section-right{flex: 1;

    padding: 160px 30px 100px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: flex-start;

}



.ourServices-item .section-right h3{

    font-size: var(--h2-size);

    font-weight: 600;

    color: var(--secondary-color);

    margin: 0;

}



.ourServices-item .content-head{

    border: solid 1px #DCDCDC ;

    border-width: 1px 0 ;

    position: relative;

    margin-bottom: 40px;

    width: 100%;

}



.ourServices-item .content-head::before{

    content: "";

    position: absolute;

    width: 92px;

    height: 5px;

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

    left: 50px;

    top: -5px;

}



.ourServices-item .content-head .content-icon{

    position: absolute;

    left: 260px;

    bottom: 100%;

    width: 72px;

}



.ourServices-item .content-head h3{

    max-width: 640px;

}



.ourServices-item p{

    color: var(--light-text);

    max-width: 590px;

    margin-bottom: 60px;

}



.slick-counter{

    font-size: var(--font-30);

    font-weight: 300;

    display: inline-flex;

    align-items: flex-end;

    justify-content: flex-end;

    padding-right: 6px;

}

.slick-counter strong{

    min-width: 40px;

    text-align: right;

    padding-right: 3px;

}

.slick-counter span{

    font-size: var(--font-18);

    padding-bottom: 4px;

}



/* gallery section */

.gallery-section{

    padding: 170px 0 70px;

    position: relative;

    overflow: hidden;

}



.gallery-section .section-head{

    position: absolute;

    width: 100%;

    text-align: center;

    top: 0;

    left: 0;

    z-index: 0;

}



.gallery-section .section-head h2{

    color: rgba(0, 0, 0, 0.05);

    font-size: clamp(9.375rem, 24.049vw - 6.047rem, 22.813rem);

    line-height: 0.75;

}



.gallery-slider{

    position: relative;

    z-index: 1;

    max-width: 944px;

    margin: 0 auto;

}



.gallery-slider .slick-list{

    overflow: visible;

}



.gallery-slider .slick-slide{

    padding: 0 15px;

}



.gallery-slider .gallery-item{

    border-radius: 20px;

    overflow: hidden;

    position: relative;

}

.gallery-slider .slick-slide img{

    filter: grayscale(100%);

    transition: all 0.3s ease;

    opacity: 0.4;

    aspect-ratio:944/685;  

    object-fit: cover;

}

/* slick-slide slick-current slick-active slick-center */

.gallery-slider .slick-slide.slick-current img {

    filter: grayscale(0);

    opacity: 1;

}



.gallery-slider .gallery-item .gallery-info{

    position: absolute;

    left: 0;

    top: 0;

    height: 100%;

    width: 100%;

    padding: 30px;

    display: none;

    flex-direction: column;

    background-color: rgba(0, 0, 0, 0.5);

    align-items: flex-start;

    justify-content: space-between;

    transition: all 0.4s ease;

    opacity: 0;

}



.gallery-slider .slick-slide.slick-current .gallery-item .gallery-info{

    display: flex;

}



.gallery-slider .slick-slide.slick-current .gallery-item:hover .gallery-info{

    opacity: 1;

}



.gallery-slider .gallery-info .tagline{

    font-size: 16px;

}

.gallery-slider .gallery-info h2{

    font-size: var(--font-30);

    transition: all 0.3s ease;

    transform: scale(1.3);

    transform-origin: left bottom;

    max-width: 300px;

}



.gallery-slider .gallery-item:hover .gallery-info h2{

    transform: scale(1);

}



.gallery-slider .gallery-info .post-location,

.gallery-slider .gallery-info .post-year{font-size: 16px;}



.gallery-slider .gallery-item .gallery-info > *{

    color: var(--white);

}



.view-hover{    position: relative;}

.view-hover .view-text {

  position: absolute;

  top: 0;

  left: 0;

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

  background: rgba(0, 0, 0, 0.9);

  color: var(--white);

  opacity: 0;

  transition: opacity 0.2s;

  height: 80px;

  width: 80px;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: var(--font-26);

  z-index: 2;

}

.view-hover:hover .view-text {

  opacity: 1;

}



/* collaboration section */

.collaboration-section{

    padding: 70px 0;

    background-position: right top;

    background-repeat: no-repeat;

}



.collaboration-section .section-content{

    display: flex;

    gap: 40px;

    align-items: center;

}



.collaboration-section .section-left{

    width: 40%;

}

.collaboration-section .section-right{
    flex: 1;
    padding-right: 5%;
    padding-left: 30px;
}

/* footer */



.footer{

    background-size: cover;

    background-position: center top;

    background-repeat: no-repeat;

    position: relative;

    padding-bottom: 245px;

    overflow: hidden;

}



.footer::before {

    content: "";

    background-color: rgba(0, 0, 0, 0.5);

    position: absolute;

    width: 100%;

    height: 100%;

    left: 0;

    top: 0;

    z-index: 0;

}



.footer .overlay-text{

    font-size: clamp(15rem, 30.984vw - 4.869rem, 32.313rem);

    color: rgba(255, 255, 255, 0.2);

    line-height: 0.48;

}



.footer .footer-container{

    position: relative;

    z-index: 1;

    background-color: rgba(0, 0, 0, 0.6);

    backdrop-filter: blur(5px);

    -webkit-backdrop-filter: blur(5px);

}



.footer-main {

    padding: 50px 0 90px;

}



.footer-main .container{

    display: flex;

    gap: 30px;

}



.footer-main .section-left{

    width: 35%;

    padding-right: 8%;

    max-width: 460px;

}



.footer-main .section-left .footer-logo{

    margin-bottom: 50px;

}



.footer-main .section-left strong{

    font-size: var(--font-26);

    font-weight: normal;

    display: block;

    margin-bottom: 25px;

}



.footer-main .section-left strong a{

    text-decoration: underline;

}



.footer-main .section-left strong a:hover{

    text-decoration: none;

}



.footer-main .section-left small{

    opacity: 0.8;

}



.footer-main .section-right{

    display: flex;

    gap: 30px;

    flex: 1;

    justify-content: space-between;

}



.footer-main .section-right a:hover{

    text-decoration: underline;

}



.footer-main h4{

    font-size: var(--font-22);

    font-weight: 500;

}



.section-right .contact-info{

    max-width: 312px;

}



.contact-details *{

    color: rgba(255, 255, 255, 0.85) !important;

}

.contact-details > div{

margin-bottom: 16px;

}

.contact-details > div strong{

    display: block;

    font-size: var(--font-18);

    font-weight: normal;

    margin-bottom: 6px;

}

.contact-details > div p,

.contact-details > div a{

    margin: 0;

    font-size: 15px;

}



.footer-links li{

    margin-bottom: 10px;

}



.footer .footer-bottom .container{

    border-top: solid 1px #707070 ;

    padding: 20px 0;

    text-align: center;

}



.footer-bottom span{

    color: rgba(255, 255, 255, 0.6) !important;

    font-size: 15px;

}

.footer-bottom span a{

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

}



.footer-bottom span a:hover{

    text-decoration: underline;

}



/* About Us page  */



/* Page title  */

.page-title-section{

    background-size: cover;

    background-repeat: repeat;

    position: relative;

}



.page-title-section::before {

    content: "";

    background-color: rgba(0, 0, 0, 0.5);

    position: absolute;

    width: 100%;

    height: 100%;

    left: 0;

    top: 0;

    z-index: 0;

}



.page-title-section > .container{

    position: relative;

    z-index: 1;

    text-align: center;

    padding-top: 179px;

    padding-bottom: 126px;

}



.page-title-section h1{

    font-size: var(--font-55);

    font-weight: 600;

    margin-bottom: 12px;

}



/* started section */

.started-section{

    padding: 70px 0;

}



.started-section .container{

    display: flex;

    gap: 40px 4%;

}

.started-section .section-left{width: 68%;}

.started-section .section-content{display: flex; gap: 40px;}

.started-section .section-content .left-side{

    width: 55%;

}



.started-section h2{

    width: 80%;

}



.started-section .left-side strong{

    font-size: clamp(10rem, 18.009vw - 1.548rem, 20.063rem);

    color: var(--primary-color);

    font-weight: 800;

    line-height: 0.75;

    display: block;

    text-align: center;

    padding-top: 30px;

}



.started-section .left-side span{

    font-size: var(--font-34);

    font-weight: 600;

    color: rgba(0, 0, 0, 0.8);

    line-height: 1;

    display: flex;

    width: 85%;

    margin: 0 auto;

    justify-content: flex-end;

}



.started-section .section-content .right-side{

    flex: 1;

}



.started-section .right-side .image-wrapper {

    margin-top: -55px;

    border-radius: 20px;

    overflow: hidden;

}



.started-section .section-right{flex: 1;}



.started-section .section-right .image-wrapper{

    border-radius: 20px;

    overflow: hidden;

    margin-bottom: 24px;

}



.started-section .section-right {

    font-size: 17px;

    color: var(--light-text);

}



.fullWidth-image img{

    width: 100%;

}



/* Our History */



.ourHistory-section{

    padding: 70px 0;

    overflow: hidden;

}

.ourHistory-carousel .slick-list{

    overflow: visible !important;

}



.ourHistory-carousel .carousel-item{

    display: flex !important;

    flex-direction: column;

    justify-content: flex-start;

}

.ourHistory-carousel .image-wrapper{

    aspect-ratio: 1/1;

    max-width: 164px;

    border-radius: 20px;

    overflow: hidden;

    margin-bottom: 30px;

}

.ourHistory-carousel hr{

    position: relative; 

    overflow: visible;

    border: 0;

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

    margin-bottom: 30px;

}

.ourHistory-carousel hr::before{

    content: "";

    position: absolute;

    top: 0;

    left: 0;

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

    height: 19px;

    width: 19px;

    border-radius: 50%;

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

}



.ourHistory-carousel .carousel-item h3{

    font-size: var(--font-30);

}



.ourHistory-carousel .carousel-item p{

    font-size: 17px;

    color: var(--light-text);

    padding-right: 20px;

}



/* GSC Banner */



.gsc-banner{

    position: relative;

    display: flex;

    align-items: center;

}

.gsc-banner h2{

    flex: 1;

    font-size: clamp(12.5rem, 30.089vw - 6.795rem, 29.313rem);

    color: rgba(0, 0, 0, 0.05);

    border-bottom: solid 50px #ECECEC;

    line-height: 0.7;

}



.gsc-banner .image-wrapper{

    width: 55%;

}



/* How We Work */



.howWeWork-section{

    padding: 0 0 70px;

}



.howWeWork-section .section-head{

    display: flex;

    gap: 6%;

    align-items: flex-end;

    margin-bottom: 40px;

}



.howWeWork-section .section-head .left-col{

    width: 50%;

}



.howWeWork-section .section-head .right-col{

    flex: 1;

}

.howWeWork-section  .section-head p{

    font-size: var(--font-20);

}



.howWeWork-caruosel{margin-bottom: 70px;}



.howWeWork-caruosel .slick-track{display: flex !important;}

.howWeWork-caruosel .slick-slide{

    padding: 8px;

  display: flex !important;      /* force flex */

  height: auto !important;

}



.howWeWork-caruosel .slick-slide > div {

  display: flex;

  flex-direction: column;

  height: 100%;

}



.howWeWork-caruosel .slick-slide > div > div{

    flex: 1;

    display: flex !important;

    flex-direction: column;

}



.howWeWork-caruosel .caruosel-item{

    background-color: var(--white);

    padding: 8px;

    border-radius: 12px;

    border: solid 1px #D4D4D4;

}



.howWeWork-caruosel .image-wrapper{

    border-radius: 12px;

    overflow: hidden;

    margin-bottom: 20px;

}



.howWeWork-caruosel h3{

    font-size: var(--font-22);

    font-weight: 600;

    line-height: 1.2;

    margin-bottom: 10px;

    display: flex;

    flex: 1;

}

.howWeWork-caruosel h3 .sn-heading{

    color: var(--primary-color); 

    margin-right: 4px;

}

.howWeWork-caruosel p{

    color: var(--secondary-color);

    margin: 0;

}



.howWeWork-caruosel .sn-item{

    color: #E2E2E2;

    font-size: clamp(3.125rem, 4.474vw + 0.256rem, 5.625rem);

    display: block;

    text-align: right;

    line-height: 0.5;

    font-weight: bold;

    margin-bottom: 10px;

}



.bottom-text p{

    text-align: center;

    margin: 0;

}

.bottom-text p a{

    color: var(--primary-color);

}



.bottom-text p a:hover{

    text-decoration: underline;

}

/* interiorDesign section */



.interiorDesign-section{

    padding: 220px 0 120px;

    position: relative;

}



.interiorDesign-section::before {

    content: "";

    background-color: rgba(0, 0, 0, 0.5);

    position: absolute;

    width: 100%;

    height: 100%;

    left: 0;

    top: 0;

    z-index: 0;

}



.interiorDesign-section .container{

    display: flex;

    gap: 40px 6%;

    position: relative;

    z-index: 2;

}



.interiorDesign-section .section-left{

    flex: 1;

}



.interiorDesign-section .section-left h2{

    line-height: 1;

}



.interiorDesign-section .section-right{

    width: 60%;

}



.interiorDesignCarousel-width{

    padding-right: 20%;    

    overflow: hidden;

}



.interiorDesignCarousel-width .slick-list{

    overflow: visible !important;

    margin-left: -10px;

}



.interiorDesign-carousel{

    margin-bottom: 30px;

}



.interiorDesign-carousel .carousel-item{

    padding: 0 10px;

}

.interiorDesign-carousel .image-wrapper{

    border-radius: 20px;

    overflow: hidden;

}

.interiorDesign-carousel .image-wrapper img{
    width: 100%;
}


.interiorDesignCarousel-width .custom-arrows{

    display: inline-flex;

    gap: 20px;

}



.interiorDesignCarousel-width .slick-arrow{

    font-size: 0;

    width: 43px;

    height: 43px;

    border-radius: 50%;

    background: var(--transparent) url(../images/btn-arrowRight-white-circle.svg) center center no-repeat;

    transition: all 0.2s ease;

    border: solid 1px var(--white);

}



.interiorDesignCarousel-width .slick-arrow.slick-prev{

    background-image: url(../images/btn-arrowLeft-white-circle.svg);

}



.interiorDesignCarousel-width .slick-arrow:hover{

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

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

}





/* ourServies-page */



.ourServies-page{

    padding: 70px 0;

    background: url(../images/ourServices-pageBG.jpg) right top no-repeat;

}



.ourServies-page.section .section-head .col-right{

    max-width: 892px;

}



.ourServices-grid{

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));

    gap: 40px;

    margin-bottom: 40px;

}



.ourServices-grid .ourServices-item{

    flex-direction: column;

}



.ourServices-grid .ourServices-item .image-wrapper{

    position: relative;

    overflow: hidden;

    border-radius: 28px;

    margin-bottom: 20px;

}



.ourServices-grid .ourServices-item .image-wrapper .sn-heading{

    position: absolute;

    left: 20px;

    top: 20px;

    font-size: var(--font-34);

    color: var(--white);

    font-weight: 800;

    line-height: 1;

    z-index: 1;

}



.ourServices-grid .ourServices-item h3{

    font-size: var(--font-34);

}



.ourServices-grid .ourServices-item p{

    color: var(--secondary-color);

    margin: 0 0 20px;

}



.ourServices-grid .image-wrapper img{

    transition: all 0.4s ease;

    transform: scale(1);

    width: 100%;

    aspect-ratio: 447/475;

    object-fit: cover;

}



.ourServices-grid .image-wrapper:hover img{

    transform: scale(1.07);

}

/* Service Detail page  */

.images-grid{
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-bottom: 30px;
}

.images-grid .image-wrapper{
    min-width: 300px;
    flex: 1;
}

.images-grid .image-wrapper img{
    width: 100%;
    border-radius: 20px;
    overflow: hidden;
    max-height: 300px;
    object-fit: cover;
}

/* projects page */



.projects-page{

    padding: 70px 0;

}



.section-head.center-align{

    text-align: center;

}



.projects-page .section-head{

    margin-bottom: 40px;

}



.projects-List{



}



.projects-item{

    position: relative;

    overflow: hidden;

    border-radius: 25px;

    margin-bottom: 40px;

}

.projects-item .image-wrapper img {
    transition: all 0.4s ease;
    transform: scale(1);
    width: 100%;
    height: 100%;
	object-fit:cover;
}
.projects-item .image-wrapper {
    width: 100%;
    height: 650px;
    overflow: hidden;
	object-fit:cover;
}


.projects-item:hover .image-wrapper img {

    transform: scale(1.03);

}



.projects-item .projects-info{

    position: absolute;

    left: 0;

    top: 0;

    height: 100%;

    width: 100%;

    padding: 40px 50px;

    display: flex;

    flex-direction: column;

    /* background-color: rgba(0, 0, 0, 0.5); */

    background: transparent linear-gradient(269deg, #FFFFFF00 0%, #000000 100%) 0% 0% no-repeat padding-box;

    align-items: flex-start;

    justify-content: space-between;

    transition: all 0.4s ease;

}



.projects-item .tagline{

    font-size: 16px;

}

.projects-item h2{

    font-size: var(--font-30);

    transition: all 0.3s ease;

    transform: scale(1.3);

    transform-origin: left bottom;

    max-width: 300px;

}



.projects-item .projects-info:hover h2{

    transform: scale(1);

}



.projects-item .post-location,

.projects-item .post-year{font-size: 16px;}



.projects-item .projects-info > *{

    color: var(--white);

}



.loadMore-container{

    overflow: hidden;

    padding: 20px 0;

}

.loadMore-btn{

    width: 70px;

    height: 70px;

    background: url(../images/btn-arrow-blue.svg) center center no-repeat;

    background-size: contain;

    border-radius: 50%;

    border: 0 none;

    transform: rotate(135deg);

    display: block;

    margin: 0 auto;

}



/* projectDetail page */



.projectDetail-page{

    padding: 70px 0 0;

}



.info-list{display: grid;

    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

    border-bottom: solid 1px var(--border-color);

    padding: 30px 0;

    margin-bottom: 30px;

    gap: 40px;

}



.info-list .list-item{

    display: flex;

    flex-direction: column;

}



.info-list .list-item span{

    color: var(--secondary-color);

    font-size: var(--font-20);

}



.info-list .list-item strong{

    font-size: var(--font-26);

    font-weight: 600;

}



.projectDetail-page h3{

    font-size: var(--font-30);

    font-weight: 800;

}



.featured-image{

    border-radius: 25px;
    overflow: hidden;
    margin-bottom: 30px;
    height: 600px;
    object-fit: cover;
	

}



ul.defaultList{

    display: flex;

    gap: 20px;

    flex-wrap: wrap;

    margin-bottom: 30px;

    padding-top: 10px;

}

ul.defaultList li{

    width: calc(50% - 10px);

    position: relative;

    padding-left: 40px;

    min-width: 250px;

}



ul.defaultList li::before {

    content: "";

    background: url(../images/check-mark.png) no-repeat;

    width: 25px;

    height: 25px;

    margin-top: -2px;

    display: inline-block;

    position: absolute;

    left: 0;

    top: 6px;

}



.projectInfo{

    display: flex;

    border: solid 1px #D6D6D6;

    padding: 30px;

    margin-bottom: 30px;

    gap: 40px;

    justify-content: space-around;

    flex-wrap: wrap;

}



.projectInfo .info-item{

    display: flex;

    flex-direction: column;

    text-align: center;

    position: relative;

    min-width: 150px;

}



.projectInfo .info-item::before{

    content: "";

    position: absolute;

    width: 1px;

    height: 80px;

    transform: rotate(25deg);

    background-color: #D6D6D6;

    left: -6.5vw;

}



.projectInfo .info-item:first-child:before{

    display: none;

}



.projectInfo .info-item strong{

    font-size: var(--font-40);

    font-weight: 800;

}



.projectInfo .info-item span{

    font-size: var(--font-20);

}



.projectTabs {

  width: 100%;

  margin-bottom: 20px;

  padding: 20px 0 0;

}



.projectTabs .container{

    overflow-x: auto;

}



.projectTabs .tab-links {

  margin: 0;

  padding: 0;

  list-style: none;

  display: flex;

  margin-bottom: 30px;



    white-space: nowrap;

    overflow-x: auto;

    scroll-behavior: smooth;

}



.projectTabs .tab-links li {

  margin-right: 10px;

}



.projectTabs .tab-links li a {

    border: solid 1px #D6D6D6;

    border-radius: 25px;

    padding: 6px 20px;

    display: block;

    font-size: var(--font-20);

    display: flex;

    gap: 8px;

    align-items: center;

    white-space: nowrap;

}



.projectTabs .tab-links i{

    max-width: 18px;

    max-height: 18px;

    min-width: 18px;

}



.projectTabs .tab-links li.active a {

  background: var(--primary-color);

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

  color: #fff;

}



.projectTabs .tab-links li.active img {

    filter: invert(100%) brightness(100%);

}



.projectTabs .tab-content{

    overflow: hidden;

    max-width: 100%;

}



.projectTabs .tab-content .tab {

  display: none;

}



.projectTabs .tab-content .tab.active {

  display: block;

}



.relatedProjects{

    padding: 70px 0 0;

}

.relatedProjects .ourServices-grid{

    margin: 0;

}



.relatedProjects h3{

    font-weight: 600;

    margin-bottom: 14px;

    line-height: 1.2;

}

.relatedProjects .post-location,

.relatedProjects .post-year{

    color: var(--secondary-color);

}





#tab1-4 .image-wrapper{ 

    border-radius: 25px;

    overflow: hidden;}



/* Contact Us page  */



.contact-page{

    padding: 70px 0 0;

    background: url(../images/contact-BG.png) right top no-repeat; 

}



.contact-page .contact-info{

    display: flex;

    gap: 40px;

    padding: 40px 7%;

}



.contact-page .contact-info .address-info{

    max-width: 375px;

    padding-left: 30px;

}



.contact-page .contact-info strong{

    font-size: var(--font-20);

    color: var(--secondary-color);

    font-weight: normal;

}

.contact-page .contact-info p{

    margin: 0;

    font-size: var(--font-26);

    font-weight: 600;

}



.contact-page .contact-info .support-info a{

    font-size: var(--font-30);

    font-weight: 600;

    margin-bottom: 24px;

    display: inline-block;

}



.contact-page .contact-info .support-info a.phone{

    color: var(--primary-color);

    text-decoration: underline;

}



.contactForm-container{

    display: flex;

    gap: 40px;

}



.contactForm-container .image-wrapper{

    width: 43%;

    max-width: 620px;

}



.contactForm-wrapper{

    flex: 1;

}



.contactForm-wrapper .form-row .form-col{

    min-width: 200px;}



.contactForm-wrapper .default-input,

.contactForm-wrapper .custom-dropdown .selected{

    background-color: var(--white);

}

.map-section{padding-top: 40px;}
.map-section iframe{
    width: 100% !important; 
}


@media (max-width: 1599.9px) {    

    .header .logo{

        max-width: 100px;

    }

}

@media (min-width: 1200px) and (max-width: 1365.9px) { 
    .banner-thumbs .thumb-item strong,
    .banner-thumbs .thumb-item .link-list p{
        margin: 0;
    }
}

@media (min-width: 1024px) and (max-width: 1199.9px) { 
    .banner-thumbs .thumb-item .thumb-content{
        padding: 10px 15px;
    }
    .banner-thumbs .thumb-item h3{line-height: 1;}
    .banner-thumbs .thumb-item strong,
    .banner-thumbs .thumb-item .link-list p{
        margin: 0;
        font-size: 14px;
    }
}

@media (max-width: 1199.9px) {    

    .container { 

        max-width: 100% !important;

        width: 100% !important;

        padding-left: 20px; 

        padding-right: 20px;

    }

}



@media (max-width: 1024.9px) {

    /* Mobile nav  */

    .header .container {padding: 8px 20px;}

    .header-links{gap: 12px;}

    

    .header .logo {

        max-width: 100px;

        position: static;

        transform: none;

    }



    .header .nav {

        display: none;

        position: fixed;

        top: 82px;

        left: 0;

        width: 100%;

        height: calc(100vh - 82px);

        background: var(--black);

        z-index: 999;

        transform: translateX(-100%);

        transition: transform 0.3s ease;

        overflow: auto;

        padding: 20px;

    }



    .menu-item-has-children .sub-menu{

        position: static;

    }



    .menu-item-has-children .dropdownIcon{

        position: absolute; 

        top: 6px;

        right: 20px;

        padding: 10px;

    }



    .header .container .btn{

        margin-left: auto;

        margin-right: 10px;

    }



    body.active{

        overflow: hidden;

    }

    .header .nav.active {

        display: flex;

        transform: translateX(0);
        padding-top: 60px;
    }



    .header .nav .nav-list{

        flex-direction: column;        
        gap: 0;
    }



    .nav-list li a{display: block;
        font-size: var(--font-30);
        color: var(--white);
        font-weight: bold;
    }



    .hamburger {

        display: flex;

        position: relative;

        z-index: 1000;

    }

    /* home banner  */

    .topBanner-item .section-content,
    .whyChooseUs-section .container,
    .whyChooseUs-section .container,
    .ourServices-item,
    .collaboration-section .section-content,
    .footer-main .container,
    .started-section .container,
    .contactForm-container,
    .contact-page .contact-info,
    .howWeWork-section .section-head,
    .interiorDesign-section .container
    {flex-direction: column !important;}

    .topBanner-item .section-content > *,
    .topBanner-item h2,
    .whyChooseUs-section .container > *,
    .whyChooseUs-section .container > *,
    .ourServices-item > *,
    .collaboration-section .section-content > *,
    .footer-main .container > *,
    .started-section .container > *,
    .contactForm-container > *,
    .contact-page .contact-info,
    .howWeWork-section .section-head > *,
    .interiorDesign-section .container > *
    { width: 100% !important;}

    .whyChooseUs-section .section-left{
        order: 2;
    }

    .banner-thumbs .thumb-item{
        min-height: 230px;
        max-height: 230px;
    }

    .interiorDesignCarousel-width {
        padding: 0;
    }
    .interiorDesign-section{
        padding: 70px 0;
    }


.section .section-head .col-left{width: auto;}

.contactForm-container .image-wrapper{
    max-width: 480px;
    margin: 0 auto 50px;
}

.started-section .section-right .image-wrapper{
    max-width: 300px;
}

.started-section .section-right p{
    max-width: 500px;
}

.collaboration-section .section-left .image-wrapper{
    max-width: 600px;
    width: 80%;
}

.ourServices-item > .section-left .img-wrapper img{
    max-height: 350px;
    object-fit: cover;
}

.projectInfo .info-item::before{
    display: none;
}

.ourServices-grid {
    grid-template-columns: repeat(auto-fit, minmax(296px, 1fr));
}

}

@media (max-width: 768.9px) {

    .topBanner-item .container{padding-top: 60px;}

    .topBanner-item .content-right{display: none;}

    .section .section-head,
    .started-section .section-content,
    .gsc-banner
    {flex-direction: column !important;
        padding: 0;
    }
    
    .section .section-head > *,
    .started-section .section-content > *,
    .gsc-banner > *
    { width: 100% !important;}

    .gsc-banner{margin-bottom: 40px; gap: 40px;}
    .gsc-banner h2 {order: 2;}

    .started-section h2{width: 100%;}

    .started-section .right-side .image-wrapper{
        margin: 0;
    }

    .started-section .section-right .image-wrapper{
        max-width: 100%;
    }

    .started-section .section-right .image-wrapper img,
    .started-section .right-side .image-wrapper img{width: 100%;}

    .footer-main .section-right{
        flex-wrap: wrap;
    }

    .section .section-head .col-left::before{
        width: 100%;
    }

    .section .section-head .col-left::after{
        right: 10px;
    }

    .buttons-set{
        flex-wrap: wrap;
    }
.gallery-slider .slick-slide img,
.projects-item .image-wrapper img,
.beer-slider>img,
.tab video
{
    min-height: 380px;
    object-fit: cover;
    object-position: center;
}

.projects-item .projects-info{
    padding: 30px;
}

.gallery-slider .gallery-info h2,
.projects-item h2{
    transform: scale(1);
}

.section .section-head{
    padding: 0;
}

}

@media (max-width: 576.9px) {

ul.defaultList{
    flex-direction: column;
}

ul.defaultList li,
.section-right .contact-info{
    width: 100%;
}

.contact-page .contact-info .address-info{
    padding-left: 0;
}

.projectTabs .tab-links i{
    display: none;
}

}