/* header strat */

/* headaer start */
/* .scroll-up .site-logo {
    max-width: 150px;} */
.hader-main .nav-links>ul {
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    padding: 0px;
    margin: 0px;
    gap: clamp(20px, 3vw, 40px);
    list-style: none;
}
html{overflow-x: hidden;
    overflow-y: scroll;}
.hader-main .nav-link {
    position: relative;
    padding: 0px;
}

.mobactive {
    display: none;
}

.hader-main .nav-link .dropdown-link a {
    padding: 12px 25px;
    line-height: 1;
    color: var(--black);
    text-decoration: none;
}

.header-items {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0px;
}

/* .scroll-up .header-items {
    padding:12px 0px;
} */
.head-cont a.workbtn {
    display: flex;
    gap: 15px;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    padding: 14px 20px;
    line-height: 1;
    border-radius: 30px;
    transition: var(--transition);
    background-color: var(--green);
    color: var(--black);
    border: 1px solid var(--green);
}

.head-cont a.workbtn:hover {
    border-color: var(--green);
    background-color: transparent;
    color: var(--green);
}

.scroll-up .head-cont a.workbtn:hover {
    border-color: var(--green);
}

.scroll-up.newpage .head-cont a.workbtn:hover {
    border-color: var(--white);
}

.header-items .nav-link>a {
    padding: 18px 0px 18px 0px;
    color: var(--white);
    font-size: 16px;
    position: relative;
    transition: var(--transition);
    border-bottom: 2px solid transparent;
    text-decoration: none;
    line-height: 1;
    font-weight: 500;
    display: flex;
    gap: 4px;
}

.header-items .nav-link>a.active {
    font-weight: 900;
}

.scroll-up .header-items .nav-link>a.active {
    border-bottom: 3px solid var(--green);
}

.logo-container img.darklogo,
.scroll-up .logo-container img.lightlogo {
    display: none;
}

.scroll-up .logo-container img.darklogo {
    display: block;
}




.header-items .nav-link>a:hover,
.header-items .nav-link>a:active {
    color: var(--green);
}

/* .scroll-up .header-items .nav-link>a {
    color: var(--green);
} */
/* .scroll-up.mg-menu .header-items .nav-link>a {
    color: var(--white);
} */
/* .scroll-up .header-items .nav-link>a{
    padding: 29px 0px 23px 0px;
} */
.header-items .nav-link>a {
    transition: all ease 0.5s;
}

.header-items .nav-link>a:hover {
    color: var(--green);
    /* font-weight: 900; */
}

.scroll-up .header-items .nav-link>a:hover {
    color: var(--green);
    border-bottom: 1px solid transparent;
}

.header-items .nav-link>a:hover::before {
    background: var(--green);
}

.scroll-up .header-items .nav-link>a:hover::before {
    background: var(--green);
}

/* .header-items .nav-link>a.active,.hader-main .nav-link:has(.active).nav-link > a{
    color: var(--green);
} */

.header-items .nav-link>a>i {
    margin-left: 7px;
    font-size: 12px;
}

img.downarwmen {
    width: 18px;
    filter: invert(1);
}

.header-items .dropdown {
    position: absolute;
    transition: all 0.4s;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0.1) 1px -2px 13px;
    border-radius: 12px;
    opacity: 0;
    padding: 25px 0px;
    transition: all ease 0.3s;
    min-width: 200px !important;
    left: -36px;
    display: none;
    top: 43px;
}

.header-items .dropdown ul {
    position: relative;
    list-style: none;
    padding: 0px;
}

.header-items .dropdown-link>a {
    display: flex;
    background-color: var(--clr-light);
    color: var(--clr-dropdown);
    color: var(--white);
    font-size: 16px;
    align-items: center;
    justify-content: start;
    transition: .3s;
    align-items: center;
}

.header-items .nav-link:hover>.dropdown,
.dropdown-link:hover>.dropdown {
    transform: translate(0, 0);
    opacity: 1;
    pointer-events: auto;
    display: block;
}

.header-items .dropdown-link:hover>a,
.header-items .dropdown-link a.active {
    color: var(--light-blue);
    background-color: #34816229;
}

.header-items .dropdown.second {
    top: 0;
    left: 95%;
    padding-left: 0px;
    cursor: pointer;
    transform: translateX(10px);
}

.header-items .arrow {
    position: absolute;
    width: 11px;
    height: 11px;
    top: -31px;
    left: 70px;
    background-color: var(--white);
    transform: rotate(45deg);
    cursor: pointer;
    transition: .3s;
    z-index: -2;
}

.header-items .nav-link>a:before {
    content: "";
    height: 2px;
    position: absolute;
    width: 100%;
    background: transparent;
    top: 47px;
    transition: all ease 0.3s;
}

/* .header-items .nav-link>a:has(i):before {
    width: calc(100% - 16px);
} */
.header-items .nav-link>a:has(i):before {
    width: 100%;
}

.scroll-up .header-items .nav-link>a:before {
    height: 2px;
    top: 50px;
}

.header-items .nav-link:has(.activemenu).nav-link>a:before {
    background: var(--green);
}

.scroll-up .header-items .nav-link:has(.activemenu).nav-link>a:before {
    background: var(--green);
}

.dropdown-link:first-child:hover~.arrow {
    background-color: var(--white);
}

.dropdown.second .arrow {
    top: -8px;
    left: -5.5px;
    background: var(--white);
    display: none;
}

.dropdown-link i {
    font-size: 12px;
    padding-right: 10px;
    color: var(--green);
}

.hamburger-menu-container,
.menu-backbtn {
    display: none;
}

.menu-subhed {
    margin: 0px;
    padding: 12px 20px;
    line-height: 1;
    color: var(--black);
    /* text-decoration: none; */
    font-size: 16px;
    font-weight: 700;
}

.header-sec li.dropdown-link {
    position: relative;
    white-space: nowrap;
    /* display: flex; */
}


@keyframes animation {
    from {
        opacity: 0;
        transform: translateY(15px);
    }

    to {
        opacity: 1;
        transform: translateY(0px);
    }
}






.site-logo {
    width: 100%;
    max-width: 100px;
    /* transition: var(--transition); */
    padding: 0px;
    display: flex;
}

.scroll-up .navbar-btn span {
    background: var(--green);
}

.mg-menu img.lightlogo {
    display: block !important;
}

.mg-menu img.darklogo {
    display: none !important;
}

.footer-main-box .site-logo {
    display: block;
}

.scroll-up header.hader-main {
    /* position: fixed;
    top: 0px; */
    /* background: var(--white); */
}

.hader-main.active .site-logo {
    max-width: 120px;
}

.header-nav-sec {
    gap: 40px;
    width: fit-content !important;
}

.header-nav-sec a.nav-link {
    padding: 24px 0px !important;
    color: var(--white);
    font-size: 14px;
    position: relative;
    transition: var(--transition);
    border-bottom: 2px solid transparent;
}

.hader-main .navbar {
    padding: 0px;
}

.header-nav-sec a.nav-link:hover {
    color: var(--green);
}

.activenav .header-nav-sec a.nav-link:hover {
    border-color: var(--green);
    /* color: var(--white); */
}

.hader-main .navbar-toggler {
    border: 1px solid #fff;
    padding: 12px 12px;
    background: transparent;
}

.hader-main .navbar-toggler:focus {
    box-shadow: none;
}

.navbar-btn {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.navbar-btn span {
    height: 2px;
    width: 27px;
    background: var(--white);
    display: block;
    transition: var(--transition);
}

/* .navbar-btn.close span{
    background: var(--white);
   } */

.navbar-btn.close span.h-btn {
    opacity: 0;
}

.navbar-btn.close span.ham1 {
    transform: rotate(-45deg) translate(-9px, 10px);
}

.navbar-btn.close span.ham2 {
    transform: rotate(45deg) translate(-4px, -7px);
}

.hader-main ul.dropdown-menu {
    transition: all 0.4s;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 10px;
    border-radius: 15px 15px;
    padding: 10px 0;
    transition: all ease 0.3s;
    top: 10px;
    position: relative;
}

.header-nav-sec .contactbtn .lern-btn {
    padding: 11px 35px !important;
    border: 1px solid var(--green);
    border-radius: 20px;
    background: var(--green);
    text-decoration: none;
    line-height: 1;
    display: block;
}

.header-nav-sec .contactbtn .lern-btn:hover {
    background: transparent;
    color: #fff;
}

.header-nav-sec .contactbtn .lern-btn:before {
    display: none;
}

.header-nav-sec .dropdown-menu .dropdown-item {
    padding: 8px 16px;
    font-size: 14px;
}

.navmenu-sec {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-nav-sec {
    gap: 40px;
    width: fit-content !important;
}


header.hader-main {
top: 0;
    position: absolute;
    /* position: sticky; */
    z-index: 999;
    width: 100%;
    padding: 0px 0px;
    transition: var(--transition);
    will-change: transform;
    backface-visibility: hidden;
    transform: translateY(0);
}




 header.hader-main {

    box-shadow: rgb(0 0 0 / 8%) 0 8px 8px;
    background-color: var(--black);
}

/* .newpage.nav-top .header-items .nav-link>a {
    color: var(--white);} */

/* .nav-top header.hader-main {
    background-color: var(--white);
} */

.newpage .head-cont a.workbtn {
    display: none;
}

.newpage.nav-top header.hader-main {
    background-color: var(--black);
}

.nav-top .header-items .nav-link>a {
    color: var(--black);
}

.newpage.nav-top .header-items .nav-link>a {
    color: var(--white);
}

.head-cont {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.head-cont.head-contmob {
    display: none;
}

.header-items .nav-link>a i {
    display: none;
}

section.subheader {
    background: #2D2D2D;
    position: fixed;
    z-index: 999 !important;
    width: 100%;
    transition: all ease 0.3s;
    top: 74px !important;
    transform: translate(-50%, 0px);
    left: 50%;
        box-shadow: 0 25px 45px rgba(0, 0, 0, 0.1);
    border: 1px solid transparent;
}

/* .scroll-up section.subheader {
    top: -1px;
    transition: var(--transition);
} */

section.subheader.fixed {
    background: none;
}

section.subheader.fixed {
    position: fixed;
    margin: 0 auto;
    top: 10px !important;
}

.scroll-up .subheader{
   
    background: rgba(0, 00, 0, 0.4);
    backdrop-filter: blur(15px);
    border-radius: 32px;
    top: 10px !important;
    max-width: 1300px;  
    border-color:rgba(255, 255, 255, 0.3);
    width: 99%;
}

.subheader .cust-contaner {
    padding: 0px 15px;
}
  
body.scroll-up:has(.subheader) .hader-main {
       transform: translateY(-100%);
}


/* .subheader{
    display: none;
} */

.subheadbox {
    display: flex;
    justify-content: space-between;
    padding: 6px 40px;
    gap: 30px;
    align-items: center;
}
body.scroll-up:has(.subheader) .subheadbox {
         padding: 6px 0px;
}

.subheadhading h2 {
    color: var(--white);
    font-size: clamp(14px, 1vw, 16px);
    line-height: 1.3;
        text-transform: uppercase;
}

.headrate {
    display: flex;
    gap: 10px;
    align-items: center;
}

.headratedis p {
    color: var(--white);
    font-size: clamp(12px, 1vw, 16px);
}

.headratemain p {
    color: #E70F0F;
    font-size: clamp(10px, 1vw, 13px);
    text-decoration: line-through;

}

.headcart a {
    display: flex;
    gap: 10px;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    padding: 12px 20px;
    line-height: 1;
    border-radius: 30px;
    transition: var(--transition);
    background-color: var(--green);
    color: var(--black);
    border: 1px solid var(--green);
    width: fit-content;
    min-width: max-content;
}

.headcart a img {
    width: 18px;
}

.subhleft {
    display: flex;
    align-items: center;
    gap: 30px;
}

@media (max-width:1200px) {

    .header-items .nav-link>a {
        font-size: 15px;
    }

    .head-cont {
        gap: 14px;
    }

    .hader-main .nav-links>ul {
        gap: 20px;
    }
.subheadbox {
    display: flex;
    justify-content: space-between;
    padding: 6px 0px;

}
}





@media (max-width:1024px) {
    .site-logo {

        max-width: 100px;
    }

    .header-items .nav-link>a {
        font-size: 14px;
    }

    .hader-main .nav-links>ul {
        gap: 16px;
    }


}

@media (max-width: 991px) {
    .hader-main .navbar-toggler {
        border:none;
        padding: 10px 10px;
    }
body:has(.subheader) .mobilemenu {
        top: 115px;}

    .newpage.nav-top .header-items .nav-link>a {
        color: var(--black);
    }

    a.mobpcall {
        min-width: 46px;
        margin-right: 14px;
    }
.mg-menu section.subheader {
    background:var(--white);
            border-top: 1px solid #bdbdbd;
}
.mg-menu .subheadhading h2{
color: var(--black);
}
.singlepage .head-cont.head-contmob {
    display: none;
}

    section.subheader {
        top: 63px !important;
    }

    .header-items .nav-link>a:has(i):before {
        width: 100%;
    }

    .menu-subhed {
        color: var(--white);
        padding-top: 20px;
    }



    .dropdown-link i {
        display: none;
    }

    .header-sec li.dropdown-link {
        position: unset;
    }

    .hamburger-menu-container {
        display: flex;
        height: fit-content;
    }

    .nav-links {
        display: none;
    }

    .head-cont {
        margin-right: 20px;
        display: none;
    }

    .head-cont.herobtn {
        display: block;
    }

    .head-cont.homeherobtn {
        display: block;
        margin: 0px auto;
        margin-top: 16px !important;
    }

    .head-cont a.workbtn {
        font-size: 16px;

        padding: 10px 20px;
    }

    .header-sec {
        display: flex;
        align-items: center;
    }

    .header-items {
        padding: 14px 0px;
    }

    .site-logo {
        width: 100%;
        max-width: 80px;
    }

    .head-cont a.workbtn {
        gap: 10px;
        font-size: 14px;
    }

    .menu-backbtn {
        display: block;
        padding: 10px 20px;
        line-height: 1;
        color: var(--white);
        text-decoration: none;
    }

    .hader-main .nav-link .dropdown-link a {
        line-height: 1;
        color: var(--black);
        text-decoration: none;
        padding: 20px 40px !important;
        border-bottom: 1px solid #cccccc30;
        font-weight: 500;
    }

    .header-items .dropdown-link:hover>a {
        /* color: var(--white); */
        background-color: transparent;
    }

    .header-items .dropdown-link a.active {
        color: var(--white);
        background-color: transparent;
        border-color: var(--white) !important;
    }

    .hader-main .nav-link:has(.active).nav-link>a {
        color: var(--white);
        background-color: transparent;
        /* border-color: var(--white) !important; */
    }

    .hader-main .dropdown-link:has(.active).dropdown-link>a {
        color: var(--white);
        background-color: transparent;
        border-color: var(--green) !important;
    }

    .nav-links {
        flex: initial;
        width: 100%;
    }

    .nav-links>ul {
        flex-direction: column;
    }

    .header-items .arrow {
        display: none;
    }

    .hader-main ul.dropdown-menu.doropdownlevalone {
        position: absolute;
        top: 70px;
        transition: all 0.4s;
        background: #fff;
        box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 10px;
        border-radius: 8px;
        opacity: 0;
        padding: 20px 0px;
        transition: all ease 0.3s;
        min-width: 200px !important;
    }

    .hader-main.activenav ul.dropdown-menu.doropdownlevalone {
        top: 85px;
    }

    .hader-main li.nav-item.dropdown:hover ul.dropdown-menu.doropdownlevalone {
        opacity: 1;
        transition: all ease 0.3s;
        border: none;
        overflow: auto;
        display: block;
    }

    .hader-main li.nav-item.dropdown,
    ul.dropdown-menu.doropdownlevalone {
        transition: all ease 0.5s
    }

    .header-items .dropdown ul {
        height: 100vh;
        overflow-y: auto;
        overflow-x: hidden;
    }

    .dropdown.second {
        padding: 0;
    }

    .header-nav-sec {
        gap: 0px;
        padding: 40px 0px;
    }

    .header-nav-sec a.nav-link {
        padding: 10px 20px !important;
    }

    .header-nav-sec li.nav-item {
        border-bottom: 1px solid #cccccc45;
    }

    .header-nav-sec a.nav-link:before {
        display: none;
    }

    .mobilemenu {
        background: var(--green);
    }

    header.hader-main .navbar {
        position: relative;
    }

    .mobilemenu {
        background: var(--white);
        transform: translate3d(200%, 0px, 0px);
        position: fixed;
        display: block !important;
        top: 63px;
        width: 100%;
        right: 0px;
        transition: all ease 0.6s;
        max-width: 500px;
        height: 100vh;
        padding: 0px 0px;
        border-top: 1px solid #a3a3a32e;
    }

    body.mg-menu {
        overflow: hidden;
    }

    .mg-menu header.hader-main {
        background-color: var(--white) !important;
    }

    .mg-menu .navbar-btn span {
        background: var(--green);
    }




    .hader-main .nav-links>ul {
        align-items: start;
    }

    .hader-main .nav-links>ul,
    .hader-main .nav-link {
        width: 100%;
    }

    .mobilemenu.active {
        transform: translate3d(0%, 0px, 0px);
    }

    /* .scroll-up .mobilemenu{
        top: 46px;
    } */
    .header-items .nav-link>a {
        padding: 18px 24px !important;
        color: var(--black);
        position: relative;
        transition: var(--transition);
        text-decoration: none;
        display: flex;
        width: 100%;
        justify-content: space-between;
        border-bottom: 1px solid #cccccc63;
        font-weight: 500;
    }

    img.leftarrowmenu {
        width: 16px;
        filter: invert(1);
    }

    .header-items .nav-link>a.active {
        color: var(--white);
        border-color: var(--white);
    }

    .header-items .nav-link:hover>a {
        color: var(--white);
    }

    .hader-main .nav-links>ul {
        gap: 0px;
        list-style: none;
    }

    .header-items .dropdown {
        position: absolute;
        top: 0px;
        left: 0px;
        border-radius: 0px;
        background: var(--white);
        z-index: 1;
        padding: 0px 0px;
        transform: translate(200%, 10px) !important;
        width: 100%;
    }

    .hader-main .nav-link {
        position: unset;
        padding: 0px;
    }

    .header-items .dropdown.active {
        transform: translate(0px, 0px) !important;
    }

    .menu-backbtn,
    .menu-backbtntwo {
        display: flex;
        gap: 10px;
        font-size: 16px;
        line-height: 1;
        color: var(--white);
        text-decoration: none;
        padding: 20px 15px !important;
        border-bottom: 1px solid #cccccc30;
        font-weight: 600;
        position: sticky;
        top: 0px;
        z-index: 1;
        background: var(--green);
        align-items: center;
    }

    .header-items .dropdown.second.active {
        top: 0;
        left: 0;
        padding-left: 0px;
        cursor: pointer;
        transform: translateX(10px);
    }

    .dropdown-link i {
        transform: rotate(0deg);
    }

    .head-cont.mobactive {
        display: flex;
        width: fit-content;
        margin: 30px auto;
    }

    .header-items .nav-link>a>i {
        margin-left: 7px;
        transform: rotate(-180deg);
    }

    .fa-angle-down {

        --fa: "\f060";
    }

    .header-items .nav-link>a:hover {
        color: var(--black);
    }

    .dropdown-link i {
        transform: rotate(-90deg);
    }

    .dropdown.second.active .fa-arrow-left {
        transform: rotate(0deg);
    }

    .header-items .dropdown {
        box-shadow: none;
    }

    /* .newpage .head-cont a.workbtn {
    display: block;
} */

    /* .scroll-up .header-items .nav-link > a:hover {
        color: var(--white);
        border-bottom: 1px solid #cccccc30;
      } */
    .scroll-up .header-items .nav-link:has(.activemenu).nav-link>a {
        border-bottom: 1px solid var(--green);
    }

    .header-items .nav-link:has(.activemenu).nav-link>a {
        font-weight: 900;
        border-bottom: 1px solid var(--green);
        color: var(--green);
    }

    .header-items .nav-link .dropdown a.activemenu {
        border-bottom: 1px solid var(--green) !important;
        font-weight: 900;
        color: var(--green);
    }

    img.downarwmen {
        width: 20px;
        filter: unset;
        transform: translate3d(0px, 0px, 26px) rotate(-90deg);
    }

    .header-items .nav-link:has(.activemenu).nav-link>a:before,
    .header-items .nav-link>a:hover::before {
        background: transparent !important;
    }

    .head-cont.head-contmob {
        display: block;
        margin: 0px auto;
        margin-top: 30px;
        width: fit-content;
    }

    .head-cont a.workbtn {
        font-size: 15px;
        padding: 12px 22px;
    }

    .herotext {
        gap: 30px;
    }


    .navbar-btn span.ham2 {
        width: 18px;
        margin: 0 0 0 auto;
    }

  .navbar-btn.close span.ham2{   width: 28px;}

    .navbar-btn span {
        height: 2px;
        width: 28px;
        border-radius: 20px;
    }
    .newpage .hader-main .navbar-toggler {
        border: none;}
         .newpage .navbar-btn span {
        background: var(--green);
    }
    header.hader-main {
    position: sticky;

}
    .navbar-btn {
    gap: 9px;
}
}
 



@media(max-width:767px) {
    .mobilemenu {
        max-width: 900px;}
    .site-logo {
        max-width: 80px;
    }

       .hader-main .navbar-toggler {
        border:none;
        padding: 11px 8px;
        display: flex;
        justify-content: center;
        align-items: center;
        height: fit-content;
    }

    .newpage .hader-main .navbar-toggler {
        border: none;
        padding: 10px 10px;
        padding-right: 0px;
    }

    .newpage .navbar-btn span {
        background: var(--green);
    }


    section.subheader {
        top: 63px !important;
    }

    .mobilemenu {
        top: 63px;
    }
section.subheader {

    box-shadow:none;}
    .subhleft {
        display: flex;
        align-items: center;
        gap: 30px;
        flex-wrap: wrap;
        justify-content: end;
        row-gap: 10px;
    }

    a.mobpcall {
        min-width: 44px;
        margin-right: 14px;
    }
}




@media screen and (min-width:992px) and (max-width:1300px) {

    /* header.hader-main{
    background-color: red;
} */
    .site-logo {
        max-width: 80px;
    }

    .head-cont a.workbtn {
        font-size: 14px;
        padding: 14px 16px;
    }

    .header-items .nav-link>a {
        font-size: 14px;
    }

    .head-cont {
        gap: 10px;
    }

    .header-items .nav-link>a {
        padding: 0px 0px 0px 0px;
    }

    .header-items .nav-link>a:before {
        top: 30px;
    }

    /* .head-cont img {
    width: 80%;
} */
    .scroll-up .header-items .nav-link>a:before {
        top: 30px;
    }

    .newpage .hader-main .nav-links>ul {
        gap: 30px;
    }

    .subheadhading h2 {
        color: var(--white);
        font-size: 14px;
    }


    section.subheader {
        top: 66px !important;
    }

    .sonbox {
        gap: 150px;
    }

    .realcam img {
        width: 100%;
        max-width: 80%;
    }

}