/* 
font-family: "DM Sans", sans-serif;
font-family: "Outfit", sans-serif;
*/
body.default_color_set{
    --storePrimaryColor: #000000;
    --storeHoverColor: #c94a10;
    --storeCardBorderColor: #c94a10;
    --storeBtnColor: #fff;
    --storeFreeShipingText: #c94a10;
    --storeTextColor: #c94a10;   
  }
  
  body.default_color_set .btn-primary {
    --bs-btn-bg: #000000;
    --bs-btn-border-color: #000000;
    --bs-btn-hover-bg: #000000;
    --bs-btn-active-bg: #000000;
    --bs-btn-active-border-color: #c94a10;
    --bs-btn-hover-border-color: #c94a10;
    --bs-btn-hover-color: #fff;
    --bs-btn-focus-shadow-rgb: none;
  }
  body.default_color_set .btn-outline-primary{
    --bs-btn-color: #000000;
    --bs-btn-border-color: #c94a10;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #c94a10;
    --bs-btn-hover-border-color: #000000;
  }
:root{
    --bs-heading-color: #000000;
}

.btn-primary.focus, .btn-primary:focus{
    background-color: #e02b20 !important;
    border-color: #e02b20 !important;
}
body{
    font-family: "DM Sans", sans-serif !important;
    background-image: url(../images/home_image_21_9.jpg) !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-attachment: fixed !important;
    /* background-image: none !important; */
    /* background-color: #ffffff; */
    /* background-image: none !important; */
}
/* main{
    background-color: rgba(255, 255, 255, 0.5);
} */

.container_custom{
    padding: 0 2%;
    width: 100%;
}

h1, h2, h3, h4{
    font-family: "Outfit", sans-serif !important;
    font-weight: 700;
}
p{
    font-family: "DM Sans", sans-serif !important;
}
.whiteBgContent a{
    color: #c94a10 !important;
}
.pro-price span:first-child {
    padding-right: 5px;
  }
.container{
    max-width: 1610px !important;
}
.container-fluid{
    max-width: 1900px !important;
}


.stepsBar{
    padding-top: 0 !important;
}

.whiteBgContent p, .whiteBgContent li{
    font-family: "DM Sans", sans-serif;
    font-size: 15px;
}

/* NEW HEADER SECTION */
.header-part{
    width: 100%;
    padding: 0 0;
    position: relative;
    z-index: 99;
    background-color: #fff;
}
.headerTop{
    width: 100%;
    background-color: #000;
}
.headerTop .container{
    min-height: 32px;
    position: relative;
}
.headerTop ul{
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: start;
    list-style: none;
}
.headerTop ul li, .headerTop p{
   font-family: "DM Sans", sans-serif; 
   color: #fff;
   font-size: 12px;
   line-height: 1.2;
   font-weight: 500;
   margin: 0;
   padding: 0;
}
.headerTop p{
    color: #ccc;
}
.headerTop ul li{
    padding-right: 21px;
}
.headerTop ul li a{
    color: #fff;
    text-decoration: none;
}
.headerTop ul li a i{
    margin-right: 5px;
}
.headerTop ul li a:hover{
    color: #c94a10;
}
.headerTop .shield{
   background-color: rgb(212 80 10/0.3); 
   color: #c94a10;
   display: inline-block;
   padding: 0 15px;
   border-radius: 10px;
   font-size: 12px;
   font-weight: 700;
}
.headerTop .shield i{
    margin: 0 5px 0 0;
}
.headerTop .shield svg{
    margin: 0 5px 0 0;
    height: 14px;
    width: auto;
}
.headerBot{
    background-color: #fff;
    padding: 12px 0;
}
.headerBot .container{
    background-color: #fff;
}




.header-part a.logo img{
    width: auto;
    max-width: inherit;
    height: 55px;
    margin: 0;
}
ul.hdrContact{
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: end;
}
ul.hdrContact li{
    list-style: none;
    margin: 0;
    padding: 0 0 0 21px;
    color: #000;
    font-size: 12px;
    font-family: "DM Sans", sans-serif;
    font-weight: 400;
}
ul.hdrContact li a{
    color: #000;
}
ul.hdrContact li i{
    margin-right: 5px;
}







ul.socialLnks{
    margin: 0;
    padding: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
ul.socialLnks li{
    margin: 0;
    padding: 0 7px;
    list-style: none;
    font-size: 18px;
    line-height: 1.5;
    color: #fff;
}
ul.socialLnks li a{
    color: #fff;
}
ul.socialLnks li svg{
    width: 21px;
    height: 21px;
}
.headerBottom .container{
    padding-top: 5px;
    padding-bottom: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.headerRight{
    display: flex;
    align-items: center;
    justify-content: space-between;
}




.callUsBtn{
    display: block;
    position: relative;
    color: #fff;
    font-size: 16px;
    font-weight: 300;
    font-family: "DM Sans", sans-serif;
    padding: 0 0 0 50px;
    line-height: 2.1;
}
.callUsBtn i{
    font-size: 30px;
    position: absolute;
    left: 0;
    top: 30%;
}
.callUsBtn span{
    display: block;
    font-weight: 500;
    font-size: 18px;
    font-weight: 500;
    font-family: "DM Sans", sans-serif;
}
.callUsBtn:hover{
    color: #fff;
}



.headerBtn{
    background-color: #c94a10;
    font-family: "Outfit", sans-serif;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 600;
    color: #fff;
    border: 1px solid #c94a10;
    border-radius: 30px;
    padding: 15px 50px !important;
    margin: 0 0 0 21px !important;
    letter-spacing: 0;
    text-transform: capitalize;
    text-decoration: none;
    display: inline-block;
    width: auto;
    height: auto;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: scale(1);
    transition: all 0.3s;
}
.headerBtn:hover{
    background-color: #c94a10;
    color: #fff;
    border-color: #c94a10;
    transform: scale(1.05);
}
.headerBtn svg{
    width: 16px;
    height: 16px;
    margin: 0 0 0 10px;
}


.headerBtn_2{
    background-color: #c94a10;
    font-family: "DM Sans", sans-serif;
    font-size: 15px;
    line-height: 1.5;
    font-weight: 400;
    color: #fff;
    border: 1px solid #c94a10;
    border-radius: 0;
    padding: 10px 25px !important;
    margin: 0 0 0 0 0 !important;
    letter-spacing: 0;
    text-transform: capitalize;
    text-decoration: none;
    display: inline-block;
    width: auto;
    height: auto;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 0 21px;
}
.headerBtn_2:hover{
    background-color: #17407a;
    color: #fff;
    border-color: #17407a;
}



a.phoneNmbr{
    font-size: 15px;
    background-color: transparent;
    padding: 10px;
    display: inline-block;
    color: #000;
    font-family: "DM Sans", sans-serif;
    font-weight: 600;
}
a.phoneNmbr span{
    color: #c94a10;
}
a.phoneNmbr:hover{
    background-color: #c94a10;
    color: #000;
}



.header-part h1{
    font-size: 40px;
    font-weight: 400;
    text-transform: uppercase;
    font-family: "DM Sans", sans-serif !important;
    padding: 0 0 0 0;
    margin: 0;
    letter-spacing: 0;
    line-height: 1.5;
}
.header-part h1 span{
    font-size: 23px;
    font-weight: 500;
    display: block;
}
a.telNumber{
    color: #fff;
    font-size: 16px;
    font-weight: 300;
    font-family: "DM Sans", sans-serif;
}
a.telNumber:hover{
    color: #fff;
}
a.hdrBtn{
    color: #caab50;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 400;
    line-height: 1;
    border: 1px solid #caab50;
    border-radius: 60px;
    padding-top: 12px;
    padding-right: 22px;
    padding-bottom: 12px;
    padding-left: 22px;
    transition: all 300ms;
}
a.hdrBtn:hover{
    color: #fff;
    border-color: #fff;
}


#site-identity p.site-title{
    background-color: #ffffff;
    color: #222;
    font-family: "DM Sans", sans-serif;
    font-size: 50px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 10px;
    line-height: 1;
    margin-top: 10px;
    margin-bottom: 15px;
    margin-left: 20px;
    text-decoration: none;
    border-top-color: #ffffff;
}
#site-identity p.site-title a{
    color: #222;
}
#site-identity p.site-title a:hover{
    color: #ff7d06;
}

#site-identity p.site-description {
    color: #000000;
    font-family: "DM Sans", sans-serif;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: 1;
    border-top-color: #ffffff;
    text-align: center;
    letter-spacing: 2.2px;
}
.header-phone-number{
    font-size: 28px;
    color: #272727;
    padding: 0 0 20px;
}
.header-phone-number a{
    color: #272727;
}
.header-phone-number i{
    padding-right: 15px;
}



.header_bottom .btn.btn-primary{
    margin: 0 0 0 25px;
    border-radius: 0;
    background-color: #000000;
}
.appointment{
    float: right;
}


.top-right-header{
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    margin-right: 25px;
    flex-wrap: nowrap;
}




/* .header-part.sticky{
    position: fixed !important;
    top: 0 !important;
    width: 100% !important;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    -webkit-animation: slide-down 0.7s;
    animation: slide-down 0.7s;
    z-index: 99;
} */

/* Content Section */
.whiteBgContent{
    background-color: rgba(255, 255, 255, 0.9);
    padding: 30px;
}
.vendorDetailsWrapper{
    display: none !important;
}
.main-content{
    /* background-image: url(https://royal-construction.com/wp-content/uploads/2024/05/project-2-1536x1024.jpg) !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    background-size: cover !important; */
    /* background-attachment: fixed !important; */
    padding-top: 0 !important;
    /* background: transparent !important; */
}
.main-content .main-content{
    padding-top: 21px !important;
}
.main-content .card{
    background-color: rgba(255, 255, 255, 0.79);
    /* background: transparent !important; */
    /* border: none !important; */
}
.breadcrumb[data-v-50778a75]{
    background-color: transparent !important;
}
.formRight{
    display: none !important;
    visibility: hidden !important;
}
.product-main-title .product-sort .pro-search .search-input .form-control{
    height: 42px !important;
    width: 280px;
}
.also-viewed .product-card, .recently-viewed .product-card{
    padding: 20px 15px 15px;
    background: #eee;
    height: 100%;
}
.product-pagination .pagination li a.active{
    color: #fff !important;
}
.customTab .nav-link{
    color: #fff !important;
}
.customTab .nav-link.active{
    color: #000000 !important;
}
.notification-design .container{
    background-color: rgba(255, 255, 255, 0.9);
    padding-top: 50px;
    padding-bottom: 50px;
}
.notification-design .container .container{
    background: transparent;
}
.loginRegSection .btnoutlineWhite{
    color: #000000;
    border-color: #000000;
}
.loginRegSection .btnoutlineWhite:hover{
    color: #fff;
    background-color: #000000;
}
.fourZeroFour{
    background-color: rgba(255, 255, 255, 0.9);
    padding: 30px;
    border-radius: 20px;
}

/* Login Register Form */
.loginRegSection{
    background-color: rgba(255, 255, 255, 0.9);
    padding: 50px 0;
    border-radius: 30px;
}
.loginRegSection .inputWrpr span.label{
    top: -10px;
}
.loginRegSection .form-control{
    background: transparent;
}
.loginRegSection .checkbox-custom-label::before{
    border: 1px solid #666 !important;
}
.loginRegSection .checkbox-custom:checked + .checkbox-custom-label::after{
    left: 5px;
}
.loginRegSection.userFormWrpr{
    max-width: 100% !important;
}

.paymentPage{
    background: rgba(255, 255, 255, 0.9);
    padding-top: 50px;
    padding-bottom: 50px;
}
.product-h-item-info .product-quantity .form-control{
    font-weight: 700;
}
.shipping-list figure img{
    object-fit: contain !important;
    background-color: #fff !important;
    border: 1px solid #ccc !important;
}
.order-summery .summery-img{
    background-color: #fff !important;
}
.recently-viewed .pro-shipping{
    display: none;
}
.product-h-item-info .product-quantity .form-control{
    background: transparent;
}

/* .breadcrumb .breadcrumb-item > a{
    color: #000000 !important;
}

.product-list .product-card .card-body .card-title{
    color: #000000 !important;
}
.product-main-title .product-sort .pro-search .search-input .btn{
    background: #000000 !important;
}
.product-list-tab .nav-tabs .nav-item .nav-link.active{
    background: #000000 !important;
    color: #fff !important;
}
.product-list-tab .nav-tabs .nav-item .nav-link{
    color: #000000 !important;
}
.product-card .pro-shop-btn .addToCartBtn{
    background-color: #000000 !important;
    color: #fff !important;
}
.product-card:hover .pro-link, .product-card:hover .pro-short-desc, .product-card:hover .card-title{
    color: #000000 !important;
}
button.btn.btn-outline-primary.btn-clear{
    color: #000000 !important;
}
.page-link.active, .active > .page-link{
    background-color: #000000 !important;
    border-color: #000000 !important;
}
.btn-primary{
    background-color: #000000 !important;
    color: #fff !important;
    border-color: #000000 !important;
}
.product-information .product-return a{
    color: #000000 !important; 
}
.product-card .pro-shipping span{
    color: #000000 !important; 
} */




/* Footer Part */
.footerPart{
    width: 100%;
    padding: 0 0 0;
    background-color: rgb(26 26 26/1);
    position: relative;
}
.footerPart .container{
    position: relative;
    z-index: 1;
}

.footerPart h3{
    color: #fff;
	font-size: 1.25rem;
	line-height: 1.5;
    font-weight: 500;
    margin: 0;
    padding: 0 0 5px;
}
.footerPart p{
    color: rgba(255, 255, 255, 0.7);
	font-size: 1rem;
	line-height: 1.5;
    font-weight: 400;
    padding: 10px 0;
}
.footerPart p a{
    color: rgba(255, 255, 255, 0.7);
}
.footerPart p i{
    margin-right: 10px;
}
a.footerBtn{
    background-color: #c94a10;
    font-family: "DM Sans", sans-serif;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 500;
    color: #fff;
    border: 1px solid #c94a10;
    border-radius: 30px;
    padding: 15px 35px !important;
    margin: 0 0 0 0 0 !important;
    letter-spacing: 0;
    text-transform: capitalize;
    text-decoration: none;
    display: inline-block;
    width: auto;
    height: auto;
    text-align: center;
    /* display: flex;
    align-items: center;
    justify-content: center; */
}
a.footerBtn i{
    margin: 0 0 0 10px;
}
a.footerBtn:hover{
    background-color: #2ba87f;
    border-color: #2ba87f;
    color: #fff;
}
.footerPart .container{
    position: relative;
    z-index: 1;
}
a.footer_logo img{
    height: 117px;
    width: auto;
    margin-bottom: 2rem;
}
.footerPart h4{
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 700 !important;
    color: #fff;
    font-family: "DM Sans", sans-serif !important;
    text-transform: uppercase;
    padding: 0 0 15px;
    margin: 0;
    letter-spacing: 1px;
}
.footerPart h5{
    font-size: .875rem;
    line-height: 1.5;
    font-weight: 400 !important;
    color: #fff;
    font-family: "DM Sans", sans-serif !important;
    text-transform: none;
    padding: 15px 90px 15px 0;
    margin: 0;
    color: #fff9;
}

.footerPart ul{
    margin: 0;
    padding: 0;
}
.footerPart ul li{
    margin: 0;
    padding: 10px 0;
    list-style: none;
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 400;
    color: #777;
    font-family: "DM Sans", sans-serif;
    text-transform: capitalize;
    position: relative;
}
.footerPart ul li a{
    margin: 0;
    padding: 0;
    color: #777;
}
.footerPart ul li i{
    margin-right: 5px;
    color: #777;
}
.footerPart p small{
    font-size: 12px;
    line-height: 1.5;
    display: block;
    color: #777;
}


.footerPart ul.contactDetails{
    margin: 0;
}
.footerPart ul.contactDetails svg{
    color: #c94a10;
    height: 16px;
    margin: 0 0 0 0;
    position: absolute;
    left: 0;
    top: 10px;
}
.footerPart ul.contactDetails li{
    position: relative;
    padding-left: 30px;
}

.footerPart li a:hover, .footerPart p a:hover{
    color: #c94a10;
}

a.footerlogo{
    display: flex;
    align-items: center;
    justify-content: start;
}
a.footerlogo img{
    padding: 10px;
    background-color: #fff;
    border-radius: 10px;
    height: 60px;
    box-shadow: #c94a10 0 0 25px;
    margin: 0 15px 0 0;
}
a.footerlogo div{
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-weight: 800;
    color: #fff
}
a.footerlogo div span{
    color: #c94a10;
}


ul.footerMenu li{
    padding-left: 25px;
    position: relative;
}
ul.footerMenu li i{
    color: #c94a10;
    font-size: 14px;
    position: absolute;
    left: 0;
    top: 11px;
}
ul.footerContact li{
    padding-left: 25px;
    position: relative;
}
ul.footerContact li i{
    color: #ccc;
    font-size: 16px;
    position: absolute;
    left: 0;
    top: 11px;
}

.copyright_sec{
    padding-top: 30px;
    padding-bottom: 30px;
    border-top: 1px solid #ffffff1a;
}
.copyright_sec p{
    margin: 0;
    padding: 0;
    text-transform: uppercase;
    font-size: 11px;
    color: #777;
}

.footerPart_1{
    padding: 70px 0 35px;
}
.footerPart_2{
    padding: 25px 0;
    border-top: 1px solid #fff;
}
.footerPart_2 p a{
    padding: 0 0 0 21px;
}
ul.socialMedia{
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: start;
    list-style: none;
}
ul.socialMedia li{
    padding: 0;
    margin: 0;
    list-style: none;
}
ul.socialMedia li a{
    width: 40px;
    height: 40px;
    background-color: transparent;
    border-radius: 50%;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 10px 0 0;
    border: 1px solid transparent;
}
ul.socialMedia li a i{
    padding: 0 !important;
    margin: 0 !important;
    font-size: 28px !important;
    color: #fff;
}
ul.socialMedia li a:hover{
    border: 1px solid transparent;
    color: #000;
}
ul.socialMedia img{
    -webkit-filter: brightness(10%);
    filter: brightness(10%);
    opacity: 0.7;
}










.callBtn{
    font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  letter-spacing: 2.9px;
  background-color: #c94a10;
  border-radius: 0px 0px 0px 0px;
  padding: 16px 20px 16px 20px;
  color: #fff;
  display: inline-block;
  margin: 0 0 21px;
}
.callBtn:hover{
    color: #fff;
}




.social_logos img{
    width: 30px;
    height: 30px;
    margin: 0 6px 0 0;
}

.p_by{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    flex-direction: column;
}
.p_by img{
    height: 35px;
    width: auto;
    padding: 0;
    border-radius: 5px;
}
.p_by h4{
    font-size: 11px !important;
    padding: 0 !important;
}

#pills-tabContent{
    background-color: #fff;
}








.mm-spn.mm-spn--dark .fa-caret-down{
    display: none;
}
.mm-spn.mm-spn--dark .fa-caret-right{
    display: none;
}
.mm-spn.mm-spn--dark{
    background-color: #000;
    color: #fff;
    text-transform: capitalize;
    font-size: 16px;
}



.popupSideBottom{
    width: 300px;
    /* min-height: 400px; */
    padding: 20px;
    border-radius: 10px 10px 0 0;
    background-color: #fff;
    position: fixed;
    right: 10px;
    bottom: 0;
    z-index: 99;
    background-image: url(../images/home_image_21_9.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    /* overflow: hidden; */
    transition: all 0.25s;
    bottom: -100%;
}
.popupSideBottom::before{
    background: #000000;
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    width: 100%;
    height: 100%;
    opacity: 0.7;
    border-radius: 10px 10px 0 0;
}
.popupSideBottom .showPopupBtn{
    position: fixed;
    width: 150px;
    height: 30px;
    right: 20px;
    bottom: 0px;
    text-align: center;
    font-size: 12px;
    line-height: 30px;
    height: 30px;
    background: #c94a10;
    color: #fff;
    cursor: pointer;
    border-radius: 5px 5px 0 0;
    display: block;
}
.popupSideBottom .showPopupBtn i{
    margin-left: 10px;
}
.popupSideBottom.closePopup .showPopupBtn{
    display: none;
}
.popupSideBottom.closePopup{
    bottom: 0%;
}
.closeBtn{
    position: absolute;
    right: 15px;
    top: 15px;
    color: #fff;
    cursor: pointer;
    font-size: 20px;
    background: transparent;
    border: none;
    cursor: pointer;
    z-index: 2;
}
.popupSideBottom .content{
    position: relative;
    z-index: 1;
    color: #fff;
}
.popupSideBottom .content h3, .popupSideBottom .content p{
    color: #fff;
    text-align: left;
}
.popupSideBottom .content h3{
    font-size: 28px;
}
.popupSideBottom .form-control{
    background: transparent !important;
    border-radius: 0;
    border: 1px solid #fff;
    color: #fff;
    margin:  15px 0;
    padding: 5px 10px;
    height: 40px;
}
.popupSideBottom .form-control::placeholder{
    color: #fff;
}
.popupSideBottom .btn.btn-primary{
    border-radius: 10px !important;
    float: right;
    background-color: #c94a10;
    color: #000;
}
.popupSideBottom .btn.btn-primary:focus{
    background-color: #c94a10 !important;
    border-color: #c94a10 !important;
}

.p_by{
    padding-top: 30px;
}



a.menuIcon{
    position: absolute;
    right: 0;
    top: 45px;
    background-color: #333;
    padding: 12px !important;
    line-height: 0;
    border-radius: 0 !important;
    z-index: 9;
    /* width: 35px; */
    color: #fff !important;
    font-size: 24px !important;
    border-radius: 50% !important;
    /* width: 40px; */
    display: none !important;
}
/* a.menuIcon img{
    height: 16px;
} */
 a.menuIcon:hover{
    background-color: #c94a10 !important;
    color: #fff !important;
 }

.mm-spn a i.fa-solid.fa-angle-down{
    display: none;
}
.mm-spn.mm-spn--dark{
    background: #333;
}
.product-card .pro-shop-btn .addToCartBtn{
    background: #000000 !important;
    padding: 10px 25px;
    border-radius: 20px;
}
.product-list.product-list-desc .card-body{
    text-decoration: none !important;
}

.achievements_imgs{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
.achievements_imgs img{
    width: auto;
    height: 55px;
    margin: 0 0 15px;
}

.newsletterSec{
    background-color: #0063E8;
    padding: 30px;
}
.newsletterSec h4{
    color: #fff;
}
.newsletterSec .form-control{
    width: 100%;
    height: 45px;
    padding: 0 10px;
    margin: 10px 0;
}
.newsletterSec button[type="submit"]{
    background-color: #000;
    color: #fff;
    width: 100%;
    height: 45px;
    border: 2px solid #000;
}
.newsletterSec button[type="submit"]:hover{
    background-color: #fff;
    color: #000;
}

.cartBtn{
    font-size: 14px;
    font-weight: 600;
    line-height: 50px;
    background-color: #c94a10;
    padding: 0;
    color: #fff;
    margin: 0 0 0 10px;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    text-align: center;
    display: block;
    position: relative;
}
.cartBtn i{
    margin: 0 5px;
    font-size: 14px;
}
.cartBtn:hover{
    color: #fff;
    text-decoration: none !important;
}
.cartBtn span.cart-number{
    
    font-size: 12px;
}
.userBtn{
    font-size: 14px;
    font-weight: 600;
    line-height: 50px;
    background-color: #c94a10;
    padding: 0;
    color: #fff;
    margin: 0 0 0 10px;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    text-align: center;
    display: block;
    border: none;
}
.userBtn img{
    margin: 0 5px 0 0;
    height: 16px;
    width: auto;
}
.userBtn:hover{
    color: #fff;
    text-decoration: none !important;
}
.navbar-toggler{
    padding: 0 !important;
}
.swal2-backdrop-hide{
   /*  display: none !important; */
}
.swal2-container.swal2-backdrop-show, .swal2-container.swal2-noanimation{
  /*   background: transparent !important; */
}
.swal2-container{
/*     left: auto !important;
    bottom: auto !important; */
}
ul.customTab{
    background-color: #000;
}
.mm-spn a{
    color: #fff !important;
    text-decoration: none !important;
    font-size: 16px;
    font-family: "DM Sans", sans-serif;
}
.shopping-cart{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.text-end{
    text-align: right !important;
}
.text-start{
    text-align: left !important;
}



/* CATEGORY */
.cardPaddingTopBot{
    padding-top: 15px;
    padding-bottom: 15px;
}
#catlist .card{
    position: relative;
    border: 2px solid #ccc !important;
}
#catlist .card .card-img-top{
    position: relative;
    background-color: #ccc;
    /* border: 1px solid #f1f1f1; */
    background: none !important;
}
/* #catlist .card .card-img-top img{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: contain;
    max-height: none !important;
} */
#catlist .card h5.card-title{
    position: absolute;
    left: 10px;
    top: 10px;
    font-size: 14px;
    font-weight: 600;
    color: #030F27;
    background-color: rgba(255, 255, 255, 0.9);
    padding: 5px 10px;
}
#catlist ul.list-unstyled{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
#catlist ul.list-unstyled li{
    font-size: 14px;
    font-weight: 400;
    color: #030F27;
    padding: 2.5px 0 2.5px 15px;
    display: block;
    width: 50%;
    position: relative;
}
#catlist ul.list-unstyled li::before{
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: #001954;
    position: absolute;
    left: 0;
    top: 11px;
}
#catlist ul.list-unstyled li a{
    color: #030F27;
}
#catlist .card-body .btn.btn-link{
    margin: 0 !important;
    background-color: #fff !important;
    border: none;
    color: #001954;
    font-size: 14px;
    font-weight: 700;
    padding: 0 !important;
    text-align: left;
    position: absolute;
    bottom: 10px;
    left: 15px;
}
ul.cat_image_sec{
    width: 100%;
    position: relative;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
ul.cat_image_sec li{
    width: calc(50% - 20px);
    position: relative;
    margin: 10px;
    padding: 0;
    list-style: none;
    border: 1px solid #ccc;
}
ul.cat_image_sec li img.img-fluid_2{
    width: 100%;
    height: 140px;
    object-fit: contain;
}
ul.cat_image_sec li h6.card-title{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.7);
    padding: 5px 2.5px;
    margin: 0;
    font-size: 12px;
}
ul.cat_image_sec li a{
    display: block;
    color: #000;
}
ul.cat_image_sec li h6.card-title a{
    color: #000;
}


.product-card.listStyle_1 .finish-product button.btn.btn-link{
    color: #000;
    font-weight: 500;
    font-size: 15px;
    text-decoration: none;
    justify-content: start;
}
.product-card.listStyle_1 a.card-body.heightAuto{
    padding: 20px;
    height: auto !important;
}
.product-card.listStyle_1 a.card-body.heightAuto:hover{
    color: #000 !important;
}

.product-card.listStyle_1 .pro-short-desc{
    font-weight: 400;
    font-size: 15px;
}
.product-card.listStyle_1 .pro-model{
    font-weight: 400;
    font-size: 15px;
}
.product-card.listStyle_1 .pro-model.sku{
    min-height: 50px;
}

.product-card.listStyle_1 .pro-price{
    font-weight: 500;
    font-size: 15px;
}
.product-card.listStyle_1 .pro-price sup{
    font-size: 13px;
}
.product-card.listStyle_1 .pro-shop-btn .addToCartBtn{
    width: 100%;
    color: #fff;
    background: #497F75;
}

.product-card.listStyle_1 button.wishListBtn{
    width: 30px;
    height: 30px;
    position: absolute;
    right: -2px;
    top: -3px;
    border: none;
    background: transparent;
}
.product-card.listStyle_1 button.wishListBtn::before{
    content: "\f08a";
    font-family: "FontAwesome";
    /* content: "\F417";
    font-family: "bootstrap-icons"; */
    width: 30px;
    height: 30px;
    font-weight: 900;
    font-size: 16px;
    line-height: 30px;
    text-align: center;
    color: #497F75;
}
.product-card.listStyle_1 button.wishListBtn.added::before{
    content: "\f004";
    font-family: "FontAwesome";
}


.product-card.listStyle_1 .finish-product ul{
    /* display: flex;
    align-items: center;
    flex-wrap: wrap; */
    width: 100%;
    margin: 0;
    padding: 0 0 10px;
}
.product-card.listStyle_1 .finish-product ul li{
    margin: 5px 4px 0 0;
    padding: 0;
    list-style: none;
    display: inline-block;
}
.product-card.listStyle_1 .finish-product img{
    width: 25px !important;
    height: 25px !important;
    object-fit: cover;
    border: 1px solid #ccc;
    margin: 0 auto;
    display: block;
}
.product-card.listStyle_1 .pro-img{
    object-fit: contain;
    border-radius: 0;
    border: 1px solid #ccc;
    height: 182px;
}
.product-card.listStyle_1 .pro-price{
    font-size: 11px;
    display: flex;
    align-items: center;
}
.product-card.listStyle_1 .pro-price p.amount{
    font-size: 24px;
    font-weight: 600;
    position: relative;
    margin-left: -5px;
}
.product-card.listStyle_1 .pro-price .amount::first-letter{
    /* font-size: 12px;
    top: -10px;
    position: absolute; */
    display: block;
    font-size: 0;
}


.product-card.listStyle_1 .pro-img-block{
    position: relative;
}
.product-card.listStyle_1 .pro-img-block .freeSampleTag{
    position: absolute;
    left: 0;
    top: 0;
    width: 140px;
    line-height: 30px;
    background-color: rgba(255, 255, 255, 0.6);
}
.product-card.listStyle_1 .pro-img-block .freeSampleTag img{
    height: 26px;
    width: auto;
    margin: 2px 0;
}
.product-card.listStyle_1 .pro-img-block .freeSampleTag span{
    font-size: 13px;
    font-weight: 500;
    color: #000;
    line-height: 30px;
}


.product-card.listStyle_1 .finish-product{
    padding: 0 15px;
    position: relative;
}

.product-card.listStyle_1 .slick-arrow{
    position: absolute;
    width: 12px;
    height: 20px;
    left: -10px;
    top: 3px;
    border: 0;
    background-color: transparent;
    font-size: 0;
}
.product-card.listStyle_1 .slick-arrow.slick-prev{
    background-image: url(../images/leftTmbSlide.png);
    background-repeat: no-repeat;
    background-size: 12px 20px;
}
.product-card.listStyle_1 .slick-arrow.slick-next{
    background-image: url(../images/rightTmbSlide.png);
    background-repeat: no-repeat;
    background-size: 12px 20px;
    left: auto;
    right: -10px;
}
.btn.btn-primary.reqFreSmpl {
    color: #000;
    border-color: #d8e045;
    text-transform: uppercase;
    font-weight: 700;
    background-color: #d8e045;
}
#catlist, #prdListCntn, #prdDtls{
    max-width: 1600px !important;
}



.border_bottom_MD{
    border: none;
}





ul.socialLinks{
    display: flex;
    align-items: start;
    justify-content: start;
    margin: 15px 0;
    padding: 0;
}
ul.socialLinks li{
    list-style: none;
    margin: 0;
    padding: 0 10px 0 0;
}
ul.socialLinks li a{
    width: 36px;
    height: 36px;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #c94a10;
    font-size: 21px;
    border: none
}
ul.socialLinks li a:hover{
    background-color: #c94a10;
    color: #c94a10;
}
ul.socialLinks li a svg{
    width: 1rem;
}
.footerPart ul.socialLinks li a{
    color: #fff;
}

ul.footer_menu_2{
    padding: 15px 0;
    margin: 15px 0 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
}



.footerLinks{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: row;
    padding: 0;
    margin: 0;
}
.footerLinks li{
    padding: 0 10px !important;
    margin: 0;
    list-style: none;
}
.footerLinks li a{
    padding: 5px 0 !important;
    margin: 0;
    color: rgba(255,255,255,0.6);
    text-align: left;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    font-family: "DM Sans", sans-serif;
    position: relative;
    list-style: none;
    text-transform: capitalize;
}

.footerLinks li a:hover{
    color: #c94a10;
}








.quoteBtn{
    line-height: 20px;
    font-size: 20px;
    background-color: #2a612a;
    padding: 15px 21px;
    margin: 5px;
    color: #ffffff;
    font-weight: 700;
    text-align: center;
    width: 180px;
    margin: 0 auto 20px;
    display: block;
}
.quoteBtn:hover{
    background-color: #054214 !important;
    color: #fff !important;
}


.wp-gr.wpac.wp-dark{
    text-align: center;
}
.wp-gr.wpac.wp-dark svg{
    fill: #fb8e28;
}
.wp-gr.wpac.wp-dark .wp-google-rating{
    color: #fb8e28;
    font-size: 18px;
    font-weight: 700;
}
.wp-gr.wpac.wp-dark .wp-star{
    margin: 0 2.5px;
}
.wp-google-powered{
    color: #fff;
}
.wp-google-wr a{
    padding: 5px 21px;
    border-radius: 15px;
    color: #fff;
    background-color: #1f67e7;
    display: inline-block;
    text-transform: capitalize;
    margin: 21px 0 0 0;
}
.wp-google-wr a:hover{
    color: #fff;
}
.wp-google-wr a svg{
    margin: 0 0 0 10px;
}


.awardSection img{
    max-height: 120px;
    max-width: 120px;
    width: auto;
    margin: 10px;
}









@media screen and (min-width: 1025px) {
    .mainMenu{
        background-color: #000000;
        width: 100%;
        padding: 0;
    }
    a.menuIcon{
        display: none;
    }
    nav.mainNav{
        /* width: 34%; */
    }
    .mainNav ul{
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        margin: 0 0 0 0;
        padding: 0 0 0 0;
    }
    .mainNav ul li{
        margin: 0 0;
        padding: 0 5px;
        list-style: none;
        position: relative;
    }
    .mainNav ul li a{
        font-size: 15px;
        line-height: 1;
        font-weight: 400;
        color: #000;
        font-family: "DM Sans", sans-serif;
        padding: 10px 15px;
        margin: 0;
        position: relative;
        text-decoration: none;
        text-transform: capitalize;
        display: block;
        /* transition: all 0.5s; */
        letter-spacing: 0;
        /* border-bottom: 3px solid transparent; */
        border-radius: 10px;
    }
    /* .mainNav ul li a::after{
        content: "";
        width: 1px;
        height: 12px;
        background-color: #1A934B;
        position: absolute;
        right: 0;
        top: 0;
    } */
    .mainNav ul li:last-child a::after{
        display: none;
    }
    .mainNav ul li a i{
        margin-left: 5px;
        font-size: 12px;
        color: #000;
    }
    .mainNav ul li a:hover, .mainNav ul li.active a{
        color: #c94a10;
        background-color: #f1f1f1;
        text-decoration: none;
        /* border-bottom: 3px solid #c94a10; */
    }
    .mainNav ul li a::before{
        /* content: "";
        width: 0%;
        height: 2px;
        background-color: transparent;
        position: absolute;
        left: 0%;
        top: auto;
        bottom: 0; */
        /* transition: all 0.3s; */
    }
    .mainNav ul li a:hover::before, .mainNav ul li.active a::before{
        /* background-color: #c94a10;
        left: 0;
        width: 100%; */
    }
    .mainNav ul li.contactTab a{
        display: none;
    }
    .mainNav ul ul.s_menu {
        visibility: hidden;
        opacity: 0;
        transform: translateY(20px);
        -webkit-transform: translateY(20px);
        -ms-transform: translateY(20px);
        z-index: -1;
        /* transition: all 0.1s ease-in-out 0s, visibility 0s linear 0.1s, z-index 0s linear 0.01s; */
        position: absolute;
        left: 0;
        top: 100%;
        background: #fff;
        width: 250px;
        z-index: 999;
        margin: 0;
        border-radius: 0 0 10px 10px;
        padding: 5px;
    }
    .mainNav ul li:hover ul.s_menu {
        visibility: visible;
        opacity: 1;
        z-index: 999;
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transition-delay: 0s, 0s, 0.1s;
        box-shadow: rgba(0, 0, 0, 0.1) 0 0 5px;
    }
    .mainNav ul ul.s_menu{
        display: block;
    }
    .mainNav ul ul.s_menu li{
        padding: 0;
        margin: 0;
    }
    .mainNav ul ul.s_menu li::after{
        display: none;
    }
    .mainNav ul ul.s_menu li a{
        font-size: 15px;
        line-height: 1.2;
        font-family: "DM Sans", sans-serif !important;
        color: #000;
        font-weight: 400;
        display: block;
        margin: 0;
        padding: 12px 15px;
        text-align: left;
        letter-spacing: 0;
        border-radius: 0;
    }
    .mainNav ul ul.s_menu li a:hover{
        /* background-color: #c94a10; */
        color: #000;
        background-color: #f1f1f1;

    }
    .mainNav ul ul.s_menu li a::before{
        display: none;
    }
    .mainNav ul ul.s_menu li ul.ss_menu{
        visibility: hidden;
        opacity: 0;
        transform: translateY(20px);
        -webkit-transform: translateY(20px);
        -ms-transform: translateY(20px);
        z-index: -1;
        /* transition: all 0.1s ease-in-out 0s, visibility 0s linear 0.1s, z-index 0s linear 0.01s; */
        position: absolute;
        left: auto;
        right: -100%;
        top: 0;
        background: #f5f5f5;
        width: 300px;
        z-index: 999;
        overflow: hidden
    }
    .mainNav ul ul.s_menu li:hover ul.ss_menu{
        visibility: visible;
        opacity: 1;
        z-index: 999;
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transition-delay: 0s, 0s, 0.1s;
        box-shadow: rgba(0, 0, 0, 0.2) 0 0 10px;
        overflow: visible;
    }
    .mainNav ul ul.s_menu li ul.ss_menu{
        display: block;
    }




    .mainNav ul ul.s_menu li ul.sss_menu{
        visibility: hidden;
        opacity: 0;
        transform: translateY(20px);
        -webkit-transform: translateY(20px);
        -ms-transform: translateY(20px);
        z-index: -1;
        /* transition: all 0.1s ease-in-out 0s, visibility 0s linear 0.1s, z-index 0s linear 0.01s; */
        position: absolute;
        left: auto;
        right: -100%;
        top: 0;
        background: #AEA5A0;
        width: 300px;
        z-index: 999;
        overflow: hidden
    }
    .mainNav ul ul.ss_menu li:hover ul.sss_menu{
        visibility: visible;
        opacity: 1;
        z-index: 999;
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transition-delay: 0s, 0s, 0.1s;
        box-shadow: rgba(0, 0, 0, 0.2) 0 0 10px;
        overflow: visible;
    }
    .mainNav ul ul.ss_menu li ul.sss_menu{
        display: block;
    }
    


    



    

}

@media screen and (max-width: 1600px) {
    .mainNav{
        /* width: 60%; */
    }
    a.phoneNmbr{
        font-size: 12px;
    }
    a.phoneNmbr{
        display: none;
    }
    

}


@media screen and (max-width: 1024px) {
    /* .header-part{
        padding: 0;
    } */
    .headerInner_1{
        height: auto;
        padding: 5px 0;
    }


    .top-right-header{
        margin: 0 0 0 0;
    }

}


@media screen and (max-width: 1280px) {
    .mainNav ul li{
        padding: 0 5px;
    }
    .mainNav ul li a{
        font-size: 14px;
    }
    .headerBtn, .headerBtn_2{
        display: none;
    }
    .footerPart .headerBtn{
        display: inline-block;
    }

    

    

}

@media screen and (max-width: 1200px) {
    #catlist ul.list-unstyled li{
        width: 100%;
    }
    #catlist .card-body .btn.btn-link{
        font-size: 12px;
    }

    a.hdrBtn{
        display: none;
    }
    .callUsBtn{
        display: none;
    }
    
}
@media screen and (max-width: 1199px) {
    /* a.menuIcon{
        top: 10px;
        left: 10px;
    } */

}
@media screen and (max-width: 991px) {
    .hdrContact{
        display: none;
    }

    .header_top{
        padding: 10px 0;
    }
    .achievements_imgs{
        justify-content: center;
        align-items: center;
    }
    .achievements_imgs img{
        margin: 15px;
    }

    

    .mm-spn a i.fa-chevron-down, .mm-spn a i.fa-chevron-right{
        display: none;
    }

    #site-identity p.site-title{
        font-size: 25px;
        margin: 0;
        padding: 0;
        text-align: center;
    }
    #site-identity p.site-description{
        font-size: 12px;
    }
    .header-phone-number{
        font-size: 18px;
        color: #272727;
        padding: 0 0 20px;
    }


    



    .border_bottom_MD{
        border-bottom: 1px solid #422826;
    }



    

    



    .quoteBtn{
        margin-top: 30px;
    }
    
    ul.hdrContact{
        display: none;
    }





    ul.socialLinks{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    ul.socialLinks li{
        padding: 0 5px;
    }



    .userBtn, .cartBtn{
        width: 36px;
        height: 36px;
        line-height: 36px;
    }

    
}

@media screen and (max-width: 767px) {
    .top-right-header .nav.navbar-btn{
        top: -30px;
    }

    .p_by{
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .header-part .btn.btn-primary.dropdown-toggle{
        padding: 12px 8px 12px 12px !important;
    }
    .top-right-header .nav.navbar-btn{
        width: auto;
        justify-content: center;
    }
    .header-part .btn.btn-primary{
        margin: 0 5px !important;
        padding: 10px !important;
        font-size: 0;
        min-width: auto;
    }
    .header-part .btn.btn-primary i{
        font-size: 20px;
    }
    #catlist ul.list-unstyled li{
        width: 100%;
    }


    .footerLinks {
        margin: 0;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
      }

      
      .p_by{
        justify-content: center;
        align-items: center;
      }

      
      
      


      ul.ftrContactList li{
        padding: 40px 0 0 0;
      }
      ul.ftrContactList li span{
        left: calc(50% - 15px);
      }
      .ftrContact{
        padding: 30px;
        margin-bottom: 30px;
      }
      


    ul.contactDtlsFtr li a{
        padding: 30px 0 0 0;
        text-align: center;
    }
    ul.contactDtlsFtr li a i{
        left: 50%;
        top: 0;
    }
    


    .header_top a.header-phone{
        display: none;
    }

    #site-identity{
        display: none;
    }
    .header-phone-number{
        display: none;
    }
    /* .top-right-header{
        margin-top: -50px;
    } */




    
    ul.ftrContactDtls li{
        text-align: center;
        padding: 20px 0 0 0;
        margin-top: 10px;
    }
    ul.ftrContactDtls li i{
        left: 50%;
        top: 0;
    }

    a.headerTollFree{
        width: 100%;
        text-align: center;
    }

    a.headerTollFree img{
        display: none;
    }



    .social_logos{
        text-align: center;
    }
    



    .footerLinks{
        flex-direction: row;
    }
    .footerLinks li{
        padding: 0  10px !important;
    }
    .footerLinks li::before{
        display: none;
    }
    .hideMb{
        display: none !important;
    }


    a.telNumber{
        display: none;
    }

    
    
    .header-part a.logo img{
        margin-left: 0;
        height: 40px;
    }


    .btn.headerBtn{
        display: none;
    }
    
    
    
    
    
    
    


    ul.socialMedia li a{
        margin: 0;
    }



    
    


    .headerRight{
        /* flex-direction: column;
        margin-top: 5px; */
    }
    ul.socialMedia{
        margin: 0 0 0 0;
    }
    ul.socialMedia{
        align-items: center;
        justify-content: center;
    }

    
    .footerLinks li a{
        padding: 10px !important;
    }
    
    

    .catSec_5 article h4{
        text-wrap: wrap;
        font-size: 12px !important;
    }
    .whiteBgContent{
        padding: 0;
    }
    .whiteBgContent h3.font22{ font-size: 16px !important; }
    .whiteBgContent h2{ font-size: 21px !important; }
    .whiteBgContent h1{ font-size: 30px !important; }

    .faq-content .tab-content{ padding: 15px 0 !important; }
    .faq-content .tab-content h3{ font-size: 23px !important; }
    .faq-content .tab-content h4{ font-size: 18px !important; }
    .faq-content .nav-tabs li .nav-link{
        padding: 5px 10px !important;
        font-size: 12px !important;
        border: none !important;
    }
    .faq-content p a, .faq-content .tab-content li a{ color: #c94a10 !important; }

    


    a.menuIcon{
        top: 56px;
    }
    


    .header-part ul.socialLinks{
        display: none;
    }
    .footerPart{
        text-align: center;
    }
    ul.footerMenu li{
        padding-left: 0;
    }
    ul.footerMenu li i{
        position: static;
        margin-right: 5px;
    }
    ul.footerContact li{
        padding-left: 0;
    }
    ul.footerContact li i{
        position: static;
        margin-right: 5px;
    }
    .footerPart h4{
        padding-top: 30px;
        padding-bottom: 5px;
    }
    .col-md-6.d-flex.align-items-center.justify-content-start{
        justify-content: center !important;
        padding-bottom: 30px;
    }
    .footerPart ul.contactDetails li{
        padding-left: 0;
    }
    .footerPart ul.contactDetails svg{
        position: static;
    }


    a.footer_logo img{
        height: 75px;
    }


    .headerTop ul li:nth-child(2), .headerTop p{
        /* display: none; */
    }
    .headerTop{
        padding: 5px 0;
    }
    .headerTop p{
        padding: 5px 0 0 0;
    }
    .headerTop .container{
        flex-direction: column;
        justify-content: start !important;
        align-items: start !important;
    }




    .footerPart h5{
        padding: 15px;
    }
    a.footerlogo{
        justify-content: center;
    }
    .copyright_sec{
        padding-bottom: 50px;
    }


    .headerBtn_3{
        display: none !important;
    }
    
}

@media screen and (max-width: 575px) {

    
    



    
    



}


#zsiq_float{
    bottom: 100px !important;
}
#zsiq_chat_wrap{
    bottom: 200px !important;
}
.zsiq-chat-icn, .zsiq-close-icn{
    background: #c94a10;
    border-radius: 50%;
}
[class*="siqico-"]::before{
    color: #fff !important;
}
@media screen and (max-width: 554px) {
    #zsiq_chat_wrap{
        bottom: 0 !important;
    }
}

/* CHAT Added */
.zsiq-chat-icn, .zsiq-close-icn{
    background: #c94a10 !important;
}
#zsiq_float{
    bottom: 100px !important;
}
#zsiq_chat_wrap{
    bottom: 200px !important;
}
@media screen and (max-width: 554px) {
    #zsiq_chat_wrap{
        bottom: 0 !important;
    }
}

.btn.blackSecBtn_1{
    background-color: #c94a10 !important;
    border-color: #c94a10 !important;
    color: #fff !important;
    border-radius: 21px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    font-family: "Outfit", sans-serif !important;
}
.sliderBox h3{
    border-radius: 30px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #fff !important;
    border: 1px solid #c94a10  !important;
    background-color: #c94a10 !important;
    text-transform: uppercase;
    font-family: "Outfit", sans-serif !important;
}
.sliderBox a:hover h3{
    background-color: #000 !important;
    border: 1px solid #000  !important;
}
.btn:hover{
    background: #000 !important;
    border: 1px solid #000 !important;
}
.btnoutlineWhite:hover{
    border-color: #000 !important;
}
.popupSideBottom .btn.btn-primary{
    background: #c94a10 !important;
    color: #fff;
}
.mm-spn li::before{
    color: #fff !important;
}
nav.catSec_2 ul li a{
    font-family: "DM Sans", sans-serif !important;
}
.zsiq-tultip-close{
    background: #ccc !important;
}
.whiteBgSec_1{
    margin-top: 25px;
}





















/* =========================================================
   DESIGN TOKENS â€” ported from Next.js src/app/globals.css
   ========================================================= */
:root {
    /* Brand palette */
    --twoa-orange:        #eb5d1d;
    --twoa-orange-dark:   #c94a10;   /* WCAG AA on white */
    --twoa-orange-light:  #ff7a45;
    /* Lane 2 #1 â€” bump orange-glow alpha 0.10 â†’ 0.15 (Vercel parity). */
    --twoa-orange-glow:        rgba(235, 93, 29, 0.15);
    /* Lane 2 #6 â€” strong orange-glow variant (Vercel parity). */
    --twoa-orange-glow-strong: rgba(235, 93, 29, 0.30);

    /* Neutrals (light defaults) */
    --twoa-dark:          #343434;
    --twoa-dark-deep:     #1a1a1a;
    --twoa-dark-mid:      #2a2a2a;
    --twoa-dark-soft:     #404040;
    /* Lane 2 #9 â€” surface dark token for FinancingCTA/Bottom contrast. */
    --twoa-surface-dark:  #1e1e1e;

    --twoa-white:         #ffffff;
    --twoa-warm:          #f8f5f2;
    --twoa-gray:          #ededed;
    /* Lane 2 #7, #8 â€” cream + warm-gray tokens (used by select ports). */
    --twoa-cream:         #faf9f7;
    --twoa-gray-warm:     #f5f3f0;

    /* Semantic surfaces & text (light) */
    --color-bg-primary:        #ffffff;
    --color-bg-secondary:      #f8f5f2;
    --color-bg-tertiary:       #ededed;
    --color-bg-card:           #ffffff;
    --color-bg-card-elevated:  #ffffff;
    --color-text-primary:      #1a1a1a;
    --color-text-secondary:    #343434;
    --color-text-muted:        #4a4a4a;
    --color-text-mid:          #4a4a4a;
    /* Lane 2 #2 â€” Vercel parity #666666. */
    --color-text-light:        #666666;
    --color-border:            #e2dedb;
    --color-border-subtle:     #e8e4e1;

    /* Lane 2 #5 â€” Hero token block (Vercel globals.css parity). */
    --hero-bg:               #f5f5f5;
    --hero-gradient:         linear-gradient(180deg, #f5f5f5 0%, #ffffff 100%);
    --hero-grid-color:       rgba(26, 26, 26, 0.05);
    --hero-badge-bg:         rgba(235, 93, 29, 0.10);
    --hero-badge-border:     rgba(235, 93, 29, 0.20);
    --hero-heading-color:    var(--twoa-dark);
    --hero-subheading-color: rgba(52, 52, 52, 0.70);
    --hero-trust-text:       rgba(52, 52, 52, 0.60);
    --hero-scroll-text:      rgba(74, 74, 74, 0.85);
    --hero-scroll-line:      rgba(74, 74, 74, 0.50);

    /* Lane 2 #10 â€” gap tokens (Vercel parity). */
    --gap-xs: 0.5rem;
    --gap-sm: 0.75rem;
    --gap-md: clamp(1rem,   1.75vw, 2.5rem);
    --gap-lg: clamp(1.5rem, 2.5vw,  4rem);
    --gap-xl: clamp(2rem,   3.5vw,  5.5rem);

    /* Lane 2 #11 â€” shadow tokens (Vercel parity). */
    --shadow-s:         0 2px 8px  rgba(0,0,0,0.06);
    --shadow-m:         0 6px 24px rgba(0,0,0,0.08);
    --shadow-l:         0 16px 48px rgba(0,0,0,0.12);
    --shadow-orange-sm: 0 4px 16px rgba(235, 93, 29, 0.30);
    --shadow-orange-md: 0 6px 24px rgba(235, 93, 29, 0.40);
    --shadow-orange-lg: 0 8px 32px rgba(235, 93, 29, 0.40);

    /* Fonts */
    --font-display: "Outfit", system-ui, Arial, sans-serif;
    --font-body:    "DM Sans", sans-serif;
    --font-serif:   "Playfair Display", Georgia, "Times New Roman", serif;

    /* Easings */
    --ease-out-cubic:     cubic-bezier(0.33, 1, 0.68, 1);
    --ease-in-out-cubic:  cubic-bezier(0.65, 0, 0.35, 1);
    --ease-out-back:      cubic-bezier(0.34, 1.56, 0.64, 1);
    --ease-out-quart:     cubic-bezier(0.25, 1, 0.5, 1);
    /* Lane 2 #12 â€” extra ease tokens (Vercel parity). */
    --ease-in-out-sine:   cubic-bezier(0.45, 0.05, 0.55, 0.95);
    --ease-out-expo:      cubic-bezier(0.16, 1, 0.30, 1);

    /* Fluid type scale (clamp-based) â€” tuned 2026-05-20 so values at the
       1440 reference width match the Vercel computed sizes:
         body 16px, section-label 14px, btn 14.6px, h2 51.2px. */
    --font-size-hero:     clamp(2.25rem, 4vw + 1rem, 6rem);
    --font-size-display:  clamp(2rem,   3.5vw + 0.75rem, 5rem);
    --font-size-h1:       clamp(1.875rem, 3vw + 0.5rem, 4rem);
    /* Clamp targets 24px @ 375px AND 51.2px @ 1440 to match Vercel text-5xl. */
    --font-size-h2:       clamp(1.5rem, 0.9rem + 2.55vw, 3.5rem);
    --font-size-h3:       clamp(1.25rem, 2vw + 0.25rem, 2.5rem);
    --font-size-h4:       clamp(1.125rem, 1.5vw + 0.125rem, 2rem);
    /* Vercel parity: clamp(1.0625rem, 1.25vw + 0.25rem, 1.5rem) â€” matches hero subtitles + lead paragraphs sitewide. */
    --font-size-body-lg:  clamp(1.0625rem, 1.25vw + 0.25rem, 1.5rem);
    --font-size-body:     clamp(0.9375rem, 0.2vw + 0.875rem, 1.0625rem);
    --font-size-body-sm:  clamp(0.875rem, 0.15vw + 0.8125rem, 1rem);
    --font-size-label:    clamp(0.75rem, 0.3vw + 0.625rem, 0.9375rem);
    --font-size-caption:  clamp(0.75rem, 0.2vw + 0.6875rem, 0.875rem);

    /* Fluid spacing */
    --space-xs:  0.25rem;
    --space-sm:  0.5rem;
    --space-md:  clamp(0.75rem, 1.25vw, 2rem);
    --space-lg:  clamp(1rem,    1.75vw, 3rem);
    --space-xl:  clamp(1.5rem,  2.5vw, 4rem);
    --space-2xl: clamp(2rem,    3.5vw, 5.5rem);
    --space-3xl: clamp(2.5rem,  4.5vw, 7rem);

    --section-padding-sm: clamp(2rem, 4vh, 5rem);
    --section-padding:    clamp(3rem, 6vh, 8rem);
    --section-padding-lg: clamp(4rem, 8vh, 10rem);
    --section-padding-xl: clamp(5rem, 10vh, 12rem);

    --container-padding: clamp(1rem, 3vw, 4rem);
    --header-height:     clamp(60px, 6vh, 100px);

    /* Radii */
    --radius-sm:  6px;
    --radius-md:  8px;
    --radius-lg:  12px;
    --radius-xl:  16px;
    --radius-2xl: 24px;

    /* Lane 2 #16 â€” Full Plyr theme tokens ported from Vercel plyr-theme.css. */
    --plyr-color-main:                       #eb5d1d;
    --plyr-video-control-color:              #ffffff;
    --plyr-video-control-color-hover:        #ffffff;
    --plyr-video-control-background-hover:   rgba(235, 93, 29, 0.85);
    --plyr-video-controls-background:        linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.55) 50%, rgba(0,0,0,0.85));
    --plyr-control-icon-size:                18px;
    --plyr-control-spacing:                  12px;
    --plyr-control-radius:                   8px;
    --plyr-range-track-height:               5px;
    --plyr-range-thumb-height:               14px;
    --plyr-range-thumb-background:           #ffffff;
    --plyr-range-thumb-shadow:               0 1px 2px rgba(0,0,0,0.4), 0 0 0 2px rgba(235, 93, 29, 0.4);
    --plyr-range-fill-background:            #eb5d1d;
    --plyr-video-progress-buffered-background: rgba(255,255,255,0.25);
    --plyr-video-control-background:         rgba(0, 0, 0, 0.45);
    --plyr-menu-background:                  rgba(20, 20, 20, 0.96);
    --plyr-menu-color:                       #ffffff;
}


/* =========================================================
   SITE HEADER (TopBar + Header)
   ========================================================= */
/* Sticky stack â€” topbar pins to viewport top, header pins BELOW the topbar
   (--twoa-topbar-h) so they don't overlap. The combined height also feeds
   `scroll-padding-top` on <html> so in-page anchors clear the chrome. */
:root { --twoa-topbar-h: 32px; }

.topbar {
    background: var(--twoa-dark-deep);
    color: #fff;
    font-size: 0.75rem;
    /* Lane 2 #37 â€” tracking-wide parity (was 0.02em). */
    letter-spacing: 0.025em;
    padding: 0.5rem 0;
    position: sticky;
    top: 0;
    z-index: 52;
    min-height: var(--twoa-topbar-h);
}
/* Lane 2 #38 â€” Topbar 3xl bumps (Vercel parity). */
@media (min-width: 1920px) {
    .topbar { /*padding:10.5px 0;*/ font-size: 0.875rem; padding-top: .75rem; padding-bottom: .75rem; }
    .topbar svg { width: 16px; height: 16px; }
}
.topbar__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    line-height: 1.5;
}
.topbar__contact {
    display: flex;
    align-items: center;
    gap: 1rem;
}
.topbar__contact a {
    color: #fff;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    /* Lane 2 #39 â€” color + transform transition (Vercel parity). */
    transition: color 300ms ease, transform 300ms ease;
    font-family: "DM Sans", sans-serif !important;
}
.topbar__contact a:hover { color: var(--twoa-orange); transform: scale(1.05); }
.topbar__license { color: rgba(255,255,255,0.8); font-family: "DM Sans", sans-serif !important; }

.site-header {
    background: var(--color-bg-primary);
    border-bottom: 1px solid var(--color-border);
    position: sticky;
    top: var(--twoa-topbar-h);   /* sit BELOW the sticky topbar, not behind it */
    z-index: 50;
    transition: box-shadow 0.3s ease;
}
/* Lane 2 #26 â€” shadow-m token parity. */
.site-header.is-scrolled { box-shadow: var(--shadow-m); }

/* Lane 2 #33 â€” site logo hover scale + transition. */
.site-brand img {
    transition: transform 0.3s ease;
}
.site-brand:hover img {
    transform: scale(1.05);
}

html.dark .site-header,
body.dark .site-header,
.dark .site-header { background: var(--twoa-dark); }

/* Topbar collapses on very narrow screens (chips wrap and add height) â€”
   force a slightly taller reserve so the header still doesn't tuck behind. */
@media (max-width: 480px) {
    :root { --twoa-topbar-h: 56px; }
}

.site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* height: clamp(60px, 8vh, 80px); */
    min-height: 70px;
    gap: 1rem;
}

.site-brand {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}
.site-brand img {
    height: clamp(40px, 6vh, 56px);
    width: auto;
    object-fit: contain;
}

.site-nav {
    display: none;
    align-items: center;
    /* Lane 2 #30 â€” gap-2 Tailwind parity (was 0.25rem). */
    gap: 0.5rem;
}
@media (min-width: 768px) {
    .site-nav { display: flex; }
}

.nav-item { position: relative; }
.nav-item__toggle,
.nav-item > a {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.5rem 1rem;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-primary);
    background: transparent;
    border: none;
    /* Vercel parity: nav pill uses rounded-lg, which the 2A tailwind config
       overrides to 16px (not the Tailwind default 8px). */
    border-radius: 16px;
    transition: all 0.2s ease;
    text-decoration: none;
}
.nav-item__toggle:hover,
.nav-item > a:hover {
    color: var(--twoa-orange);
    background: var(--twoa-gray);
}
.dark .nav-item__toggle:hover,
.dark .nav-item > a:hover { background: var(--twoa-dark-deep); }

.nav-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    /* Lane 2 #28 â€” min-width 220 â†’ 200 (Vercel parity). */
    min-width: 200px;
    background: var(--color-bg-primary);
    border-radius: 10px;
    /* Lane 2 #27 â€” shadow-l token parity. */
    box-shadow: var(--shadow-l);
    padding: 0.5rem;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    /* Lane 2 #29 â€” transition 0.25s â†’ 0.3s ease (Vercel parity). */
    transition: all 0.3s ease;
    pointer-events: none;
    z-index: 60;
}
.nav-item:hover .nav-dropdown,
.nav-item:focus-within .nav-dropdown,
.nav-item.is-open .nav-dropdown {       /* JS click toggle for touch devices */
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}
html.dark .nav-dropdown,
body.dark .nav-dropdown,
.dark .nav-dropdown { background: var(--twoa-dark-deep); }

.nav-dropdown a {
    display: block;
    padding: 0.625rem 0.875rem;
    border-radius: 6px;
    font-size: 0.875rem;
    color: var(--color-text-primary);
    transition: background 0.15s ease, color 0.15s ease;
}
.nav-dropdown a:hover {
    color: var(--twoa-orange);
    background: var(--twoa-warm);
}
.dark .nav-dropdown a:hover { background: var(--twoa-dark); }

/* Active-page state (Vercel Header parity: aria-current + .is-active highlight). */
.nav-item.is-active > .nav-item__toggle,
.nav-item.is-active > a,
.nav-dropdown a.is-current,
.mobile-menu a.is-current {
    color: var(--twoa-orange);
    background: rgba(235, 93, 29, 0.10);
}

.header-cta {
    display: none;
    margin-left: 0.75rem;
}
@media (min-width: 768px) { .header-cta { display: inline-flex; } }

.mobile-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    background: transparent;
    border: none;
    /* Vercel parity: mobile toggle uses rounded-lg = 16px (tailwind override). */
    border-radius: 16px;
    color: var(--color-text-primary);
    transition: background 0.2s ease;
}
.mobile-toggle:hover { background: var(--twoa-gray); }
/* Lane 2 #25 â€” dark hover bg. */
.dark .mobile-toggle:hover { background: var(--twoa-dark-deep); }
/* Lane 2 #41 â€” SVG bump 22 â†’ 24 (Vercel parity). */
.mobile-toggle svg { width: 24px; height: 24px; }
@media (min-width: 768px) { .mobile-toggle { display: none; } }

.mobile-menu {
    display: none;
    position: fixed;
    /* Full-height panel from the true viewport top (top:0). The chrome (sticky
       topbar z:52 + header z:50) paints OVER the drawer's empty padding-top
       region; an opaque scroll-padding-top pushes the first item (EXTERIOR /
       Roofing) below the chrome. Because the topbar uses flex-wrap and a
       *min-height* (not a fixed height), its rendered height grows when the
       contact chips wrap at 360â€“600px â€” so a fixed `top` calc using
       --twoa-topbar-h underestimates the chrome and tucked the top group behind
       it. A generous full-height spacer clears the worst-case wrapped chrome and
       the list scrolls from the true top (scrollTop:0 shows EXTERIOR/Roofing).
       Math: topbar (â‰¤480 min 56px, wrapped ~80â€“96px) + header clamp(60-80px)
       + 24px breathing room â†’ clamp(150px, 26vh, 200px) safe spacer. */
    top: 0;
    right: 0;
    bottom: 0;
    width: 18rem;
    max-width: 88vw;
    background: var(--color-bg-primary);
    border-left: 2px solid var(--twoa-orange);
    padding: 70px 1.5rem 1.5rem;
    /* BELOW the sticky topbar (z:52) + header (z:50) so the chrome paints over
       the drawer's padding-top region (visually capping it) and the header's
       X-toggle stays clickable to close the menu. */
    z-index: 999;
    overflow-y: auto;
    /* iOS momentum scrolling â€” without this an overflowing drawer can feel
       "stuck" / non-scrollable on older iOS Safari when the body is scroll-locked. */
    -webkit-overflow-scrolling: touch;
    /* Lane 2 #34 â€” overscroll containment + touch-action. */
    overscroll-behavior: contain;
    touch-action: pan-y;
    /* Lane 2 #35 â€” drawer shadow normalize. */
    box-shadow: -16px 0 48px rgba(0,0,0,0.18);
    padding-bottom: 50px;
}
/* Lane 2 #23 â€” dark drawer background var(--twoa-dark). */
.dark .mobile-menu { background: var(--twoa-dark); }
.mobile-menu.is-open { display: block; }
.mobile-menu h3 {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    /* Lane 2 #36 â€” letter-spacing 0.1em â†’ 0.05em (tracking-wider). */
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
    color: var(--color-text-primary);
}
.mobile-menu a {
    display: block;
    padding: 0.5rem 0;
    color: var(--color-text-primary);
}
.mobile-menu a:hover { color: var(--twoa-orange); }
.mobile-menu__group { margin-bottom: 1.5rem; }
.mobile-menu .btn { display: flex; width: 100%; margin-top: 1rem; justify-content: center; text-align: center; }

.mobile-backdrop {
    display: none;
    position: fixed;
    /* Full-viewport dimmer (top:0) sitting BELOW the sticky chrome (z:50/52) so
       the topbar+header stay visible/clickable on top; the drawer (z:49) sits
       above the backdrop (z:48). */
    inset: 0;
    background: #0006;
    z-index: 99;
}
/* Lane 2 #24 â€” dark backdrop 0.4 â†’ 0.6 (Vercel parity). */
.dark .mobile-backdrop { background: rgba(0,0,0,0.6); }
.mobile-backdrop.is-open { display: block; }



.twoa-container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding-left: var(--container-padding);
  padding-right: var(--container-padding);
}
@media (min-width: 1920px) {
  .twoa-container {
    max-width: 1700px;
  }
}
@media (max-width: 991px) {
    .nav-item__toggle, .nav-item > a{
        font-size: 12px;
        padding: 7px;
    }
}
@media (max-width: 767px) {
.topbar__inner{
    gap: 0.1rem;
}

}


.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: 0.01em;
  transition: all 0.3s ease;
  border-radius: 9999px;
  font-size: clamp(0.8125rem, 0.875vw + 0.125rem, 1.25rem);
  padding: clamp(0.75rem, 1.25vh, 1.5rem) clamp(1.5rem, 2.5vw, 3.5rem);
  border: none;
  text-decoration: none;
  cursor: pointer;
}
.btn-primary {
  background-color: var(--twoa-orange-dark);
  color: #fff;
  box-shadow: 0 4px 16px rgba(235, 93, 29, 0.25);
}
.headerBtn_3{
    background-color: var(--twoa-orange-dark);
    color: #fff;
    box-shadow: 0 4px 16px rgba(235, 93, 29, 0.25);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-family: var(--font-display);
    font-weight: 600;
    letter-spacing: 0.01em;
    transition: all 0.3s ease;
    border-radius: 9999px;
    font-size: clamp(.8125rem,.875vw + .125rem,1.25rem);
    padding: 14px 27px;
    border: none;
    text-decoration: none;
    cursor: pointer;
}
.headerBtn_3:hover{
    color: #fff;
    filter: brightness(1.1);
    box-shadow: 0 8px 24px rgba(235, 93, 29, 0.35);
}


/* Mobile Menu CSS */
.mobile-toggle.open svg.mobile-toggle__icon.mobile-toggle__icon--menu{
    display: none;
}
.mobile-toggle.open svg.mobile-toggle__icon.mobile-toggle__icon--close{
    display: block;
}
.mobile-menu.is-open{
    display: block !important;
}
.mb_menuBtn{
    display: flex;
    width: 100%;
    margin-top: 1rem;
    justify-content: center;
    text-align: center;
    background-color: #c94a10;
    color: #fff;
    box-shadow: 0 4px 16px rgba(235, 93, 29, 0.25);
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-display);
    font-weight: 600;
    letter-spacing: 0.01em;
    transition: all 0.3s ease;
    border-radius: 9999px;
    font-size: clamp(0.8125rem, 0.875vw + 0.125rem, 1.25rem);
    border: none;
    text-decoration: none;
    cursor: pointer;
}










/* =========================================================
   FOOTER
   ========================================================= */
.site-footer {
    background: var(--twoa-dark-deep);
    color: rgba(255,255,255,0.6);
    padding: 4rem 0 0;
}
.footer-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
    margin-bottom: 2.5rem;
}
@media (min-width: 768px)  { .footer-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .footer-grid { grid-template-columns: repeat(4, 1fr); } }

.footer-brand a {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    color: #fff;
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 800;
    margin-bottom: 1rem;
}
.footer-brand a .twoa { color: var(--twoa-orange); }
.footer-brand p {
    font-size: 1rem;
    line-height: 1.55;
    max-width: 280px;
    margin: 0 0 1.5rem;
    color: rgba(255,255,255,0.6);
    font-family: "DM Sans", sans-serif !important;
}
.footer-logo-circle {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 14px;
    background: linear-gradient(135deg, #fff, var(--twoa-gray));
    padding: 0.25rem;
    box-shadow: 0 0 30px #c94a10;
    overflow: hidden;
    transition: all .5s;
}
.footer-logo-circle img { width: 100%; height: 100%; object-fit: cover; border-radius: 10px;  }

.footer-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.footer-socials a {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: rgba(255,255,255,0.10);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,0.8);
    transition: all 0.25s ease;
    margin: 0;
}
.footer-socials a:hover {
    background: var(--twoa-orange);
    color: #fff;
    transform: scale(1.1);
}

.footer-col h3 {
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
}
.footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.footer-col a {
    font-size: 0.875rem;
    color: rgba(255,255,255,0.6);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: "DM Sans", sans-serif !important;
    font-weight: 400;
}
.footer-col a:hover { color: var(--twoa-orange); }
.footer-col li.contact-line { display: flex; align-items: center; gap: 0.5rem; }
.footer-col svg { color: var(--twoa-orange); }

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.1);
    padding: 2rem 0;
    font-size: .75rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    text-align: center;
}
.footer-military {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}
.footer-military img { width: 56px; height: auto; display: block; }
.footer-military span {
    color: #ffffffb3;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: .05em;
    text-transform: uppercase;
    text-align: left;
}
.footer-copy { white-space: nowrap; }
@media (max-width: 640px) {
    .footer-bottom { flex-direction: column; justify-content: center; }
    .footer-copy { white-space: normal; }
}



.footer-brand a:hover .footer-logo-circle {
  transform: scale(1.1);
  box-shadow: 0 0 0 1px var(--twoa-orange, #eb5d1d), 0 6px 24px rgba(235,93,29,0.4);
}
.footer-brand a span{
    color: #fff;
}
.footer-brand a:hover .footer-logo-circle::before {
  opacity: 0.8;
}

.footer-grid_2{
    width: 100%;
    padding: 0 0 30px 0;
}
.footer-grid_2 h4{
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
    text-align: center;
}
.footer-grid_2 .p_by h4{
    margin: 0 0 5px;
}




/* =========================================================
   BOTTOM CONTACT
   ========================================================= */
.bottom-contact {
    padding: 4rem 0;
    background: var(--color-bg-primary);
    text-align: center;
    border-top: 1px solid var(--color-border);
    /* Lane 2 #137 â€” bg + border transition. */
    transition: background-color 0.3s ease, border-color 0.3s ease;
}
.bottom-contact h2 {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: .625rem;
}
.bottom-contact__phone {
    font-family: var(--font-display);
    font-size: 1.875rem;
    font-weight: 800;
    color: var(--twoa-orange);
    display: inline-block;
    margin-bottom: .625rem;
    /* Lane 2 #138 â€” transform transition for scale. */
    transition: transform 0.3s ease;
    line-height: 1.5;
}
.bottom-contact__phone:hover {
    text-decoration: underline;
    /* transform: scale(1.05); */
    color: var(--twoa-orange);
}
.bottom-contact__email {
    color: var(--color-text-mid);
    display: block;
    /* Lane 2 #139 â€” color transition + orange hover. */
    transition: color 0.3s ease;
}
.bottom-contact__email:hover { color: var(--twoa-orange); }
.bottom-contact__hours {
    color: var(--color-text-light);
    font-size: 0.875rem;
    margin-top: 0.5rem;
}







.military-friendly-badge{
    display: none;
}
.closeBtn{
    color: #000;
    padding: .5rem;
}

@media (min-width: 768px) {
    .mobile-menu{
        display: none !important;
    }
    .mobile-backdrop{
        display: none !important;
    }
}



@media (max-width: 767px) {
    .topbar{
        padding: .3rem 0;
        position: relative;
    }
    .topbar__contact{
        flex-direction: column;
        align-items: start;
        gap: 0;
        line-height: 1.7;
    }
    .topbar__inner{
        flex-direction: column;
        align-items: start;
        
    }
    .topbar__license{
        line-height: 1.3;
    }
    .military-friendly-badge{
        display: inline;
        position: absolute;
        right: 16px;
        top: 12px;
        height: 44px;
        width: auto;
        opacity: .9;
    }   
}