@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600;700&family=Barlow+Condensed:wght@700;800;900&display=swap');

:root {--black: #0a0b0d; --dark: #13161b; --dark2: #1c2028; --dark3: #252c38; --green: #9ccb3b; --green-d: #7fb02e; --white: #ffffff; --off: #f5f6f7; --g100: #f0f2f4; --g200: #e2e5e9; --g300: #c8cdd5; --g400: #8d97a3; --g500: #596470; --g600: #353e48; --red: #d93025; --ff-d: 'Barlow Condensed', sans-serif; --ff-b: 'Barlow', sans-serif; --r: 4px; --r2: 8px; --sh: 0 1px 3px rgba(0,0,0,.08), 0 2px 8px rgba(0,0,0,.06); --sh2: 0 4px 20px rgba(0,0,0,.14); --wrap: 1280px; --pad: 20px; --topbar-h: 34px; --hdr-h: 73px; --nav-h: 46px; --mob-hdr-h: 156px;}

*, *::before, *::after {box-sizing: border-box; margin: 0; padding: 0;}
html {scroll-behavior: smooth; -webkit-text-size-adjust: 100%;}
body {font-family: var(--ff-b); font-size: 16px; color: var(--g600); background: var(--white); line-height: 1.5; overflow-x: hidden;}
body.logged-in { padding-top: 0 !important; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
ul { list-style: none; }
button { cursor: pointer; font-family: inherit; }

.wrap {max-width: var(--wrap); margin: 0 auto; padding: 0 var(--pad);}
@media (min-width: 1320px) {
 .wrap { padding: 0 40px; }
}
/*  4. CORE.CSS OVERRIDES
 These rules must stay near the top so they load even if S4S
 truncates the file. Uses `body` prefix for specificity.
------------------------------------------------------------- */
body header.site-hdr,
body header.site-header,
body .site-header {padding: 0 !important; height: auto !important; float: none !important; display: block !important; background: var(--white) !important;}
body #searchBox .search-submit {position: static !important; top: auto !important; right: auto !important; width: 46px !important; height: 100% !important;}
body .header-links {position: static !important; float: none !important; width: auto !important; height: auto !important; display: flex !important; top: auto !important; right: auto !important;}
body .header-links > ul { display: none !important; }
body .minicart {float: none !important; position: static !important; width: auto !important; padding: 0 !important; display: flex !important; align-items: center !important;}
body .minicart img,
body .minicart i { display: none !important; }
body .tcdmenu > ul {display: flex !important; float: none !important; width: 100% !important; border: none !important; background: transparent !important;}
body .tcdmenu > ul > li {float: none !important; display: flex !important;}
body .tcdmenu > ul > li > a.cat {float: none !important; display: flex !important; background: transparent !important;}
/*  5. HEADER SPACER
 Reserves space below the fixed header so content isn't hidden.
------------------------------------------------------------- */
.wbd-spacer,
.header-spacer {display: block !important; height: calc(var(--topbar-h) + var(--hdr-h) + var(--nav-h)) !important; padding: 0 !important;}
@media (max-width: 991px) {
: root { --nav-h: 0px; }
 .wbd-spacer,
 .header-spacer {
 height: calc(var(--topbar-h) + var(--hdr-h)) !important;
 }
}
@media (max-width: 767px) {
 .wbd-spacer,
 .header-spacer {
 height: var(--mob-hdr-h) !important;
 }
 .tb-links, .tb-badge { display: none !important; }
 .tb-left { display: flex !important; font-size: 14px; max-width: calc(100% - 100px); }
 .topbar .wrap { justify-content: space-between; }
 .tb-phone { display: flex !important; }
}
.breadcrumb, .breadCrumb, #breadcrumbs, .page-crumb {scroll-margin-top: calc(var(--topbar-h) + var(--hdr-h) + var(--nav-h) + 12px);}

body.not-logged-in .cart-btn,
body.not-logged-in a.minicart,
body.not-logged-in .minicart-details { display: none !important; }
.wbd-header-wrap {position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; z-index: 200;}

.topbar {background: var(--dark); height: var(--topbar-h); display: flex; align-items: center;}
.topbar .wrap {display: flex; align-items: center; justify-content: space-between; width: 100%; min-width: 0;}
.tb-left {color: var(--g400); font-size: 15px; font-weight: 500; display: flex; align-items: center; gap: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;}
.tb-left svg { color: var(--green); }
.tb-right { display: flex; align-items: center; flex-shrink: 0; }
.tb-phone { display: none; color: var(--g300); font-size: 15px; font-weight: 600; letter-spacing: .03em; text-decoration: none; padding: 0 8px; white-space: nowrap; }
.tb-phone:hover { color: var(--white); }
.tb-badge {background: var(--green); color: var(--black); font-size: 14px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; padding: 0 14px; height: var(--topbar-h); display: flex; align-items: center; white-space: nowrap;}
.tb-links { display: flex; }
.tb-links a {color: var(--g400); font-size: 15px; padding: 0 10px; border-right: 1px solid var(--dark3); height: var(--topbar-h); display: flex; align-items: center; white-space: nowrap; transition: color .15s;}
.tb-links a:first-child { border-left: 1px solid var(--dark3); }
.tb-links a:hover { color: var(--white); }
@media (max-width: 900px) and (min-width: 992px), (max-width: 767px) { .tb-left { display: none; } }
@media (max-width: 700px) { .tb-links { display: none; } }

body .site-hdr,
body header.site-hdr {background: var(--white) !important; border-bottom: 1px solid var(--g200) !important; box-shadow: 0 2px 6px rgba(0,0,0,.06) !important; padding: 0 !important; float: none !important; display: block !important; width: 100% !important; position: relative !important; z-index: 200;}
body .site-hdr .wrap {display: block !important; height: auto !important; max-width: var(--wrap) !important; margin: 0 auto !important; padding: 0 var(--pad) !important; box-sizing: border-box !important;}
body .hdr-inner {display: grid !important; grid-template-columns: 1fr auto 1fr !important; align-items: center !important; height: var(--hdr-h) !important; gap: 0 !important; padding: 0 !important; margin: 0 !important; width: 100% !important; box-sizing: border-box !important;}
body .hdr-inner > a {display: inline-flex !important; align-items: center !important; justify-content: flex-start; text-decoration: none !important; float: none !important; width: fit-content !important; height: auto !important; padding: 0 !important;}
body .hdr-inner > a img {display: block !important; height: 46px !important; width: auto !important; max-width: 220px !important; object-fit: contain;}
body .logo-w,
body .logo-s { display: none !important; }
body .srch,
body #searchBox {width: clamp(280px, 40vw, 560px) !important; min-width: 0 !important; position: static !important; top: auto !important; left: auto !important; right: auto !important; height: auto !important; padding: 0 !important; float: none !important;}
body .srch-form,
body #searchBox form,
body #searchBox .search-form {display: flex !important; align-items: stretch !important; height: 44px !important; border: 1.5px solid var(--g300) !important; border-radius: var(--r2); overflow: hidden !important; background: var(--off) !important; position: static !important; width: 100% !important; box-shadow: none !important; transition: border-color .2s;}
body .srch-form:focus-within,
body #searchBox .search-form:focus-within {border-color: var(--green) !important; background: var(--white) !important;}
body .srch-form input,
body #searchBox .form-control.search-text,
body #searchBox input[type="text"],
body #searchBox input[name="keyword"] {flex: 1 !important; min-width: 0 !important; background: transparent !important; border: none !important; outline: none !important; box-shadow: none !important; padding: 0 16px !important; font-size: 14px !important; font-family: var(--ff-b) !important; color: var(--dark) !important; height: 100% !important; border-radius: 0; -webkit-appearance: none !important;}
body .srch-form input::placeholder,
body #searchBox input::placeholder { color: var(--g400) !important; }
body .srch-btn,
body #searchBox .search-submit,
body #searchBox button[type="submit"] {flex-shrink: 0; width: 46px !important; height: 100% !important; background: transparent !important; border: none !important; border-left: 1.5px solid var(--g200) !important; color: var(--g400) !important; cursor: pointer; display: flex !important; align-items: center !important; justify-content: center !important; transition: color .15s; border-radius: 0; position: static !important; padding: 0 !important;}
body .srch-btn:hover,
body #searchBox .search-submit:hover { color: var(--green) !important; }
/* QUICKSEARCH DROPDOWN
   S4S renders .searchlight-balloon full-width relative to body at top:~75px
   We clip it to match the #searchBox position/width */
.searchlight-balloon {
  position: fixed !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: var(--wrap) !important;
  max-width: 100vw !important;
  top: calc(var(--topbar-h) + var(--hdr-h)) !important;
  z-index: 9999 !important;
  background: transparent !important;
  padding: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}
.searchlight-results-wrapper {
  /* Positioned by JS inline styles - do not override with fixed positioning */
  background: var(--white) !important;
  border: 1.5px solid var(--g200) !important;
  border-top: none !important;
  border-radius: 0 0 var(--r2) var(--r2) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.14) !important;
  max-height: 420px !important;
  overflow-y: auto !important;
  height: auto !important;
  min-height: 0 !important;
}
table.searchlight-results {
  width: 100% !important;
  height: auto !important;
  display: table !important;
  border-collapse: collapse !important;
}
table.searchlight-results tr {
  display: table-row !important;
  height: auto !important;
  border-bottom: 1px solid var(--g100) !important;
}
table.searchlight-results tr:hover { background: var(--g100) !important; cursor: pointer !important; }
table.searchlight-results td { padding: 8px 12px !important; vertical-align: middle !important; }
.searchlight-result-text { display: flex !important; align-items: center !important; gap: 10px !important; font-size: 14px !important; font-weight: 600 !important; color: var(--dark) !important; }
.searchlight-result-icon { width: 44px !important; height: 44px !important; object-fit: contain !important; flex-shrink: 0 !important; }
.search-price { color: var(--green-d) !important; font-weight: 700 !important; display: block !important; font-size: 14px !important; }
.searchlight-results-wrapper li {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 14px !important;
  border-bottom: 1px solid var(--g100) !important;
  cursor: pointer !important;
  transition: background .12s !important;
  list-style: none !important;
}
.searchlight-results-wrapper li:last-child { border-bottom: none !important; }
.searchlight-results-wrapper li:hover { background: var(--g100) !important; }
.searchlight-results-wrapper li img { width: 44px !important; height: 44px !important; object-fit: contain !important; flex-shrink: 0 !important; }
.searchlight-results-wrapper li a { font-size: 14px !important; font-weight: 600 !important; color: var(--dark) !important; text-decoration: none !important; flex: 1 !important; }
.searchlight-results-wrapper .price, .searchlight-results-wrapper [class*="price"] { color: var(--green-d) !important; font-weight: 700 !important; font-size: 14px !important; white-space: nowrap !important; }
body .hdr-actions {display: flex !important; align-items: center !important; gap: 10px; justify-content: flex-end; position: static !important; float: none !important; width: auto !important; height: auto !important; padding: 0 !important;}
body .cart-btn,
body a.minicart {display: flex !important; align-items: center !important; gap: 8px; height: 44px !important; padding: 0 16px !important; border: 1.5px solid var(--g200) !important; border-radius: var(--r); background: var(--white) !important; color: var(--dark) !important; text-decoration: none !important; white-space: nowrap; transition: border-color .15s; float: none !important; position: static !important; width: auto !important; box-sizing: border-box !important;}
body .cart-btn:hover,
body a.minicart:hover { border-color: var(--dark) !important; }
body .cart-ic {position: relative !important; display: flex !important; align-items: center !important;}
body .cart-badge {position: absolute !important; top: -8px !important; right: -10px !important; background: var(--green) !important; color: var(--black) !important; font-size: 9px !important; font-weight: 800 !important; min-width: 16px !important; height: 16px !important; border-radius: 8px; display: flex !important; align-items: center !important; justify-content: center !important; padding: 0 3px !important;}
body .cart-txt { display: flex !important; flex-direction: column !important; line-height: 1.2 !important; }
body .cart-lbl { font-size: 14px !important; font-weight: 600 !important; color: var(--dark) !important; }
body .cart-sub { font-size: 14px !important; color: var(--g400) !important; }
body .dlr-btn,
body a.dlr-btn {display: flex !important; align-items: center !important; gap: 8px; height: 44px !important; padding: 0 20px !important; background: var(--dark) !important; color: var(--white) !important; border-radius: var(--r); border: none !important; font-family: var(--ff-d) !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: .08em; text-transform: uppercase !important; white-space: nowrap; text-decoration: none !important; transition: background .15s; cursor: pointer; flex-shrink: 0;}
body .dlr-btn:hover,
body a.dlr-btn:hover {background: var(--green) !important; color: var(--black) !important;}
body .mob-tog {display: none !important; align-items: center !important; justify-content: center !important; width: 44px !important; height: 44px !important; background: transparent !important; border: 1.5px solid var(--g300) !important; border-radius: var(--r); color: var(--dark) !important; cursor: pointer; flex-shrink: 0; padding: 0 !important;}
@media (max-width: 991px) {
 body .hdr-inner {
 display: grid !important;
 grid-template-columns: 44px 1fr 1fr !important;
 grid-template-rows: auto auto !important;
 align-items: center !important;
 height: auto !important;
 padding: 10px 0 !important;
 column-gap: 0 !important;
 row-gap: 8px !important;
 flex-wrap: unset;
 position: static !important;
 }
 body .mob-tog {
 display: flex !important;
 grid-column: 1 !important;
 grid-row: 1 !important;
 flex-shrink: 0;
 }
 body .hdr-inner > a {
 grid-column: 1 / -1 !important;
 grid-row: 1 !important;
 justify-self: center;
 align-self: center;
 position: static !important;
 transform: none !important;
 flex: none !important;
 padding: 0 !important;
 height: auto !important;
 z-index: 1;
 }
 body .hdr-inner > a img { height: 42px !important; }
 body .hdr-actions {
 grid-column: 3 !important;
 grid-row: 1 !important;
 justify-self: end;
 display: flex !important;
 align-items: center !important;
 gap: 6px;
 margin-left: 0 !important;
 }
 body .srch,
 body #searchBox {
 grid-column: 1 / -1 !important;
 grid-row: 2 !important;
 flex: none !important;
 max-width: 100% !important;
 width: 100% !important;
 order: unset !important;
 }
 body .cart-txt { display: none !important; }
 body .cart-btn,
 body a.minicart {
 width: 44px !important;
 height: 44px !important;
 padding: 0 !important;
 justify-content: center !important;
 gap: 0;
 }
 body .dlr-btn .dlr-txt { display: none !important; }
 body .dlr-btn,
 body a.dlr-btn {
 width: 44px !important;
 height: 44px !important;
 padding: 0 !important;
 justify-content: center !important;
 gap: 0;
 }
}
@media (max-width: 480px) {
 body .hdr-inner > a img { height: 36px !important; }
}

/* -- TABLET: 600 991px   fix awkward mid-width header layout -- */
@media (min-width: 600px) and (max-width: 991px) {
  body .hdr-inner {
    grid-template-columns: 44px 1fr 44px !important;
  }
  body .hdr-inner > a {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
  }
  body .hdr-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
  }
  body .srch,
  body #searchBox {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
  }
}

.nav-bar,
.tcdmenu-wrapper {background: var(--dark) !important; border-bottom: 2px solid var(--green) !important; position: relative !important; z-index: 190; float: none !important; width: 100% !important; display: block !important;}
.nav-inner,
.tcdmenu {display: flex !important; align-items: stretch !important; height: var(--nav-h) !important; overflow: visible !important; background: transparent !important; border: none !important; border-radius: 0; max-width: var(--wrap); margin: 0 auto; padding: 0 var(--pad); text-align: left;}
@media (min-width: 1320px) {
 .nav-inner, .tcdmenu { padding: 0 40px; }
}
.tcdmenu > ul {display: flex !important; align-items: stretch !important; justify-content: center !important; height: var(--nav-h) !important; list-style: none !important; margin: 0 !important; padding: 0 !important; float: none !important; width: 100% !important; background: transparent !important; border: none !important;}
.tcdmenu > ul > li {position: static !important; display: flex !important; align-items: stretch !important; float: none !important; flex-shrink: 0;}
.tcdmenu > ul > li.tcdm-login:first-of-type { margin-left: auto !important; }
.tcdmenu > ul > li > a.cat {display: flex !important; align-items: center !important; gap: 5px; padding: 0 16px !important; height: var(--nav-h) !important; color: var(--g300) !important; font-family: var(--ff-d) !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: .07em; text-transform: uppercase !important; white-space: nowrap; transition: color .15s, background .15s; border-right: 1px solid rgba(255,255,255,.05) !important; text-decoration: none !important; background: transparent !important; line-height: 1; position: relative !important;}
.tcdmenu > ul > li:hover > a.cat {color: var(--white) !important; background: rgba(255,255,255,.07) !important;}
.tcdmenu > ul > li:hover > a.cat::after {content: ''; position: absolute !important; bottom: -2px !important; left: 0 !important; right: 0 !important; height: 2px !important; background: var(--green) !important;}
.tcdmenu > ul > li > .arrow { display: none !important; }
.tcdmenu > ul > li.tcdm-login > a.cat {color: var(--green) !important; border-right: none !important; border-left: 1px solid rgba(156,203,59,.2) !important; font-size: 14px !important;}
.tcdmenu > ul > li.tcdm-login:hover > a.cat {background: rgba(156,203,59,.08) !important; color: var(--green) !important;}
.tcdmenu > ul > li > a.cat > span { display: none !important; }
.tcdmenu > ul > li.tcdm-login > a.cat > span { display: inline !important; }
@media (max-width: 991px) {
 .nav-bar,
 .tcdmenu-wrapper { display: none !important; }
}

.tcdmenu > ul > li:not(.tcdm-login) > ul.subMenu {display: none !important; position: absolute !important; top: 100% !important; left: 0 !important; right: 0 !important; width: 100vw !important; background: var(--white) !important; border-top: 2px solid var(--green) !important; border-bottom: 1px solid var(--g200) !important; box-shadow: 0 8px 32px rgba(0,0,0,.14) !important; z-index: 300; padding: 24px max(var(--pad), calc((100vw - var(--wrap)) / 2 + var(--pad))) !important; list-style: none !important; columns: 5 160px !important; column-gap: 0 !important; column-rule: 1px solid var(--g100) !important;}
.tcdmenu > ul > li:not(.tcdm-login):hover > ul.subMenu { display: block !important; }
.tcdmenu > ul > li:not(.tcdm-login) > ul.subMenu:not(:has(li)) { display: none !important; }
.tcdmenu > ul > li.no-submenu > ul.subMenu { display: none !important; }
.tcdmenu > ul > li.no-submenu:hover > ul.subMenu { display: none !important; }
.tcdmenu > ul > li:not(.tcdm-login) > ul.subMenu > li {break-inside: avoid !important; display: block !important; float: none !important; width: auto !important;}
.tcdmenu > ul > li:not(.tcdm-login) > ul.subMenu > li > a,
.tcdmenu > ul > li:not(.tcdm-login) > ul.subMenu > li > a.subcat {display: block !important; padding: 7px 20px 7px 16px !important; color: var(--g500) !important; font-size: 14px !important; font-family: var(--ff-b) !important; font-weight: 400 !important; line-height: 1.3; border-bottom: 1px solid var(--g100) !important; transition: color .12s, padding-left .12s; text-decoration: none !important; text-transform: none !important; letter-spacing: 0; white-space: normal; background: transparent !important;}
.tcdmenu > ul > li:not(.tcdm-login) > ul.subMenu > li > a:hover,
.tcdmenu > ul > li:not(.tcdm-login) > ul.subMenu > li > a.subcat:hover {color: var(--dark) !important; padding-left: 24px !important; background: transparent !important;}
.tcdmenu > ul > li.tcdm-login > ul.subMenu {display: none !important; position: absolute !important; top: 100% !important; left: auto !important; right: 0 !important; width: 170px !important; margin: 0 !important; background: var(--white) !important; border: 1px solid var(--g200) !important; border-top: 2px solid var(--green) !important; box-shadow: var(--sh2) !important; z-index: 300; padding: 6px 0 !important; list-style: none !important; columns: 1 !important;}
.tcdmenu > ul > li.tcdm-login:hover > ul.subMenu { display: block !important; }
.tcdmenu > ul > li.tcdm-login > ul.subMenu > li > a,
.tcdmenu > ul > li.tcdm-login > ul.subMenu > li > a.subcat {display: block !important; padding: 9px 16px !important; color: var(--g600) !important; font-size: 14px !important; font-weight: 500 !important; border-bottom: 1px solid var(--g100) !important; transition: background .12s, color .12s; text-transform: none !important; letter-spacing: 0; white-space: nowrap;}
.tcdmenu > ul > li.tcdm-login > ul.subMenu > li > a:hover {background: var(--g100) !important; color: var(--dark) !important;}

.mob-mask {display: none; position: fixed; inset: 0; background: rgba(0,0,0,.65); z-index: 400; cursor: pointer;}
.mob-mask.is-open { display: block; }
.mob-panel {position: fixed; top: 0; left: 0; bottom: 0; width: min(300px, 85vw); background: var(--dark); z-index: 401; overflow-y: auto; overflow-x: hidden; transform: translateX(-100%); transition: transform .27s cubic-bezier(.4,0,.2,1); display: none; flex-direction: column;}
.mob-panel.is-open { transform: translateX(0); }
.mob-head {background: var(--black); padding: 14px 18px; display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid var(--green); flex-shrink: 0;}
.mob-logo { font-family: var(--ff-d); font-size: 18px; font-weight: 900; color: var(--white); text-transform: uppercase; }
.mob-logo span { color: var(--green); }
.mob-close {background: none; border: none; color: var(--g400); padding: 6px; line-height: 1; cursor: pointer; display: flex; border-radius: 4px;}
.mob-close:hover { color: var(--white); background: rgba(255,255,255,.08); }
/* Nav rows (mob-ni) */
.mob-ni {border-bottom: 1px solid rgba(255,255,255,.07);}
.mob-ni > a {display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 13px 18px !important; color: var(--g300) !important; font-family: var(--ff-d) !important; font-size: 14px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .04em; text-decoration: none !important; width: 100% !important; box-sizing: border-box !important; background: transparent; transition: color .12s, background .12s;}
.mob-ni > a:hover {color: var(--white) !important; background: rgba(255,255,255,.04) !important;}
.mob-ni > a svg {opacity: .4; transition: transform .2s; flex-shrink: 0;}
.mob-ni.exp > a svg { transform: rotate(180deg); opacity: .8; }
.mob-ni-sub,
.mob-sub {display: none; background: var(--black); border-top: 1px solid rgba(255,255,255,.06);}
.mob-ni.exp > .mob-ni-sub,
.mob-ni.exp > .mob-sub { display: block; }
.mob-ni-sub a,
.mob-sub a {display: block !important; padding: 9px 26px !important; color: var(--g500) !important; font-size: 14px !important; font-family: var(--ff-b) !important; border-bottom: 1px solid rgba(255,255,255,.04) !important; text-decoration: none !important; transition: color .12s, background .12s;}
.mob-ni-sub a:hover,
.mob-sub a:hover { color: var(--white) !important; background: rgba(255,255,255,.05) !important; }
.mob-div { height: 1px; background: var(--dark3); margin: 2px 0; }
.mob-cta {padding: 16px 18px; margin-top: auto; border-top: 1px solid var(--dark3); flex-shrink: 0;}
.mob-cta a {display: flex; align-items: center; gap: 8px; justify-content: center; background: var(--green); color: var(--black); font-family: var(--ff-d); font-size: 14px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; padding: 0 18px; height: 42px; border-radius: var(--r); text-decoration: none;}
.mob-cta a:hover { background: #b0e020; }
@media (min-width: 992px) {
 .mob-mask,
 .mob-panel { display: none !important; }
 body .mob-tog { display: none !important; }
}
@media (max-width: 991px) {
 body .mob-tog { display: flex !important; }
}

.tcd-footer,
.wbd-footer {background: #0d0f10; border-top: 3px solid var(--green); float: left; width: 100%; padding: 0; position: relative;}
.wbd-footer::before {content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 22px 22px; pointer-events: none;}
.tcd-footer > .wbd-container {max-width: var(--wrap); margin: 0 auto; padding: 56px var(--pad) 0; position: relative;}
.tcd-footer-top { display: none; }
.wbd-footer-grid {display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 48px; border-bottom: 1px solid rgba(255,255,255,.08); align-items: start;}
/* Brand column */
.wbd-fc-brand .ftr-logo { margin-bottom: 14px; }
.wbd-fc-brand .ftr-logo img {filter: brightness(0) invert(1); opacity: .9; max-width: 190px;}
.wbd-fc-desc {color: rgba(255,255,255,.45); font-size: 15px; line-height: 1.75; max-width: 240px; margin: 0 0 20px;}
.wbd-fc-sites-label {font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--green); margin-bottom: 10px;}
.wbd-fc-sites ul {list-style: none; margin: 0; padding: 0;}
.wbd-fc-sites ul li { margin-bottom: 4px; }
.wbd-fc-sites ul li a {color: rgba(255,255,255,.4); font-size: 14px; text-decoration: none; transition: color .15s;}
.wbd-fc-sites ul li a:hover { color: var(--white); }
/* Column toggle buttons (desktop: styled like plain title) */
.wbd-fc-title,
button.wbd-fc-toggle {font-family: var(--ff-d); font-size: 14px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--white); margin-bottom: 18px; padding-bottom: 11px; border-bottom: 1px solid rgba(255,255,255,.1); display: flex; align-items: center; justify-content: space-between; width: 100%; background: none; border-top: none; border-left: none; border-right: none; outline: none; cursor: default; padding-top: 0; padding-left: 0; padding-right: 0; text-align: left;}
.ftr-chevron { display: none; }
/* Link lists */
.wbd-fc-links,
.extrapages {list-style: none; margin: 0; padding: 0;}
.wbd-fc-links li { margin-bottom: 2px; }
.wbd-fc-links li a,
.extrapages li a {display: inline-flex; align-items: center; gap: 6px; color: rgba(255,255,255,.45); font-size: 15px; padding: 3px 0; transition: color .15s, padding-left .12s; text-decoration: none;}
.wbd-fc-links li a::before {content: ''; display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: var(--green); opacity: .6; flex-shrink: 0; transition: opacity .15s;}
.wbd-fc-links li a:hover,
.extrapages li a:hover {color: var(--white); padding-left: 3px;}
.wbd-fc-links li a:hover::before { opacity: 1; }
/* Contact list */
.wbd-fc-contact { list-style: none; margin: 0; padding: 0; }
.wbd-fc-contact li {display: flex; gap: 11px; align-items: flex-start; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,.05);}
.wbd-fc-contact li:last-child { border-bottom: none; }
.wbd-fc-ic { color: var(--green); flex-shrink: 0; margin-top: 3px; }
.wbd-fc-contact a {color: rgba(255,255,255,.45); font-size: 15px; line-height: 1.55; transition: color .15s; text-decoration: none;}
.wbd-fc-contact a:hover { color: var(--white); }
/* Social icons */
.wbd-soc-list {display: flex; gap: 8px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap;}
.wbd-soc-btn {width: 36px; height: 36px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: 8px; display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.5); font-size: 16px; transition: background .15s, color .15s, border-color .15s, transform .12s; float: none; text-decoration: none;}
.wbd-soc-btn:hover {background: var(--green); color: var(--black); border-color: var(--green); transform: translateY(-2px);}
/* Copyright bar */
.copyright,
.wbd-copyright {display: flex; align-items: center; justify-content: space-between; padding: 18px 0; gap: 12px; float: none;}
.copyright_txt {color: rgba(255,255,255,.28); font-size: 14px; float: none; width: auto;}
.scrollToTop {position: fixed; right: 20px; bottom: 24px; width: 40px; height: 40px; background: rgba(13,15,16,.9); color: var(--white); border: 1.5px solid rgba(255,255,255,.15); border-radius: 50%; display: none; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 4px 16px rgba(0,0,0,.4); z-index: 999; text-decoration: none; font-size: 18px; backdrop-filter: blur(6px); transition: background .15s, border-color .15s;}
.scrollToTop:hover {background: var(--green); border-color: var(--green); color: var(--black);}
.scrollToTop span { display: none; }
.scrollToTop.visible { display: flex; }
@media (max-width: 1024px) {
 .wbd-footer-grid { grid-template-columns: 1fr 1fr; gap: 32px 40px; }
}
@media (max-width: 767px) {
 .tcd-footer > .wbd-container { padding: 32px var(--pad) 0; }
 .wbd-footer-grid {
 grid-template-columns: 1fr;
 gap: 0;
 padding-bottom: 16px;
 border-bottom: none;
 }
 .wbd-fc-brand {
 text-align: center;
 padding-bottom: 24px;
 border-bottom: 1px solid rgba(255,255,255,.08);
 margin-bottom: 4px;
 }
 .wbd-fc-brand .ftr-logo { display: flex; justify-content: center; }
 .wbd-fc-brand .wbd-fc-desc { margin-left: auto; margin-right: auto; text-align: center; }
 .wbd-fc-sites { text-align: center; }
 .wbd-fc-sites-label { text-align: center; }
 .wbd-fc-sites ul { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; }
 .wbd-fc[data-ftr-col] {
 border-bottom: 1px solid rgba(255,255,255,.07);
 }
 button.wbd-fc-toggle {
 cursor: pointer;
 padding: 15px 0;
 margin-bottom: 0;
 border-bottom: none;
 }
 .ftr-chevron { display: block; flex-shrink: 0; opacity: .5; transition: transform .25s, opacity .2s; }
 button.wbd-fc-toggle[aria-expanded="true"] .ftr-chevron {
 transform: rotate(45deg);
 opacity: 1;
 }
 .wbd-fc-body {
 overflow: hidden;
 max-height: 0;
 transition: max-height .28s cubic-bezier(.4,0,.2,1);
 }
 .wbd-fc[data-ftr-col] .wbd-fc-body > * { padding-bottom: 16px; }
 .wbd-fc[data-ftr-col] .wbd-fc-body {
 text-align: center;
 }
 .wbd-fc-links li, .extrapages li { text-align: center; }
 .wbd-fc-links li a, .extrapages li a { justify-content: center; }
 .wbd-fc-links li a::before { display: none; }
 .wbd-fc-contact li { justify-content: center; }
 .wbd-fc-contact a { text-align: center; }
 .wbd-soc-list { justify-content: center; }
 .copyright,
 .wbd-copyright {
 flex-direction: column;
 align-items: center;
 text-align: center;
 gap: 10px;
 padding: 20px 0;
 }
}

#category { padding-top: 0; }
#category .container { max-width: 1400px; }
#category .page_heading {font-size: 25px; background-color: #000; padding: 8px 0 9px 8px; color: #fff; font-weight: 600;}
.subcategories { border-bottom: 1px solid #ececec; padding: 0 0 10px; }
section.subcategories_block { margin: 0 0 10px; }
.subcategories > ul { list-style: none; margin: 0; padding: 0; }
.subcategories > ul > li { float: left; padding: 2px; margin: 0; }
.subcategories > ul > li:hover { box-shadow: 0 0 5px 0 #ccc; }
.subcategories > ul > li:hover .subcat-name { background-color: #000; color: #fff; }
.subcategories > ul > li > a.subcat-name { color: #000; text-decoration: none; transition: all .25s; width: 100%; float: left; display: flex; align-items: center; justify-content: center; }
.subcategories > ul > li span.category-img { display: inline-block; position: relative; width: 100%; height: 150px; float: left; background-color: #fff; }
.subcategories > ul > li span.name { font-size: 14px; font-weight: 600; text-transform: uppercase; margin: 0; padding: 4px; line-height: 1.2; width: 100%; }
.category-products { padding: 15px 0 30px; }
.category-actions { padding: 0 0 15px; margin: 0 0 15px; border-bottom: 1px solid #ececec; }
.category-toolbar .view-as-btn { display: none; }
@media (max-width: 991px) {
 .subcategories > ul > li { width: 50% !important; float: left; max-width: 100%; }
}
.product-items { margin: 0; }
.product-items .product-item { padding: 5px; text-align: center; margin-bottom: 5px; height: auto; }
.product-item-inner {background: #fff; border: 1px solid #e0e0e0; padding: 5px; border-radius: 5px; display: inline-block; width: 100%;}
.product-items .product-item .img {min-height: 220px; position: relative; border: 1px solid #ececec; background-color: #fff; margin: 0 0 5px; border-radius: 3px;}
.product-items .product-item .img img {position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; max-height: 100%; max-width: 100%; height: auto; width: auto; transition: all .5s ease;}
.product-items .product-item .name { height: 84px; overflow: visible; line-height: 1.35; margin: 10px 0 8px; }
.product-items .product-item .name a { margin-bottom: 0; text-transform: uppercase; font-size: 13px; }
.product-items .product-item .product-id { font-size: 14px; margin: 0; float: left; width: 100%; }
.product-items .product-item .price { font-size: 20px; font-weight: bold; float: left; margin: 0; width: 100%; }
.product-items .product-item .regular-price { color: #292929; display: inline-block; }
.product-items .product-item .sale-price { color: #c20000; }
.product-items .product-item .status {font-size: 15px; font-weight: bold; color: var(--green); float: right; width: 100%; position: relative; display: block;}
.product-items .product-item .action { float: left; width: 100%; margin: 10px 0 0; }
.product-items .product-item .action .btn {background-color: #000; width: 100%; font-size: 16px; border: 1px solid #000; color: #fff; padding: 0; line-height: 35px; font-weight: 600; border-radius: 3px; box-shadow: 0 0 0 35px #383d41 inset;}
.product-items .product-item:hover .action .btn {background-color: #333; box-shadow: 0 0 0 35px #000 inset;}
.paging { float: right; }
.paging strong, .paging a:hover { color: #fff; background-color: #0f0f0f; text-decoration: none; }
@media (max-width: 480px) {
 .product-items .product-item { float: left !important; width: 50% !important; padding: 2px !important; height: auto !important; }
}

.owl-item { box-sizing: border-box !important; height: auto !important; }
.owl-item > div { width: 100% !important; height: 100% !important; box-sizing: border-box !important; display: block !important; }
.owl-carousel .product-item {float: none !important; display: flex !important; flex-direction: column; width: 100% !important; box-sizing: border-box !important; padding: 0 4px !important; margin: 0 !important; height: 100% !important;}
.owl-carousel .product-item-inner {display: flex !important; flex-direction: column; width: 100% !important; height: 100% !important; background: #fff !important; border: 1px solid #e0e0e0 !important; border-radius: 5px; padding: 8px !important;}
.owl-carousel .product-item .product-content {display: flex !important; flex-direction: column; flex: 1 !important; min-height: 0 !important;}
.owl-carousel .product-item .status {float: none !important; width: 100% !important; font-size: 14px !important; font-weight: 600 !important; color: var(--green) !important; margin: 4px 0 2px !important; line-height: 1.3;}
.owl-carousel .product-item .product-id {float: none !important; width: 100% !important; font-size: 14px !important; color: var(--g400) !important; margin: 0 0 2px !important;}
.owl-carousel .product-item .img {width: 100% !important; height: 160px !important; min-height: 0 !important; flex-shrink: 0; position: relative !important; overflow: hidden !important; background: #fff !important; border: 1px solid #ececec !important; border-radius: 3px; margin: 0 0 8px !important;}
.owl-carousel .product-item .img img {position: absolute !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; width: auto !important; max-width: 85% !important; height: auto !important; max-height: 85% !important; margin: 0 !important;}
.owl-carousel .product-item .name {flex-shrink: 0; height: 64px !important; overflow: hidden !important; margin: 0 0 6px !important;}
.owl-carousel .product-item .name a {font-size: 14px !important; line-height: 1.38; text-transform: uppercase !important; color: var(--dark) !important; display: block !important;}
.owl-carousel .product-item .price {float: none !important; width: 100% !important; font-size: 17px !important; font-weight: 700 !important; line-height: 1.2; margin: 4px 0 0 !important;}
.owl-carousel .product-item .action {float: none !important; width: 100% !important; margin-top: auto !important; padding-top: 10px !important;}
.owl-carousel .product-item .action .btn {display: block !important; width: 100% !important; font-size: 14px !important; line-height: 34px; padding: 0 !important; text-align: center;}
.tcdprod-wrap { position: relative; }
.tcdprod-wrap .owl-nav {display: flex !important; gap: 4px; justify-content: flex-end !important; position: absolute !important; top: -46px !important; right: 0 !important; margin: 0 !important;}
.tcdprod-wrap .owl-nav button {width: 34px !important; height: 34px !important; background: var(--white) !important; border: 1.5px solid var(--g200) !important; border-radius: var(--r); color: var(--dark) !important; font-size: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer; transition: border-color .15s, background .15s;}
.tcdprod-wrap .owl-nav button:hover {background: var(--dark) !important; border-color: var(--dark) !important; color: var(--white) !important;}
.tcdprod-wrap .owl-nav button svg { pointer-events: none; }
.tcdprod-wrap .owl-nav button.disabled { opacity: .35 !important; cursor: not-allowed !important; }
.tcdprod-wrap .owl-dots { display: none !important; }
.tcdprod-wrap .owl-stage-outer { overflow: hidden !important; }
/*  18. LISTING (product detail page)
------------------------------------------------------------- */
#listing .container {max-width: 1400px;}
.listing-page-content {padding: 20px 0;}
.listing-page .category-header, .listing-page .category-footer {margin: 0px;}
#listing .title-top {float: left;width: 100%;margin: 0 0 5px;}
#listing h1.page_headers {margin: 0;font-weight: 500;font-size: min(max(18px,4vw),20px);color: #333;padding: 4px 0px;border-bottom: 1px solid #000;text-transform: capitalize;}
#listing .header > h4.page_heading {margin-bottom: 10px;}
#listing .product-id strong {color: #fff;font-size:13px;}
#listing #availabilityInfo .product-id {margin: 0 0 0 5px;float: left;width: auto;font-size: 14px;font-weight: 500;color: #fff;}
#listing .quantity-wrap {float: left;width: 100%;}
#listing .quantityBlock.sub-section {display: inline-block;width: 100%; float: left;margin: 0 0 15px;border: 1px solid #ccc;}
#listing .quantityBlock.sub-section .header h4.page_heading { margin: 0;padding: 4px 0;background-color: #eee;float: left;width: 100%;}
#listing .quantityBlock .quantity-table {margin-top: 0;}
#listing .quantity-wrap .aslowas-title { font-weight: 700; margin: -15px 0 15px 2px;font-size: 17px; text-transform: uppercase;}
#listing .quantity-wrap .aslowas-title span {color: #c90000;}
#listing .quantity-wrap .table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th { padding: 5px 8px; line-height: 1.42857143; vertical-align: top; border-top: 1px solid #ddd;}
#listing .table>thead>tr>th {border-bottom: 1px solid #ddd;}
#listing .special-actions.text-center {float: left; width: 100%; border-left: 1px solid #ccc; margin: 5px 0 0; border-top: 0px solid #ccc;}
#listing .special-action {width: 25%;float: left;border-bottom: 1px solid #ccc;border-right: 1px solid #ccc;margin: 0;background-color: #fff;transition: all 0.5s ease 0s;}
#listing .special-action:hover {color: #fff;background-color: #000;}
#listing .special-action:hover .btn-link { color: #fff;}
#listing .special-action .btn-link {font-weight: 500;padding: 2px 4px;font-size: 14px;color: #222;letter-spacing: -0.2px;border-radius: 0px;text-decoration: none;width: 100%;transition: all 0.5s ease 0s;}
#listing .addToCartBlock.sub-section {background: #f6f6f6;padding: 15px 10px 10px;border: 1px solid #ccc;margin:0;position: relative;float: left;width: 100%;}
#listing .addToCartBlock.sub-section .form-group {margin-bottom: 0;}
#listing .qtybox-addcart.form-group {float: left;}
#listing .qty-input input[type="text"] {border: 1px solid #777;}
#listing .qtybox-addcart.form-group > label.qty-input-title {position: absolute;top: 0;font-size: 14px;left: 22px;text-transform: uppercase;}
#listing .qtybox-addcart.form-group label.qty-input {position: relative;width: 80px;margin: 0 10px;vertical-align: middle;}
#listing .pricingBlock {margin: 0;line-height: 1;float: right;width: 100%;text-align: left;padding: 20px 0;}
#listing .pricingBlock span {padding-left: 5px;color: var(--green);}
#listing .pricingBlock .yourprice, #listing .pricingBlock .saleprice {font-size: 22px;font-weight: 700;}
#listing .pricingBlock span#price {padding-left: 5px;color: #333;}
#listing .pricingBlock .retailprice {margin: 5px 0;font-size: 15px;}
#listing .pricingBlock .savings {font-weight: 600;font-size: 15px;}
#listing div#divOptionsBlock {margin: 0px 0px 25px;}
#listing div#divOptionsBlock .page_heading {font-size: 16px;background-color: #383d41;padding: 5px 5px;color: #fff;}
#listing .opt-label {margin: 0 0 5px;line-height: 1;}
#listing .opt-label > label {margin: 0;font-size: 14px;}
#listing #OptionsAccessories {margin: 0 0 15px;padding: 8px;border: 1px solid #ccc;}
#listing #OptionsAccessories .page_heading {margin: 0;padding: 5px;border: none;background: #505043;color: #fff;font-size: 14px;font-weight: 500;}
#listing .opt-label {margin: 0 0 4px;border-bottom: 1px solid #ccc;padding: 0 0 4px;}
#listing #divOptionsBlock .opt-regular {margin: 10px 0 0;}
#listing #divOptionsBlock .radio-format > input[type="radio"]:checked + label.radio-option {border: 2px solid #333;background: #333;color: #fff;}
#listing .checkbox-format {background-color: transparent;padding-left: 5px;padding-right: 5px;padding-top: 3px;padding-bottom: 3px;position: relative;cursor: pointer;font-weight: 600;font-size: 14px;width: 100%;margin: 0;}
#listing .checkbox-format input[type="checkbox"], .checkbox-format input[type="checkbox"] {position: relative;left: 0;top: 2px;bottom: auto;margin: auto;}
#listing #main-image {background:#fff;border: 0px solid #ccc;position: relative;overflow:hidden;}
#listing .short-description {display: none;}
.listing-page .addl-images {margin: 10px 0;}
#listing .col-md-6.tcd-stuck {position: sticky;top: 160px; bottom: 0;}
#listing .product-cols.row > .col-md-6:nth-of-type(1) {width: 48%;float:left;}
#listing .product-cols.row > .col-md-6:nth-of-type(2) {width: 52%;float:left;}
#listing .sub-section {margin: 35px 0 0;display: inline-block;width: 100%;}
#listing #availabilityInfo {float: left;width: 100%;padding: 0px 5px 0px 0px;background: #000;border: 0px solid #ccc;font-weight: 400;margin: 0px;position: relative;line-height: 23px;text-align: right;}
#listing #availabilityInfo .availability-header {font-weight: 700;font-size: 14px;color: #fff;}
#listing #availabilityInfo #availability {color: var(--green);font-size: 14px;font-weight: 600;}
#listing #product_inventory {color: var(--green);font-weight: 600;}
#listing .rTabs { margin: 15px 0; float: left;width: 100%;}
#listing .r-tabs .r-tabs-nav { border-bottom: 1px solid #ccc; margin: 0;}
#listing .r-tabs .r-tabs-nav .r-tabs-state-active { border: none; margin-bottom: -2px; box-shadow: none;}
#listing .r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor { background-color: #ffffff !important; border-top: none; border-bottom: 5px solid #333; box-shadow: none; color: #444 !important;}
#listing .r-tabs .r-tabs-nav .r-tabs-anchor { background: transparent none repeat scroll 0 0; color: #777; font-size: 14px !important; letter-spacing: -0.5px;margin-bottom: 0; padding: 5px 6px; text-transform: uppercase; font-weight:600;}
#listing .r-tabs .r-tabs-panel {border: medium none;background: #fff;}
#listing .r-tabs a:hover {color: #111 !important;}
#listing .r-tabs .r-tabs-accordion-title .r-tabs-anchor {background-color: #333;color: #fff;}
#listing .r-tabs .r-tabs-accordion-title.r-tabs-state-active .r-tabs-anchor {background-color: #000 !important;color: #fff;}
#listing .addToCartBlock.sub-section .form-group button#Add.btn-default.btn-inverse {transition: all 0.3s ease 0s;}
#listing .main-image > a img {max-height: 500px !important;}
#listing .loginReqBlock.sub-section {margin: 10px 0 20px;max-width: 440px;padding: 10px;background-color: #383d41;border: 1px solid #000;border-radius: 3px;color: #fff;}
#listing .loginReqBlock.sub-section a {color: var(--green);}
.non-current-wrap {float: left;width: 100%;margin: 15px 0;}
.non-current-inner {background-color: #e3e3e3; padding: 20px; margin: 0 0 10px;float: left;width: 100%;}
.non-current-title {color: var(--green);font-weight: 600; letter-spacing: 0.5px; font-size: 15px;}
.non-current-note {color: var(--green);font-weight: 600; letter-spacing: 0.5px; font-size: 15px;float: left;width: 100%;}
.print_btn {margin: 0 0 10px;float: left;width: auto;padding: 0 20px;background-color: var(--green);border-radius: 20px;box-shadow: 0 0 0 1px #333;}
@media(max-width:1100px) {
#listing .special-action {width: 50%;}
}
@media(max-width: 767px) {
#listing .container {padding: 0 10px;}
#listing .product-cols.row > .col-md-6:nth-of-type(1) {width: 100%;float:left;margin: 0 0 20px;}
#listing .product-cols.row > .col-md-6:nth-of-type(2) {width: 100%;float:left;}
#listing .product-cols.row > .col-md-6 {width: 100%;position: relative;top: 0;}
}
@media(max-width: 567px) {
#listing .product-id {float: left;width: 100%;}
}
@media(min-width: 640px) {
div#atcblock {top: 0;transition: top 0s linear 0s;}
div#atcblock.sticky {position: fixed !important;top: 160px;z-index: 100;width: 100%;left: 0;right: 0;text-align: center;padding: 0px 5px !important;transition: top 0.4s linear 0s;}
div#atcblock.sticky .atcblock-wrap { max-width: 991px;margin: auto;}
div#atcblock.sticky .atcblock-info {float: left;display: block !important;width: 50%;padding: 10px 0;}
div#atcblock.sticky .qtybox-addcart.form-group { float: right; margin: 0 auto; width: 50%;}
div#atcblock.sticky .atcblock-manu {display: none;}
div#atcblock.sticky .atcblock-logo {float: left;width: auto;}
div#atcblock.sticky .atcblock-logo img {max-height: 50px;border: 1px solid #ccc;}
div#atcblock.sticky .atcblock-title {float: left;padding: 0 5px;max-width: 260px;text-align: left; font-weight: 600;line-height: 1.25;font-size: 14px;}
div#atcblock.sticky .qtybox-addcart.form-group label:nth-of-type(1) { display: none;}
div#atcblock.sticky .btn.btn-addcart {padding: 4px 10px;font-size: 14px;}
div#atcblock.sticky .qtybox-addcart.form-group label.qty-input {  width: 65px;}
div#atcblock.sticky .qty-input input[type=text] {padding: 0 25px 0 5px;height: 28px; width: 65px;font-size: 15px;}
div#atcblock.sticky span.qty-nav {height: 26px; width: 22px;}
div#atcblock.sticky span.qty-nav>button {  font-size: 14px; line-height: 12px;}
div#atcblock.sticky .atcblock-price { display: block !important;float: right;width: 100%;padding: 3px 5px;font-weight: 700; font-size: 17px;}
}
@media(max-width: 991px) {
div#atcblock.sticky {top: 110px;}
}
@media (max-width:720px) {
div#atcblock.sticky { top: 115px;}
}
@media (max-width:640px) {
div#atcblock.sticky {top: 0px;}
}

.home-page-content .category-header,
.home-page-content .category-footer { padding: 0 !important; margin: 0 !important; }
.home-page-content .category-header > .container,
.home-page-content .category-footer > .container { max-width: 100% !important; padding: 0 !important; border: none !important; }
section.home-page-content,
.home-page-content.page-content,
.page-content,
section.page-content { margin-top: 0 !important; padding-top: 0 !important; }
#home > .hero:first-child,
.home-page-content > .hero:first-child { margin-top: 0 !important; }
.hero {position: relative; background: var(--dark); overflow: hidden; height: 620px; min-height: 620px; float: left; width: 100%; margin-top: 0 !important;}
@media (max-width: 767px) {
  .hero { height: 480px !important; min-height: 480px !important; }
}
@media (max-width: 480px) {
  .hero { height: 400px !important; min-height: 400px !important; }
}
.hero-bg {position: absolute; inset: 0; background: linear-gradient(110deg, rgba(10,11,13,.88) 0%, rgba(10,11,13,.55) 50%, rgba(10,11,13,.1) 100%); z-index: 1; pointer-events: none;}
.hero-bg::after {content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: var(--green);}
.homeCarousel.flexslider {position: absolute !important; inset: 0 !important; margin: 0 !important; border: none !important; border-radius: 0; box-shadow: none !important; background: transparent !important; z-index: 0; overflow: hidden !important;}
.homeCarousel.flexslider .flex-viewport { overflow: hidden !important; scrollbar-width: none !important; -ms-overflow-style: none !important; }
.homeCarousel.flexslider .flex-viewport::-webkit-scrollbar { display: none !important; }
/* FlexSlider nav arrows */
.homeCarousel.flexslider .flex-direction-nav { z-index: 6; }
.homeCarousel.flexslider .flex-direction-nav a {width: 40px; height: 40px; background: rgba(0,0,0,.45); border-radius: 50%; display: flex !important; align-items: center; justify-content: center; color: #fff; font-size: 22px; line-height: 1; text-decoration: none; position: absolute; top: 50%; transform: translateY(-50%); z-index: 6; transition: background .2s, opacity .2s; opacity: 0.35; pointer-events: auto;}
.hero:hover .homeCarousel.flexslider .flex-direction-nav a,
.homeCarousel.flexslider:hover .flex-direction-nav a,
.homeCarousel.flexslider .flex-direction-nav a:hover { opacity: 1; background: rgba(0,0,0,.7); }
.homeCarousel.flexslider .flex-direction-nav a:hover { background: rgba(0,0,0,.7); }
.homeCarousel.flexslider .flex-direction-nav .flex-prev { left: 16px; }
.homeCarousel.flexslider .flex-direction-nav .flex-next { right: 16px; }
/* FlexSlider pagination dots */
.homeCarousel.flexslider .flex-control-nav {position: absolute; bottom: 14px; left: 0; right: 0; text-align: center; z-index: 10; margin: 0; padding: 0; list-style: none;}
.homeCarousel.flexslider .flex-control-nav li { display: inline-block; margin: 0 4px; }
.homeCarousel.flexslider .flex-control-paging li a {display: block; width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.45); cursor: pointer; text-indent: -9999px;}
.homeCarousel.flexslider .flex-control-paging li a.flex-active { background: var(--green); }
.homeCarousel.flexslider .flex-viewport,
.homeCarousel.flexslider .slides,
.homeCarousel.flexslider .slides li { height: 100% !important; }
.homeCarousel.flexslider .slides li img {width: 100% !important; height: 100% !important; object-fit: cover; object-position: center top !important; display: block !important; pointer-events: none;}
.hero .btn-prim, .hero .btn-ghost-w { pointer-events: auto; }
.hero-content {position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: center; padding: 60px max(var(--pad), calc((100vw - var(--wrap)) / 2 + var(--pad))); box-sizing: border-box; pointer-events: none;}
.hero-content .hero-text-wrap { max-width: 580px; pointer-events: auto; }
.hero-text-wrap {max-width: 580px;}
.hero-eye {display: inline-flex; align-items: center; gap: 7px; background: var(--green); color: var(--black); font-family: var(--ff-d); font-size: 14px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; padding: 4px 11px; border-radius: 2px; margin-bottom: 18px; width: fit-content;}
.hero-h1 {font-family: var(--ff-d); font-size: clamp(38px, 5.5vw, 76px); font-weight: 900; color: var(--white); line-height: 1.0; text-transform: uppercase; letter-spacing: -.01em; margin-bottom: 16px;}
.hero-h1 em { font-style: normal; color: var(--green); }
.hero-p {color: rgba(255,255,255,.6); font-size: 15px; font-weight: 300; line-height: 1.65; max-width: 420px; margin-bottom: 28px;}
.hero-btns { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.btn-prim {display: inline-flex; align-items: center; gap: 7px; background: var(--green); color: var(--black); font-family: var(--ff-d); font-size: 14px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 0 24px; height: 44px; border-radius: var(--r); border: none; transition: background .15s; text-decoration: none;}
.btn-prim:hover { background: #aede4a; color: var(--black); }
.btn-ghost-w {display: inline-flex; align-items: center; gap: 7px; background: transparent; color: var(--white); font-family: var(--ff-d); font-size: 14px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 0 20px; height: 44px; border-radius: var(--r); border: 1.5px solid rgba(255,255,255,.3); transition: border-color .15s, background .15s; text-decoration: none;}
.btn-ghost-w:hover { border-color: rgba(255,255,255,.65); background: rgba(255,255,255,.05); }
.btn-grn {display: inline-flex; align-items: center; gap: 8px; background: var(--green); color: var(--black); font-family: var(--ff-d); font-size: 14px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 0 28px; height: 50px; border-radius: var(--r); border: none; transition: background .15s; white-space: nowrap; flex-shrink: 0; text-decoration: none;}
.btn-grn:hover { background: #aede4a; color: var(--black); }
.slogan-band { background: var(--green); overflow: hidden; float: left; width: 100%; }
.slogan-inner { display: flex; align-items: stretch; min-height: 52px; }
.slogan-main {display: flex; align-items: center; justify-content: center; gap: 12px; flex: 1; padding: 12px 20px; font-family: var(--ff-d); font-size: clamp(14px, 2vw, 19px); font-weight: 900; letter-spacing: .06em; text-transform: uppercase; color: var(--black); text-align: center;}
.slogan-main .dot-sep { color: rgba(0,0,0,.3); font-size: 20px; line-height: 1; }
.trust { background: var(--off); border-bottom: 1px solid var(--g200); float: left; width: 100%; }
.trust-row { display: grid; grid-template-columns: repeat(5, 1fr); min-height: 48px; }
@media (max-width: 767px) {
  .trust-row { grid-template-columns: repeat(2, 1fr) !important; overflow: hidden !important; }
  .trust-it { border-bottom: 1px solid var(--g200) !important; justify-content: flex-start !important; display: flex !important; }
  .trust-it:nth-child(even) { border-right: none !important; }
  .trust-it:last-child { grid-column: 1 / -1 !important; justify-content: center !important; border-bottom: none !important; }
}
@media (max-width: 768px) {
  .trust-row { grid-template-columns: repeat(2, 1fr) !important; }
  .trust-it { border-bottom: 1px solid var(--g200) !important; justify-content: flex-start !important; display: flex !important; }
  .trust-it:nth-child(even) { border-right: none !important; }
  .trust-it:last-child { grid-column: 1 / -1 !important; justify-content: center !important; border-bottom: none !important; }
}
.trust-it { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 12px; border-right: 1px solid var(--g200); font-size: 14px; font-weight: 600; color: var(--g600); text-align: center; }
.trust-it:last-child { border-right: none; }
.trust-it svg { color: var(--green); flex-shrink: 0; }
.stats-sec { background: var(--dark); padding: 48px 0; float: left; width: 100%; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--dark3); border: 1px solid var(--dark3); border-radius: var(--r2); overflow: hidden; }
.stat { background: var(--dark2); padding: 26px 20px; text-align: center; transition: background .2s; }
.stat:hover { background: var(--dark3); }
.stat-n { font-family: var(--ff-d); font-size: 44px; font-weight: 900; color: var(--white); line-height: 1; letter-spacing: -.02em; }
.stat-n sup { font-size: 22px; color: var(--green); }
.stat-l { color: var(--g400); font-size: 14px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; margin-top: 6px; }
.stat-s { color: var(--g500); font-size: 14px; margin-top: 3px; }
.sec { padding: 56px 0 !important; display: flow-root; width: 100%; }
.sec-off { background: var(--off); border-top: 1px solid var(--g200); clear: both; }
.sec-dark { background: var(--dark); padding-top: 56px !important; }
.sec-hd { display: flex !important; align-items: flex-end; justify-content: space-between; margin-bottom: 28px; gap: 12px; width: 100% !important; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important; float: none !important; flex-shrink: 0 !important; }
.wrap > .sec-hd { width: 100% !important; }
.sec-eye { font-family: var(--ff-d); font-size: 15px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--green); margin-bottom: 5px; display: flex; align-items: center; gap: 7px; }
.sec-eye::before { content: ''; width: 16px; height: 2px; background: var(--green); border-radius: 1px; }
.sec-ttl { font-family: var(--ff-d); font-size: clamp(24px, 3.5vw, 38px); font-weight: 900; line-height: 1; text-transform: uppercase; letter-spacing: -.01em; color: var(--dark); background: none !important; border: none !important; height: auto !important; padding: 0 !important; float: none !important; }
.sec-ttl.lt { color: var(--white); }
.va-link { display: inline-flex; align-items: center; gap: 5px; font-family: var(--ff-d); font-size: 14px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--g400); border-bottom: 1px solid transparent; transition: color .15s, border-color .15s; padding-bottom: 2px; white-space: nowrap; text-decoration: none; }
.va-link:hover { color: var(--dark); border-color: var(--g300); }
.cat-grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: auto auto; gap: 12px; }
.cat-tile { position: relative; border-radius: var(--r2); overflow: hidden; display: block; cursor: pointer; background: var(--dark2); text-decoration: none; }
.cat-tile:not(.wide) { padding-top: 56%; }
.cat-tile.wide { grid-column: span 2; height: 280px; }
.cat-bg { position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform .4s ease; }
.cat-tile:hover .cat-bg { transform: scale(1.05); }
.cat-ov { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,11,13,.82) 0%, rgba(10,11,13,.18) 55%, transparent 100%); }
.cat-body { position: absolute; bottom: 0; left: 0; right: 0; padding: 14px 16px; }
.cat-name { font-family: var(--ff-d); font-size: 18px; font-weight: 900; color: var(--white); text-transform: uppercase; line-height: 1; }
.cat-sub { font-size: 14px; color: rgba(255,255,255,.5); margin-top: 3px; }
.cat-cta { display: inline-flex; align-items: center; gap: 4px; font-family: var(--ff-d); font-size: 14px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--green); margin-top: 8px; opacity: 0; transform: translateY(5px); transition: opacity .2s, transform .2s; }
.cat-tile:hover .cat-cta { opacity: 1; transform: translateY(0); }
/* Brand logo marquee */
.partners { padding: 40px 0; background: var(--white); border-top: 1px solid var(--g200); border-bottom: 1px solid var(--g200); float: left; width: 100%; overflow: hidden; }
.p-lbl { text-align: center; font-family: var(--ff-d); font-size: 14px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--g400); margin-bottom: 20px; }
.p-track-wrap { display: flex; overflow: hidden; width: 100%; position: relative; }
.p-track-wrap::before,.p-track-wrap::after{content:'';position:absolute;top:0;bottom:0;width:80px;z-index:2;pointer-events:none;}
.p-track-wrap::before{left:0;background:linear-gradient(to right,var(--white),transparent);}
.p-track-wrap::after{right:0;background:linear-gradient(to left,var(--white),transparent);}
.p-track { display: flex; align-items: center; animation: brandScroll 70s linear infinite; flex-shrink: 0; }
@keyframes brandScroll{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}
.p-logo { display: flex; align-items: center; justify-content: center; padding: 8px 28px; border-right: 1px solid var(--g200); flex-shrink: 0; }
.p-logo img { height: 40px; width: auto; max-width: 120px; object-fit: contain; filter: grayscale(1) opacity(.55); transition: filter .25s; display: block; }
.p-logo:hover img { filter: grayscale(0) opacity(1); }
.p-view-all { text-align: center; margin-top: 20px; }
.p-view-link { font-size: 14px; font-weight: 600; color: var(--g400); text-decoration: none; display: inline-flex; align-items: center; gap: 5px; transition: color .15s; }
.p-view-link:hover { color: var(--green); }
.val-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--dark3); border: 1px solid var(--dark3); border-radius: var(--r2); overflow: hidden; margin-top: 36px; }
.val-it { background: var(--dark2); padding: 32px 28px; transition: background .2s; }
.val-it:hover { background: var(--dark3); }
.val-ic { width: 38px; height: 38px; background: rgba(156,203,59,.1); border-radius: var(--r); display: flex; align-items: center; justify-content: center; color: var(--green); margin-bottom: 14px; }
.val-ttl { font-family: var(--ff-d); font-size: 18px; font-weight: 800; text-transform: uppercase; color: var(--white); margin-bottom: 8px; }
.val-p { color: var(--g400); font-size: 16px; line-height: 1.65; }

/* ---- Distribution Centers ---- */
.dist-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 52px; align-items: start; padding: 0; }
.dist-map { position: relative; background: var(--white); border: 1.5px solid var(--g200); border-radius: var(--r2); min-height: 200px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 20px; }
.dist-map-img { width: 100%; max-width: 500px; display: block; opacity: .85; }
.dist-map-lbl { display: flex; align-items: center; gap: 8px; margin-top: 12px; color: var(--g400); font-size: 15px; }
.dist-locs { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 24px; }
.dist-loc { background: var(--white); border: 1.5px solid var(--g200); border-top: 3px solid var(--green); border-radius: var(--r2); padding: 20px 18px; }
.dloc-city { font-family: var(--ff-d); font-size: 19px; font-weight: 800; color: var(--dark); text-transform: uppercase; }
.dloc-type { font-size: 15px; color: var(--green); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-top: 4px; }
.dloc-addr { font-size: 15px; color: var(--g400); margin-top: 8px; line-height: 1.6; }
.dist-desc { color: var(--g500); font-size: 16px; line-height: 1.7; margin-bottom: 24px; }

/* ---- Hero slide tag ---- */
.slide-tag { position: absolute; right: 0; bottom: 80px; z-index: 9; transform: translateX(100%); transition: transform .4s cubic-bezier(.22,1,.36,1); }
.slide-tag.visible { transform: translateX(0); }
@media (max-width: 767px) { .slide-tag { display: none !important; } }
.slide-tag-a { display: flex; align-items: center; gap: 8px; background: rgba(10,11,13,.82); backdrop-filter: blur(8px); border-left: 3px solid var(--green); color: var(--white); font-family: var(--ff-d); font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; padding: 10px 14px 10px 12px; text-decoration: none; white-space: nowrap; border-radius: 2px 0 0 2px; transition: background .15s; }
.slide-tag-a:hover { background: rgba(10,11,13,.95); color: var(--white); }
.slide-tag-dot { width: 6px; height: 6px; background: var(--green); border-radius: 50%; flex-shrink: 0; }
.tweel-vid-sec { float: left; width: 100%; position: relative; background: var(--off); }
.tweel-vid-wrap { position: relative; width: 100%; max-width: none; height: clamp(420px, 56vw, 680px); overflow: hidden; background: var(--dark); }
.tweel-vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
.tweel-vid-ov { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.55) 45%, rgba(0,0,0,.15) 100%); z-index: 1; }
.tweel-vid-content { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; width: 100%; max-width: var(--wrap); margin: 0 auto; left: 50%; transform: translateX(-50%); padding: 60px var(--pad); box-sizing: border-box; }
.tweel-vid-content .wrap { display: flex; justify-content: flex-start; }
.tweel-vid-inner { max-width: 540px; text-align: left; }
.tweel-vid-badge { display: inline-flex; align-items: center; gap: 7px; font-family: var(--ff-d); font-size: 12px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; }
.tweel-vid-badge::before { content: ''; width: 20px; height: 2px; background: var(--green); border-radius: 1px; }
.tweel-vid-ttl { font-family: var(--ff-d); font-size: clamp(52px, 7vw, 96px); font-weight: 900; text-transform: uppercase; line-height: .88; color: var(--white); letter-spacing: -.02em; margin-bottom: 20px; }
.tweel-vid-ttl em { color: var(--green); font-style: normal; display: block; }
.tweel-vid-sub { color: rgba(255,255,255,.75); font-size: 17px; line-height: 1.65; max-width: 420px; margin-bottom: 28px; }
.tweel-vid-btns { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
@media (max-width: 768px) {
  .tweel-vid-wrap { height: clamp(480px, 90vw, 580px); }
  .tweel-vid-ov { background: linear-gradient(180deg, rgba(0,0,0,.2) 0%, rgba(0,0,0,.75) 50%, rgba(0,0,0,.88) 100%); }
  .tweel-vid-content { align-items: flex-end; padding-bottom: 40px; }
  .tweel-vid-inner { max-width: 100%; }
  .tweel-vid-ttl { font-size: clamp(44px, 11vw, 64px); }
  .tweel-vid-sub { font-size: 15px; max-width: 100%; }
}
@media (max-width: 480px) {
  .tweel-vid-wrap { height: 520px; }
  .tweel-vid-btns { flex-direction: column; align-items: flex-start; gap: 10px; }
  .tweel-vid-btns .btn-grn, .tweel-vid-btns .btn-ghost-w { width: 100%; justify-content: center; }
}
/* -- HOW IT WORKS --------------------------------------------- */
.hiw-hd { text-align: center; margin-bottom: 52px; }

/* Section dark upgrade   class added by JS */
/* -- AUTH VISIBILITY ------------------------------------------ */
.guest-only { display: block; }
body.logged-in .guest-only { display: none !important; }
.logged-in-only { display: none; }
body.logged-in .logged-in-only { display: block; }
body.logged-in .dlr-btn .dlr-txt { font-size: 0; }
body.logged-in .dlr-btn .dlr-txt::after { content: 'My Account'; font-size: 14px; }
body.logged-in .sec-dark { display: none !important; }
body.logged-in .hiw-sec-wrap { display: none !important; }
body.logged-in .stats-sec { display: none !important; }

/* -- DEALER PROMO BAND ---------------------------------------- */
.dealer-promo-band { background: var(--dark); border-top: 2px solid var(--green); padding: 56px 0; float: left; width: 100%; position: relative; overflow: hidden; }
.dealer-promo-band::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(156,203,59,.07) 1px, transparent 1px); background-size: 24px 24px; pointer-events: none; }
.dpromo-header { text-align: center; margin-bottom: 36px; }
.dpromo-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-family: var(--ff-d); font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--green); margin-bottom: 10px; }
.dpromo-dot { width: 28px; height: 2px; background: var(--green); border-radius: 2px; }
.dpromo-title { font-family: var(--ff-d); font-size: clamp(28px, 4vw, 42px); font-weight: 900; color: var(--white); text-transform: uppercase; letter-spacing: .04em; margin: 0; }
.dpromo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 24px; position: relative; z-index: 1; }
.dpromo-card { background: var(--dark2); border: 1px solid rgba(255,255,255,.07); border-radius: var(--r2); padding: 28px 24px; position: relative; overflow: hidden; transition: border-color .25s, box-shadow .25s; }
.dpromo-card:hover { border-color: rgba(156,203,59,.4); box-shadow: 0 0 32px rgba(156,203,59,.08); }
.dpromo-card::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, var(--green), rgba(156,203,59,.3)); }
.dpromo-badge { display: inline-block; background: var(--green); color: var(--black); font-family: var(--ff-d); font-size: 15px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; padding: 4px 12px; border-radius: 4px; margin-bottom: 14px; }
.dpromo-brand { font-family: var(--ff-d); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--g400); margin-bottom: 6px; }
.dpromo-name { font-family: var(--ff-d); font-size: 20px; font-weight: 800; color: var(--white); text-transform: uppercase; letter-spacing: .03em; line-height: 1.2; margin-bottom: 10px; }
.dpromo-desc { font-size: 14px; color: var(--g400); line-height: 1.5; margin: 0; }
.dpromo-disclaimer { display: flex; align-items: center; gap: 7px; justify-content: center; font-size: 13px; color: var(--g500); text-align: center; position: relative; z-index: 1; }
.dpromo-disclaimer svg { flex-shrink: 0; color: var(--g400); }
@media (max-width: 768px) {
  .dpromo-grid { grid-template-columns: 1fr; }
  .dealer-promo-band { padding: 40px 0; }
}
@media (min-width: 769px) and (max-width: 991px) {
  .dpromo-grid { grid-template-columns: 1fr; gap: 12px; }
}

.hiw-sec-wrap { background: var(--dark) !important; position: relative; overflow: hidden; }
.hiw-sec-wrap .sec-eye { color: var(--green) !important; }
.hiw-sec-wrap .sec-ttl { color: var(--white) !important; }
.hiw-sec-wrap::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(156,203,59,.12) 1px, transparent 1px); background-size: 28px 28px; pointer-events: none; animation: hiwGridDrift 20s linear infinite; }
@keyframes hiwGridDrift { 0% { background-position: 0 0; } 100% { background-position: 28px 28px; } }

/* Mouse-tracking orb   injected by JS */
.hiw-orb { position: absolute; border-radius: 50%; background: radial-gradient(circle, rgba(156,203,59,.18) 0%, transparent 70%); pointer-events: none; width: 300px; height: 300px; transform: translate(-50%,-50%); opacity: 0; transition: opacity .6s; }

/* Desktop grid   cards stretch to equal height */
.hiw-steps { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; grid-template-rows: 1fr; gap: 0; align-items: stretch; margin-top: 36px; position: relative; }

/* Desktop connector */
.hiw-arr { display: flex; flex-direction: row; align-items: center; justify-content: center; align-self: stretch; width: 80px; padding: 0; position: relative; overflow: visible; }
.hiw-arr::before { content: ''; position: absolute; left: 0; top: 50%; height: 1px; width: 0; background: linear-gradient(90deg, var(--green), rgba(156,203,59,.2)); transition: width 1s cubic-bezier(.22,1,.36,1); box-shadow: 0 0 8px rgba(156,203,59,.6); }
.hiw-arr::after { content: ''; position: absolute; right: -1px; top: 50%; transform: translateY(-50%); width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 9px solid var(--green); opacity: 0; transition: opacity .15s .9s; filter: drop-shadow(0 0 4px var(--green)); }
.hiw-arr.hiw-line-in::before { width: 80px; }
.hiw-arr.hiw-line-in::after  { opacity: 1; }

/* Step card */
.hiw-step { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 40px 28px 36px; background: var(--dark2); border: 1px solid rgba(255,255,255,.07); border-radius: 16px; position: relative; overflow: hidden; height: 100%; box-sizing: border-box; opacity: 0; transform: translateY(40px) scale(.96); transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1), border-color .3s, box-shadow .3s; }
.hiw-step.hiw-step-in { opacity: 1; transform: translateY(0) scale(1); }
.hiw-step:hover { border-color: rgba(156,203,59,.35); box-shadow: 0 0 40px rgba(156,203,59,.08), 0 20px 40px rgba(0,0,0,.3); transform: translateY(-6px) scale(1.01); }

/* Top accent bar */
.hiw-step::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, var(--green), rgba(156,203,59,.3)); transform: scaleX(0); transform-origin: left; transition: transform .8s cubic-bezier(.22,1,.36,1) .4s; box-shadow: 0 0 12px rgba(156,203,59,.7); }
.hiw-step.hiw-step-in::after { transform: scaleX(1); }

/* Ghost watermark number   injected by JS */
.hiw-step-ghost { position: absolute; bottom: -16px; right: 4px; font-family: var(--ff-d); font-size: 120px; font-weight: 900; line-height: 1; color: rgba(255,255,255,.03); pointer-events: none; user-select: none; transition: color .4s; }
.hiw-step.hiw-step-in .hiw-step-ghost { color: rgba(156,203,59,.06); }
.hiw-step:hover .hiw-step-ghost { color: rgba(156,203,59,.1); }

/* Shimmer sweep   injected by JS */
.hiw-step-shimmer { position: absolute; inset: 0; background: linear-gradient(105deg, transparent 40%, rgba(156,203,59,.06) 50%, transparent 60%); background-size: 200% 100%; background-position: 200% 0; pointer-events: none; transition: background-position 0s; }
.hiw-step:hover .hiw-step-shimmer { background-position: -200% 0; transition: background-position .7s ease; }

/* Number circle */
.hiw-num { width: 64px; height: 64px; border-radius: 50%; background: rgba(156,203,59,.1); color: var(--green); font-family: var(--ff-d); font-size: 26px; font-weight: 900; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; flex-shrink: 0; position: relative; z-index: 1; border: 1.5px solid rgba(156,203,59,.3); transition: background .3s, box-shadow .3s, transform .3s; }
.hiw-num-ring { position: absolute; inset: -8px; border-radius: 50%; border: 1.5px dashed rgba(156,203,59,.25); animation: hiwSpin 12s linear infinite; }
@keyframes hiwSpin { to { transform: rotate(360deg); } }
@keyframes hiwBurst { 0% { box-shadow: 0 0 0 0 rgba(156,203,59,.6); } 50% { box-shadow: 0 0 0 20px rgba(156,203,59,0); } 100% { box-shadow: 0 0 0 0 rgba(156,203,59,0); } }
.hiw-step.hiw-step-in .hiw-num { animation: hiwBurst .9s cubic-bezier(.22,1,.36,1) .5s both; }
.hiw-step:hover .hiw-num { background: rgba(156,203,59,.2); box-shadow: 0 0 24px rgba(156,203,59,.25); transform: scale(1.08); }

/* Text */
.hiw-step-ttl { font-family: var(--ff-d); font-size: 21px; font-weight: 900; text-transform: uppercase; letter-spacing: .06em; color: var(--white); margin-bottom: 10px; position: relative; z-index: 1; }
.hiw-step-p { font-size: 14px; color: rgba(255,255,255,.45); line-height: 1.75; max-width: 200px; position: relative; z-index: 1; }

/* Mobile */
@media (max-width: 767px) {
  .hiw-steps { grid-template-columns: 1fr; grid-template-rows: auto; gap: 0; align-items: center; }
  .hiw-step { height: auto; padding: 32px 24px 28px; }
  .hiw-step:hover { transform: none; box-shadow: none; }
  .hiw-arr { width: 100%; height: 48px; flex-direction: column; align-items: center; justify-content: center; }
  .hiw-arr::before { left: 50%; top: 0; transform: translateX(-50%); width: 1px; height: 0; background: linear-gradient(180deg, var(--green), rgba(156,203,59,.2)); transition: height 1s cubic-bezier(.22,1,.36,1); box-shadow: 0 0 8px rgba(156,203,59,.6); }
  .hiw-arr::after { right: auto; left: 50%; top: auto; bottom: 0; transform: translateX(-50%); border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 8px solid var(--green); border-bottom: none; transition: opacity .15s .9s; filter: drop-shadow(0 0 4px var(--green)); }
  .hiw-arr.hiw-line-in::before { width: 1px; height: 48px; }
  .hiw-arr.hiw-line-in::after  { opacity: 1; }
}
.cta-band { background: var(--dark); background-image: url('/assets/images/DEALER-BG.webp'); background-size: cover; background-position: center; background-repeat: no-repeat; padding: 64px 0; border-top: 2px solid var(--green); position: relative; overflow: hidden; float: left; width: 100%; }
.cta-band::after { content: ''; position: absolute; inset: 0; background: rgba(10,11,13,.82); z-index: 0; }
.cta-band::before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; width: 40%; border-left: 1px solid rgba(255,255,255,.06); transform: skewX(-10deg) translateX(50px); z-index: 1; }
.cta-inner { display: flex; align-items: center; justify-content: center; gap: 64px; position: relative; z-index: 2; }
.cta-ttl { font-family: var(--ff-d); font-size: clamp(30px, 4.5vw, 52px); font-weight: 900; text-transform: uppercase; line-height: .97; color: var(--white); letter-spacing: -.01em; }
.cta-sub { color: var(--g500); font-size: 16px; margin-top: 14px; max-width: 400px; line-height: 1.65; }

/* ---- Home page breakpoints ---- */
@media (max-width: 900px) {
  .trust-row { grid-template-columns: repeat(3, 1fr); }
  .trust-it:nth-child(n+4) { display: none; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .cat-tile.wide { height: 220px; }
  .dist-inner { gap: 36px; }
}
@media (max-width: 768px) {
  .hero-content { position: absolute; inset: 0; height: auto; min-height: 0; padding: 24px var(--pad); justify-content: flex-end; }
  .hero-content .hero-text-wrap { max-width: 100%; }
  .hero-h1 { font-size: clamp(36px, 9vw, 52px); }
  .cat-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .cat-tile.wide { grid-column: span 2; height: 200px; }
  .cat-tile:not(.wide) { padding-top: 60%; }
  .val-grid { grid-template-columns: 1fr; }
  .val-it { padding: 24px 20px; }
  .dist-inner { grid-template-columns: 1fr; gap: 28px; }
  .dist-locs { grid-template-columns: 1fr 1fr; gap: 12px; }
  .dist-map { padding: 16px; min-height: auto; }
  .dist-map-img { max-width: 100%; }
  .cta-inner { flex-direction: column; align-items: center; text-align: center; gap: 28px; }
  .cta-sub { max-width: 100%; }
  .cta-band { padding: 48px 0; }
  .slogan-main { font-size: 14px; gap: 8px; }
}

/* -- TABLET 768 991px: content grid adjustments --------------- */
@media (min-width: 768px) and (max-width: 991px) {
  /* TOPBAR   show company name + phone, hide badge/links */
  .tb-left { display: flex !important; font-size: 13px !important; max-width: calc(100% - 120px) !important; }
  .tb-phone { display: flex !important; }
  .tb-badge { display: none !important; }
  .tb-links { display: none !important; }
  .topbar .wrap { justify-content: space-between !important; }

  /* SLOGAN   wrap items, hide separators */
  .slogan-main { flex-wrap: wrap !important; justify-content: center !important; gap: 4px 14px !important; font-size: 13px !important; padding: 8px 16px !important; min-height: 0 !important; }
  .slogan-main .dot-sep { display: none !important; }
  .slogan-band { height: auto !important; }

  /* STATS */
  .stats-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* CATS */
  .cat-grid { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  .cat-tile.wide { grid-column: span 2 !important; height: 220px !important; }

  /* VALUES */
  .val-grid { grid-template-columns: 1fr !important; }
  .val-it { padding: 24px 20px !important; }

  /* DISTRIBUTION   stack, center map */
  .dist-inner { grid-template-columns: 1fr !important; gap: 28px !important; justify-items: center !important; }
  .dist-map { padding: 16px !important; min-height: auto !important; width: 100% !important; max-width: 560px !important; box-sizing: border-box !important; }
  .dist-map-img { max-width: 100% !important; }
  .dist-locs { grid-template-columns: 1fr 1fr !important; gap: 12px !important; width: 100% !important; max-width: 560px !important; }
  .dist-text { max-width: 560px !important; width: 100% !important; }

  /* HIW STEPS */
  .hiw-steps { grid-template-columns: 1fr !important; grid-template-rows: auto !important; gap: 16px !important; align-items: stretch !important; }
  .hiw-arr { display: none !important; }
  .hiw-step { height: auto !important; }

  /* TRUST */
  .trust-row { grid-template-columns: repeat(3, 1fr) !important; }
  .trust-it:nth-child(n+4) { display: none !important; }

  /* FOOTER */
  .wbd-footer-grid { grid-template-columns: 1fr 1fr !important; gap: 32px 40px !important; }

  /* HERO */
  .hero-h1 { font-size: clamp(36px, 7vw, 56px) !important; }

  /* SBM DROPDOWNS   stack */
  .sbm-bar { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; }
  .sbm-field { width: 100% !important; }
  .sbm-select { width: 100% !important; }
  .sbm-go { width: 100% !important; }

  /* CTA */
  .cta-inner { flex-direction: column !important; align-items: center !important; text-align: center !important; gap: 28px !important; }
  .cta-sub { max-width: 100% !important; }

  /* DEALER STRIP */
  .dealer-strip-inner { flex-direction: column !important; align-items: center !important; text-align: center !important; gap: 20px !important; }
  .dealer-strip-left { flex-direction: column !important; align-items: center !important; text-align: center !important; gap: 8px !important; }
  .dealer-strip-right { flex-direction: column !important; align-items: center !important; gap: 14px !important; width: 100% !important; }
  .dealer-strip-btn { justify-content: center !important; width: 100% !important; max-width: 260px !important; }
}
@media (max-width: 600px) {
  .dist-inner { gap: 20px; }
  .dist-locs { grid-template-columns: 1fr 1fr; gap: 10px; }
  .dist-loc { padding: 14px 12px; }
  .dloc-city { font-size: 16px; }
  .dloc-type { font-size: 14px; }
  .dloc-addr { font-size: 14px; }
}
@media (max-width: 480px) {
  .trust-row { grid-template-columns: 1fr 1fr; }
  .trust-it:nth-child(n+3) { display: none; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .stat-n { font-size: 34px; }
  .cat-grid { grid-template-columns: 1fr; gap: 8px; }
  .cat-tile.wide { grid-column: 1 / -1; height: 200px; width: 100%; }
  .cat-tile:not(.wide) { padding-top: 55%; }
  .p-row { flex-wrap: wrap; }
  .p-item { font-size: 14px; padding: 6px 12px; border-bottom: 1px solid var(--g200); }
  .p-item:nth-child(2n) { border-right: none; }
  .dist-locs { grid-template-columns: 1fr; }
  .dist-loc { padding: 16px 14px; }
  .cta-band { padding: 40px 0; }
}
/* MYACCOUNT: hide register, center login */
.content-area.col-lg-12 > .col-lg-6:first-of-type {display: none !important;}
.content-area.col-lg-12 > .col-lg-6:last-of-type {width: 100% !important; max-width: 480px !important; margin: 40px auto !important; float: none !important;}

/* ACCOUNT PAGE: top nav buttons */
.account-btns {display: flex; gap: 10px; flex-wrap: wrap; margin: 0 0 24px; padding-top: 15px;}
.account-btn-block a {display: inline-flex; align-items: center; height: 38px; padding: 0 18px; background: var(--dark); color: var(--white) !important; font-family: var(--ff-d); font-size: 14px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; border-radius: var(--r); text-decoration: none !important; transition: background .15s;}
.account-btn-block a:hover {background: var(--green); color: var(--black) !important;}
/* BTN OVERRIDES */
.btn-primary,
.btn.btn-primary,
button.btn-primary,
input.btn-primary {
  background-color: var(--dark) !important;
  border-color: var(--dark) !important;
  color: var(--white) !important;
  font-family: var(--ff-d) !important;
  font-weight: 700 !important;
  letter-spacing: .05em;
  transition: background .15s, border-color .15s !important;
}
.btn-primary:hover,
.btn.btn-primary:hover,
button.btn-primary:hover,
input.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: var(--green) !important;
  border-color: var(--green) !important;
  color: var(--black) !important;
}

.btn-default,
.btn.btn-default,
button.btn-default {
  background-color: var(--dark) !important;
  border-color: var(--dark) !important;
  color: var(--white) !important;
  font-family: var(--ff-d) !important;
  font-weight: 700 !important;
  transition: background .15s, border-color .15s !important;
}
.btn-default:hover,
.btn.btn-default:hover {
  background-color: var(--green) !important;
  border-color: var(--green) !important;
  color: var(--white) !important;
}
/* Modal close/cancel buttons stay light */
.modal .btn-default, .modal-footer .btn-default {
  background-color: var(--white) !important;
  border-color: var(--g300) !important;
  color: var(--dark) !important;
}
.modal .btn-default:hover { background-color: var(--g100) !important; }

.checkout-1 .btn-primary {
  background-color: var(--green) !important;
  border-color: var(--green) !important;
  color: var(--black) !important;
}
.modal-dialog { top: 15%; }
.modal-content { border: 2px solid #ccc; }
button.close { float: right; font-size: 30px; opacity: .5; }
.quickview { display: none; }
#viewCartQuick { padding: 20px 10px; float: left; width: 100%; }
.checkout-1 .has-labelholder.floating .form-control { padding-left: 16px !important; }
.checkout-1 .page_heading { margin: 0 0 5px; font-weight: 600; text-transform: uppercase; padding: 6px 0 6px 8px; border-bottom: 2px solid var(--green); color: #fff !important; font-size: 14px; background-color: #292929; border-radius: 3px 3px 0 0; }
.checkout-1 #mobile-menu { display: none; }
.checkout-1 .site-footer { display: none; }
.checkout-1 #spanCheckout .btn-primary { color: #000; background-color: var(--green); border-color: #333; width: 100%; font-size: 25px; font-weight: 800; }
@media (max-width: 991px) {
  .tb-links { display: none; }
}
@media (max-width: 767px) {
  .tb-left { display: none; }
}
@media (max-width: 480px) {
 .copyright_txt { float: left; width: 100%; padding: 10px 0 5px; }
 .copyright_cc { width: 100%; padding: 4px 0; }
}
@media print {
 .site-hdr, .nav-bar, .mob-panel, .mob-mask, .scrollToTop { display: none !important; }
}
/* Dealer Locator Strip */
.dealer-strip { background: var(--black); border-top: 1px solid var(--dark3); border-bottom: 1px solid var(--dark3); padding: 32px 0; float: left; width: 100%; }
.dealer-strip-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.dealer-strip-left { display: flex; align-items: center; gap: 14px; color: var(--green); }
.dealer-strip-left svg { flex-shrink: 0; }
.dealer-strip-label { font-size: 15px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--green); margin-bottom: 4px; }
.dealer-strip-title { font-family: var(--ff-d); font-size: 22px; font-weight: 800; text-transform: uppercase; color: var(--white); letter-spacing: .02em; }
.dealer-strip-right { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.dealer-strip-stat { color: var(--g500); font-size: 15px; }
.dealer-strip-stat strong { font-family: var(--ff-d); font-size: 24px; font-weight: 900; color: var(--white); margin-right: 4px; }
.dealer-strip-btn { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
@media (max-width: 860px) {
  .dealer-strip-inner { flex-direction: column; align-items: center; text-align: center; gap: 20px; }
  .dealer-strip-left { flex-direction: column; align-items: center; text-align: center; gap: 8px; }
  .dealer-strip-right { flex-direction: column; align-items: center; gap: 14px; width: 100%; }
  .dealer-strip-stat { display: flex; justify-content: center; align-items: center; gap: 4px; }
  .dealer-strip-btn { justify-content: center; width: 100%; max-width: 260px; }
}
@media (max-width: 480px) {
  .dealer-strip { padding: 32px 0; }
  .dealer-strip-title { font-size: 18px; }
  .dealer-strip-stat strong { font-size: 20px; }
}
/* =====================================================
   DEALERSHIP SUCCESS TEAM (DST)   myaccount.html
   3-column: Sales Rep | Inside Service | Freight+Promo
   ===================================================== */

.dealer-success-team {
    float: left;
    width: 100%;
    margin: 0 0 20px 0;
    border: 2px solid var(--green, #9ccb3b);
    border-radius: 4px;
    overflow: hidden;
    font-family: 'Barlow Condensed', sans-serif;
}

/* Header bar */
.dst-header {
    background: #13161b;
    color: #fff;
    padding: 10px 16px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.dst-header i {
    color: var(--green, #9ccb3b);
    margin-right: 6px;
}

/* Body   3 equal columns */
.dst-body {
    display: flex;
    flex-wrap: wrap;
    background: #1c2029;
}

.dst-rep {
    flex: 1 1 0;
    min-width: 200px;
    padding: 16px 18px;
    border-right: 1px solid rgba(255,255,255,0.07);
    box-sizing: border-box;
}
.dst-rep:last-child {
    border-right: none;
}

/* Role label */
.dst-role {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #888;
    margin-bottom: 10px;
}

/* Photo + name row */
.dst-photo-name {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.dst-photo {
    width: 91px;
    height: 91px;
    border-radius: 50%;
    object-fit: cover;
    object-position: top;
    border: 2px solid var(--green, #9ccb3b);
    flex-shrink: 0;
}
.dst-photo-placeholder {
    width: 91px;
    height: 91px;
    border-radius: 50%;
    background: #2a2f3a;
    border: 2px solid #444;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #666;
    font-size: 34px;
    flex-shrink: 0;
}
.dst-name-contact {
    flex: 1;
}
.dst-name {
    font-size: 17px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 6px;
    line-height: 1.1;
}
.dst-contact {
    font-size: 13px;
    color: #aaa;
    line-height: 1.7;
}
.dst-contact i {
    color: var(--green, #9ccb3b);
    margin-right: 5px;
    font-size: 12px;
}
.dst-contact a {
    color: #aaa;
    text-decoration: none;
}
.dst-contact a:hover {
    color: var(--green, #9ccb3b);
}

/* -- Freight zone column -- */
.dst-freight {
    background: #181c23;
}

.dst-freight-zone {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}
.dst-freight-badge {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #fff;
    padding: 5px 11px;
    border-radius: 3px;
    white-space: nowrap;
    flex-shrink: 0;
}
.dst-freight-info {
    line-height: 1.4;
}
.dst-freight-rate {
    font-size: 15px;
    font-weight: 600;
    color: #aaa;
}
.dst-freight-threshold {
    display: inline-block;
    font-size: 14px;
    font-weight: 800;
    color: var(--green, #9ccb3b);
    margin-bottom: 4px;
    letter-spacing: 0.02em;
}

/* -- Promo callout -- */
.dst-promo {
    border-top: 1px solid rgba(255,255,255,0.07);
    padding-top: 12px;
    margin-top: 4px;
}
.dst-promo-label {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--green, #9ccb3b);
    margin-bottom: 3px;
}
.dst-promo-title {
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    line-height: 1.2;
}
.dst-promo-detail {
    font-size: 12px;
    color: #888;
    margin-top: 2px;
}
.dst-promo-link {
    display: inline-block;
    margin-top: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--green, #9ccb3b);
    text-decoration: none;
}
.dst-promo-link:hover {
    color: #fff;
}

/* -- Responsive -- */
@media (max-width: 768px) {
    .dst-rep {
        flex: 1 1 100%;
        border-right: none;
        border-bottom: 1px solid rgba(255,255,255,0.07);
    }
    .dst-rep:last-child {
        border-bottom: none;
    }
}
/* ============================================================
   ACCESSORIES BLOCK   listing_0.html "You May Also Like"
   DO NOT REMOVE   breaks upsell layout on all product pages
============================================================ */
.accessoriesBlock { margin: 24px 0 0; }
.accessoriesBlock .header { margin-bottom: 10px; }
.accessoriesBlock .header h4.page_heading {
  font-size: 14px; font-weight: 800; text-transform: uppercase;
  letter-spacing: .06em; color: var(--dark); margin: 0 0 4px;
  background: none; padding: 0; border-bottom: 2px solid var(--g200);
  padding-bottom: 8px;
}
.accessoriesBlock .header:after {
  content: "Accessories are individual items. Total of added items will show in cart";
  float: left; width: 100%; font-size: 11px; font-weight: 600;
  border-bottom: 1px solid var(--g200); margin: 0 0 5px;
}

/* Vertical list   override product-items grid */
.accessoriesBlock .product-items {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  margin: 0 !important;
  border: 1px solid var(--g200) !important;
  border-radius: var(--r2);
  overflow: hidden;
}
.accessoriesBlock .product-item {
  float: none !important;
  width: 100% !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
  border-bottom: 1px solid var(--g200) !important;
  box-sizing: border-box !important;
}
.accessoriesBlock .product-item:last-child { border-bottom: none !important; }

/* Each row   horizontal flex */
.accessoriesBlock .item-inner {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 10px 14px !important;
  background: var(--white) !important;
  border: none !important;
  border-radius: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  transition: background .12s;
}
.accessoriesBlock .item-inner:hover { background: var(--off) !important; }

/* ADD label + qty input   leftmost */
.accessoriesBlock .action {
  float: none !important;
  width: auto !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 2px !important;
  position: static !important;
  left: auto !important;
  top: auto !important;
  bottom: auto !important;
}
.accessoriesBlock .action::before {
  content: 'ADD';
  font-family: var(--ff-d);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .12em;
  color: var(--g400);
  text-transform: uppercase;
}
.accessoriesBlock .action .QTY-nav { display: flex !important; }
.accessoriesBlock .action input[type="text"] {
  width: 48px !important;
  height: 32px !important;
  text-align: center !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  border: 1.5px solid var(--g300) !important;
  border-radius: var(--r) !important;
  padding: 0 4px !important;
  color: var(--dark) !important;
  background: var(--white) !important;
}

/* Thumbnail */
.accessoriesBlock .img {
  width: 52px !important;
  height: 52px !important;
  min-height: 0 !important;
  flex-shrink: 0 !important;
  position: relative !important;
  border: 1px solid var(--g200) !important;
  border-radius: var(--r) !important;
  overflow: hidden !important;
  background: var(--white) !important;
  margin: 0 !important;
  left: auto !important;
  top: auto !important;
  bottom: auto !important;
}
.accessoriesBlock .img img {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: auto !important;
  height: auto !important;
  max-width: 90% !important;
  max-height: 90% !important;
  transition: none !important;
}
.accessoriesBlock .img img.mainaccess { opacity: 1; z-index: 1; max-height: 25px !important; }
.accessoriesBlock .img a { position: absolute; inset: 0; z-index: 2; display: block; }
.accessoriesBlock .img img.toolaccess { opacity: 0 !important; }

/* Product name   fills remaining space */
.accessoriesBlock .item-info {
  flex: 1 !important;
  min-width: 0 !important;
}
.accessoriesBlock .item-title a {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--dark) !important;
  text-decoration: none !important;
  line-height: 1.35 !important;
  display: block !important;
  height: auto !important;
  overflow: visible !important;
  padding: 0 !important;
}
.accessoriesBlock .item-title a:hover { color: var(--green-d) !important; }

/* Price   right-aligned */
.accessoriesBlock .item-price {
  flex-shrink: 0 !important;
  min-width: 70px !important;
  text-align: right !important;
  height: auto !important;
}
.accessoriesBlock .item-price .regular-price {
  font-size: 15px !important;
  font-weight: 800 !important;
  color: var(--red) !important;
  display: block !important;
}
.accessoriesBlock .item-price .special-price {
  font-size: 15px !important;
  font-weight: 800 !important;
  color: var(--red) !important;
}

/* Hide sale badge */
.accessoriesBlock .icon-sale-label { display: none !important; }

@media (max-width: 480px) {
  .accessoriesBlock .item-price { min-width: 60px; }
  .accessoriesBlock .img { width: 44px !important; height: 44px !important; }
}