

.main_nav{
	background:var(--maincolor);
	color: #fff;
}


.main_nav .offcanvas-btn {
    font-size: 37px;
    color: #fff;
}

.Signin_btn {
    border: 1px solid #fff;
    padding: 4px 19px;
    border-radius: 31px;
    color: var(--maincolor);
}

.header_btn{
	 font-size: 19px;
}

.Signin_btn i {
    border-radius: 8px;
    overflow: hidden;
}

.Signin_btn span {
    margin-left: 11px;
}

.header_btn:hover{
	border: 1px solid #fff;
}


.home_banner p {
    color: #ffffff;
    background: var(--maincolor);
    display: inline;
    padding: 10px;
}


.deletebtnmodal{
    background: var(--maincolor);
    color: #fff;
}

.deletebtnmodal:hover{
    background: #7c0c00c4 ;
    color: #fff;
}

.counter_custom_count{
    background-color: var(--maincolor);
    border-radius: 80px;
    padding: 10px 0px;
}

.bg_primary{
     background-color: var(--maincolor);
}

.customdrip-count-content{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
}


.customdrip-count-content img {
    width: 42px !important;
    height: 42px !important;
}


.customdrip-count-content .img {
    background: #fff;
    padding: 16px;
    border-radius: 50%;
    margin: 0 10px;
}


.custom-count-number{
    font-size: 39px;
    font-weight: 700;
    color: white;
}


.custom-count-text p{
    margin: 0;
    line-height: 1.2;
    color: #b1b1b1 ;
}




@media only screen and (min-width: 300px) {
    .customdrip-count-content {
        justify-content: start;
    }
}




.services_section .bg{

    background: #E1C5C2;


}






.services_section .sec-heading h3 {
    color: #7c0c00;
    font-weight: 400;
}


.c_btn {
    position: relative;
    background: var(--maincolor);;
    color: #ffffff;
    padding: 9px 15px;
    border-radius: 20px;   /* parent rounded */
    cursor: pointer;
    border: 1px solid var(--maincolor); ;
    overflow: hidden;      /* keep corners clean */
    transition: color 0.4s ease;
}

.c_btn span {
    position: relative;
    z-index: 2; /* টেক্সট সবসময় উপরে */
}

/* Sliding background layer */
.c_btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    border: var(--maincolor);
    background: #fff;
    border-radius: 20px;   /* child rounded */
    z-index: 1;
    transition: width 0.4s ease; /* একটু ছোট timing দিলে সুন্দর দেখাবে */
}

.c_btn:hover::before {
    width: 100%;
}

.c_btn:hover {
    color: #7c0c00;
}



.p_btn {
    position: relative;
    background: #fff; /* different main color */
    color: var(--maincolor); 
    padding: 10px 18px;
    border-radius: 25px;   /* parent rounded */
    cursor: pointer;
    border: 2px solid #fff;
    overflow: hidden;      /* keep corners clean */
    transition: color 0.4s ease, border-color 0.4s ease;
}

.p_btn span {
    position: relative;
    z-index: 2; /* text always on top */
}

/* Sliding background layer */
.p_btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background: var(--maincolor); 
    border-radius: 25px;   /* child rounded */
    z-index: 1;
    transition: width 0.35s ease; /* slightly faster animation */
}

.p_btn:hover::before {
    width: 100%;
}



.p_btn:hover {
    color: var(--secondarycolor); /* text changes on hover */
    border-color: #fff;
}



.services_section .wrapper {
    overflow: hidden;
    border-radius: 8px;
    height: 100%;
}

.services_section .img {
    overflow: hidden;       /* hide overflow */
    position: relative;     /* keeps it contained */
    transform: scale(3);
}

.services_section .img img {
    transition: transform 0.4s ease; /* smooth zoom */
}


.services_section .card:hover img {
    transform: scale(1.1); /* zoom effect */
}

.services_section .card {
    transition: transform 0.4s ease;
}

.services_section .card:hover  {
    transform: translateY(-2px); /* zoom effect */
}



.services_section img {
    height: 100%;
    border-radius: 14px !important;
}

.services_section .card-body .address {
    color: #666666;
}

.services_section .card-body i{
    color: #7c0c00;
}


.services_section .card-body ul {
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}



.services_section .card-body ul span {
    font-weight: bold;
    color: #000 ;
}


.services_section .card-body span.icon {
    font-size: 12px;
    background: #7c0c00;
    height: 23px;
    width: 23px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.services_section .card-body span.icon i {
    color: #fff;
}







.spcial_services .card {
    box-shadow: -7px 7px 5px #00000061;
    transition: transform 0.4s ease;

}

.spcial_services .card:hover{

    transform: scale(1.06); 

}


.spcial_services .card_footer{
    background: #7c0c00;
    border-radius: 0 0 8px;
}

.spcial_services .card h3 {
    color: #fff;
    text-align: center;
    font-weight: 400;
    font-size: 22px;
    padding: 22px;
}






.strategic_section .sec-heading h3 {
    color: #7c0c00;
    font-weight: 400;
}



.strategic_section .content {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.strategic_section .content p {
    font-size: 32px;
    color: #262626;
}


.testimonial .sec-heading h3 {
    color: #7c0c00;
    font-weight: 400;
}





.smart-tes-content {
    background: #e1c5c2;
    padding: 40px 20px;
    border-radius: 8px;
}

.smart-tes-author {
    position: absolute;
    left: 0;
    right: 0;
    top: -52px;
}

.testimonial .item-box {
    position: relative;
    margin: 45px 0;
}

.smart-tes-content p {
    font-size: 15px;
    color: #7c0c00;
    font-size: 18px;
}


span.st-author-subtitle {
    color: #7c0c1e;
    font-size: 18px !important;
}

.st-author-info .st-author-title {
    margin: 0;
    font-size: 12px;
    line-height: 1;
    color: #7c0c1e;
}


footer .contact_info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #fff;
    font-size: 17px;
    flex-direction: row; /* default */
}

@media (max-width: 768px) {
    footer .contact_info {
        flex-direction: column;
        gap: 10px; /* optional: add spacing between items */
        text-align: center; /* optional for better look */
    }
}



.copyright {
    background: #000;
    padding: 22px;
}



.copyright .main{
     display: flex;
     align-items: center;
     justify-content: space-between;
}

.copyright .main p, .copyright .main a {
    font-size: 15px;
}


@media (max-width: 768px) {
    .copyright .main {
        flex-direction: column;
        gap: 10px; /* optional: add spacing between items */
        text-align: center; /* optional for better look */
    }
}




.renovation_banner p {
    color: #ffffff;
    background: var(--maincolor);
    display: inline;
    padding: 10px;
    font-size: 50px !important;
}

.renovation_banner h4 {
    color: var(--maincolor);
}



.renovation_why img{
    width: 60px;
}


.what_offer img{
    width: 60px;
}


.renovation_service ol {
    margin: 0;
    padding-left: 22px;
}

.renovation_service ol li {
    font-size: 19px;
    line-height: 2.2;
}


.renovation_service .card-body {
    background: var(--maincolor);
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 8px;
}


.renovation_service .d_flex{
    display: flex;
    align-items: center;
    height: 100%;
}

.renovation_service .icon {
    margin-right: 12px;
    color: #7c0c00;
}

/* For small devices (e.g., max-width 576px) */
@media (max-width: 676px) {
    .renovation_service .icon {
        display: none;
    }
}


.renovation_faq .accordion-button{
    font-weight: bold;
}


.renovation_faq .accordion-button:not(.collapsed) {
    background-color: var(--maincolor);
    color: #fff; 
    
}

/* Optional: change the arrow color */
.renovation_faq .accordion-button::after {
    filter: invert(1); /* invert arrow color if needed */
}



.renovation_faq .accordion-button i {
    font-weight: bold;
    font-size: 20px;
}

.renovation_faq .left_side {
    text-align: center!important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}




.asset_management_main{
    background-color: var(--maincolor);
    color: #fff;
    height: 100%;
    border-radius: 8px 0 0 8px;
}


.asset_management img{
    border-radius: 0 8px 8px 0 ; 
}




.about_section_main{
    background-color: var(--maincolor);
    color: #fff;
    height: 100%;
    border-radius: 0 8px 8px 0;
}


.about_section_main img{
    border-radius: 8px 0 0 8px ; 
    
}



.aboutMission .card {
    background: var(--maincolor);
    overflow: hidden; /* important for image scaling */
    transition: background 1s, border-radius 1s;
    border-radius: 8px;
}

.aboutMission .card img {
    width: 100%;
    display: block;
    border-radius: 8px 8px 0 0; /* top corners rounded */
    transition: transform 0.3s ease ;
}

.aboutMission .card:hover img {
    transform: scale(0.95);
    border-radius: 12px; /* smooth change on hover */
}






.aboutTetsimonial .card {
    background: var(--maincolor);
    overflow: hidden; /* important for image scaling */
    transition: background 1s, border-radius 1s;
    border-radius: 8px;
}

.aboutTetsimonial .card img {
    width: 100%;
    display: block;
    transition: transform 0.3s ease ;
    transform: scale(0.95);
    border-radius: 8px; /* smooth change on hover */
}

.aboutTetsimonial .card:hover img {
    transform: scale(1);
   
}




.aboutTetsimonial p.name {
    margin: 0;
    font-size: 17px;
}


.aboutTetsimonial p.title {
    margin: 0;
    line-height: 1;
    font-size: 16px;
    color: #c9c9c9 !important;
}



.AmenetiesLessing {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
}   

.AmenetiesLessing li{
    display: block;
    list-style: none;
    position: relative;
    margin: 10px 0 10px;
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}

.AmenetiesLessing img{
    width: 30px;
}







