#topnav .logo {
    float:right;
    color:#3c4858 !important
   }
   #topnav .logo .l-dark {
    display:none
   }
   #topnav .logo .l-light {
    display:inline-block
   }
   #topnav .logo:focus {
    outline:none
   }
   #topnav .has-submenu.active a {
    color:#fff
   }
   #topnav .has-submenu.active .submenu li.active>a {
    color:rgba(174, 142, 119, 1) !important ;
    
   }
   #topnav .has-submenu.active.active .menu-arrow {
    border-color:rgba(174, 142, 119, 1)
   }
   #topnav .has-submenu {
    position:relative
   }
   #topnav .has-submenu .submenu .submenu-arrow {
    border:solid #3c4858;
    border-radius:0.5px;
    border-width:0 0 2px 2px;
    display:inline-block;
    padding:3px;
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg);
    position:absolute;
    left:20px;
    top:14px
   }
   #topnav .has-submenu .submenu .has-submenu:hover .submenu-arrow {
    border-color:rgba(174, 142, 119, 1)
   }
   #topnav .navbar-toggle {
    border:0;
    position:relative;
    width:60px;
    padding:0;
    margin:0;
    cursor:pointer
   }
   #topnav .navbar-toggle .lines {
    width:25px;
    display:block;
    position:relative;
    margin:28px 20px;
    height:18px
   }
   #topnav .navbar-toggle span {
    height:2px;
    width:100%;
    background-color:#3c4858;
    display:block;
    margin-bottom:5px;
    -webkit-transition:-webkit-transform .5s ease;
    transition:-webkit-transform .5s ease;
    transition:transform .5s ease;
    transition:transform .5s ease, -webkit-transform .5s ease
   }
   #topnav .navbar-toggle span:last-child {
    margin-bottom:0
   }
   #topnav .buy-button {
    float:left;
    line-height:68px
   }
   #topnav .buy-button>li {
    line-height:initial
   }
   #topnav .buy-button .login-btn-primary {
    display:none
   }
   #topnav .buy-button .login-btn-light {
    display:inline-block
   }
   #topnav .buy-button .dropdown .dropdown-toggle:after,
   #topnav .buy-menu-btn .dropdown .dropdown-toggle:after {
    display:none
   }
   #topnav .navbar-toggle.open span {
    position:absolute
   }
   #topnav .navbar-toggle.open span:first-child {
    top:6px;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg)
   }
   #topnav .navbar-toggle.open span:nth-child(2) {
    visibility:hidden
   }
   #topnav .navbar-toggle.open span:last-child {
    width:100%;
    top:6px;
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg)
   }
   #topnav .navbar-toggle.open span:hover {
    background-color:rgba(174, 142, 119, 1)
   }
   #topnav .navbar-toggle:hover,
   #topnav .navbar-toggle:focus,
   #topnav .navbar-toggle .navigation-menu>li>a:hover,
   #topnav .navbar-toggle:focus {
    background-color:transparent
   }
   #topnav .navigation-menu {
    list-style:none;
    margin:0;
    padding:0
   }
   #topnav .navigation-menu>li {
    float:right;
    display:block;
    position:relative;
    margin:0 10px
   }
   #topnav .navigation-menu>li:hover>a,
   #topnav .navigation-menu>li.active>a {
    color:rgba(174, 142, 119, 1) !important;
    background-color: #F6DED1 !important;
    border-radius: 10px !important;
    /*padding: 10px !important;*/
    min-height: 50px !important;
    margin-top: 15px !important;
   }
   /*#topnav .navigation-menu>li>a {*/
   /* display:block;*/
   /* color:#3c4858;*/
   /* font-size:13px;*/
   /* background-color:transparent !important;*/
   /* font-weight:700;*/
   /* letter-spacing:0px;*/
   /* line-height:24px;*/
   /* text-transform:uppercase;*/
   /* -webkit-transition:all 0.5s;*/
   /* transition:all 0.5s;*/
   /* padding-right:15px;*/
   /* padding-left:15px*/
   /*}*/
   /*#topnav .navigation-menu>li>a:hover,*/
   /*#topnav .navigation-menu>li>a:active {*/
   /* color:rgba(174, 142, 119, 1)*/
   /*}*/
   #topnav .navigation-menu .has-submenu .menu-arrow {
    border:solid #3c4858;
    border-radius:0.5px;
    border-width:0 0 2px 2px;
    display:inline-block;
    padding:3px;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg);
    position:absolute;
    -webkit-transition:all 0.5s;
    transition:all 0.5s;
    left:-1px;
    top:30px
   }
   #topnav .navigation-menu .has-submenu:hover .menu-arrow {
    -webkit-transform:rotate(-225deg);
    transform:rotate(-225deg)
   }
   #topnav .menu-extras {
    float:left
   }
   #topnav.scroll {
    background-color:#fff;
    border:none;
    -webkit-box-shadow:0 0 3px rgba(60,72,88,0.15);
    box-shadow:0 0 3px rgba(60,72,88,0.15)
   }
   #topnav.scroll .navigation-menu>li>a {
    color:#3c4858
   }
   #topnav.scroll .navigation-menu>li>.menu-arrow {
    border-color:#3c4858
   }
   #topnav.scroll .navigation-menu>li:hover>a,
   #topnav.scroll .navigation-menu>li.active>a {
    color:rgba(174, 142, 119, 1)
   }
   #topnav.scroll .navigation-menu>li:hover>.menu-arrow,
   #topnav.scroll .navigation-menu>li.active>.menu-arrow {
    border-color:rgba(174, 142, 119, 1)
   }
   #topnav.defaultscroll.dark-menubar .logo {
    line-height:70px
   }
   #topnav.defaultscroll.scroll .logo {
    line-height:62px
   }
   #topnav.defaultscroll.scroll.dark-menubar .logo {
    line-height:62px
   }
   #topnav.nav-sticky {
    background:#fff;
    -webkit-box-shadow:0 0 3px rgba(60,72,88,0.15);
    box-shadow:0 0 3px rgba(60,72,88,0.15)
   }
   #topnav.nav-sticky .navigation-menu.nav-light>li>a {
    color:#3c4858
   }
   #topnav.nav-sticky .navigation-menu.nav-light>li.active>a {
    color:rgba(174, 142, 119, 1) !important
   }
   #topnav.nav-sticky .navigation-menu.nav-light>li:hover>.menu-arrow,
   #topnav.nav-sticky .navigation-menu.nav-light>li.active>.menu-arrow {
    border-color:rgba(174, 142, 119, 1) !important
   }
   #topnav.nav-sticky .navigation-menu.nav-light>li:hover>a,
   #topnav.nav-sticky .navigation-menu.nav-light>li.active>a {
    color:rgba(174, 142, 119, 1) !important
   }
   #topnav.nav-sticky .navigation-menu.nav-light .has-submenu .menu-arrow {
    border-color:#3c4858
   }
   #topnav.nav-sticky.tagline-height {
    top:0 !important
   }
   #topnav.nav-sticky .buy-button .login-btn-primary {
    display:inline-block
   }
   #topnav.nav-sticky .buy-button .login-btn-light {
    display:none
   }
   #topnav.nav-sticky .logo .l-dark {
    display:inline-block
   }
   #topnav.nav-sticky .logo .l-light {
    display:none
   }
   .logo {
    font-weight:700;
    font-size:24px;
    padding:0 0 6px;
    letter-spacing:0px;
    line-height:68px
   }
   @media (min-width: 1025px) {
    #topnav .navigation-menu>li .submenu.megamenu {
     width:1116px !important
    }
    #topnav .navigation-menu>li .submenu.megamenu>li {
     min-width:223px !important
    }
   }
   @media screen and (max-width: 1024px) and (min-width: 992px) {
    #topnav .navigation-menu>li .submenu.megamenu {
     width:936PX !important
    }
    #topnav .navigation-menu>li .submenu.megamenu>li {
     min-width:180px
    }
   }
   @media (min-width: 992px) {
    #topnav .navigation-menu {
     display:-webkit-box;
     display:-ms-flexbox;
     display:flex;
     -webkit-box-pack:center;
     -ms-flex-pack:center;
     justify-content:center
    }
    #topnav .navigation-menu>.has-submenu:hover .menu-arrow {
     top:33px !important
    }
    #topnav .navigation-menu>.has-submenu.active .menu-arrow {
     top:30px
    }
    #topnav .navigation-menu>li .submenu {
     position:absolute;
     top:100%;
     right:0;
     z-index:1000;
     padding:15px 0;
     list-style:none;
     min-width:180px;
     visibility:hidden;
     opacity:0;
     margin-top:10px;
     -webkit-transition:all .2s ease;
     transition:all .2s ease;
     border-radius:6px;
     background-color:#fff;
     -webkit-box-shadow:0 0 3px rgba(60,72,88,0.15);
     box-shadow:0 0 3px rgba(60,72,88,0.15)
    }
    #topnav .navigation-menu>li .submenu li {
     position:relative
    }
    #topnav .navigation-menu>li .submenu li a {
     display:block;
     padding:10px 20px;
     clear:both;
     white-space:nowrap;
     font-size:11px;
     text-transform:uppercase;
     letter-spacing:0px;
     font-weight:700;
     color:#3c4858 !important;
     -webkit-transition:all 0.3s;
     transition:all 0.3s
    }
    #topnav .navigation-menu>li .submenu li a:hover {
     color:rgba(174, 142, 119, 1) !important
    }
    #topnav .navigation-menu>li .submenu li ul {
     list-style:none;
     padding-right:0;
     margin:0
    }
    #topnav .navigation-menu>li .submenu.megamenu {
     white-space:nowrap;
     right:50%;
     -webkit-transform:translateX(50%);
     transform:translateX(50%);
     position:fixed;
     top:74px
    }
    #topnav .navigation-menu>li .submenu.megamenu>li {
     overflow:hidden;
     display:inline-block;
     vertical-align:top
    }
    #topnav .navigation-menu>li .submenu.megamenu>li .submenu {
     right:100%;
     top:0;
     margin-right:10px;
     margin-top:-1px
    }
    #topnav .navigation-menu>li .submenu>li .submenu {
     right:101%;
     top:0;
     margin-right:10px;
     margin-top:-1px
    }
    /*#topnav .navigation-menu>li>a {*/
    /* padding-top:25px;*/
    /* padding-bottom:25px;*/
    /* min-height:62px*/
    /*}*/
    #topnav .navigation-menu>li:hover>.menu-arrow {
     border-color:rgba(174, 142, 119, 1)
    }
    #topnav .navigation-menu>li:hover>a,
    #topnav .navigation-menu>li.active>a {
     color:rgba(174, 142, 119, 1) !important
    }
    #topnav .navigation-menu>li.last-elements .submenu {
     right:auto;
     left:0
    }
    #topnav .navigation-menu>li.last-elements .submenu:before {
     right:auto;
     left:10px
    }
    #topnav .navigation-menu>li.last-elements .submenu>li.has-submenu .submenu {
     right:auto;
     left:100%;
     margin-right:0;
     margin-left:10px
    }
    #topnav .navigation-menu.nav-light>li>a {
     color:rgba(255,255,255,0.5)
    }
    #topnav .navigation-menu.nav-light>li.active>a {
     color:#fff !important
    }
    #topnav .navigation-menu.nav-light>li:hover>.menu-arrow {
     border-color:#fff !important
    }
    #topnav .navigation-menu.nav-light>li:hover>a {
     color:#fff !important
    }
    #topnav .navigation-menu.nav-light .has-submenu .menu-arrow {
     border-color:rgba(255,255,255,0.5)
    }
    #topnav .navigation-menu.nav-light .has-submenu.active .menu-arrow {
     border-color:#fff !important
    }
    #topnav .navigation-menu.nav-right {
     -webkit-box-pack:end !important;
     -ms-flex-pack:end !important;
     justify-content:flex-end !important
    }
    #topnav .navigation-menu.nav-left {
     -webkit-box-pack:start !important;
     -ms-flex-pack:start !important;
     justify-content:flex-start !important
    }
    #topnav .navigation-menu.nav-left>li.last-elements .submenu {
     right:0 !important;
     left:auto !important
    }
    #topnav .navigation-menu.nav-left>li.last-elements .submenu:before {
     right:45px !important;
     left:auto !important
    }
    #topnav .buy-button {
     padding-right:15px;
     margin-right:15px
    }
    #topnav .navbar-toggle {
     display:none
    }
    #topnav #navigation {
     display:block !important
    }
    #topnav.scroll {
     top:0
    }
    #topnav.scroll .navigation-menu>li>a {
     padding-top:20px;
     padding-bottom:20px
    }
    #topnav.scroll-active .navigation-menu>li>a {
     padding-top:25px;
     padding-bottom:25px
    }
   }
   @media (max-width: 991px) {
    #topnav {
     background-color:#fff;
     -webkit-box-shadow:0 0 3px rgba(60,72,88,0.15);
     box-shadow:0 0 3px rgba(60,72,88,0.15);
     min-height:74px
    }
    #topnav .logo .l-dark {
     display:inline-block !important
    }
    #topnav .logo .l-light {
     display:none !important
    }
    /*#topnav .container {*/
    /* width:auto*/
    /*}*/
    #topnav #navigation {
     max-height:400px
    }
    #topnav .navigation-menu {
     float:none
    }
    #topnav .navigation-menu>li {
     float:none
    }
    #topnav .navigation-menu>li .submenu {
     display:none;
     list-style:none;
     padding-right:20px;
     margin:0
    }
    #topnav .navigation-menu>li .submenu li a {
     display:block;
     position:relative;
     padding:7px 15px;
     text-transform:uppercase;
     font-size:11px;
     letter-spacing:0px;
     font-weight:700;
     color:#3c4858 !important;
     -webkit-transition:all 0.3s;
     transition:all 0.3s
    }
    #topnav .navigation-menu>li .submenu.open {
     display:block
    }
    #topnav .navigation-menu>li .submenu .submenu {
     display:none;
     list-style:none
    }
    #topnav .navigation-menu>li .submenu .submenu.open {
     display:block
    }
    #topnav .navigation-menu>li .submenu.megamenu>li>ul {
     list-style:none;
     padding-right:0
    }
    #topnav .navigation-menu>li .submenu.megamenu>li>ul>li>span {
     display:block;
     position:relative;
     padding:10px 15px;
     text-transform:uppercase;
     font-size:12px;
     letter-spacing:0px;
     color:#8492a6
    }
    /*#topnav .navigation-menu>li>a {*/
    /* color:#3c4858;*/
    /* padding:10px 20px*/
    /*}*/
    /*#topnav .navigation-menu>li>a:after {*/
    /* position:absolute;*/
    /* left:15px*/
    /*}*/
    #topnav .navigation-menu>li>a:hover,
    #topnav .navigation-menu>li .submenu li a:hover,
    #topnav .navigation-menu>li.has-submenu.open>a {
     color:rgba(174, 142, 119, 1)
    }
    #topnav .menu-extras .menu-item {
     border-color:#8492a6
    }
    #topnav .navbar-header {
     float:right
    }
    #topnav .buy-button .login-btn-primary {
     display:inline-block !important
    }
    #topnav .buy-button .login-btn-light {
     display:none
    }
    #topnav .has-submenu .submenu .submenu-arrow {
     -webkit-transform:rotate(-45deg);
     transform:rotate(-45deg);
     position:absolute;
     left:20px;
     top:12px
    }
    #topnav .has-submenu.active a {
     color:rgba(174, 142, 119, 1)
    }
    #navigation {
     position:absolute;
     top:74px;
     right:0;
     width:100%;
     display:none;
     height:auto;
     padding-bottom:0;
     overflow:auto;
     border-top:1px solid #f1f3f9;
     border-bottom:1px solid #f1f3f9;
     background-color:#fff
    }
    #navigation.open {
     display:block;
     overflow-y:auto
    }
   }
   @media (max-width: 768px) {
    #topnav .navigation-menu .has-submenu .menu-arrow {
     left:16px;
     top:16px
    }
    #topnav .buy-button {
     padding:3px 0
    }
   }
   @media (min-width: 768px) {
    #topnav .navigation-menu>li.has-submenu:hover>.submenu {
     visibility:visible;
     opacity:1;
     margin-top:0
    }
    #topnav .navigation-menu>li.has-submenu:hover>.submenu>li.has-submenu:hover>.submenu {
     visibility:visible;
     opacity:1;
     margin-right:0;
     margin-left:0
    }
    .navbar-toggle {
     display:block
    }
   }
   @media (max-width: 375px) {
    #topnav .buy-button {
     display:none
    }
    #topnav .buy-menu-btn {
     display:block !important;
     margin:0 10px;
     padding:10px 20px
    }
    #topnav .buy-menu-btn .dropdown .dropdown-menu.show {
     -webkit-transform:translate3d(0px, -54px, 0px) !important;
     transform:translate3d(0px, -54px, 0px) !important
    }
    #topnav .navbar-toggle .lines {
     margin-left:0 !important
    }
   }
   .tagline {
    position:absolute;
    width:100%;
    z-index:99;
    font-size:14px;
    padding:13px 0
   }
   @media screen and (max-width: 575px) {
    .tagline {
     display:none
    }
   }
   @media screen and (max-width: 575px) {
    .tagline-height {
     top:0px !important
    }
   }
   @media (min-width: 576px) {
    .tagline-height {
     top:47px !important
    }
   }
   .sidebar-nav {
    padding:15px 0
   }
   .sidebar-nav>.navbar-item {
    padding:3px 15px
   }
   .sidebar-nav>.navbar-item .navbar-link {
    color:#3c4858 !important;
    font-size:15px;
    font-weight:600
   }
   .sidebar-nav>.navbar-item .navbar-link .navbar-icon {
    font-size:18px;
    margin-left:6px
   }
   #navmenu-nav li.active a {
    color:rgba(174, 142, 119, 1)
   }
   #navmenu-nav li.account-menu.active .navbar-link,
   #navmenu-nav li.account-menu:hover .navbar-link {
    color:#fff !important;
    background-color:rgba(174, 142, 119, 1) !important
   }
   .bg-home {
    height:100vh;
    background-size:cover;
    -ms-flex-item-align:center;
    -ms-grid-row-align:center;
    align-self:center;
    position:relative;
    background-position:center center
   }
   .bg-half-260 {
    padding:260px 0;
    background-size:cover;
    -ms-flex-item-align:center;
    -ms-grid-row-align:center;
    align-self:center;
    position:relative;
    background-position:center center
   }
   .bg-half-170 {
    padding:170px 0;
    background-size:cover;
    -ms-flex-item-align:center;
    -ms-grid-row-align:center;
    align-self:center;
    position:relative;
    background-position:center center
   }
   .bg-half {
    padding:184px 0 90px;
    background-size:cover;
    -ms-flex-item-align:center;
    -ms-grid-row-align:center;
    align-self:center;
    position:relative;
    background-position:center center
   }
   .bg-auth-home {
    padding:142px 0;
    background-size:cover;
    -ms-flex-item-align:center;
    -ms-grid-row-align:center;
    align-self:center;
    position:relative;
    background-position:center center
   }
   .bg-circle-gradiant {
    background:radial-gradient(circle at 50% 50%, rgba(47,85,212,0.1) 0%, rgba(47,85,212,0.1) 33.333%, rgba(47,85,212,0.3) 33.333%, rgba(47,85,212,0.3) 66.666%, rgba(47,85,212,0.5) 66.666%, rgba(47,85,212,0.5) 99.999%)
   }
   .it-home {
    -webkit-animation:animate-left-to-right 60s linear infinite;
    animation:animate-left-to-right 60s linear infinite
   }
   @-webkit-keyframes animate-left-to-right {
    from {
     background-position:100% 0
    }
    to {
     background-position:0% 0
    }
   }
   @keyframes animate-left-to-right {
    from {
     background-position:100% 0
    }
    to {
     background-position:0% 0
    }
   }
   .home-dashboard img {
    position:relative;
    top:60px;
    z-index:1
   }
   @media (min-width: 768px) {
    .home-dashboard.onepage-hero {
     overflow:hidden
    }
   }
   .classic-saas-image .bg-saas-shape:after {
    bottom:3rem;
    right:0;
    width:75rem;
    height:55rem;
    border-radius:20rem
   }
   @media (max-width: 767px) {
    .classic-saas-image .bg-saas-shape:after {
     right:10rem;
     width:30rem;
     height:30rem;
     border-radius:10rem
    }
   }
   @media (max-width: 768px) {
    .classic-saas-image .bg-saas-shape img,
    .freelance-hero .bg-shape img {
     max-width:550px
    }
   }
   @media (max-width: 767px) {
    .classic-saas-image .bg-saas-shape img,
    .freelance-hero .bg-shape img {
     max-width:100%;
     height:auto
    }
   }
   .classic-saas-image .bg-saas-shape:after,
   .freelance-hero .bg-shape:after {
    opacity:0.9;
    -webkit-transform:rotate(-130deg);
    transform:rotate(-130deg)
   }
   @media (max-width: 767px) {
    .classic-saas-image .bg-saas-shape:after,
    .freelance-hero .bg-shape:after {
     bottom:-5rem !important;
     height:30rem
    }
   }
   .freelance-hero .bg-shape:after {
    bottom:0rem;
    right:7rem;
    width:100rem;
    height:70rem;
    border-radius:6rem
   }
   @media (max-width: 768px) {
    .freelance-hero .bg-shape:after {
     bottom:-10rem
    }
   }
   @media (max-width: 767px) {
    .freelance-hero .bg-shape:after {
     right:15rem;
     width:40rem;
     height:30rem
    }
   }


/*#topnav {*/
/*    position: absolute;*/
/*    top: 10px;*/
/*    z-index: 999;*/
/*    width: 100%;*/
/*}*/


#topnav{

    position:fixed;

    top:20px;

    left:50%;

    transform:translateX(-50%);

    width:95%;

    max-width:1450px;

    z-index:99999;

    transition:.45s;

    border-radius:22px;

    background:rgb(120 120 120 / 12%);

    backdrop-filter:blur(8px);

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

    border:1px solid rgba(255,255,255,.15);

}

#topnav .container{

    display:flex;

    align-items:center;

    justify-content:space-between;

    min-height:82px;

}

.logo img{

    /*height:72px;*/
    height:clamp(56px,4vw,72px);

    transition:.4s;

}

#topnav .navigation-menu>li{

    margin:0 8px;

}

#topnav .navigation-menu>li>a{

    color:#000;

    font-size:15px;

    font-weight:500;

    text-transform:none;

    letter-spacing:0;

    padding:10px 18px;

    position:relative;

}

#topnav .navigation-menu>li>a::after{

    content:"";

    position:absolute;

    left:18px;

    right:18px;

    bottom:6px;

    height:2px;

    background:#c7a36d;

    transform:scaleX(0);

    transition:.35s;

    transform-origin:right;

}

#topnav .navigation-menu>li:hover>a::after,
#topnav .navigation-menu>li.active>a::after{

    transform:scaleX(1);

}

#topnav .navigation-menu>li:hover>a,
#topnav .navigation-menu>li.active>a{

    color:#d9b27c !important;

    background:none !important;

}

.buy-button a{

    background:linear-gradient(135deg,#b68c55,#d9b27c);

    border-radius:40px;

    padding:14px 30px;

    color:#fff;

    font-weight:600;

    box-shadow:0 10px 30px rgba(182,140,85,.35);

}

.buy-button a:hover{

    transform:translateY(-3px);

    box-shadow:0 20px 40px rgba(182,140,85,.45);

}

#topnav.nav-sticky{

    top:0;

    width:100%;

    max-width:none;

    border-radius:0;

    /*background:#ffffff;*/

    border:none;

    box-shadow:0 10px 40px rgba(0,0,0,.08);
    
    background:rgb(255 255 255 / 63%);

    backdrop-filter:blur(10px);

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

}

#topnav.nav-sticky .navigation-menu>li>a{

    color:#222;

}

#topnav.nav-sticky .navigation-menu>li:hover>a{

    color:#b68c55 !important;

}

#topnav.nav-sticky .logo img{

    height:60px;

}

@media(max-width:991px){

#topnav{

    width:100%;

    top:0;

    border-radius:0;

}

}

@media(max-width:991px){

.logo img{

height:52px;

}

}

@media(max-width:991px){

.buy-button{

display:none;

}

}



/*.price-slider{*/

/*position:relative;*/

/*width:190px;*/

/*height:46px;*/

/*overflow:hidden;*/

/*padding:10px 18px;*/

/*border-radius:18px;*/

/*background:rgba(255,255,255,.08);*/

/*backdrop-filter:blur(10px);*/

/*}*/

.price-slider{

position:relative;

width:220px;
height:50px;

overflow:hidden;

display:flex;
justify-content:center;
align-items:center;

padding:0 18px;

border-radius:18px;

background:rgba(255,255,255,.08);

backdrop-filter:blur(14px);

}

/*.price-slide{*/

/*position:absolute;*/

/*inset:0;*/

/*display:flex;*/

/*align-items:center;*/

/*gap:12px;*/

/*opacity:0;*/

/*transform:translateY(20px);*/

/*transition:.55s;*/

/*}*/

/*.price-slide.active{*/

/*opacity:1;*/

/*transform:translateY(0);*/

/*}*/

.price-slide{

position:absolute;

left:0;
right:0;
top:0;

height:100%;

display:flex;

justify-content:center;
align-items:center;

gap:10px;

opacity:0;

transform:translateY(100%);

transition:.55s cubic-bezier(.4,0,.2,1);

}

.price-slide.active{

opacity:1;

transform:translateY(0);

}

.price-slide.out{

opacity:0;

transform:translateY(-100%);

}

/*.price-icon{*/

/*width:28px;*/

/*height:28px;*/

/*border-radius:50%;*/

/*display:flex;*/

/*justify-content:center;*/

/*align-items:center;*/

/*color:#fff;*/

/*font-size:15px;*/

/*}*/

/*.up .price-icon{*/

/*background:#18a64b;*/

/*animation:upFloat 1.8s infinite;*/

/*}*/

/*.down .price-icon{*/

/*background:#d73333;*/

/*animation:downFloat 1.8s infinite;*/

/*}*/

.price-icon{

width:24px;
height:24px;

border-radius:50%;

display:flex;

align-items:center;
justify-content:center;

color:#fff;

font-size:14px;

flex-shrink:0;

}

.up .price-icon{

background:#18a64b;

animation:upFloat 2s infinite;

}

.down .price-icon{

background:#d93838;

animation:downFloat 2s infinite;

}

/*.price-info small{*/

/*display:block;*/

/*font-size:11px;*/

/*color:#000;*/

/*}*/

/*.price-info strong{*/

/*display:block;*/

/*font-size:13px;*/

/*font-weight:700;*/

/*color:#fff;*/

/*}*/

.price-info{

display:flex;

align-items:center;

gap:8px;

color:#000;


}

.price-info small{

color:#000;

font-size:12px;

margin:0;

}

.price-info strong{

font-size:13px;

color:#000;

font-weight:700;

}

@keyframes upFloat{

50%{
transform:translateY(-3px);
}

}

@keyframes downFloat{

50%{
transform:translateY(3px);
}

}


@media(max-width:991px){

.price-slider{

width:115px;

height:40px;

padding:0 2px;

border-radius:12px;

}

.price-icon{

width:18px;
height:18px;

font-size:11px;

}

.price-info small{

font-size:10px;

}

.price-info strong{

font-size:11px;

}

}




@media(max-width:991px){

#navigation{

display:none;

position:absolute;

top:74px;

left:15px;

right:15px;

background:#fff;

border-radius:20px;

box-shadow:0 15px 40px rgba(0,0,0,.15);

padding:20px;

max-width: 93%;

}

#navigation.open{

display:block;

animation:menuFade .35s;

}

.navigation-menu{

display:flex;

flex-direction:column;

gap:8px;

}

.navigation-menu li{

margin:0!important;

}

.navigation-menu li a{

padding:14px 10px!important;

border-radius:12px;

}

}


@keyframes menuFade{

from{

opacity:0;

transform:translateY(-15px);

}

to{

opacity:1;

transform:translateY(0);

}

}
.mobile-login{

margin-top:15px;

padding-top:15px;

border-top:1px solid #eee;

}

.mobile-login-btn{

display:flex;

justify-content:center;

align-items:center;

gap:10px;

background:#b8925d;

color:#fff!important;

padding:14px;

border-radius:40px;

font-weight:600;

}

/* پیش فرض (دسکتاپ) */
.mobile-login{
    display:none !important;
}

/* فقط موبایل */
@media (max-width:991px){

    .mobile-login{
        display:block;
    }
    
    
        .price-info{

        flex-direction:column;

        justify-content:center;

        align-items:flex-start;

        gap:2px;

        line-height:1.2;

    }

    .price-info small{

        display:block;

        font-size:9px;

        margin:0;

    }

    .price-info strong{

        display:block;

        font-size:10px;

        margin:0;

    }

}









/*==================================================
    LUXURY HEADER CART
==================================================*/

.header-cart{
    position:relative;
    display:flex;
    align-items:center;
    margin-right:18px;
}

/*==================================================
    BUTTON
==================================================*/

.cart-dropdown{
    position:relative;
}

.cart-btn{

    width:52px;
    height:52px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:18px;

    text-decoration:none;

    position:relative;

    color:#b88946;
    font-size:20px;

    background:rgb(223 223 223 / 47%);

    border:1px solid rgba(255,255,255,.18);

    backdrop-filter:blur(18px);

    transition:
        .45s ease;

    overflow:hidden;

}

/* shine */

.cart-btn:before{

    content:"";

    position:absolute;

    top:-120%;
    left:-40%;

    width:60%;
    height:300%;

    background:
    linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,.65),
        transparent
    );

    transform:rotate(20deg);

    transition:.8s;

}

.cart-btn:hover:before{

    left:140%;

}

.cart-btn:hover{

    background:#b88946;

    color:#fff;

    transform:
        translateY(-3px);

    box-shadow:
        0 15px 35px rgba(184,137,70,.35);

}

/*==================================================
    COUNT
==================================================*/

.cart-count{

    position:absolute;

    top:-5px;
    left:-5px;

    width:22px;
    height:22px;

    border-radius:50%;

    background:#d43737;

    color:#fff;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:11px;
    font-weight:700;

    border:2px solid #fff;

    animation:pulseCart 2s infinite;
    
    z-index: 1;

}

@keyframes pulseCart{

    0%{
        transform:scale(1);
        box-shadow:0 0 0 0 rgba(212,55,55,.45);
    }

    70%{
        transform:scale(1.08);
        box-shadow:0 0 0 10px rgba(212,55,55,0);
    }

    100%{
        transform:scale(1);
    }

}

/*==================================================
    POPUP
==================================================*/

.cart-popup{

    position:absolute;

    top:72px;
    left:0;

    width:390px;

    background:
        rgba(255,255,255,.92);

    backdrop-filter:blur(28px);

    border:1px solid rgba(255,255,255,.6);

    border-radius:28px;

    overflow:hidden;

    box-shadow:

    0 40px 80px rgba(0,0,0,.14),

    0 0 0 1px rgba(255,255,255,.35) inset;

    opacity:0;

    visibility:hidden;

    transform:
        translateY(18px)
        scale(.96);

    transition:

        opacity .35s,

        transform .35s,

        visibility .35s;

    z-index:99999;

}

/* Hover */

.cart-dropdown:hover .cart-popup{

    opacity:1;

    visibility:visible;

    transform:
        translateY(0)
        scale(1);

}

/* Arrow */

.cart-popup:before{

    content:"";

    position:absolute;

    top:-10px;
    left:28px;

    width:20px;
    height:20px;

    background:#fff;

    transform:rotate(45deg);

    border-radius:2px;

}

/*==================================================
    HEADER
==================================================*/

.cart-popup-header{

    padding:24px 26px;

    display:flex;

    justify-content:space-between;

    align-items:flex-start;

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

}

.cart-popup-header small{

    display:block;

    color:#b88946;

    letter-spacing:2px;

    text-transform:uppercase;

    font-size:11px;

    margin-bottom:6px;

}

.cart-popup-header h5{

    margin:0;

    font-size:20px;

    color:#222;

    font-weight:700;

}

.cart-popup-header span{

    background:#f6f1ea;

    color:#b88946;

    padding:8px 16px;

    border-radius:50px;

    font-size:13px;

    font-weight:600;

}

/*==================================================
    PRODUCTS
==================================================*/

.cart-items{

    max-height:360px;

    overflow-y:auto;

    padding:8px 0;

}

/*==================================================
    ITEM
==================================================*/

.cart-item{

    display:flex;

    gap:18px;

    align-items:center;

    padding:18px 24px;

    transition:.35s;

}

.cart-item:hover{

    background:#faf7f3;

}

/*==================================================
    IMAGE
==================================================*/

.cart-thumb{

    width:84px;

    height:108px;

    flex-shrink:0;

    border-radius:
        90px
        90px
        16px
        16px;

    overflow:hidden;

    border:1px solid #e7d4bf;

    background:#f6eee7;

    box-shadow:

        0 10px 30px rgba(0,0,0,.08);

}

.cart-thumb img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.5s;

}

.cart-item:hover img{

    transform:scale(1.08);

}

/*==================================================
    CONTENT
==================================================*/

.cart-content{

    flex:1;

}

.cart-content h6{

    margin:0;

    font-size:16px;

    font-weight:700;

    color:#222;

    line-height:1.5;

}

.cart-category{

    display:block;

    margin:6px 0 12px;

    color:#999;

    font-size:13px;

    letter-spacing:.5px;

}

/*==========================================
=            ITEMS                         =
==========================================*/

.cart-items{
    max-height:340px;
    overflow-y:auto;
    padding:10px 0;
}

.cart-items::-webkit-scrollbar{
    width:6px;
}

.cart-items::-webkit-scrollbar-thumb{
    background:#d8c0a4;
    border-radius:20px;
}

.cart-item{

    display:flex;
    align-items:center;
    gap:16px;

    padding:18px 22px;

    transition:.35s;
    position:relative;
}

.cart-item:not(:last-child){
    border-bottom:1px solid rgba(0,0,0,.05);
}

.cart-item:hover{
    background:#faf8f4;
}

/* تصویر محصول */

.cart-thumb{

    width:74px;
    height:90px;

    border-radius:70px 70px 14px 14px;

    overflow:hidden;

    flex-shrink:0;

    border:1px solid #d9bf9a;

    background:#f7f2ed;

    box-shadow:
    0 12px 24px rgba(0,0,0,.08);
}

.cart-thumb img{

    width:100%;
    height:100%;

    object-fit:cover;

    transition:.45s;
}

.cart-item:hover .cart-thumb img{

    transform:scale(1.08);
}

/* اطلاعات */

.cart-info{

    flex:1;

    display:flex;
    flex-direction:column;
}

.cart-info h5{

    margin:0 0 8px;

    font-size:15px;

    color:#222;

    font-weight:700;
}

.cart-info span{

    color:#777;

    font-size:13px;

    margin-bottom:6px;
}

.cart-price{

    color:#b88946;

    font-weight:700;

    font-size:15px;
}

/* حذف */

.cart-remove{

    width:34px;
    height:34px;

    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#999;

    transition:.3s;

    cursor:pointer;
}

.cart-remove:hover{

    background:#f4ece5;

    color:#d64242;

    transform:rotate(90deg);
}



/*==========================================
=            FOOTER                        =
==========================================*/

.cart-footer{

    padding:22px;

    background:#fcfbfa;

    border-top:1px solid rgba(0,0,0,.06);
}

.cart-total{

    display:flex;

    justify-content:space-between;

    margin-bottom:20px;

    font-size:15px;

    font-weight:700;

    color:#333;
}

.cart-total strong{

    color:#b88946;

    font-size:18px;
}

/* دکمه ها */

.cart-actions{

    display:flex;

    gap:12px;
}

.cart-actions a{

    flex:1;

    text-align:center;

    text-decoration:none;

    padding:13px 10px;

    border-radius:50px;

    transition:.35s;

    font-size:14px;

    font-weight:600;
}

/* مشاهده */

.cart-btn-view{

    border:1px solid #d6b28b;

    color:#b88946;

    background:#fff;
}

.cart-btn-view:hover{

    background:#f5efe8;

    color:#9d6b2f;
}

/* پرداخت */

.cart-btn-checkout{

    background:linear-gradient(135deg,#d5b180,#b88946);

    color:#fff;

    box-shadow:
    0 12px 28px rgba(184,137,70,.35);
}

.cart-btn-checkout:hover{

    transform:translateY(-2px);

    color:#fff;

    box-shadow:
    0 18px 35px rgba(184,137,70,.45);
}



/*==========================================
=            EMPTY                         =
==========================================*/

.cart-empty{

    text-align:center;

    padding:55px 25px;

    color:#999;
}

.cart-empty i{

    font-size:56px;

    color:#d4b28d;

    margin-bottom:18px;

    display:block;
}

.cart-empty h4{

    margin-bottom:8px;

    color:#444;
}

.cart-empty p{

    margin:0;

    font-size:14px;
}



/*==========================================
=            ANIMATION                     =
==========================================*/

@keyframes popupShow{

    from{

        opacity:0;

        transform:
        translateY(25px)
        scale(.96);

    }

    to{

        opacity:1;

        transform:
        translateY(0)
        scale(1);

    }

}

.header-cart:hover .cart-popup{

    animation:popupShow .35s ease;
}



/*==========================================
=            RESPONSIVE                    =
==========================================*/

@media(max-width:991px){

    .cart-popup{

        width:330px;

        right:0;
        left:auto;
    }

    .cart-popup:before{

        right:25px;
        left:auto;
    }

}

@media(max-width:768px){

    .cart-popup{

        position:fixed;

        top:75px;

        left:12px;
        right:12px;

        width:auto;

        max-width:none;

        border-radius:22px;
    }

    .cart-popup:before{

        display:none;
    }

    .cart-thumb{

        width:62px;
        height:76px;
    }

    .cart-info h5{

        font-size:14px;
    }

    .cart-actions{

        flex-direction:column;
    }

    .cart-actions a{

        width:100%;
    }
    
    .header-user{

        display:none;
    
    }

}

@media(max-width:480px){

    .cart-item{

        padding:16px;
        gap:12px;
    }

    .cart-footer{

        padding:18px;
    }

    .cart-total{

        font-size:14px;
    }

    .cart-total strong{

        font-size:16px;
    }

}




.header-user{

    margin-right:14px;

}

.user-btn{

    width:48px;
    height:48px;

    border-radius:16px;

    display:flex;
    align-items:center;
    justify-content:center;

    text-decoration:none;

    background:rgba(255,255,255,.08);

    border:1px solid rgba(255,255,255,.18);

    backdrop-filter:blur(14px);

    color:#b88946;

    font-size:19px;

    transition:.35s;
}

.user-btn:hover{

    background:#b88946;

    color:#fff;

    transform:translateY(-3px);

    box-shadow:0 12px 30px rgba(184,137,70,.35);

}


.remove-item{

    width:40px;
    height:40px;

    border-radius:50%;

    border:none;

    background:#fff;

    color:#c35d5d;

    cursor:pointer;

    transition:.35s;

    box-shadow:0 10px 25px rgba(0,0,0,.06);
    
    position: absolute;
    left: 15px;
    top: 15px;

}

.remove-item:hover{

    background:#d94848;

    color:#fff;

    transform:rotate(10deg);

}




.header-left{
    display:flex;
    align-items:center;
    gap:14px;
    margin-right:auto;
}

.header-cart,
.header-user{
    flex-shrink:0;
}

#topnav .container{
    display:flex;
    align-items:center;
}

.logo{
    flex-shrink:0;
}

#navigation{
    margin-right:40px;
}

.header-left{
    display:flex;
    align-items:center;
    gap:14px;
    margin-right:auto;
}



.cart-footer{

    padding:22px;

    border-top:1px solid rgba(0,0,0,.06);

    background:#ffffff4f;
}

.cart-total{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-bottom:18px;

    font-size:15px;

}

.cart-total strong{

    color:#b88946;

    font-size:20px;

    font-weight:700;

}

.btn-checkout-cart{

    width:100%;

    height:52px;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    border-radius:999px;

    text-decoration:none;

    font-size:15px;

    font-weight:700;

    color:#fff;

    background:linear-gradient(135deg,#d8b77e,#b88946);

    box-shadow:0 15px 35px rgba(184,137,70,.30);

    transition:.35s;

}

.btn-checkout-cart:hover{

    color:#fff;

    transform:translateY(-3px);

    box-shadow:0 22px 45px rgba(184,137,70,.42);

    background:linear-gradient(135deg,#e0c28f,#b88946);

}

.btn-checkout-cart i{

    font-size:16px;

}



@media (max-width:991px){

#topnav .container{

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:8px;

    padding:0 12px;

    min-height:72px;

}


.logo img{

    height:clamp(50px,8vw,56px);

    width:auto;

    display:block;

}


.header-left{

    display:flex;

    align-items:center;

    gap:clamp(5px,2vw,12px);

    margin-right:auto;

    flex-shrink:0;

}

.price-slider{

    width:clamp(95px,26vw,140px);

    height:clamp(36px,9vw,44px);

    padding:0 0px;

    border-radius:12px;

}

.price-info{

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:flex-start;

    line-height:1.1;

}

.price-info small{

    font-size:clamp(8px,2vw,10px);

}

.price-info strong{

    font-size:clamp(9px,2.4vw,11px);

    font-weight:700;

}

.price-icon{

    width:18px;

    height:18px;

    font-size:11px;

    flex-shrink:0;

}

.cart-btn{

    width:clamp(38px,10vw,44px);

    height:clamp(38px,10vw,44px);

    border-radius:12px;

}

.cart-btn i{

    font-size:clamp(15px,4vw,18px);

}

.cart-count{

    top:-5px;

    left:-5px;

    width:20px;

    height:20px;

    font-size:10px;

}

.menu-extras{

    flex-shrink:0;

}

.navbar-toggle{

    width:42px;

    height:42px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:12px;

}

.lines span{

    width:22px;

}

.logo{

    flex-shrink:0;

}

.price-slider{

    flex-shrink:0;

}

#topnav .container{

    display:grid;

    grid-template-columns:

        auto
        1fr
        auto
        auto;

    align-items:center;

}

.logo{

    order:2;

    justify-self:center;

}

.header-left{

    order:1;

}

.menu-extras{

    order:3;

}

.header-cart {

     margin-right: 0px; 
}

#topnav .navbar-toggle .lines {

     margin: 0px; 
     width: 22px;
}

#topnav .navbar-toggle
 {
    width: 40px;
}

#navigation
 {
     margin-right: 0px; 
}

}
