#nav.htg-header{
         --htg-purple: #932588;
         --htg-text: #232127;
         --htg-line: #ece7ed;
         font-family: 'Poppins', Arial, sans-serif;
         color: var(--htg-text)
      }
#nav.htg-header *{
         box-sizing: border-box
      }
#nav.htg-header{
         position: sticky;
         top: 0;
         z-index: 990;
         background: rgba(255, 255, 255, .98);
         box-shadow: 0 3px 22px #30152d0c;
         backdrop-filter: blur(16px);
         padding: 0;
      }
#nav.htg-header a{
         text-decoration: none;
         color: inherit
      }
#nav.htg-header button{
         font: inherit;
         cursor: pointer;
         border: 0
      }
#nav.htg-header button:focus-visible,
#nav.htg-header a:focus-visible{
         outline: 3px solid #b961ac;
         outline-offset: 3px
      }
#nav .htg-container{
         width: min(1320px, 92%);
         margin-inline: auto
      }
#nav .htg-mainbar{
         display: grid;
         grid-template-columns: auto minmax(180px, 1fr) auto;
         align-items: center;
         gap: 32px;
         min-height: 92px;
         padding-block: 15px
      }
#nav .htg-brand{
         display: flex;
         align-items: center;
         gap: 11px;
         min-width: 0;
         white-space: normal
      }
#nav .htg-brand img{
         display: block;
         object-fit: contain;
         width: 44px;
         height: 44px;
         flex: 0 0 44px
      }
#nav .htg-brand-copy{
         display: block;
         min-width: 0
      }
#nav .htg-brand-name{
         display: block;
         font-weight: 800;
         font-size: 23px;
         line-height: 1.25;
         letter-spacing: -.65px;
         white-space: nowrap;
         color: #202020
      }
#nav .htg-brand-name .htg-high{
         color: #932588
      }
#nav .htg-brand-name .htg-tech{
         color: #747574
      }
#nav .htg-brand-tagline{
         display: block;
         margin-top: 4px;
         font-size: 8px;
         line-height: 1.5;
         letter-spacing: 1.35px;
         text-transform: uppercase;
         font-weight: 600;
         color: #aaa;
         white-space: nowrap
      }
#nav #navSearchBtn.htg-search{
         display: flex;
         align-items: center;
         gap: 12px;
         width: 100%;
         height: 45px;
         padding: 6px 7px 6px 15px;
         border: 1px solid #eae5ec;
         border-radius: 12px;
         background: #f7f5f8;
         color: #807885;
         text-align: left;
         font-size: 12px;
         box-shadow: none;
         min-width: 0
      }
#nav .htg-search>span:not(.htg-search-arrow){
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap
      }
#nav .htg-search .htg-search-arrow{
         margin-left: auto;
         flex: 0 0 32px;
         height: 32px;
         background: #932588;
         color: white;
         border-radius: 8px;
         display: grid;
         place-items: center;
         font-size: 20px
      }
#nav .htg-account-actions{
         display: flex;
         gap: 17px;
         align-items: center
      }
#nav .htg-action{
         display: flex;
         position: relative;
         align-items: center;
         gap: 8px;
         color: #302a34;
         background: none;
         padding: 8px 3px;
         white-space: nowrap;
         font-size: 11px
      }
#nav .htg-action i{
         font-size: 18px
      }
#nav .htg-cart-count{
         position: absolute;
         top: -3px;
         left: 15px;
         background: #932588;
         color: white;
         border-radius: 20px;
         min-width: 17px;
         height: 17px;
         display: grid;
         place-items: center;
         font-size: 9px;
         padding: 0 4px
      }
#nav .htg-nav-panel{
         border-top: 1px solid #ece7ed
      }
#nav .htg-nav-row{
         display: flex;
         position: relative;
         align-items: center;
         gap: 26px;
         min-height: 52px
      }
#nav .htg-nav-row>a,
#nav .htg-nav-trigger{
         font-size: 12px;
         font-weight: 600;
         padding: 16px 0;
         background: none;
         color: #322b37;
         line-height: 1.5;
         display: flex;
         align-items: center;
         gap: 10px
      }
#nav .htg-nav-trigger:first-child{
         color: #932588;
         padding-right: 22px;
         border-right: 1px solid #ece7ed
      }
#nav .htg-nav-row .htg-help{
         margin-left: auto;
         font-size: 11px;
         font-weight: 400;
         color: #807583
      }
#nav .htg-nav-trigger[aria-expanded=true],
#nav .htg-nav-row>a:hover{
         color: #932588
      }
#nav .htg-menu-toggle{
         display: none;
         background: none;
         color: #932588
      }
#nav .htg-mega{
         position: absolute;
         top: 100%;
         left: 0;
         right: 0;
         padding: 25px;
         background: white;
         border: 1px solid #ece7ed;
         border-radius: 0 0 18px 18px;
         box-shadow: 0 20px 40px #26102822;
         max-height: 65vh;
         overflow: auto;
         z-index: 3;
         animation: htg-menu-in .18s ease-out
      }
#nav .htg-mega[hidden]{
         display: none !important
      }
#nav .htg-mega h2{
         font-family: inherit;
         font-size: 16px;
         font-weight: 700;
         margin: 0 0 20px
      }
#nav .htg-mega-grid{
         display: grid;
         grid-template-columns: repeat(4, minmax(0, 1fr));
         gap: 12px
      }
#nav .htg-mega-grid>button,
#nav .htg-mega-grid>a{
         display: flex;
         align-items: center;
         justify-content: center;
         border-radius: 10px;
         padding: 14px 10px;
         background: #f9f5f8;
         color: #4a3e4a;
         font-size: 12px;
         font-weight: 500;
         text-align: center
      }
#nav .htg-mega-grid>button:hover,
#nav .htg-mega-grid>a:hover{
         background: #f0e3ee;
         color: #932588
      }
#nav .htg-brand-grid>a{
         background: #fff;
         border: 1px solid #ece7ed
      }
#nav .htg-brand-grid img{
         width: 110px;
         height: 55px;
         object-fit: contain;
         max-width: 100%
      }
#nav .htg-menu-link{
         display: inline-block;
         margin-top: 18px;
         font-size: 12px;
         color: #932588
      }
@keyframes htg-menu-in{
         from {
            opacity: 0;
            transform: translateY(-6px)
         }

         to {
            opacity: 1;
            transform: translateY(0)
         }
      }
@media(max-width:1150px){#nav .htg-mainbar{
            gap: 20px
         }
#nav .htg-action>span:not(.htg-cart-count){
            display: none
         }
#nav .htg-brand-name{
            font-size: 21px
         }
#nav .htg-brand-tagline{
            font-size: 7px;
            letter-spacing: 1px
         }
#nav .htg-nav-row{
            gap: 20px
         }}
@media(max-width:760px){#nav .htg-mainbar{
            grid-template-columns: 24px minmax(0, 1fr) auto;
            gap: 12px 9px;
            min-height: 0;
            padding: 12px 0
         }
#nav .htg-menu-toggle{
            display: block;
            padding: 2px;
            font-size: 18px;
            width: 24px
         }
#nav .htg-brand{
            gap: 8px
         }
#nav .htg-brand img{
            width: 36px;
            height: 36px;
            flex-basis: 36px
         }
#nav .htg-brand-name{
            font-size: clamp(15px, 4vw, 21px);
            letter-spacing: -.5px
         }
#nav .htg-brand-tagline{
            font-size: clamp(5px, 1.3vw, 7px);
            letter-spacing: .55px;
            margin-top: 3px
         }
#nav .htg-account-actions{
            gap: 10px
         }
#nav .htg-action i{
            font-size: 17px
         }
#nav .htg-action{
            padding: 5px 0
         }
#nav #navSearchBtn.htg-search{
            grid-column: 1/-1;
            grid-row: 2;
            height: 39px;
            font-size: 11px
         }
#nav .htg-search .htg-search-arrow{
            height: 27px;
            flex-basis: 29px
         }
#nav .htg-nav-panel{
            display: none;
            max-height: calc(100dvh - 130px);
            overflow-y: auto
         }
#nav .htg-nav-panel.is-open{
            display: block
         }
#nav .htg-nav-row{
            display: flex;
            flex-direction: column;
            align-items: stretch;
            gap: 0;
            padding: 5px 0 13px
         }
#nav .htg-nav-row>a,
#nav .htg-nav-trigger{
            font-size: 12px;
            padding: 13px 8px;
            border-bottom: 1px solid #ece7ed
         }
#nav .htg-nav-trigger:first-child{
            border-right: 0
         }
#nav .htg-nav-row .htg-help{
            margin-left: 0
         }
#nav .htg-mega{
            position: static;
            border: 0;
            box-shadow: none;
            max-height: none;
            padding: 15px 0 20px;
            order: 0
         }
#nav .htg-mega-grid{
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px
         }
#nav .htg-mega-grid>button{
            font-size: 11px
         }}
@media(prefers-reduced-motion:reduce){#nav .htg-mega{
            transition: none;
            animation: none
         }}
#nav.htg-header .htg-nav-row>a,
#nav.htg-header .htg-nav-row>.htg-nav-trigger{
         font-family: 'Poppins', Arial, sans-serif;
         font-size: 12px;
         font-weight: 500;
         line-height: 1.5;
         letter-spacing: 0;
         text-transform: none;
      }
#nav.htg-header .htg-nav-row>.htg-home-active,
#nav.htg-header .htg-nav-row>.htg-home-active:hover{
         color: #932588;
      }
#nav.htg-header .htg-outline-icon{
         display: block;
         width: 22px;
         height: 22px;
         flex: 0 0 22px;
         fill: none;
         stroke: currentColor;
         stroke-width: 1.6;
         stroke-linecap: round;
         stroke-linejoin: round;
      }
#nav.htg-header .htg-account-actions{
         gap: 22px;
      }
#nav.htg-header .htg-action{
         display: flex;
         align-items: center;
         gap: 10px;
         color: #231e29;
         padding: 7px 0;
      }
#nav.htg-header .htg-action>.htg-action-copy{
         display: flex;
         flex-direction: column;
         align-items: flex-start;
         gap: 4px;
         text-align: left;
      }
#nav.htg-header .htg-action-copy small{
         display: block;
         font-size: 9px;
         font-weight: 400;
         line-height: 1.4;
         color: #8b8290;
      }
#nav.htg-header .htg-action-copy b{
         display: block;
         font-size: 11px;
         font-weight: 700;
         line-height: 1.4;
         color: #231e29;
      }
#nav.htg-header .htg-cart-count{
         top: -1px;
         left: 13px;
         font-weight: 500;
         border: 1px solid #fff;
         min-width: 17px;
         height: 17px;
         z-index: 1;
      }
#nav.htg-header .htg-nav-row>.htg-profile-link{
         margin-left: auto;
         display: flex;
         align-items: center;
         gap: 8px;
         color: #756a7b;
         white-space: nowrap;
      }
#nav.htg-header .htg-profile-link .htg-outline-icon{
         width: 19px;
         height: 19px;
         flex-basis: 19px;
      }
#nav.htg-header .htg-nav-row{
         gap: 22px;
      }
@media (min-width: 761px) and (max-width: 1100px){#nav.htg-header .htg-action>.htg-action-copy{
            display: none;
         }
#nav.htg-header .htg-nav-row{
            gap: 15px;
            flex-wrap: wrap;
         }}
@media (max-width: 760px){#nav.htg-header .htg-account-actions{
            gap: 13px;
         }
#nav.htg-header .htg-action>.htg-action-copy{
            display: none;
         }
#nav.htg-header .htg-action .htg-outline-icon{
            width: 20px;
            height: 20px;
            flex-basis: 20px;
         }
#nav.htg-header .htg-nav-row{
            gap: 0;
         }
#nav.htg-header .htg-nav-row>.htg-profile-link{
            margin-left: 0;
         }}
#nav.htg-header .htg-container{
         width: 92%;
         max-width: 1320px;
         margin-inline: auto;
         box-sizing: border-box;
      }



#nav.htg-header { --primary:#932588; width:100%; margin:0; line-height:1.5; text-align:left; }
#nav.htg-header .htg-search-form { display:flex; align-items:center; gap:12px; width:100%; height:45px; padding:6px 7px 6px 15px; border:1px solid #eae5ec; border-radius:12px; background:#f7f5f8; margin:0; min-width:0; }
#nav.htg-header .htg-search-form input { font:inherit; font-size:12px; color:#232127; background:transparent; border:0; outline:0; box-shadow:none; width:100%; min-width:0; padding:0; margin:0; height:auto; }
#nav.htg-header .htg-search-form:focus-within { outline:2px solid #b961ac; outline-offset:2px; }
#nav.htg-header .htg-search-form button { flex:0 0 30px; width:30px; height:30px; padding:0; border-radius:8px; background:#932588; color:white; }
#nav.htg-header .htg-search-icon { width:16px; height:16px; flex-shrink:0; }
#nav.htg-header .htg-category-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }
#nav.htg-header .htg-category-card { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:12px; border:1px solid #ece7ed; border-radius:10px; background:white; font-size:12px; text-align:center; overflow:hidden; }
#nav.htg-header .htg-category-card:hover { border-color:#932588; background:#ffffff; }
#nav.htg-header .htg-category-card img { display:block; width:70px; height:70px; max-width:100%; object-fit:contain; }
#nav.htg-header .htg-brand-card { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:0px; border:1px solid #ece7ed; border-radius:10px; background:white; font-size:12px; text-align:center; overflow:hidden; }
#nav.htg-header .htg-brand-card img { width:100px;height: 70px; }
#nav.htg-header .htg-nav-row > a[aria-current="page"] { color:#932588; }
#nav.htg-header .htg-mega { max-height:min(65vh,560px); overflow-y:auto; }
#nav.htg-header .htg-menu-toggle { background:transparent; color:#932588; padding:8px; }
@media(max-width:760px) {
 #nav.htg-header .htg-search-form { grid-column:1/-1; grid-row:2; height:42px; }
 #nav.htg-header .htg-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 #nav.htg-header .htg-mainbar { column-gap:8px; }
}

#nav.htg-header svg.bi { fill:currentColor; stroke:none; flex-shrink:0; }