*:focus {outline: none !important;}
body {font-family: 'roboto', sans-serif !important;}
p, span, li, a {
    font-family: 'poppins', sans-serif !important;
}
html {scroll-behavior: smooth;}
ul,ol {list-style: none;padding: 0;}
a, button, img, input, span {
  transition: all 0.3s ease 0s;
}
a:hover {
  text-decoration: none !important;
}




/* Journey Section Styling */
.our-journey {
    /*padding: 60px 0;*/
    overflow: hidden;
}

.video-section-wrapper video {
    outline: none;
    border: none;
    border-radius: 15px;
}

/* Mobile responsive fixes */
@media (max-width: 991px) {
    .our-journey .content {
        text-align: center;
        margin-bottom: 40px;
    }
    .banner-our-jurnny {
        flex-direction: column;
    }
    .banner-our-jurnny img {
        width: 100% !important;
        margin-bottom: 15px;
    }
    .icon-journey h3 {
        font-size: 14px;
        margin-top: 10px;
    }
}

/* whychooseus */
            
            @media (max-width: 768px) {
                .why-header-wrapper {
                    margin-left: 0 !important; /* Mobile pe zero kar diya */
                    padding-left: 35px; /* Mobile pe icons ke sath align rakhne ke liye */
                }
                .why-features {
                    padding-left: 35px !important;
                }
            }
        

.box-our {
    padding: 20px;
    transition: all 0.3s ease;
}
.box-our:hover {
    transform: translateY(-5px);
}


.header {
    background-image: url('../images/header-bg.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: -200px center;
}
.main-menu .navbar {padding: 0 16px;}
.navbar-brand .logo{
    max-width: 178px;
}
.navbar-brand .logo img{
    width: 100%;
}
.navigation li{
    display: inline-block;
}
.navigation li a{
    position: relative;
    display: inline-block;
    color: #ffffff;
    font-size: 14px;
    text-transform: uppercase;
    text-decoration: none;
    padding-top: 33px !important;
    padding-bottom: 33px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 14px;
    white-space: nowrap;
}
.navigation > li:last-child a {margin-right: 0;}
.navigation > li > a:after {
    position: absolute;
    content: '';
    display: block;
    height: 2px;
    width: 0;
    background-color: #AD8B4F;
    left: 50%;
    bottom: 30px;
    transform: translate(-50%,0) translateZ(0);
    transition: width .25s cubic-bezier(.27,.62,.43,1.01);
}
.navigation > li > a:hover:after, .navigation > li > a.active:after {
    width: calc(100% + 6px);
}
.navigation li a:hover, .navigation li a.active {
    color: #AD8B4F;
}

/* dropdown menu css */
.navbar-nav span .hovericon {
    font-size: 18px; 
    display: block !important;
    position: absolute; 
    z-index: 99; 
    right: -7px; 
    top: 0;   
    height: 37px; 
    width: 37px; 
    cursor: pointer; 
    text-align: center; 
    line-height: 39px;
    color: #fff;
}
@media (min-width: 992px) {
    .main-menu ul li span .downicon {display: none !important;}
}
.main-menu ul li span .downicon
{
    font-size: 20px;
    display: block;
    position: absolute;
    z-index: 99;
    right: 24px;
    top: 0;
    height: 40px;
    width: 40px;
    cursor: pointer;
    text-align: center;
    line-height: 40px;
    color: #000;
}
.main-menu ul > li > ul,
.main-menu ul > li > ul > li > ul
{
    box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.20);
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 100;
    visibility: hidden;
    background-color: #17191A;
    opacity: 0;
    transform: translateY(20px);
    box-shadow: 0 3px 20px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease-out;
}
.main-menu ul > li > ul > li > ul {
    left: 100%;
    top: 0;
}
.main-menu ul > li.dropdown:hover > ul,
.main-menu ul > li > ul > li.dropdown:hover > ul
{
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    z-index: 999;
}
.main-menu ul > li > ul > li {display: list-item;}
.main-menu ul > li > ul > li a
{
    position: relative;
    font-size:14px;
    color: #fff;
    padding: 10px 30px 10px 20px !important;
    margin: 0;
}
/*.main-menu ul > li > ul > li a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background-color: #AD8B4F;
    opacity: 0;
    visibility: visible;
}*/
.main-menu ul > li > ul > li a:hover, .main-menu ul > li > ul > li a:focus,
.main-menu ul > li > ul > li > ul > li a:hover, .main-menu ul > li > ul > li > ul > li a:focus {
    color: #fff;
    background-color: #AD8B4F;
    transition: none;
}
.main-menu ul > li > ul > li a:hover:after {
    opacity: 1;
    visibility: visible;
}

@media (max-width: 1199px) {.navigation li a {margin: 0 9px;}}
@media (max-width: 991px) {
    .main-menu ul > li > ul,
    .main-menu ul > li > ul > li > ul {background-color: transparent;box-shadow: inherit; width: 100%; display: none; position: inherit; -moz-transform: translateY(0); transform: translateY(0);}
    .main-menu ul > li > ul > li > ul {left: 0;top: 100%;}
    .main-menu ul > li.dropdown > ul.open,
    .main-menu ul > li.dropdown > ul.open li.dropdown > ul.open { display: block; opacity: 1; visibility: visible; }
    .main-menu ul > li > ul > li a {white-space: inherit !important;padding-left: 8% !important;}
    .main-menu ul li a {padding: 10px 16px;}
    .navigation li a {font-size: 16px;}
}

/* Mobile Menu Css Start */
.mobile-sidebar-menu {
    display: none;
    padding: 11px 16px 20px 16px;
    background-image: url('../images/header-bg.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: -248px center;
}
.mobile-menu {
    height: 100%;
    width: 75%;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    background-color: #000;
    overflow-x: hidden;
    transition: 0.5s;
    transform:  translateX(-100%);
}
.mobile-menu-btn {
    font-size: 22px;
    cursor: pointer;
    color: #fff;
    border: none;
    background-color: transparent;
    border: 1px solid #AD8B4F;
    transition: margin-left .5s;
    position: absolute;
    top: 23px;
    right: 4%;
    width: 40px;
    height: 40px;
    line-height: 40px;
}
#closebtn {background-color: #AD8B4F;}
.mobile-menu .navbar-collapse ul {margin-top: 0;}
.mobile-menu ul li.nav-item {border-bottom: 1px solid #fff;}
.mobile-menu ul li.nav-item:first-child {border-top: 1px solid #fff;}
.mobile-menu .nav-link {
    padding: 0 5% !important;
    height: 44px;
    line-height: 44px; 
    text-transform: capitalize;
    color: #fff;
    font-weight: 400;
    margin: auto;
    width: 100%;
    text-transform: uppercase;
}
.mobile-menu .nav-link:after {content: none !important;}
.mobile-menu-show {height: 70px;}
.mobile-menu ul li span .downicon {color: #fff;}
.mobile-menu ul li ul li ul li a {padding-left: 12% !important;}
.mobile-menu ul li a {font-size: 15px !important;}

@media (max-width: 991px) {.desktop-menu {display: none;}.mobile-sidebar-menu {display: block;}}
/* mobile menu css end */

/*banner-sec*/
.carousel-inner img {
    width: 100%;
    height: 95vh;
}
.banner-sec{
    box-shadow: 0px 10px 10px #efefef;
}
.carousel-caption{
    top: 26%;
    max-width: 550px;
    left: 15% !important;
    bottom: auto !important;
    right: 15% !important;
    margin: auto;
    padding: 20px 25px 25px 25px !important;
    background-color: #000000bd;
    border-bottom-left-radius: 70px;
    border-bottom-right-radius: 70px;
    text-align: center !important;
}
.carousel-caption h1{
    font-size: 35px;
    font-weight: bold;
    color: #ffffff;
    text-transform: uppercase;
}
.carousel-caption p {
    position: relative;
    margin-bottom: 0;
}
.carousel-caption p:after  {
    content: "";
    position: absolute;
    bottom: -28px;
    left: 50%;
    transform: translate(-50%);
    background-color: #BBA37E;
    height: 7px;
    width: 77%;
}
.carousel-indicators li {
    font-size: 13px;
    text-align: center;
    width: 10px !important;
    height: 10px !important;
    border-radius: 50px !important;
    border-top: none !important;
    border-bottom: none !important;
    color: #AD8B4F;
    background-color: #000 !important;
    text-indent: inherit !important;
    opacity: 1 !important;
    transition: all 0.3s ease 0s !important; 
}
.carousel-indicators li.active {
    width: 25px !important;
    background-color: #AD8B4F !important;
}


/*our-journey*/
.our-journey{
    padding-top: 150px;
    /*padding-bottom: 70px;*/
    position: relative;
}
.our-journey .content .back-title {position: absolute;top: 60px;z-index: -1;}
.our-journey .content .back-title h1 {
    font-size: 120px;
    color: #80808012;
    font-weight: bold;
    text-transform: uppercase;
}
.our-journey .content .sub-title h1{
    font-size: 26px;
    color: #ad8b4f;
    margin-bottom: 15px;
    text-transform: uppercase;
}
.our-journey .content .title h2{
    font-size: 25px;
    color: #505151;
}
.our-journey .content .title h2 span{color: #ad8b4f;}
.our-journey .content .text {margin-bottom: 35px;}
.our-journey .content .text p{
    font-size: 16px;
    color: #797979;
    line-height: 20px;
}
.our-journey .content .about-btn {
    font-weight: bold;
    color: #AD8B4F;
    text-decoration: none;
    background-color: #17191A;
    padding: 12px 25px;
}
.our-journey .content .about-btn:hover {
    color: #fff;
    background-color: #AD8B4F;
}

@media (max-width: 767px) {.our-journey .content .back-title h1 {font-size: 40px;}
    .carousel-inner img {
    width: 100%;
    height: 100%;
}
}
.icon-journey{
    padding-top: 37px;
    position: relative;
    margin-top: 30px;
    
    
}

.icon-journey .icon{
    background-image: url('../images/icone-bg.png');
    background-repeat: no-repeat;
    background-size: contain;
}
.box-our::after{
    content: '';
    position: absolute;
    top: 0;
    right: -20px;
    height: 122px;
    background-image: url(../images/arrow.png);
    background-size: cover;
    width: 30px;
}

#shipping::after{
    content: '';
    background-image: inherit;
}
.box-our{
    display: flex;
    align-items: center;
    flex-direction: column;

}
.box-our .icon{
    max-width: 92px;
    margin: 0 auto;
    padding-bottom: 25px;
    min-height: 122px;
    display: flex;
    align-items: flex-end;
}
.box-our h3{
    text-align: center;
    font-size: 20px;
    color: #404040;
    text-transform: capitalize;
}

/*our-product*/
.our-product{
    padding-bottom: 85px;
}

/*title use in all section*/
.main-title {
    text-align: center;
    position: relative;
    padding-bottom: 20px;
}

.main-title h3{
    position: absolute;
    top: 35px;
    left: 50%;
    transform: translate(-50%);
    font-size: 40px;
    color: #ad8b4f;
    margin-bottom: 0;
}
.main-title h3::before{
    content:url('../images/title-equalto.png');
    position: absolute;
    top: -17%;
    left: -58px;
}

.main-title h3::after{
    content:url('../images/title-equalto.png');
    position: absolute;
    top: -17%;
    right: -58px;
}
.boxes .col-md-6 {
    padding-top: 80px;
}
.boxes .box{
    min-height: 390px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
    padding-bottom: 34px;
    cursor: pointer;
    transition: .8s ease;
}
.boxes .box img{
    position: absolute;
    top: -45px;
    right: 10px;
}

.boxes .box h3{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    color: #ffffff;
    font-size: 35px;
    width: 100%;
    text-align: center;
}

.boxes #counter{
    background-image: url('../images/counter.png');    
}

.boxes #bathroom{
    background-image: url('../images/bathroom.png');    
}

.boxes #furniture{
    background-image: url('../images/furniture.png');    
}

.boxes #packaging{
    background-image: url('../images/packaging.png');    
}

.boxes .box a{
    display: inline-block;
    font-size: 20px;
    color: #ffffff;
    background-color: #ad8b4f;
    padding: 10px 15px;
    width: 280px;
    text-align: center;
    border-radius: 4px;
    text-decoration: none;
    position: absolute;
    left: 50%;
    bottom: -26px;
    transform: translate(-50%, 0);
    opacity: 0; 
    visibility: hidden; 
    transition: .5s ease;
}

.boxes .box:hover a{
    opacity: 1;
    visibility: visible;
}

.boxes .box:hover{
    transform: translateY(-25px);
}
@media (max-width: 575px) {
    .boxes .col-md-6:first-child {padding-top: 20px;}
}


      /* nEw services  */

/* Service Section - Professional 3D Look */

.custom-service-area {
    padding-top: 80px;
    background-color: #ffffff;}*/ /* Light greyish-white background 
*/
/* Row ke andar gap maintain karne ke liye */

.service-row-gap {
    margin-top: 20px;
}
.banner-our-jurnny img{
    width: 100%;
}
.service-card {
    background: #ffffff;
    padding: 40px 25px;
    margin-bottom: 40px; /* Do rows ke beech gap yahan se aayega */
    height: calc(100% - 40px);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,0.03);/* Halka sa border for definition */
    /* Mobile pe shadow ko saaf rakhne ke liye precise shadow */
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
    transition: all 0.4s ease-in-out;
}

/* Hover Effect - Proper 3D lift */
.service-card:hover {
    transform: translateY(-15px);
    box-shadow: 0 25px 40px -10px rgba(0, 0, 0, 0.15);
    border-color: #e0e0e0;
}

.service-card-icon {
    width: 95px;
    height: 95px;
    margin-bottom: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.service-card-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: none !important;
}

.service-card-info h3 {
    font-size: 22px;
    font-weight: 700;
    color: #ae8d50;
    margin-bottom: 15px;
}

.service-card-info p {
    font-size: 15px;
    color: #555;
    line-height: 1.6;
    margin-bottom: 25px;
}

/* Button - Website theme se match karta hua (Teal/Dark) */
.service-btn-custom {
    display: inline-block;
    padding: 12px 30px;
    background-color: #ae8d50; /* Professional Dark Blue/Grey */
    color: #fff !important;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 1px;
    border-radius: 6px; /* Squarish round corners */
    text-decoration: none !important;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.service-btn-custom:hover {
    background-color: #ae8d50;
    transform: scale(1.05);
    box-shadow: 0 6px 12px rgba(0,0,0,0.2);
}

/* Mobile adjustments */
@media (max-width: 768px) {
    .service-card {
        margin-bottom: 30px; /* Mobile pe gap */
        padding: 30px 20px;
    }
}
/* nEw services  */


/*service provider*/

.service{
    background-image: url('../images/service-bg.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding-top: 50px;
    padding-bottom: 40px;
    background-color: #f8f9f7;
}

.service .text{
    max-width: 920px;
    margin: 0 auto;
    text-align: center;
    font-size: 15px;
    line-height: 20px;
    color: #8f8f8f;
}

.service-box {
    margin-top: 40px;
}
.service-box .title-sec {
    float: left;
    width: 46px;
    margin-right: 12px;
    margin-bottom: 8px;
}
.service-box .content {
    font-size: 18px;
    line-height: 26px;
    color: #191919;
    display: block;
    float: left;
    width: 83%;
}
.service-box .content h3 {
    font-size: 24px;
    color: #191919;
    font-weight: bold;
}

/* Section padding */
.quality-sec {
    padding-top: 30px;    /* was 50px */
    padding-bottom: 150px; /* was 140px */
}

/* Main title spacing */
/* .main-title {
    margin-top: 55px; 
} */
.main-title h3 {
    font-size: 28px;     /* slightly smaller heading */
}

/* Sample card spacing */
.sample-card {
    margin-bottom: 30px; /* was 50px */
}

/* Heading above carousel */
.sample-card .caption h4 {
    font-size: 20px;      /* smaller than before */
    margin-bottom: 10px;  /* was 15px */
}

/* Paragraph above carousel */
.sample-card p {
    margin-bottom: 15px; /* was 20px */
    font-size: 15px;     /* slightly smaller */
    line-height: 22px;   /* tighter spacing */
}

/* Explore Now button margin */
.sample-program-cta {
    margin: 20px 0; /* was 30px */
}
/* Headings above each carousel */
.sample-card .caption h4 {
    text-align: center;        /* centers the heading */
    font-size: 32px;           /* slightly bigger for a heading */
    font-weight: 700;          /* bold */
    color: #000000;            /* golden color */
    margin-bottom: 12px;       /* space below heading */
}

/* quality-sec sample program sec */

.quality-sec.sample-program-section {
    margin-top: -20px;  
    padding-top: 0;
}




/** quartz **/

/* Quartz heading */
.sample-card:nth-of-type(2) .caption h4 {
    margin-top: -50px;   
    margin-bottom: 15px;
}

/* Quartz paragraph */
.sample-card:nth-of-type(2) p {
    margin-top: 5px;   
    margin-bottom: 10px;
}

/* Quartz images carousel */
.sample-card:nth-of-type(2) .owl-carousel {
    margin-top: 5px;   
    margin-bottom: 10px;
}

/* Explore Now button */
.sample-program-cta {
    margin-top: 15px;  
    margin-bottom: 20px; /
}

.custom-service-area .container{
    margin-top: -150px;
}

/* what our client says section */

.testimonial-section  .container{
    margin-top: -60px;
}

/* CASE STUDIES */

.export-page-section .container{
    margin-top: -90px;
}




/*quality credentials section*/

.quality-sec{
    padding-top: 15px;
    padding-bottom: 140px;
}
#client{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 30px;
}
#client img{
    width: 80px;
}


.your-project{
    margin-top: 30px;
    align-items: center;
}
.your-project-content {margin-top: 30px;}
.your-project-content p {
    font-size: 17px;
    color: #8f8f8f;
    text-align: center;
}
.your-project .text-content h4{
    font-size: 24px;
    color: #666666;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.your-project .text-content h3{
    color: #ad8b4f;
    font-size: 50px;
    text-transform: capitalize;
    margin-bottom: 18px;
}

.your-project p{
    font-size:  18px;
    line-height: 26px;
    color: #191919;
    text-align: center;
}

.your-project .form-content p{
    text-align: left;
    padding-left: 0;
}

.project-form .form-control{
    border: 1px solid #ad8b4f;
    background-color: #FCFEFF;
    height: 40px;
}
.project-form .form-group textarea {height: auto;padding-top: 10px;}
.project-form .form-control::placeholder {
    font-size: 15px;
    color: #919191;
}
.form-content .button-sec{
    padding-top: 64px;
    margin-top: -31px;
}
.form-content .button-sec {
    color: #ffffff;
    text-transform: uppercase;
}

.your-project{
    background-image: url('../images/your-project-bg2.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 14px 6px;
    box-shadow: 0px 32px 11px 0px rgba(53, 53, 53, 0.09);
}
.form-content .button-sec .submit{
    background-color: #ad8b4f;
    padding: 7px 33px;
    color: white;
}
.form-content .button-sec .reset{
    background-color: #191919;
    padding: 7px 33px;
    margin-left: 25px;
    color: white;
}
.form-content .button-sec .submit:hover {background-color: #191919;}
.form-content .button-sec .reset:hover {background-color: #AD8B4F;}
.form-content .button-sec .submit:hover .form-content .button-sec .reset {background-color: #AD8B4F;}
.owl-carousel .item img{
    width: auto; 
    margin: 0 auto;
    display: block;
    max-width: 100% !important;
    width: auto !important;
}
.form-bg-img{
    position: relative;
    background-image: url('../images/your-project-bg.png');
    height: 550px;
    width: 100%;
    border-radius: 10px;
    background-size: cover;
    margin-left: -17px;
}
.form-bg-img .text-content {
    position: absolute;
    top: 68%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    text-align: center;
    padding: 0 20px;
}
.project-form .form-group .placeholder{
    background-color: #FCFEFF !important;
}

/* Card should NOT have fixed height */
.team-card {
    width: 100%;
    max-width: 180px;      /* keeps width same everywhere */
    margin: 0 auto;
    text-align: center;
}

/* Image wrapper behavior */
.team-card img.face {
    width: 100%;
    height: 200px;         /* image crop height */
    object-fit: cover;     /* crop from all sides */
    object-position: center;
    border-radius: 10px;
    display: block;
}

/* Text spacing */
.description-container {
    margin-top: 8px;
}




/* blog section css */
.blog-section {
    background: #f9f9f9;
    padding: 70px 0;
}
.blog-widget {margin-top: 40px;}
.blog-content {position: relative;padding: 20px;box-shadow: 0 12px 16px 0 rgb(0 0 0 / 3%), 0 17px 50px 0 rgb(0 0 0 / 10%);}
.blog-content span {
    color: #AD8B4F;
    width: 80px;
    height: 80px;
    display: flex;
    background: #17191A;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: absolute;
    top: -40px;
}
.blog-content h3 {    
    font-size: 20px;
    margin-top: 45px;
    line-height: 1.5;
    margin-bottom: 0;
    height: 60px;
}
.blog-content a {
    font-weight: 500;
    color: #ffffff;
    text-decoration: none;
    background-color: #AD8B4F;
    padding: 8px 20px;
    display: inline-block;
    margin-top: 30px;
}
.blog-content a:hover {background-color: #ffffff;color:#AD8B4F; border: 1px solid #AD8B4F;}

@media (max-width: 767px) {.blog-content h3 {height: auto;}}

/**************** footer section *******************/
.footer-section{
    border-color: #C2C2C2;
    border: dotted;
    border-radius: 20px;
    padding: 5px;
}
footer{
    background-image: url('../images/footer-bg.png');
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 40px;
    padding-bottom: 15px;
}
.footer-info {padding-left: 15px;}
footer .flogo{
    max-width: 185px;
    padding-bottom: 25px;
}
footer img{width: 100%;}
footer h3{
    font-size: 17px;
    color: #c2c2c2;
    line-height: 18px;
    font-weight: bold;
    padding-bottom: 15px;
    text-transform: uppercase;
    position: relative;
}
footer h3::after{
    content:'';
    position: absolute;
    bottom: 12px;
    left: 0;
    width: 58px;
    height: 1px;
    background-color:#ad8b4f;
}
footer .address{
    display: flex;
}
footer i{
    padding-right: 15px;
    color: #ad8b4f;
    padding-top: 4px;
}
footer p{
    color: #c2c2c2;
    font-size: 15px;
}
footer a{
    color: #c2c2c2;
    font-size: 15px;
    display: inline-block;
}
footer a:hover{
    text-decoration: none;
    color: #ad8b4f;
}
footer ul{
    list-style-type: none;
}
footer ul li{
    padding-bottom: 8px;
}
footer ul li i{
    color: #ad8b4f;
    padding-right: 0;
    margin-right: 12px;
    padding-top: 0;
}
footer .nkba {padding-bottom: 30px;}
footer .nkba-img img {max-width: 100px;display: inline-block;}
footer .nkba-img img:first-child {margin-right: 15px;}
footer .nkba span {
    display: none;
    color: #7e7e7e;
    font-size: 28px;
    line-height: 29px;
    text-transform: uppercase;
}
footer .connect .icon i{
    color: #ad8b4f;
    background-color: #ffffff;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    padding-right: inherit;
    padding-top: 0;
    line-height: 35px;
    text-align: center;
    transition: all 0.3s ease 0s;
}
footer .connect .icon i:hover {
    color: #ffffff;
    background-color: #ad8b4f;
}
.copyright-section {background-color: #ad8b4f;}
.copyright{
    padding-top: 15px;
    padding-bottom: 15px;
}
.copyright p{
    margin-bottom: 0;
    font-size: 16px;
    color: #ffffff;
}
.copyright-section .col-lg-6:last-child .copyright p {text-align: right;}
.copyright p a {color: #fff;}

@media (min-width: 992px) and (max-width: 1199px) {footer .nkba-img img:first-child {margin-right: 0;}}
@media (max-width: 991px) {
    .copyright p {text-align: center;}
    .copyright-section .col-lg-6:last-child .copyright {padding-top: 0;}
    .copyright-section .col-lg-6:last-child .copyright p {text-align: center;}
}


/*-----------------home page responsive css start---------------------*/

/*----------------main menu start----------------*/
@media (min-width: 1400px) {
    .main-menu {background-position: inherit;}
}
@media(max-width: 991px){
    .desktop-bar{display: none;}
    .mobile-sidebar{display: block;}
    .bn-title{top:24%;}
    .bn-title h1{font-size: 32px;}
    /*.carousel-inner img{height: 300px;}*/
}
@media(max-width: 767px){
    .bn-title h1{font-size: 23px;}
    /*.carousel-inner img{height: 236px;}*/
}
@media(max-width: 490px){
    .bn-title{right: 36%; top: 59px; left: 6%;}
}

/*----------banner section start--------------*/
@media (min-width: 1400px) {
    .carousel-caption {max-width: 625px;}
    .carousel-caption h1 {font-size: 45px;}
    .carousel-caption p {font-size: 18px;}
}
@media (max-width: 767px) {
    .carousel-caption {top: 22%;left: 10% !important;right: 10% !important;}
    .carousel-caption h1 {font-size: 28px;}
    .carousel-caption p {font-size: 14px;}
}
@media (max-width: 991px) {
    .carousel-caption h1 {font-size: 30px;}
    .bn-title{top: 0px;}
    .bn-title h1{font-size: 21px;}
}
@media (max-width: 575px) {
    .carousel-caption {
        top: 18%;
        padding: 15px 15px 18px 15px !important;
        border-bottom-left-radius: 50px;
        border-bottom-right-radius: 50px;
    }
    .carousel-caption h1 {font-size: 24px;}
    .carousel-caption p:after {bottom: -21px;height: 6px;}
    .carousel-indicators {bottom: -8px !important;}
}
@media (max-width: 500px) {
    .carousel-caption h1 {font-size: 21px;margin-bottom: 2px;}
    .carousel-caption p {font-size: 13px;}
}
@media (max-width: 450px) {
    .carousel-caption {
        top: 14%;
        padding: 10px 10px 12px 10px !important;
        border-bottom-left-radius: 40px;
        border-bottom-right-radius: 40px;
    }
    .carousel-caption h1 {font-size: 21px;margin-bottom: 3px;}
    .carousel-caption p {font-size: 13px;}
    .carousel-caption p:after {bottom: -15px;}
}
@media (max-width: 400px) {
    .carousel-caption h1 {font-size: 16px;}
    .carousel-caption p {font-size: 10px;}
}
@media (max-width: 350px) {
    .carousel-caption h1 {font-size: 14px;}
}

/*----------our journey section start--------------*/
@media(max-width: 1025px){
  .our-journey{padding-top: 85px;}
  .our-journey .content .sub-title h1{font-size: 23px;}
  .our-journey .content .title h2 {font-size: 40px;}
  .our-journey .content .text p {font-size: 16px;}

}
@media(max-width: 991px){
    .our-journey{padding-top: 46px;padding-bottom: 35px;}
    .our-journey .content .sub-title h2{padding-bottom: 10px;}
    .our-journey .content .title h2{
        padding-bottom: 10px;
        font-size: 32px;
    }
    .our-journey .content .text p{text-align: justify;}
}
@media(max-width: 767px){
    .box-our {margin-top: 35px;}
    .box-our::after{display: none;}
    .icon-journey{padding-top: 0px;}
}
@media(max-width: 650px){
   .box-our h3 {font-size: 17px;}
}
@media(max-width: 600px){
   .our-journey .content .sub-title h1{font-size: 18px;}
   .our-journey .content .text p {font-size: 15px;}
}
@media (max-width: 575px) {
    .icon-journey .col-sm-6:first-child .box-our, .icon-journey .col-sm-6:nth-child(2) .box-our {margin-top: 10px;}
    .our-journey .content .title h2 {font-size: 28px;}
}

/*------------ our product section start ---------*/
@media(max-width: 991px){
    .main-title h3{top: 31px; font-size: 35px; }
    .main-title{padding-bottom: 10px;}
    .our-product{ padding-top: 23px;padding-bottom: 50px;} 
    .boxes .box{min-height: 300px;}
    .boxes .box h3{font-size: 27px;}
    .main-title {padding-bottom: 35px;}
    .boxes {padding-top: 0px;}
    .boxes .box a{
        opacity: 1;
        visibility: visible;
        padding: 8px 24px;
        font-size: 18px;
        bottom: -22px;
    }
}
@media(max-width: 575px){
    .ourproduct .main-title h3{top: 35px; font-size: 26px;}
    .main-title h3 {width: 100%;font-size: 30px;top: 35px;}
    .main-title h3::before {left: 95px;}
    .main-title h3::after {right: 95px;}
}
@media (max-width: 500px) {
    .main-title h3::before {left: 60px;}
    .main-title h3::after {right: 60px;}
}
@media (max-width: 450px) {
    .main-title h3::before {left: 35px;}
    .main-title h3::after {right: 35px;}
}
@media (max-width: 400px) {
    .boxes .box a {width: 240px;}
    .main-title {padding-bottom: 0;}
    .main-title h3::before {left: 15px;}
    .main-title h3::after {right: 15px;}
}


/*------------ our services section start ---------*/
@media (max-width: 767px) {
    .service .main-title h3 {width: 100%;}
    .service .main-title h3::before {left: 48px;}
    .service .main-title h3::after {right: 48px;}
    .service-box {margin-top: 30px;}
}
@media (max-width: 575px) {
    .service {padding-bottom: 20px;}
    .service .main-title {padding-bottom: 30px;}
}
@media (max-width: 520px) {
    .service .main-title h3::before {left: 35px;}
    .service .main-title h3::after {right: 35px;}
}
@media (max-width: 480px) {
    .service .main-title h3::before {left: 12px;}
    .service .main-title h3::after {right: 12px;}
}
@media (max-width: 440px) {
    .service .main-title h3::before {left: 0;}
    .service .main-title h3::after {right: 0;}
}


/*------------ quality section start ---------*/
@media (max-width: 1199px) {
    .your-project {background-size: inherit;background-position: inherit;}
    .form-content .button-sec {padding-top: 12px;margin-top: 0;}
}
@media (max-width: 991px) {
    .quality-sec {padding-bottom: 60px;}
    .quality-sec .content {padding-bottom: 25px;}
    .your-project {background-image: none;}
    .form-content {margin-top: 20px;padding-bottom: 15px;}
}
@media (max-width: 767px) {
    .form-bg-img {margin-left: 0;}
}
@media (max-width: 575px) {
    .quality-sec {padding-top: 40px;}
    .quality-sec .content {padding-bottom: 30px;}
    .quality-slider {padding-bottom: 0;}
    .quality-sec .main-title h3:before {left: 72px;}
    .quality-sec .main-title h3:after {right: 72px;}
    .form-bg-img {background-position: center;}
    .form-bg-img .text-content {top: 60%;}
    .your-project .text-content h4 {font-size: 20px;}
    .your-project .text-content h3 {font-size: 35px;}
    .your-project p {font-size: 16px;}
}
@media (max-width: 500px) {
    .quality-sec .main-title h3:before {left: 50px;}
    .quality-sec .main-title h3:after {right: 50px;}
}
@media (max-width: 450px) {
    .quality-sec .main-title h3:before {left: 30px;}
    .quality-sec .main-title h3:after {right: 30px;}
}
@media (max-width: 400px) {
    .quality-sec .main-title h3:before {left: 8px;}
    .quality-sec .main-title h3:after {right: 8px;}
}
@media (max-width: 360px) {
    .quality-sec .main-title h3:before {left: -8px;}
    .quality-sec .main-title h3:after {right: -8px;}
}


/*------------ footer section start ---------*/
@media (max-width: 991px) {
    .footer-section {padding: 10px 20px 20px 20px;}
    .footer-info {padding-left: 0;}
    .footer-col {margin-top: 20px;}
}


/* --- FLOATING CATALOG BUTTON STYLE --- */
    .catalog_float {
        position: fixed;
        bottom: 20px;
        left: 20px;
        background-color: #ad8b4f;
        color: #FFF !important;
        padding: 12px 25px;
        border-radius: 50px;
        text-align: center;
        font-size: 16px;
        font-weight: 600;
        box-shadow: 0 4px 10px rgba(0,0,0,0.3);
        z-index: 1000;
        text-decoration: none;
        transition: all 0.3s ease;
        display: flex;
        align-items: center;
    }
    .catalog_float:hover {
        background-color: #222;
        color: #ad8b4f !important;
        transform: translateY(-3px);
        text-decoration: none;
    }
    .catalog_float i {
        margin-right: 8px;
        font-size: 20px;
    }



/*****************************************************************
                        About Us Page Css
*****************************************************************/
.inner-page-banner {
    /*background-image: url(../images/aboutus/inner-page-banner.jpg);*/
   background-image:  url('../images/header-bg.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: center center;  
    padding: 1% 0;
}
.inner-page-banner-title {text-align: center;}
.inner-page-banner-title h1 {
    font-size: 40px;
    font-weight: bold;
    color: #fff;
    margin-bottom: 15px;
}
.breadcrumbs a {color: #fff;vertical-align: middle;}
.breadcrumbs i {color: #fff;vertical-align: middle;margin: 0 5px;}
.breadcrumbs a:hover {color: #AD8B4F;}
.breadcrumbs span {color: #AD8B4F;font-weight: 500;vertical-align: middle;}
.about-page-section {
    padding-top: 60px;
    margin-top: 80px;
}
.about-page-parallex {
    background-image: url(../images/aboutus/1.png?v=1);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-position: center center;
}
/* .about-page-content {
    background-color: #17191A;
    width: 35%;
    padding: 30px 40px;
    transform: translateY(-85px);
} */

.about-page-content {
    width: 100% !important;
    max-width: 720px;         /* Wide & clean layout */
    margin-left: 0 !important;
    margin-right: auto !important;
    padding: 35px 40px !important;
    background-color: #17191A;
    border-left: 5px solid #AD8B4F;
    border-radius: 6px;
    transform: translateY(-40px);  /* Smooth subtle lift */
}
.about-page-content h5 {color: #fff;}
.about-page-content h3 {color: #fff;}
.about-page-content h3 span {text-transform: uppercase;font-size: 26px;}
.about-page-content p {color: #fff;}

@media (max-width: 575px) {
    /* .about-page-content {padding: 30px 22px;} */
     .about-page-content {
        transform: translateY(0);
        padding: 20px !important;
    }
}

/* about service section */
.about-service-section {
    padding-top: 60px;
    padding-bottom: 50px;
    background-color: #f9f9f9;
}
.about-service-image {
    border: 4px outset #AD8B4F;
}
.about-service-text {margin-top: 20px;}
.about-service-text h5 {
    font-size: 18px;
    margin-bottom: 10px;
    text-transform: uppercase;
}
.about-service-text h5 span {color: #ad8b4f;}
.about-service-text p {color: #797979;}

/* about project section */
.about-project-section {padding-top: 60px;padding-bottom: 60px;}
.about-project-image {
    position: relative;
    padding-left: 60px;
    padding-bottom: 60px;
}
.about-project-image:after {
    content: "";
    position: absolute;
    border: 15px outset #AD8B4F;
    width: 575px;
    height: 395px;
    left: 0;
    bottom: 0;
    z-index: -1;
}
.about-project-content h5 {
    position: relative;
    font-size: 30px;
    color: #AD8B4F;
    padding-bottom: 12px;
    margin-bottom: 15px;
    display: inline-block;
    border-bottom: 1px solid #000;
}
.about-project-content h6 {font-size: 18px;}
.about-project-content p {text-align: justify;}
.about-project-section .mt-5 {margin-top: 70px !important;}
.aboutus-quality-sec {padding-bottom: 60px;}

@media (max-width: 1199px) {
    .about-project-image:after {width: 465px;height: 325px;}
    /* .about-page-content {width: 42%;} */
    .about-page-content {
        max-width: 800px !important;
    }
}
@media (max-width: 991px) {
    /* .about-page-content {width: 57%;} */
    .about-page-content {
        max-width: 100% !important;
        transform: translateY(-20px);
        padding: 25px !important;
    }
    .about-service-section .col-lg-3:nth-child(3) .about-service-widget,
    .about-service-section .col-lg-3:nth-child(4) .about-service-widget {
        margin-top: 30px;
    }
    .about-project-section .mt-5 {margin-top: 0 !important;}
    .about-project-image {margin-top: 30px;}
    .about-project-content {margin-top: 30px;}
    .about-project-image:after {width: 610px;height: 430px;} 
}
@media (max-width: 767px) {
    .about-page-content {width: 76%;}
    .about-service-section .col-lg-3:nth-child(2) .about-service-widget {
        margin-top: 30px;
    }
    .about-project-image:after {width: 450px;height: 310px;}
}
@media (max-width: 575px) {
    .inner-page-banner {padding: 20% 0;}
    .inner-page-banner-title h1 {font-size: 28px;}
    .breadcrumbs a, .breadcrumbs span {font-size: 14px;}
    .about-service-section {padding-bottom: 20px;}
    .about-project-section {padding-top: 20px;padding-bottom: 30px;}
    .about-page-content {width: 100%;}
    .about-project-image:after {width: 86%;height: 86%;}
    .aboutus-quality-sec {padding-top: 0px;padding-bottom: 40px;}
}
@media (max-width: 500px) {
    .about-project-image {padding-left: 50px;padding-bottom: 50px;}
    .about-project-image:after {width: 84%;height: 84%;}
}
@media (max-width: 400px) {
    .about-project-image {padding-left: 40px;padding-bottom: 40px;}
    .about-project-image:after {height: 88%;}
}


/*****************************************************************
                        Export Page Css
*****************************************************************/
.export-page-section {padding: 50px 0 60px;}
.export-page-section .export-page-content ul {margin-top: 10px;}
.export-page-content.page-content {padding-top: 80px;}

@media (max-width: 575px) {.export-page-section {padding: 40px 0;}}


/*****************************************************************
                        Blog Page Css
*****************************************************************/
.blog-page-section {padding: 40px 0 70px;}


/*****************************************************************
                        Blog Detail Page Css
*****************************************************************/
.blog-detail-page-section {padding: 70px 0;}
.blog-full-image {margin-bottom: 30px;}
.blog-detail-content h3 {margin-bottom: 20px;color: #AD8B4F;}
.blog-detail-content p {font-size: 17px;color: #959595;text-align: justify;}
.blog-detail-content h5 {margin-top: 25px;position: relative;margin-bottom: 12px;}
.blog-detail-content h5:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: -5px;
    width: 120px;
    height: 10px;
    background: #ad8b4f61;
    z-index: -1;
}
.blog-detail-content ul {margin-bottom: 25px;padding-left: 15px;}
.blog-detail-content ul li {margin-bottom: 4px;}
.blog-detail-content ul li span {vertical-align: middle;margin-left: 5px;font-size: 17px;color: #959595;}
.bullet-points {margin-bottom: 30px;}
.bullet-points h6 {font-size: 18px;}
.bullet-points h6 span {
    width: 30px;
    height: 30px;
    line-height: 30px;
    background-color: #AD8B4F;
    display: inline-block;
    text-align: center;
    border-radius: 50%;
    color: #fff;
    margin-right: 12px;
}
.blog-sidebar {border: 2px solid #0000001a;padding: 20px;}
.blog-sidebar h3 {color: #AD8B4F;margin-bottom: 30px;}
.latest-post-wrap {display: table;margin-bottom: 25px;}
.latest-post-image {
    width: 30%;
    overflow: hidden;
    float: left;
    text-align: center;
    box-shadow: 0 2.1px 1.3px rgb(0 0 0 / 4%), 0 5.9px 4.2px rgb(0 0 0 / 5%), 0 12.6px 9.5px rgb(0 0 0 / 6%), 0 25px 20px rgb(0 0 0 / 0%);
}
.latest-post-title {
    width: 69%;
    float: left;
    padding-left: 12px;
}
.latest-post-title p {
    font-size: 17px;
    font-weight: 500;
    margin-bottom: 0;
}
.latest-post-title p a {color: #404040;}

@media (max-width: 991px) {.blog-sidebar {margin-top: 15px;}}
@media (max-width: 575px) {.blog-detail-page-section {padding: 40px 0}}


/*****************************************************************
                        Contact Us Page Css
*****************************************************************/
.contactus-section {
    background-image: url(../images/contact-sectionbg.png);
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 85px;
    padding-bottom: 60px;
}
.contactus-widget {
    background-image: url(../images/contactbg.jpg);
    background-repeat: no-repeat;
    background-size: 515px;
    padding-top: 60px;
    padding-bottom: 60px;
}
.contactus-info {
    background-image: url(../images/contact-detailbg.png);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 50px 40px;
    height: 540px;
}
/*.contactus-info2 {margin-top: 30px;}*/
.contactus-info .title {margin-bottom: 40px;}
.contactus-info .title h3 {color: #fff;position: relative;}
.contactus-info .title h3:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -4px;
    width: 70px;
    height: 1px;
    background-color: #AD8B4F;
}
.contactus-info p {display: flex;}
.contactus-info p i {display: block;padding-top: 4px;color: #AD8B4F;}
.contactus-info p span {padding-left: 12px;color: #fff;}
.contactus-info p span a {color: #fff;text-decoration: none;}
.contactus-info p span a:hover {color: #AD8B4F;}
.contact-form .title {margin-bottom: 30px;}
.contact-form .title h3 {font-size: 33px;position: relative;}
.contact-form .title h3:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -4px;
    width: 70px;
    height: 1px;
    background-color: #AD8B4F;
}
.contact-form .form-group {margin-bottom: 30px;}
.contact-form .form-group input {
    height: 50px;
    box-shadow: 0 0px 50px 0px #eee;
    border: 1px solid #AD8B4F;
}
.contact-form .form-group input::placeholder {color: gray;}
.contact-form .form-group textarea {
    height: auto;
    box-shadow: 0 0px 50px 0px #eee;
    border: 1px solid #AD8B4F;
    padding-top: 10px;
}
.contact-form .form-group .contact-btn {
    padding: 8px 25px;
    height: auto;
    color: #fff;
    background-color: #AD8B4F;
    border-radius: 4px;
}
.contact-map {height: 450px;}

@media (max-width: 1199px) {
    .contactus-widget {background-size: 550px;background-position: -75px;}
}
@media (max-width: 991px) {
    .contactus-widget {background-size: 350px;background-position: inherit;padding-bottom: 0;}
    .contactus-info {height: auto;}
    .contact-form {margin-top: 100px;}
}
@media (max-width: 767px) {
    .contact-form {margin-top: 78px;}
}
@media (max-width: 575px) {
    .contactus-section {padding-top: 50px;padding-bottom: 20px;}
    .contactus-widget {padding-top: 25px;background-size: 300px;}
    .contact-form {margin-top: 35px;}
    .contact-map {height: 350px;}
    .contact-map iframe {height: 350px;}
}

/************************************************************************
                    Category Page Css (Bathroom Vanities)
*************************************************************************/
.page-content ul {margin-top: 20px;}
.page-content ul li {margin-bottom: 15px;display: flex;text-align: justify;}
.page-content ul li i {color: #AD8B4F;margin-right: 8px;padding-top: 4px;}
.category-wrap-section {
    padding-top: 60px;
    padding-bottom: 60px;
}
.category-widget {
    margin-top: 30px;
    display: block;
    overflow: hidden;
    text-decoration: none !important;
}
.category-image {
    position: relative;
    text-align: center;
}
.category-image:before {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    background: #333;
    opacity: 0;
    transition: .3s all ease-in-out;
}
.category-image:after {
    content: '\f067';
     font-family: "Font Awesome 5 Free";
     color:transparent;
    background: linear-gradient(#000 0 0), linear-gradient(#000 0 0);
    background-position:center;
    background-size: 70% 2px,2px 50%; /*thickness = 2px, length = 50% (25px)*/
    background-repeat:no-repeat;
    font-size: 50px;
    display: block;
    position: absolute;
    top: calc(50% - 20px);
    left: calc(50% - 25px);
    transition: .3s all ease-in-out;
    font-weight: 200;
    opacity: 0;
}
.category-image:hover:before {
    opacity: .6;
}
.category-image:hover:after {
    opacity: 1;
    top: calc(50% - 35px);
}
.category-widget h3 {
    text-align: center;
    background-color: #17191A;
    padding: 15px 6px;
    font-size: 20px;
    color: #AD8B4F;
}
.countertops-project-form {margin-bottom: 60px;}

@media (max-width: 575px) {
    .category-wrap-section {
        padding-top: 30px;
        padding-bottom: 40px;
    }
    .countertops-project-form {margin-bottom: 40px;}
}


/*****************************************************************
                    Category Page Css (Furniture)
*****************************************************************/
.furniture-page {padding-top: 60px;}
.page-content {padding-top: 60px;}
.page-content h3 {
    /* margin-top: 25px; */
    margin-bottom: 6px;
    color: #AD8B4F;
}
.page-content h5 {
    margin-top: 25px;
    position: relative;
    margin-bottom: 12px;
}
.page-content h5:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: -5px;
    width: 120px;
    height: 10px;
    background: #ad8b4f61;
    z-index: -1;
}
.page-content p {font-size: 17px;}
.boxes #coffee-tables-d {
    background-image: url('../images/furniture/coffee-tables-bg.jpg');    
}
.boxes #consoles-pending-d {
    background-image: url('../images/furniture/consoles-bg.jpg');    
}
.boxes #end-tables {
    background-image: url('../images/furniture/end-tables-bg.jpg');    
}
.boxes #media-consoles {
    background-image: url('../images/furniture/media-consoles-bg.jpg');    
}
.furniture-category-wrap .category-image {background-color: #f6f6f6;}
.furniture-category-wrap .category-image img {padding: 0 10px;}
.end-tables-category .category-image img {padding: 0;}
@media (max-width: 991px) {.furniture-page {padding-top: 20px;}}
@media (max-width: 575px) {.furniture-page {padding-bottom: 25px !important;}}

/*****************************************************************
                    Category Page Css (Counter Tops)
*****************************************************************/
.countertops-page {padding-top: 35px;padding-bottom: 40px}
.countertops-page .boxes .box h3 {
    font-size: 28px;
    padding: 3px 0;
    background-color: #00000085;
}
.boxes #engineered-quartz {
    background-image: url('../images/countertops/engineered-quartz1.jpg');    
}
.boxes #granite-slabs {
    background-image: url('../images/countertops/granite-slabs2.jpg');    
}
.boxes #limestonep {
    background-image: url('../images/countertops/limestone1.jpg');    
}
.boxes #sandstonep {
    background-image: url('../images/countertops/sandstone1.jpg');    
}
.boxes #porcelainp {
    background-image: url('../images/countertops/porcelain1.jpg');    
}
.boxes #quartizep {
    background-image: url('../images/countertops/quartzite1.jpg');    
}
.boxes #paverp {
    background-image: url('../images/countertops/paver1.jpg');    
}
@media (max-width: 991px) {.countertops-page {padding-top: 40px;padding-bottom: 0;}}


/*****************************************************************
                    Sub Category Page Css (Coffee Tables, Consoles, End Tables)
*****************************************************************/
.coffee-tables-page-section .category-widget h3,
.consoles-page-section .category-widget h3,
.end-tables-category .category-widget h3 {height: 102px;display: grid;align-items: center;}

@media (min-width: 992px) and (max-width: 1199px) {
    .consoles-page-section .category-widget h3 {height: 126px;}
}
@media (max-width: 767px) {
    .coffee-tables-page-section .category-widget h3,
    .consoles-page-section .category-widget h3,
    .end-tables-category .category-widget h3 {height: auto;}
}

/******************************************************************************
                Product Details Page Css (Albester White Quartz)
*******************************************************************************/
.product-detail-section {
    padding-top: 60px;
    padding-bottom: 60px;
}
.product-detail-image {border: 5px inset #AD8B4F;}
.product-detail-content h3 {margin-bottom: 35px;position: relative;}
.product-detail-content h3:after {
    content: "";
    position: absolute;
    bottom: -8px;
    left: 0;
    width: 80px;
    height: 2px;
    background-color: #AD8B4F;
    z-index: -1;
}
.product-detail-content table {border: 1px solid #AD8B4F !important;margin-bottom: 35px;}
.product-detail-content table th {
    border: 1px solid #AD8B4F !important;
    padding: 10px;
    color: #AD8B4F;
} 
.product-detail-content table td {
    border: 1px solid #AD8B4F !important;
    padding: 5px;
}
.product-detail-content .inquiry-btn {
    font-weight: bold;
    color: #AD8B4F;
    text-decoration: none;
    background-color: #17191A;
    padding: 12px 25px;
}
.product-detail-content .inquiry-btn:hover {
    color: #fff;
    background-color: #AD8B4F;
}
.product-description {
    border: 1px solid #AD8B4F;
    margin-top: 120px;
    padding: 20px;
    padding-top: 0;
}   
.filter {transform: translateY(-25px);}
.filter li {
    background-color: #AD8B4F;
    margin: 2px 5px 2px 2px;
    text-align: center;
}
.filter li a {
    display: block; 
    padding: 10px 15px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 1px;
    color: #fff;
    text-decoration: none;
}
.filter li .active {background-color: #17191A;color: #AD8B4F !important;}
.description-content .tab-pane p {margin-bottom: 20px;}
.description-content .tab-pane ul li {display: flex;margin-bottom: 12px;}
.description-content .tab-pane ul li i {color: #AD8B4F;display: block;padding-top: 3px;margin-right: 10px;}
.description-content .tab-pane table tbody tr th {padding: 8px;font-weight: 500;}
.description-content .tab-pane table tbody tr td {vertical-align: middle;padding: 8px;}


@media (max-width: 991px) {
    .product-detail-content {margin-top: 35px;}
}
@media (max-width: 575px) {
    .product-detail-section {padding-top: 40px;padding-bottom: 40px;}
    .product-description {margin-top: 70px;}
}



/*****************************************************************
                       Factory Furniture Page Css
*****************************************************************/
.factory-furniture-section {padding-top: 60px;padding-bottom: 60px;}
.factory-furniture-content.page-content {padding-top: 30px;}
.factory-furniture-content p {text-align: justify;}
.factory-furniture-image {text-align: center;}
.factory-furniture-process-image {margin-top: 20px;text-align: center;}
.factory-furniture-section .row .col-lg-4, .factory-furniture-section .row .col-lg-6,
.factory-furniture-section .row .col-lg-12 {
    padding-left: 10px;
    padding-right: 10px;
}


.granite-page-content .page-content {padding-top: 0;}
.fa-fr li b {display: contents;}
.our-factory-furniture-page {padding-top: 30px;}
.factory-image{
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    text-align: center;
}
.factt{
    padding-top: 50px;
}
.vid{
    text-align: center;
}
@media screen and (max-width: 575px)
{
    .inner-page-banner {padding: 20% 0;}
    .inner-page-banner-title h1 {font-size: 28px;}
    .vid video {max-width: 100%;}
}


/*****************************************************************
                       Manufacturing Furniture Page Css
*****************************************************************/
.manufacturing-furniture-section {padding-top: 60px;padding-bottom: 40px;}
.manufacturing-furniture-content.page-content {padding-top: 0;}
.manufacturing-furniture-section .row .col-lg-4, 
.manufacturing-furniture-section .row .col-lg-6, .manufacturing-furniture-section .row .col-lg-12  {
    padding-left: 10px;
    padding-right: 10px;
}


/*****************************************************************
                       Factory-natural stone Page Css
*****************************************************************/




/*****************************************************************
                       Delivery Page Css
*****************************************************************/
.delivery-page-section {padding-top: 60px;padding-bottom: 60px;}
.delivery-page-content.page-content {padding-top: 30px;}
.delivery-page-section .row .col-lg-2, .delivery-page-section .row .col-lg-4, 
.delivery-page-section .row .col-lg-6, .delivery-page-section .row .col-lg-12  {
    padding-left: 10px;
    padding-right: 10px;
}

@media (min-width: 992px) {
    .delivery-process-row .col-lg-2 {
        flex: 0 0 20%;
        max-width: 20%;
    }
} 
@media (max-width: 575px) {
    .delivery-page-section {padding-top: 40px;}
    .delivery-page-content.page-content {padding-top: 0;}
}


/*****************************************************************
                       Packaging Page Css
*****************************************************************/
.packaging-page-section {padding-top: 60px;padding-bottom: 40px;}
.packaging-page-content.page-content {padding-top: 30px;}
.packaging-page-section .row .col-lg-4, .packaging-page-section .row .col-lg-6,
.packaging-page-section .row .col-lg-12 {
    padding-left: 10px;
    padding-right: 10px;
}

@media (min-width: 992px) {
    .packaging-page-section .pr-lg-10 {padding-right: 10px;}
    .packaging-page-section .pl-lg-10 {padding-left: 10px;}
}
@media (max-width: 575px) {
    .packaging-page-section {padding-top: 40px;}
    .packaging-page-content.page-content {padding-top: 0;}
}


/*****************************************************************
                       Quality Control Page Css
*****************************************************************/
.qc-page-section {padding-top: 60px;padding-bottom: 40px;}
.qc-page-content.page-content {padding-top: 30px;}
.qc-page-section .row .col-lg-2, .qc-page-section .row .col-lg-4, 
.qc-page-section .row .col-lg-6, .qc-page-section .row .col-lg-12 {
    padding-left: 10px;
    padding-right: 10px;
}
.qc-page-content ul li b {display: contents;}

@media (min-width: 992px) {
    .quality-control-row .col-lg-2 {
        flex: 0 0 20%;
        max-width: 20%;
    }
} 
@media (max-width: 575px) {
    .qc-page-section {padding-top: 40px;}
    .qc-page-content.page-content {padding-top: 0;}
}


/*****************************************************************
                      Contact Form Error Message Css
*****************************************************************/

.status-msg.error {
    color: #a94442 !important;
    background: #f2dede !important;
    border: 1px solid #ebccd1 !important;
}



/* custom 
ul.navbar-nav.navigation li.nav-item:nth-last-child(2) {
  display: none !important;
}*/
/* custom new sep 2024 */
.col-lg-7.new, .col-lg-6.new {margin:auto;}
.category-image.new {border:1px solid #ccc;/*border-bottom: 0;*/}
.product-detail-image.new img {
            transition: transform 0.1s ease;
            cursor:pointer;
}    
#custompage .product-detail-image.new{border:0px;}
#custompage .image-viewer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.9);
  display: none;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  z-index: 9999;
}

/* Full-width image */
#custompage .full-image-container {
  width: 80vw; /* Default width */
  height: 80vh; /* Default height */
  position: relative;
  overflow: hidden;
  margin-top: -2px;
  transition: width 0.3s, height 0.3s; /* Smooth transition for zoom */
  display: flex;
  justify-content: center; /* Center the image horizontally */
  align-items: center;
}

#custompage .full-image-container.expanded {
  width: 100vw; /* Expanded width */
  height: 100vh; /* Expanded height */
}
#custompage .full-image-container.expanded .full-image{
  cursor: zoom-out;
}
#custompage .full-image {
  width: 100%; 
  height: auto;
  max-height: 100vh;
  cursor: zoom-in;
}

/* Thumbnails container */
#custompage .thumbnails {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}

#custompage .thumbnails img {
  width: 150px;
  height: auto;
  margin: 0 10px;
  cursor: pointer;
  border: 2px solid transparent;
}

#custompage .thumbnails img.active {
  border: 2px solid #AD8B4F;
}

/* Zoom effect */
#custompage .zoomed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  pointer-events: none;
  transform-origin: center;
  background-size: 200%; /* Default zoom level */
  display: none;
}

/* Close button */
#custompage .close-btn {
  position: absolute;
  top: 3px;
  right: 20px;
  width: 30px; /* Width and height equal to make it a perfect circle */
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  color: white;
  background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background for visibility */
  cursor: pointer;
  z-index: 10000;
}

/* Responsive for mobile */
@media (max-width: 768px) {
  #custompage .thumbnails img {
    width: 100px;
    height: auto;
  }

  #custompage .full-image-container {
    width: 100%; /* Ensure full width on mobile */
    height: auto; /* Auto height to maintain aspect ratio */
  }
}
/* Slider Container */
#custompage #slider-container {
    position: relative;
    width: 100%;
    border: 1px solid #AD8B4F;
    margin: auto;
    overflow: hidden;
}
#custompage .slider-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 12px;
    font-weight: bold;
    background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
    padding: 5px 10px;
    border-radius: 10px;
    text-align: center;
    pointer-events: none; /* Make sure overlay does not interfere with clicks */
    z-index: 10; /* Ensure overlay is on top */
}
#custompage .slider-images {
    display: flex;
    transition: transform 1s ease-in-out;
    /* width: 300%; 3 images */
}

#custompage .slider-images img {
    width: 100%;
    height: auto;
    display: none; /* Hide all initially */
    transition: opacity 1s ease-in-out; /* Smooth transition for fade effect */
    opacity: 0;
}

#custompage .slider-images img.active {
    display: block;
    opacity: 1; /* Show the active image */
}

/* Arrows */
#custompage .slider-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(0, 0, 0, 0.2);
    color: #AD8B4F;
    font-size: 24px;
    padding: 5px;
    cursor: pointer;
    z-index: 1000;
    border:none;
}

#custompage .slider-arrow.prev {
    left: 0px;
}

#custompage .slider-arrow.next {
    right: 0px;
}

/* Dots */
#custompage .slider-dots {
    text-align: center;
    margin-top: 10px;
}

#custompage .dot {
    height: 15px;
    width: 15px;
    margin: 0 5px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    cursor: pointer;
}

#custompage .dot.active {
    background-color: #AD8B4F;
}
#custompage .imgname{text-align:center;color:#fff;}
#customcatpage .category-widget h3 {
    text-align: center;
   /* background-color: #17191A;*/
   background-color: #fff;
    padding: 5px 1px;
    font-size: 16px;
    color: #AD8B4F;
}
.whatsapp_float {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 999;
}

.whatsapp_icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2);
}

/* --- NEW ZIG-ZAG LAYOUT STYLES --- */
    .zigzag-wrapper {
        display: flex;
        flex-direction: column;
        gap: 60px;
        margin-top: 40px;
        margin-bottom: 60px;
    }

    .zigzag-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        background: #fff;
    }

    /* Even rows (2nd, 4th, 6th) will swap Image and Text */
    .zigzag-row:nth-child(even) {
        flex-direction: row-reverse;
    }

    .zigzag-image {
        width: 50%;
        padding: 0 15px;
        text-align: center;
        overflow: hidden;
        border-radius: 8px;
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    }
    

   /* Carousel Container - Fixed Height */
   .zigzag-image .owl-carousel {
       /*height: 370px;*/
       display: flex;
       align-items: center;
   }

   /* All carousel items - same size */
   .zigzag-image .owl-carousel .item {
       height: 350px;
       display: flex;
       align-items: center;
       justify-content: center;
   }

   /* Product images - uniform sizing */
   .zigzag-image .owl-carousel .item img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       max-width: 550px;
       border-radius: 8px;
   }
   
.product-img-slider .owl-dots {
    text-align: center;
    margin-top: 20px;
}

.product-img-slider .owl-dot {
    width: 12px;
    height: 12px;
    background: #ad8b4f !important;
    border-radius: 50%;
    display: inline-block;
    margin: 0 5px;
    transition: 0.3s;
    padding-bottom: 5px;
}

.product-img-slider .owl-dot.active {
    background: #000 !important;
}

.product-img-slider .owl-dot:hover {
    background: #000;
    opacity: 0.7;
}

    .zigzag-content {
        width: 50%;
        padding: 0 40px;
        text-align: left;
    }

    .zigzag-content h3 {
        font-size: 28px;
        font-weight: 700;
        color: #222;
        margin-bottom: 20px;
        text-transform: uppercase;
        position: relative;
    }

    .zigzag-content h3::after {
        content: '';
        display: block;
        width: 60px;
        height: 3px;
        background: #ad8b4f;
        margin-top: 10px;
    }

    .zigzag-content p {
        color: #666;
        line-height: 1.8;
        font-size: 16px;
        margin-bottom: 25px;
    }

    .zigzag-btn {
        display: inline-block;
        background: #ad8b4f;
        color: #fff;
        padding: 12px 30px;
        border-radius: 5px;
        font-weight: 600;
        text-decoration: none;
        transition: 0.3s;
    }

    .zigzag-btn:hover {
        background: #222;
        color: #ad8b4f;
        text-decoration: none;
    }

    /* Mobile Responsive */
    @media (max-width: 768px) {
        .zigzag-row {
            gap: 20px;
            margin-bottom: 40px;
        }
        .zigzag-row, .zigzag-row:nth-child(even) {
            flex-direction: column; 
        }
        .zigzag-image, .zigzag-content {
            width: 100%;
            padding: 0 15px;
            text-align: center; 
        }
        .zigzag-content h3::after {
            margin: 10px auto; 
        }
    }



    .content-flex{
        display: flex;
        gap: 30px;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }

    .banner-our-jurnny{
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: 30px;
        margin-top: 40px;
        justify-content: center;

    }
    
    .card-header{padding:5px; background-color: rgba(0,0,0,.01);}
    .btn-block.btn-link{color:inherit; 
        text-decoration:none;}
    .btn-block.btn-link:hover {
       color: #ad8b4f;
       text-decoration: none;}
    .btn-block.btn-link:focus {box-shadow: none;}
    .card-body{color:#8f8f8f;}
    
    .our-product .boxes { margin-top: 50px; } 
    .our-product .box { margin-bottom: 30px; }
    
    /* --- FIXED CERTIFICATE CSS --- */
    .home-certificates-section { 
        /*padding: 80px 0; */
        background-color: #ffffff; 
    }
    .cert-box {
        background: #fff;
        padding: 30px;
        border-radius: 10px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.08);
        transition: transform 0.3s ease;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        border: 1px solid #eee;
    }
    .cert-box:hover {
        transform: translateY(-5px);
    }
    .cert-box img { 
        max-height: 200px; 
        width: auto; 
        max-width: 100%;
        margin-bottom: 15px; 
        box-shadow: none !important; /* Overriding default img shadow */
    }
    
    .home-projects-section { padding: 50px 0; }

    /* --- SAMPLE PROGRAM SECTION --- */
    .sample-program-section {
        padding: 60px 0;
        background: #fff;
    }
    .sample-program-section .inner {
        max-width: 1100px;
        margin: 0 auto;
        text-align: left;
    }
    /* .sample-program-section .main-title {
        text-align: left;
        margin-bottom: 20px;
    } */
    /* .sample-program-section .main-title img { max-width: 120px; margin-bottom: 8px; } */
    /* .sample-program-section h3 { font-size: 26px; font-weight:700; color:#222; margin:0 0 12px; } */
    .sample-program-section p { color:#444; font-size:15.5px; line-height:20px; margin-bottom:18px; }
    .sample-program-grid { display:flex; gap:20px; margin-bottom:18px; flex-direction: row; }
    .sample-program-grid .sample-card { flex:1 1 calc(33.333% - 13px); background:#fff; border-radius:8px; overflow:hidden; box-shadow:0 8px 30px rgba(0,0,0,0.06); text-align:center; }
    .sample-program-grid .sample-card img { width:100%; height:180px; object-fit:cover; display:block; }
    .sample-program-grid .sample-card .caption { padding:12px; font-size:14px; color:#666; }
    .sample-program-cta { text-align:left; }
    .sample-program-cta .btn-cta { background:#ad8b4f; color:#fff; padding:12px 26px; border-radius:6px; text-decoration:none; font-weight:600; display:inline-block; transition:all .25s ease; }
    .sample-program-cta .btn-cta:hover { background:#222; color:#ad8b4f; }
    @media (max-width:768px) {
        .sample-program-grid .sample-card { flex:1 1 100%; }
        .sample-program-section .inner { padding: 0 15px; text-align:center; }
        .sample-program-cta { text-align:center; margin-top:10px; }
    }

    /* --- NEW ZIG-ZAG LAYOUT STYLES --- */
    .zigzag-wrapper {
        display: flex;
        flex-direction: column;
        gap: 60px; /* Space between rows */
        margin-top: 40px;
        margin-bottom: 60px;
    }

    .zigzag-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        background: #fff;
    }

    /* Even rows (2nd, 4th, 6th) will swap Image and Text */
    .zigzag-row:nth-child(even) {
        flex-direction: row-reverse;
    }

    .zigzag-image {
        width: 50%;
        padding: 0 15px;
        text-align: center;
    }

    .zigzag-image img {
        width: 100%;
        max-width: 550px; /* Limit image width */
        height: auto;
        border-radius: 8px;
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        transition: transform 0.3s ease;
    }

    .zigzag-image img:hover {
        transform: scale(1.02);
    }

    .zigzag-content {
        width: 50%;
        padding: 0 40px;
        text-align: left;
    }

    .zigzag-content h3 {
        font-size: 28px;
        font-weight: 700;
        color: #222;
        margin-bottom: 20px;
        text-transform: uppercase;
        position: relative;
    }

    .zigzag-content h3::after {
        content: '';
        display: block;
        width: 60px;
        height: 3px;
        background: #ad8b4f;
        margin-top: 10px;
    }

    .zigzag-content p {
        color: #666;
        line-height: 20px;
        font-size: 16px;
        margin-bottom: 25px;
        font-weight: light;
    }

    .zigzag-btn {
        display: inline-block;
        background: #ad8b4f;
        color: #fff;
        padding: 12px 30px;
        border-radius: 5px;
        font-weight: 600;
        text-decoration: none;
        transition: 0.3s;
    }

    .zigzag-btn:hover {
        background: #222;
        color: #ad8b4f;
        text-decoration: none;
    }

    /* --- TESTIMONIAL & CASE STUDY STYLES --- */
    .testimonial-section, .home-case-studies { padding: 70px 0; background: #fff; }
    
    .testimonial-grid {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin-top: 30px;
    }

    .testimonial-card {
        background: #f9f9f9;
        padding: 30px;
        border-radius: 10px;
        position: relative;
        border-left: 5px solid #ad8b4f;
        box-shadow: 0 5px 15px rgba(0,0,0,0.05);
        height: 100%;
        text-align: left;
    }
    
    .testimonial-col {
        padding: 15px;
        margin-bottom: 20px;
    }

    .testimonial-card .quote-icon {
        font-size: 30px; color: #ad8b4f; margin-bottom: 15px; display: block;
    }
    .testimonial-card p { font-style: italic; color: #555; min-height: 80px; font-size: 15px; }
    
    .client-details h5 { font-size: 18px; font-weight: 700; margin: 15px 0 0 0; color: #333; text-align: right; }

    /* --- FLOATING CATALOG BUTTON STYLE --- */
    .catalog_float {
        position: fixed;
        bottom: 14px;
        left: 70px;
        background-color: #ad8b4f;
        color: #FFF !important;
        padding: 12px 25px;
        border-radius: 50px;
        text-align: center;
        font-size: 16px;
        font-weight: 600;
        box-shadow: 0 4px 10px rgba(0,0,0,0.3);
        z-index: 1000;
        text-decoration: none;
        transition: all 0.3s ease;
        display: flex;
        align-items: center;
    }
    .catalog_float:hover {
        background-color: #222;
        color: #ad8b4f !important;
        transform: translateY(-3px);
        text-decoration: none;
    }
    .catalog_float i {
        margin-right: 8px;
        font-size: 20px;
    }

    /* Mobile Responsive */
    @media (max-width: 768px) {
        .zigzag-row {
            gap: 20px;
            margin-bottom: 40px;
        }
        .zigzag-row, .zigzag-row:nth-child(even) {
            flex-direction: column; 
        }
        .zigzag-image, .zigzag-content {
            width: 100%;
            padding: 0 15px;
            text-align: center; 
        }
        .zigzag-content h3::after {
            margin: 10px auto; 
        }
        .zigzag-image img { margin-bottom: 20px; }
        
        .row.align-items-center.mt-4 {
            flex-direction: column;
        }
        .embed-responsive {
            margin-top: 20px;
        }
    }

    /* --- VIDEO SECTION STYLING --- */
    .video-section-wrapper {
        position: relative;
        padding: 80px 0;
        background: url('images/banner1.jpg') no-repeat center center/cover;
        background-attachment: fixed;
        text-align: center;
        color: #fff;
    }
    .video-overlay {
        position: absolute; top: 0; left: 0; width: 100%; height: 100%;
        background: rgba(0,0,0,0.6);
    }
    .video-content { position: relative; z-index: 2; }
    .video-content h2 { font-size: 36px; font-weight: 700; margin-bottom: 30px; color:#fff; }
    .play-btn {
        display: inline-block;
        width: 80px; height: 80px;
        background: #ad8b4f;
        border-radius: 50%;
        line-height: 80px;
        font-size: 30px;
        color: #fff;
        cursor: pointer;
        animation: pulse 2s infinite;
        transition: all 0.3s;
    }
    .play-btn:hover { background: #fff; color: #ad8b4f; }
    @keyframes pulse {
        0% { box-shadow: 0 0 0 0 rgba(173, 139, 79, 0.7); }
        70% { box-shadow: 0 0 0 20px rgba(173, 139, 79, 0); }
        100% { box-shadow: 0 0 0 0 rgba(173, 139, 79, 0); }
    }

    .view-all-btn-container { text-align: center; margin-top: 20px; }
    .view-all-btn {
        display: inline-block;
        background-color: #ad8b4f;
        color: #fff;
        padding: 12px 30px;
        border-radius: 5px;
        font-weight: 600;
        text-transform: uppercase;
        text-decoration: none;
        transition: all 0.3s ease;
        border: 1px solid #ad8b4f;
    }
    .view-all-btn:hover {
        background-color: transparent;
        color: #ad8b4f;
        text-decoration: none;
    }

    /* --- ABOUT US SECTION STYLES --- */
    .about-us-section {
        padding: 80px 0;
        background: #fff;
    }

    .about-us-header {
        text-align: center;
        margin-bottom: 50px;
    }

    .about-us-header h1 {
        font-size: 42px;
        font-weight: 700;
        color: #222;
        position: relative;
        display: inline-block;
        padding-bottom: 15px;
    }

    .about-us-header h1::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 80px;
        height: 3px;
        background: #ad8b4f;
    }

    .about-us-section p {
        font-size: 16px;
        line-height: 20px;
        color: #666;
        margin-bottom: 25px;
        text-align: justify;
    }

    .about-us-button {
        text-align: center;
        margin-top: 40px;
    }

    .about-us-button .about-btn {
        display: inline-block;
        background: #ad8b4f;
        color: #fff;
        padding: 14px 40px;
        border-radius: 5px;
        font-weight: 600;
        text-decoration: none;
        transition: all 0.3s ease;
        border: 2px solid #ad8b4f;
    }

    .about-us-button .about-btn:hover {
        background: transparent;
        color: #ad8b4f;
        text-decoration: none;
    }

    /* Mobile Responsive */
    @media (max-width: 768px) {
        .about-us-section {
            padding: 50px 0;
        }

        .about-us-header h1 {
            font-size: 32px;
            margin-bottom: 20px;
        }

        .about-us-section p {
            font-size: 15px;
            text-align: left;
        }
    }

    /* --- SERVICE SECTION STYLES --- */
    .service-section {
        padding: 80px 0;
        background: #f9f9f9;
    }

    .service-intro {
        text-align: center;
        margin-bottom: 60px;
        max-width: 800px;
        margin-left: auto;
        margin-right: auto;
    }

    .service-intro p {
        font-size: 18px;
        line-height: 20px;
        color: #666;
        font-weight: 500;
    }

    .service-row {
        display: flex;
        flex-wrap: wrap;
        gap: 25px;
        margin-top: 50px;
    }

    .service-row .col-lg-4 {
        flex: 0 0 calc(33.333% - 17px);
    }

    .service-box {
        background: #fff;
        padding: 40px 30px;
        border-radius: 10px;
        box-shadow: 0 5px 20px rgba(0,0,0,0.08);
        transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        text-align: center;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .service-box:hover {
        transform: translateY(-10px);
        box-shadow: 0 20px 50px rgba(173, 139, 79, 0.25);
    }

    .service-icon {
        margin-bottom: 25px;
        width: 80px;
        height: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #f0f0f0;
        border-radius: 50%;
        transition: all 0.4s ease;
    }

    .service-box:hover .service-icon {
        background: #f7d9a5;
        transform: scale(1.1) rotate(5deg);
    }

    .service-icon img {
        max-width: 50px;
        height: auto;
        filter: grayscale(100%);
        transition: all 0.4s ease;
    }

    .service-box:hover .service-icon img {
        filter: grayscale(0%);
        brightness(1.2);
        transform: scale(1.1);
    }

    .service-content h3 {
        font-size: 22px;
        font-weight: 700;
        color: #222;
        margin-bottom: 15px;
        position: relative;
        padding-bottom: 10px;
        transition: color 0.3s ease;
    }

    .service-content h3::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 40px;
        height: 2px;
        background: #ad8b4f;
        opacity: 0;
        transition: all 0.4s ease;
    }

    .service-box:hover .service-content h3::after {
        opacity: 1;
        width: 60px;
    }

    .service-content p {
        font-size: 16px;
        line-height: 1.7;
        color: #555;
        margin-bottom: 15px;
    }

    .service-content {
        position: relative;
    }

    .service-btn-wrapper {
        background: #222;
        padding: 20px;
        border-radius: 8px;
        margin-top: 20px;
        text-align: left;
    }

    .service-btn {
        display: inline-block;
        background: #ad8b4f;
        color: #fff;
        padding: 12px 28px;
        border-radius: 5px;
        font-weight: 600;
        text-decoration: none;
        transition: all 0.3s ease;
        border: 2px solid #ad8b4f;
    }

    .service-btn:hover {
        background: transparent;
        color: #ad8b4f;
        text-decoration: none;
        transform: translateX(5px);
    }

    /* Reverse layout for even rows */
    .service-row-zigzag.reverse {
        flex-direction: row-reverse;
    }
    /* ==== FIX HORIZONTAL SCROLL ISSUE ==== */
html, body {
    width: 100%;
    overflow-x: hidden !important;
}

/* Fix non-bootstrap container-full overflow */
.container-full {
    width: 100%;
    max-width: 100%;
    padding-left: 15px;
    padding-right: 15px;
    margin-left: auto;
    margin-right: auto;
}

/* Prevent rows from breaking viewport */
.row {
    margin-left: 0;
    margin-right: 0;
}

/* Images safety */
img {
    max-width: 100%;
    height: auto;
}

/* About section padding fix on small screens */
@media (max-width: 767px) {
    .about-page-parallex {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
}


    /* Responsive */
    @media (max-width: 768px) {
        .service-row-zigzag, .service-row-zigzag.reverse {
            flex-direction: column;
        }
        .service-img-col, .service-text-col {
            flex: 0 0 100%;
            max-width: 100%;
            padding: 0 15px;
        }
        .service-img-col {
            margin-bottom: 30px;
        }
        .service-btn-wrapper {
            text-align: center;
        }
    }
