/** Shopify CDN: Minification failed

Line 2125:0 Unexpected "}"

**/

:root{
  --accent:#f2c300;
  --bg:#101010;
  --panel:#1a1a1a;
  --text:#eaeaea;
  --muted:rgba(255,255,255,.72);
  --border:rgba(255,255,255,.10);
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
/* Prevent tiny horizontal overflows (common on iOS when using 100vw / transforms) */
html, body{ overflow-x:clip; }
body{
  width:100%;
  position:relative;
  background:var(--bg);
  color:var(--text);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  line-height:1.5;
}

/* Clamp common wrappers so nothing can push the page wider than the viewport */
#MainContent, main, .page-width, .page, .shopify-section{ max-width:100%; overflow-x:clip; }
img, svg, video, canvas{ max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
a:visited{ color:inherit; }

/* Header */
.site-header{
  position:sticky;
  top:0;
  z-index:9000;
  background:rgba(5,5,5,.92);
  backdrop-filter: blur(14px);
  border-bottom:1px solid var(--border);
}
.header-inner{
  max-width:1240px;
  margin:0 auto;
  padding:10px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}
.brand img{ height:34px; width:auto; display:block; }

.nav{ flex:1; }
.menu{
  display:flex;
  align-items:center;
  gap:18px;
  list-style:none;
  margin:0;
  padding:0;
}
.menu > li{ position:relative; }
.menu-link{
  display:inline-flex;
  align-items:center;
  padding:8px 6px;
  font-family: Oswald, Inter, sans-serif;
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:1.1px;
  font-weight:700;
  opacity:.9;
}
.menu-link:hover{ color:var(--accent); opacity:1; }
.menu-link.is-active{opacity:1; position:relative;}
.menu-link.is-active::after{
  content:"";
  position:absolute;
  left:0; right:0;
  height:2px;
  bottom:-6px;
  background:var(--accent);
  border-radius:2px;
}

.header-actions{ display:flex; align-items:center; gap:10px; }
.cart-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;

  font-family: Oswald, Inter, sans-serif;
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:1.1px;
  font-weight:700;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  padding:10px 12px;
  border-radius:999px;
}
.cart-btn:hover{ border-color:rgba(242,195,0,.45); color:var(--accent); }

.hamburger{
  display:none;
  height:38px;
  padding:0 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  color:var(--text);
}

/* Dropdowns */
.dropdown, .mega{
  display:none;
  position:absolute;
  top: calc(100% + 10px);
  left:0;
  background: rgba(10,10,10,.92);
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow: 0 30px 80px rgba(0,0,0,.75);
  backdrop-filter: blur(14px);
  z-index:9500;
}
.has-dropdown:hover .dropdown{ display:block; }
.dropdown{
  min-width: 220px;
  padding:10px;
}
.dropdown a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 10px;
  border-radius:12px;
  color:var(--muted);
  font-size:13px;
  font-weight:700;
  border:1px solid transparent;
}
.dropdown a::after{ content:"›"; opacity:.45; font-weight:900; }
.dropdown a:hover{
  color:var(--text);
  border-color:rgba(242,195,0,.22);
  background:rgba(242,195,0,.08);
}
.dropdown a:hover::after{ opacity:.9; color:var(--accent); }

.has-mega:hover .mega{ display:grid; }
.mega{
  padding:16px;
  width: min(680px, 92vw);
  display:none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:18px;
}
.mega-title{
  font-size:11px;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--accent);
  font-weight:800;
  margin:0 0 10px 0;
}
.mega-col a{
  position:relative;
  display:block;
  padding:10px 28px 10px 10px;
  border-radius:12px;
  color:var(--muted);
  font-size:13px;
  font-weight:700;
  border:1px solid transparent;
  transition: background .14s ease, border-color .14s ease, color .14s ease;
}
.mega-col a::after{
  content:"›";
  position:absolute;
  right:10px;
  top:50%;
  transform: translateY(-50%);
  opacity:.45;
  font-weight:900;
}
.mega-col a:hover{
  color:var(--text);
  border-color:rgba(242,195,0,.22);
  background:rgba(242,195,0,.08);
}
.mega-col a:hover::after{ opacity:.9; color:var(--accent); }
.mega-col a::after{ content:"›"; opacity:.45; font-weight:900; }
.mega-col a:hover{
  color:var(--text);
  border-color:rgba(242,195,0,.22);
  background:rgba(242,195,0,.08);
}
.mega-col a:hover::after{ opacity:.9; color:var(--accent); }

/* Announcement marquee */
.announcement{ border-bottom:1px solid rgba(255,255,255,.06); }
.marquee{ overflow:hidden; white-space:nowrap; }
.marquee__track{
  display:inline-block;
  padding:10px 0;
  font-family: Oswald, Inter, sans-serif;
  letter-spacing:1px;
  color:var(--accent);
  animation: marquee 20s linear infinite;
}
@keyframes marquee{
  from{ transform: translateX(0); }
  to{ transform: translateX(-33.333%); }
}

/* Hero */
.hero{
  max-width:1240px;
  margin:0 auto;
  padding:56px 18px 22px;
}
.hero__content{ max-width:720px; }
.hero__branding{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:10px;
}
.hero__logoImg{
  width: clamp(44px, 5vw, 64px);
  height:auto;
  display:block;
}
.hero__brandText{
  font-family: Oswald, Inter, sans-serif;
  letter-spacing:1.6px;
  text-transform:uppercase;
  font-weight:700;
  font-size:18px;
  opacity:.95;
}
.hero p{ color:var(--muted); margin: 10px 0 18px; }
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 16px;
  border-radius:14px;
  font-family: Oswald, Inter, sans-serif;
  text-transform:uppercase;
  letter-spacing:1.1px;
  font-weight:700;
  font-size:12px;
  border:1px solid var(--border);
}
.btn--primary{
  background: rgba(242,195,0,.14);
  border-color: rgba(242,195,0,.35);
  color: var(--accent);
}
.btn--secondary{ background: rgba(255,255,255,.03); }
.hero__buttons{ display:flex; gap:12px; flex-wrap:wrap; }

/* Category tiles on homepage */
.grid{
  max-width:1240px;
  margin:0 auto;
  padding: 18px 18px 44px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
}
@media (max-width: 900px){
  .grid{ grid-template-columns: 1fr; }
}
.card{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background: radial-gradient(60% 80% at 30% 15%, rgba(242,195,0,.12), transparent 55%), rgba(255,255,255,.02);
  padding:16px;
  box-shadow: 0 18px 50px rgba(0,0,0,.45);
}
.card h3{
  margin:0 0 8px 0;
  font-family: Oswald, Inter, sans-serif;
  text-transform:uppercase;
  letter-spacing:1.1px;
}
.card p{ margin:0; color:var(--muted); }
.card:hover{ border-color: rgba(242,195,0,.28); }

/* Product grid */
.pgrid{
  max-width:1240px;
  margin:0 auto;
  padding:26px 18px 44px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:14px;
}
@media (min-width: 720px){ .pgrid{ grid-template-columns: repeat(3, minmax(0, 1fr)); gap:16px; } }
@media (min-width: 1100px){ .pgrid{ grid-template-columns: repeat(4, minmax(0, 1fr)); gap:18px; } }

.ptile{
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  overflow:hidden;
  transition: transform .14s ease, border-color .18s ease, background .18s ease;
}
.ptile:hover{
  border-color:rgba(242,195,0,.35);
  background: rgba(255,255,255,.035);
  transform: translateY(-2px);
}
.ptile__media{ aspect-ratio:1/1; background:#0b0b0b; }
.ptile__img{ width:100%; height:100%; object-fit:cover; display:block; }
.ptile__body{ padding:12px 12px 14px; }
.ptile__title{ font-size:13px; font-weight:800; line-height:1.25; color:var(--text); }
.ptile__price{ color:var(--accent); font-weight:900; margin-top:6px; font-size:14px; }

/* Footer basic */
.site-footer{
  border-top:1px solid rgba(255,255,255,.08);
  padding: 18px 18px;
  position: relative;
  overflow: hidden;
}

.footer-watermark{
  position:absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 420px;
  max-width: 70vw;
  opacity: .045;
  filter: blur(.2px);
  pointer-events:none;
}

.footer-inner{
  max-width:1240px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  /* Prevent the footer reading like two stacked bars on desktop */
  flex-wrap:nowrap;
  position:relative;
  z-index:1;
}
.footer-brand{
  display:flex;
  align-items:center;
  gap:10px;
}
.footer-brand img{ height:28px; width:auto; }
.footer-small{ color: rgba(255,255,255,.65); font-size:13px; }

@media (max-width: 980px){
  .footer-inner{ flex-wrap:wrap; }
}

/* Mobile */
@media (max-width: 920px){
  .nav{ display:none; }
  .hamburger{ display:inline-flex; align-items:center; justify-content:center; }
}

/* Mobile drawer */
.mnav{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.65);
  display:none;
  z-index:10000;
}
.mnav.is-open{ display:block; }
.mnav__panel{
  position:absolute;
  top:0;
  right:0;
  width:min(420px, 92vw);
  height:100%;
  background:rgba(8,8,8,.96);
  border-left:1px solid var(--border);
  box-shadow:0 18px 60px rgba(0,0,0,.75);
  backdrop-filter: blur(14px);
  display:flex;
  flex-direction:column;
}
.mnav__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px;
  border-bottom:1px solid var(--border);
}
.mnav__brand{display:flex;align-items:center;gap:10px;}
.mnav__brand img{height:22px;width:auto;display:block;opacity:.95;}
.mnav__social{display:flex;align-items:center;gap:10px;margin-left:auto;margin-right:10px;}
.mnav__soc{
  width:34px;height:34px;border-radius:999px;
  display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.85);
  font-weight:900;
}
.mnav__soc svg{ width:18px; height:18px; display:block; }
.mnav__soc:hover{border-color:rgba(242,195,0,.22);background:rgba(242,195,0,.10);color:var(--text);}
.mnav__close{
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  color:var(--text);
  border-radius:12px;
  padding:8px 12px;
}
.mnav__body{
  padding:14px 16px 18px;
  overflow:auto;
}
.mnav__item{
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  border-radius:16px;
  padding:10px;
  margin-top:12px;
}
.mnav__summary{
  list-style:none;
  cursor:pointer;
  font-weight:900;
  letter-spacing:1px;
  text-transform:uppercase;
  font-size:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:8px 6px;
  color:var(--text);
}
.mnav__summary::-webkit-details-marker{ display:none; }
.mnav__item[open] .mnav__summary{ color: var(--accent); }
.mnav__links{
  display:grid;
  gap:8px;
  margin-top:10px;
}
.mnav__group{display:grid;gap:8px;margin-top:10px;}
.mnav__groupTitle{
  font-size:11px;
  letter-spacing:1.2px;
  text-transform:uppercase;
  font-weight:950;
  color: rgba(242,195,0,.95);
  padding:10px 6px 4px;
}
.mnav__links a{
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  color:rgba(255,255,255,.80);
  font-weight:700;
}
.mnav__links a:hover{
  border-color:rgba(242,195,0,.22);
  background:rgba(242,195,0,.08);
  color:var(--text);
}
.mnav__quick{ margin-top:16px; }


/* --- Dropdown linger + hover buffer --- */
.has-mega .mega,
.has-dropdown .dropdown{
  display:block; /* keep in flow for transitions */
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform: translateY(8px);
  transition: opacity .16s ease, transform .16s ease, visibility 0s linear .18s;
}

/* Buffer area so you can move cursor into the panel */
.has-mega .mega::before,
.has-dropdown .dropdown::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-14px;
  height:14px;
}

.has-mega:hover .mega,
.has-dropdown:hover .dropdown{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform: translateY(0);
  transition: opacity .16s ease, transform .16s ease, visibility 0s;
}

/* JS-driven open state for the PARTS mega menu.
   Without this, the mega panel becomes non-interactive the moment the cursor
   leaves the trigger <li> (because :hover is lost), which feels like the menu
   "times out" instantly. */
.has-mega.is-open .mega{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform: translateY(0);
  transition: opacity .16s ease, transform .16s ease, visibility 0s;
}

/* JS-driven open state (prevents instant close when traversing into panels) */
.has-dropdown.is-open .dropdown{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform: translateY(0);
  transition: opacity .16s ease, transform .16s ease, visibility 0s;
}

/* Hover bridge for normal dropdowns (JS positions it between trigger and panel) */
.jr-dd-bridge{
  display:none;
  pointer-events:auto;
  background:transparent;
}

/* Make 'More parts' look like a subtle CTA */
.menu__more{
  margin-top: 10px;
  color: var(--accent);
  font-weight: 900;
  letter-spacing: .4px;
  opacity: 1 !important;
}


/* --- Brand strip --- */
.brand-strip{
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
}
.brand-strip__inner{
  max-width: 1240px;
  margin: 0 auto;
  padding: 16px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.brand-strip__label{
  text-transform: uppercase;
  font-weight: 900;
  letter-spacing: 1px;
  font-size: 11px;
  color: rgba(255,255,255,.72);
}
.brand-strip__logos{
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
}
.brand-strip__logos img{
  height: 34px;
  width:auto;
  object-fit: contain;
  opacity: .98;
  filter: none;
}
.brand-strip__logos img:hover{
  opacity: 1;
}
@media (max-width: 720px){
  .brand-strip__logos img{ height: 20px; }
}

/* Layout sanity */
html, body{ height:auto; }
body{ margin:0; }
main{ display:block; padding-bottom: 0 !important; }
.site-footer{ margin-top: 0; }


/* --- v6: mega menu polish + featured column --- */
.mega{
  width: min(880px, 92vw) !important;
  grid-template-columns: 1fr 1fr 0.9fr !important;
  align-items: start !important;
}
.mega__feature{ min-width: 0; }
.mega__card{
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  border-radius: 16px;
  padding: 14px;
}
.mega__cardTitle{
  text-transform: uppercase;
  font-weight: 900;
  letter-spacing: 1px;
  font-size: 11px;
  color: rgba(255,255,255,.75);
  margin-bottom: 10px;
}
.mega__brandGrid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.mega__brandGrid img{
  width: 100%;
  height: 26px;
  object-fit: contain;
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 10px;
  padding: 6px 10px;
}
.mega__cta{
  display:inline-flex;
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(242,195,0,.30);
  background: rgba(242,195,0,.10);
  color: var(--accent);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 11px;
}
.mega__cta:hover{ background: rgba(242,195,0,.14); border-color: rgba(242,195,0,.45); }

@media (max-width: 1100px){
  .mega{
    grid-template-columns: 1fr 1fr !important;
    width: min(760px, 92vw) !important;
  }
  .mega__feature{ grid-column: 1 / -1; }
  .mega__brandGrid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .mega__brandGrid img{ height: 28px; }
}
@media (max-width: 720px){
  .mega__brandGrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* --- v6: brand strip motion + swipe --- */
@media (min-width: 900px){
  .brand-strip__logos img{
    transition: transform .18s ease, filter .18s ease, opacity .18s ease;
  }
  .brand-strip__logos img:hover{
    transform: translateY(-1px);
    filter: saturate(1.15) contrast(1.05);
  }
}
@media (max-width: 899px){
  .brand-strip__logos{
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    padding-bottom: 6px;
  }
  .brand-strip__logos img{
    scroll-snap-align: start;
  }
  .brand-strip__logos::-webkit-scrollbar{ height: 6px; }
  .brand-strip__logos::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.15); border-radius: 999px; }
}


.mega{
  left: 0 !important;
  right: auto !important;
  transform: none !important;

  width: min(980px, 96vw) !important;
  grid-template-columns: 1fr 1fr 0.9fr !important;

  max-height: min(640px, 78vh) !important;
  overflow: auto !important;
}

.mega > div:not(.mega__feature){
  overflow: visible !important;
  max-height: none !important;
}

.mega{ align-items: start !important; }
.mega > div{ padding-right: 10px; }
.mega > div:last-child{ padding-right: 0; }

@media (min-width: 900px){
  .mega > div:not(.mega__feature){
    max-height: min(560px, 72vh);
    overflow-y: auto;
  }
}

.mega__feature{ display: block !important; }
.mega__card{ position: sticky; top: 0; }

.mega::-webkit-scrollbar{ height: 10px; width: 10px; }
.mega::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.14); border-radius: 999px; }



.mega{
  left: 0 !important;
  width: min(1040px, 96vw) !important;
  grid-template-columns: 1.2fr 1fr 0.85fr !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Two-column list inside E-BIKE PARTS to fit everything */
.mega__list2col{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 8px 10px;
}
.mega__list2col a{
  margin-top: 0 !important;
}

/* Tighten row height a touch so everything fits */
.mega a{
  padding: 10px 10px !important;
  font-size: 12.5px !important;
}

/* If width is smaller, drop the internal 2-col back to 1-col */
@media (max-width: 980px){
  .mega{
    grid-template-columns: 1fr 1fr !important;
    width: min(860px, 96vw) !important;
  }
  .mega__feature{ grid-column: 1 / -1; }
  .mega__list2col{ grid-template-columns: 1fr; }
}



.mega{
  width: min(1120px, 96vw) !important;
  grid-template-columns: 1fr 1fr .9fr 1.05fr !important;
  gap: 18px !important;
  overflow: visible !important;
  max-height: none !important;
}

.mega__col{ min-width: 0; }
.mega__col--perf{ border-left: 1px solid rgba(255,255,255,.08); padding-left: 14px; }

.mega h4{
  margin: 2px 0 12px 0 !important;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.mega a{
  padding: 10px 12px !important;
  border-radius: 14px !important;
  font-size: 12.5px !important;
  font-weight: 850 !important;
}

.mega a + a{ margin-top: 8px; }

.mega__brandGrid--wide{
  grid-template-columns: repeat(2, minmax(0,1fr));
}
.mega__brandGrid--wide img{
  height: 26px;
}

@media (max-width: 1100px){
  .mega{
    grid-template-columns: 1fr 1fr !important;
    width: min(900px, 96vw) !important;
  }
  .mega__col--perf{ border-left: 0; padding-left: 0; }
  .mega__feature{ grid-column: 1 / -1; }
  .mega__brandGrid--wide{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}

@media (max-width: 720px){
  .mega{ grid-template-columns: 1fr !important; }
  .mega__feature{ grid-column: auto; }
  .mega__brandGrid--wide{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}


/* --- v10: homepage category tiles (motorsport) --- */
.cat-tiles{
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.015);
}
.cat-tiles__inner{
  max-width: 1240px;
  margin: 0 auto;
  padding: 18px 18px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}
.cat-tile{
  border: 1px solid rgba(255,255,255,.10);
  background: radial-gradient(80% 140% at 10% 10%, rgba(242,195,0,.16), transparent 55%),
              rgba(255,255,255,.03);
  border-radius: 18px;
  padding: 16px;
  min-height: 120px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition: transform .14s ease, border-color .18s ease, background .18s ease;
}
.cat-tile:hover{
  transform: translateY(-2px);
  border-color: rgba(242,195,0,.32);
  background: radial-gradient(80% 140% at 10% 10%, rgba(242,195,0,.22), transparent 55%),
              rgba(255,255,255,.04);
}
.cat-tile__kicker{
  text-transform: uppercase;
  font-weight: 900;
  letter-spacing: 1.2px;
  font-size: 11px;
  color: rgba(255,255,255,.70);
}
.cat-tile__title{
  text-transform: uppercase;
  font-weight: 950;
  letter-spacing: 1.4px;
  font-size: 16px;
  margin-top: 4px;
}
.cat-tile__meta{
  color: rgba(255,255,255,.72);
  font-weight: 700;
  font-size: 12.5px;
  line-height: 1.35;
  max-width: 44ch;
}
@media (max-width: 900px){
  .cat-tiles__inner{ grid-template-columns: 1fr; }
  .cat-tile{ min-height: 108px; }
}


/* --- v11: Mega menu like reference (grid groups) --- */
.mega.mega--grid{
  width: min(1180px, 96vw);
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 18px;
  padding: 18px;
  background: rgba(12,12,12,.97);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  box-shadow: 0 40px 140px rgba(0,0,0,.85);
  backdrop-filter: blur(16px);
}

.mega__grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 18px 22px;
  align-content: start;
}

.mega__group h4{
  margin: 2px 0 12px 0;
  color: rgba(255,255,255,.92);
  text-transform: uppercase;
  letter-spacing: 1.2px;
  font-size: 12px;
  font-weight: 950;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,.10);
  position: relative;
}
.mega__group h4::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-1px;
  width: 44px;
  height: 2px;
  background: rgba(242,195,0,.75);
  border-radius: 999px;
}

.mega__group a{
  display:block;
  padding: 9px 0;
  font-size: 13px;
  font-weight: 800;
  color: rgba(255,255,255,.70);
}
.mega__group a:hover{ color: var(--accent); }

.mega__aside .mega__card{
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  border-radius: 16px;
  padding: 14px;
  height: 100%;
}

.mega__cardTitle{
  text-transform: uppercase;
  font-weight: 950;
  letter-spacing: 1px;
  font-size: 11px;
  color: rgba(255,255,255,.72);
  margin-bottom: 12px;
}

.mega__brandRow{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
}
.mega__brandRow img{
  height: 26px;
  width: auto;
  object-fit: contain;
  background: rgba(0,0,0,.30);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 10px;
  padding: 6px 10px;
}

.mega__cta{
  display:inline-flex;
  width: 100%;
  justify-content:center;
  margin-top: 12px;
  padding: 12px 12px;
  border-radius: 14px;
  border: 1px solid rgba(242,195,0,.32);
  background: rgba(242,195,0,.12);
  color: var(--accent);
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 12px;
}
.mega__cta:hover{ background: rgba(242,195,0,.16); border-color: rgba(242,195,0,.45); }

@media (max-width: 1100px){
  .mega.mega--grid{ grid-template-columns: 1fr; }
  .mega__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 820px){
  .mega__grid{ grid-template-columns: 1fr; }
}


/* v15: homepage safe styles */

.home{
  padding: 34px 0 22px;
}
.home__wrap{
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 18px;
}
.home__hero{
  border: 1px solid rgba(255,255,255,.10);
  background: radial-gradient(70% 140% at 10% 0%, rgba(242,195,0,.16), transparent 55%), rgba(255,255,255,.03);
  border-radius: 22px;
  padding: 28px;
}
.home__brand{
  display:flex;
  align-items:center;
  gap: 14px;
}
.home__logo{
  width: 54px;
  height: 54px;
  object-fit: contain;
}
.home__title{
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  font-size: 14px;
  color: rgba(255,255,255,.92);
}
.home__tag{
  margin-top: 12px;
  color: rgba(255,255,255,.78);
  font-weight: 700;
  max-width: 58ch;
}
.home__cta{
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
  margin-top: 16px;
}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  font-weight: 950;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: 12px;
}
.btn:hover{
  border-color: rgba(242,195,0,.30);
  background: rgba(242,195,0,.08);
  color: rgba(255,255,255,.95);
}
.btn--primary{
  border-color: rgba(242,195,0,.40);
  background: rgba(242,195,0,.14);
  color: var(--accent);
}
.home__brands{
  margin-top: 14px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
  border-radius: 18px;
  padding: 12px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.home__brandsLabel{
  text-transform: uppercase;
  font-weight: 950;
  letter-spacing: 1px;
  font-size: 11px;
  color: rgba(255,255,255,.72);
}
.home__brandsRow{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items:center;
}
.home__brandsRow img{
  height: 28px;
  width: auto;
  object-fit: contain;
  background: rgba(0,0,0,.30);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 10px;
  padding: 6px 10px;
}
@media (max-width: 640px){
  .home__hero{ padding: 18px; }
  .home__logo{ width: 44px; height: 44px; }
}


/* --- v16: Collection listing polish --- */
.page{
  max-width: 1240px;
  margin: 0 auto;
  padding: 26px 18px 44px;
}
@media (max-width: 749px){
  /* Mobile: tighter page gutters + less vertical bloat */
  .page{ padding: 10px 10px 22px; }
}
.page__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 16px;
  padding: 6px 0 18px;
  border-bottom: 1px solid rgba(255,255,255,.10);
  margin-bottom: 18px;
}
.page__title{
  margin: 0;
  font-weight: 950;
  letter-spacing: .6px;
  text-transform: uppercase;
  font-size: clamp(28px, 3.2vw, 44px);
  line-height: 1.05;
}
.page__desc{
  max-width: 62ch;
  color: rgba(255,255,255,.72);
  font-weight: 650;
  margin-top: 10px;
}
@media (max-width: 720px){
  .page__head{ flex-direction:column; align-items:flex-start; }
}

/* Product tiles: more premium + consistent */
.ptile{
  display:block;
  text-decoration:none;
  color: inherit;
}
.ptile__media{
  aspect-ratio: 4 / 5;
  background: radial-gradient(80% 140% at 50% 0%, rgba(242,195,0,.10), transparent 55%), #0a0a0a;
}
.ptile__badge{
  position:absolute;
  top: 10px;
  left: 10px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(242,195,0,.35);
  background: rgba(242,195,0,.12);
  color: var(--accent);
  font-weight: 950;
  font-size: 11px;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.ptile__media{ position: relative; }
.ptile__body{
  padding: 12px 12px 14px;
  display:flex;
  flex-direction:column;
  gap: 8px;
}
.ptile__title{
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .2px;
  color: rgba(255,255,255,.92);
}
.ptile__meta{
  display:flex;
  align-items:baseline;
  gap: 10px;
}
.ptile__price{
  color: var(--accent);
  font-weight: 950;
  font-size: 14px;
}
.ptile__compare{
  color: rgba(255,255,255,.55);
  text-decoration: line-through;
  font-weight: 800;
  font-size: 12.5px;
}

/* Grid: tighter + better balance */
.pgrid{
  padding: 0;
}
.pgrid{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 720px){
  .pgrid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1100px){
  .pgrid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
}


/* --- v17: Smaller product tiles + denser collection grid --- */
.collection__grid, .product-grid, .grid--collection{
  display: grid;
  gap: 14px !important;
}

@media (min-width: 1100px){
  .collection__grid, .product-grid, .grid--collection{
    grid-template-columns: repeat(5, minmax(0,1fr)) !important;
  }
}
@media (min-width: 820px) and (max-width: 1099px){
  .collection__grid, .product-grid, .grid--collection{
    grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  }
}
@media (min-width: 560px) and (max-width: 819px){
  .collection__grid, .product-grid, .grid--collection{
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  }
}
@media (max-width: 559px){
  .collection__grid, .product-grid, .grid--collection{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
}

/* Card density */
.product-card, .card-product, .product-tile{
  border-radius: 16px !important;
}
.product-card__media, .card-product__media, .product-tile__media{
  aspect-ratio: 1 / 1 !important; /* smaller visual block */
}
.product-card__body, .card-product__body, .product-tile__body{
  padding: 10px 10px 12px !important;
}
.product-card__title, .card-product__title, .product-tile__title{
  font-size: 12.5px !important;
  line-height: 1.25 !important;
}
.product-card__price, .card-product__price, .product-tile__price{
  font-size: 12px !important;
}

/* Reduce collection heading size */
.collection__title, .collection-title, h1.collection-title{
  font-size: clamp(24px, 3.4vw, 40px) !important;
}


/* --- v18: Mega menu (simple columns like reference) --- */
.mega.mega--simple{
  width: min(1100px, 96vw);
  padding: 14px 16px;
  background: rgba(12,12,12,.96);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  box-shadow: 0 40px 140px rgba(0,0,0,.85);
  backdrop-filter: blur(14px);
}
.mega--simple .mega__title{
  font-weight: 950;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: rgba(255,255,255,.85);
  font-size: 12px;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,.10);
}
.mega--simple .mega__cols{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px 18px;
}
.mega--simple .mega__head{
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  font-size: 12px;
  color: rgba(255,255,255,.92);
  margin-bottom: 10px;
  position: relative;
  padding-bottom: 8px;
}
.mega--simple .mega__head::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width: 44px;
  height: 2px;
  background: rgba(242,195,0,.75);
  border-radius: 999px;
}
.mega--simple a{
  display:block;
  padding: 6px 0;
  font-size: 13px;
  font-weight: 800;
  color: rgba(255,255,255,.70);
}
.mega--simple a:hover{
  color: var(--accent);
}
.mega--simple a::before{
  content:"- ";
  color: rgba(242,195,0,.60);
}
.mega--simple .mega__bottom{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.10);
  display:flex;
  justify-content:flex-end;
}
@media (max-width: 1100px){
  .mega--simple .mega__cols{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 820px){
  .mega--simple .mega__cols{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 520px){
  .mega--simple .mega__cols{ grid-template-columns: 1fr; }
}

/* --- v18: Collection grid density (fix huge products) --- */
.pgrid{
  display:grid !important;
  gap: 14px !important;
}
@media (min-width: 1200px){
  .pgrid{ grid-template-columns: repeat(5, minmax(0,1fr)) !important; }
}
@media (min-width: 980px) and (max-width: 1199px){
  .pgrid{ grid-template-columns: repeat(4, minmax(0,1fr)) !important; }
}
@media (min-width: 640px) and (max-width: 979px){
  .pgrid{ grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
}
@media (max-width: 639px){
  .pgrid{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}

/* Make product cards more compact */
.product-card, .product-card__inner, .product-card__media{
  max-width: 100%;
}
.product-card__media img{
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* v18 ptile compact */
.ptile{
  display:block;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
  border-radius: 16px;
  overflow:hidden;
}
.ptile__media{ aspect-ratio: 1 / 1; background: rgba(0,0,0,.25); }
.ptile__img{ width:100%; height:100%; object-fit:cover; display:block; }
.ptile__body{ padding: 10px; }
.ptile__title{ font-size: 12.5px; font-weight: 900; line-height: 1.25; color: rgba(255,255,255,.92); }
.ptile__price{ margin-top: 6px; font-size: 12px; font-weight: 850; color: rgba(255,255,255,.78); }

/* --- v20: Product card polish (clean mobile + refined desktop) --- */
/* Desktop: keep cards crisp but not "blocky" */
@media (min-width: 640px){
  .ptile{
    border: 1px solid rgba(255,255,255,.08);
    background: rgba(255,255,255,.015);
  }
}

/* Mobile: remove heavy "tiles" look and let products breathe */
@media (max-width: 639px){
  .pgrid{ gap: 12px !important; }

  .ptile{
    border: 0 !important;
    background: transparent !important;
    border-radius: 12px !important;
    overflow: hidden;
  }
  .ptile__media{
    background: rgba(0,0,0,.18) !important;
    border-radius: 12px !important;
    overflow: hidden;
  }
  .ptile__body{
    padding: 8px 2px 2px !important;
  }
  .ptile__title{
    font-size: 13px !important;
    letter-spacing: .1px;
  }
  .ptile__price{
    font-size: 12.5px !important;
  }

  /* Also cover other common card classes some templates use */
  .product-card,
  .card-product,
  .product-tile{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  .product-card__inner,
  .card-product__inner{
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
}


/* --- v19: Tidy mega menu layout (no big gaps, clean columns) --- */
.mega.mega--simple{
  width: min(980px, 94vw) !important;
  padding: 14px 16px 12px !important;
}

.mega--simple .mega__title{
  margin-bottom: 10px !important;
  padding-bottom: 10px !important;
  font-size: 12px !important;
}

.mega--simple .mega__cols{
  grid-template-columns: repeat(4, minmax(160px, 1fr)) !important;
  gap: 12px 18px !important;
  align-items: start !important;
}

.mega--simple .mega__col{ min-width: 0; }

.mega--simple .mega__head{
  font-size: 11px !important;
  letter-spacing: 1.1px !important;
  margin-bottom: 8px !important;
  padding-bottom: 7px !important;
  white-space: nowrap;
}

.mega--simple a{
  padding: 5px 0 !important;
  font-size: 12.5px !important;
  line-height: 1.15 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mega--simple a::before{ content:""; display:none; }

.mega--simple a{
  position: relative;
  padding-left: 10px !important;
}
.mega--simple a::after{
  content:"";
  position:absolute;
  left:0;
  top: 50%;
  width: 6px;
  height: 2px;
  background: rgba(242,195,0,.60);
  transform: translateY(-50%);
  border-radius: 999px;
}

.mega--simple .mega__bottom{
  margin-top: 10px !important;
  padding-top: 10px !important;
  justify-content: flex-end !important;
}
.mega--simple .mega__cta{ max-width: 320px; }

@media (max-width: 1100px){
  .mega--simple .mega__cols{ grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
  .mega--simple a{ white-space: normal; }
}
@media (max-width: 820px){
  .mega--simple .mega__cols{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width: 520px){
  .mega--simple .mega__cols{ grid-template-columns: 1fr !important; }
}

/* --- v19: Footer/Home brand logos (no weird tile BG, no distortion) --- */
.home__brandsRow img,
.mega__brandRow img,
.brand-strip img,
.footer__brands img,
.footer-brands img{
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.home__brandsRow img,
.footer__brands img,
.footer-brands img,
.brand-strip img{
  height: 28px !important;
  width: auto !important;
  object-fit: contain !important;
}

.home__brandsRow a,
.footer__brands a,
.footer-brands a{
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* v22 search grid like 666 */
.srch{ padding: 34px 0 40px; }
.srch__wrap{ max-width: 1320px; margin: 0 auto; padding: 0 18px; }
.srch__title{ text-align:center; font-size: 32px; letter-spacing: 1px; text-transform: uppercase; font-weight: 950; margin: 0 0 18px; }
.srch__bar{ display:flex; justify-content:center; gap: 10px; margin-bottom: 18px; }
.srch__bar input{ width: min(760px, 100%); padding: 14px 14px; border-radius: 10px; border: 1px solid rgba(255,255,255,.18); background: rgba(0,0,0,.40); color: rgba(255,255,255,.92); }
.srch__bar button{ padding: 14px 18px; border-radius: 10px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: rgba(255,255,255,.92); font-weight: 900; text-transform: uppercase; letter-spacing: 1px; }
.srch__top{ display:flex; justify-content:space-between; align-items:center; gap: 14px; margin: 12px 0 22px; flex-wrap: wrap; }
.srch__filters{ display:flex; align-items:center; gap: 14px; flex-wrap: wrap; }
.srch__label, .srch__label2{ text-transform: uppercase; font-weight: 950; letter-spacing: 1px; color: rgba(255,255,255,.78); font-size: 12px; }
.srch__muted{ color: rgba(255,255,255,.55); font-weight: 700; }
.fdrop{ position: relative; }
.fdrop__sum{ list-style: none; cursor:pointer; padding: 10px 12px; border: 1px solid rgba(255,255,255,.14); border-radius: 10px; background: rgba(0,0,0,.30); font-weight: 850; }
.fdrop[open] .fdrop__sum{ border-color: rgba(242,195,0,.30); }
.fdrop__panel{ position:absolute; top: calc(100% + 8px); left:0; min-width: 220px; background: rgba(12,12,12,.96); border: 1px solid rgba(255,255,255,.14); border-radius: 12px; padding: 10px; z-index: 1000; box-shadow: 0 30px 120px rgba(0,0,0,.85); }
.fopt{ display:flex; gap: 10px; align-items:center; padding: 6px 6px; color: rgba(255,255,255,.80); font-weight: 800; }
.fopt em{ opacity: .7; font-style: normal; font-weight: 800; }
.fapply{ width: 100%; margin-top: 8px; padding: 10px 12px; border-radius: 10px; border: 1px solid rgba(242,195,0,.35); background: rgba(242,195,0,.10); color: rgba(255,255,255,.92); font-weight: 950; text-transform: uppercase; letter-spacing: 1px; }
.fprice{ display:flex; gap: 8px; }
.fprice input{ width: 100%; padding: 10px; border-radius: 10px; border: 1px solid rgba(255,255,255,.14); background: rgba(0,0,0,.30); color: rgba(255,255,255,.88); }
.srch__sort{ display:flex; align-items:center; gap: 12px; flex-wrap: wrap; margin-left:auto; }
.srch__sort select{ padding: 12px 14px; border-radius: 10px; border: 1px solid rgba(255,255,255,.18); background: rgba(0,0,0,.30); color: rgba(255,255,255,.92); font-weight: 850; min-width: 220px; }
.srch__count{ color: rgba(255,255,255,.70); font-weight: 850; text-transform: uppercase; letter-spacing: 1px; font-size: 12px; }
.srch__grid{ display:grid; gap: 18px; grid-template-columns: repeat(4, minmax(0,1fr)); margin-top: 18px; }
@media (max-width: 1080px){ .srch__grid{ grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 760px){ .srch__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } .srch__title{ font-size: 26px; } }
@media (max-width: 440px){ .srch__grid{ grid-template-columns: 1fr; } }

/* White product card like 666 */
.pcw{
  display:block;
  border-radius: 16px;
  background: #ffffff;
  color: #111;
  overflow:hidden;
  box-shadow: 0 12px 38px rgba(0,0,0,.35);
}
.pcw__media{
  background:#fff;
  aspect-ratio: 1 / 1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 22px;
}
.pcw__media img{ max-width: 100%; max-height: 100%; object-fit: contain; }
.pcw__body{ padding: 16px 16px 18px; }
.pcw__title{
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: .8px;
  font-size: 18px;
  line-height: 1.12;
}
.pcw__vendor{ margin-top: 8px; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: rgba(0,0,0,.55); font-weight: 800; }
.pcw__price{ margin-top: 12px; font-weight: 950; letter-spacing: 1px; font-size: 18px; }
.pcw__compare{ text-decoration: line-through; color: rgba(0,0,0,.45); margin-right: 10px; font-weight: 900; }

/* v24 product page motorsport (matches reference without Klarna) */
.pdp{
  max-width: 1320px;
  margin: 0 auto;
  padding: 28px 18px 44px;
  display:grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  gap: 22px;
}
@media (max-width: 980px){
  .pdp{ grid-template-columns: 1fr; }
}
.pdp__media{
  background: transparent;
}
.pdp__mediaInner{
  background: rgba(255,255,255,.03);
  border-radius: 16px;
  padding: 18px;
  min-height: 520px;
  display:flex;
  flex-direction: column;
  gap: 12px;
  align-items:center;
  justify-content:center;
  box-shadow: 0 18px 60px rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.10);
}
\.pdp__mainMedia{ width:100%; display:flex; align-items:center; justify-content:center; }
.pdp__thumbs{ width:100%; display:flex; gap:10px; overflow-x:auto; padding: 2px 2px 8px; -webkit-overflow-scrolling: touch; }
.pdp__thumb{ flex:0 0 auto; border:1px solid rgba(255,255,255,.10); background: rgba(0,0,0,.18); border-radius: 12px; padding: 6px; cursor:pointer; }
.pdp__thumb img{ width:72px; height:72px; object-fit: cover; display:block; border-radius: 10px; }
.pdp__thumb.is-active{ border-color: rgba(242,195,0,.55); background: rgba(242,195,0,.10); }

.pdp__img{
  width: 100%;
  height: auto;
  max-height: 680px;
  object-fit: contain;
  display:block;
}

@media (max-width: 749px){
  /* Mobile PDP: tighter, less oversized */
  .pdp{ padding: 10px 10px 20px; gap: 12px; }
  .pdp__mediaInner{
    padding: 8px;
    min-height: unset;
    border-radius: 12px;
    box-shadow: 0 8px 26px rgba(0,0,0,.38);
  }
  .pdp__img{
    max-height: 340px;
    width: min(100%, 88vw);
  }
  .pdp__thumbs{ gap: 8px; padding: 0 0 8px; }
  .pdp__thumb{ border-radius: 10px; padding: 5px; }
  .pdp__thumb img{ width:56px; height:56px; border-radius: 8px; }
  .pdp__info{ padding: 12px 12px 14px; border-radius: 12px; }
  .pdp__title{ font-size: 24px; line-height: 1.1; }

  /* Hard-stop any horizontal drift on iOS */
  html, body{ overflow-x:hidden !important; }
  #MainContent, main, .pdp, .pdp__info, .pdp__mediaInner{ width:100%; max-width:100%; overflow-x:hidden; }

  /* Make long titles never push layout wider */
  .pdp__title{ overflow-wrap:anywhere; word-break:break-word; hyphens:auto; letter-spacing:.6px; font-size:22px; }

  /* Pricing + badges slightly smaller */
  .pdp__compare{ font-size:16px; }
  .pdp__price{ font-size:28px; letter-spacing:.5px; }
  .pdp__badge{ font-size:11px; padding:5px 9px; }

  /* Feature box tighter */
  .pdp__features{ padding:12px; border-radius:14px; }
  .pdp__feature{ font-size:12px; }

  /* Variant pills tighter + wrap instead of overflowing */
  .pdp__opts{ flex-wrap:wrap; gap:8px; }
  .pdp__opt{ padding:10px 12px; border-radius:999px; font-size:13px; }

  /* Quantity row smaller */
  .pdp__qtyRow{ grid-template-columns: 52px 1fr 52px; gap:8px; }
  .pdp__qtyBtn, .pdp__qty{ height:44px; border-radius:12px; }
  .pdp__qtyBtn{ font-size:16px; }
  .pdp__atc{ height:48px; border-radius:14px; font-size:14px; }

}

.pdp__info{
  background: rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 18px 18px 20px;
  box-shadow: 0 18px 70px rgba(0,0,0,.55);
}
.pdp__vendor{
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,.70);
  font-weight: 850;
}
.pdp__title{
  margin: 8px 0 10px;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: 1px;
  line-height: 1.05;
  font-size: 34px;
}
@media (max-width: 980px){ .pdp__title{ font-size: 28px; } }
.pdp__pricing{
  display:flex;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
  margin: 6px 0 6px;
}
.pdp__compare{
  text-decoration: line-through;
  color: rgba(255,255,255,.55);
  font-weight: 900;
  font-size: 20px;
}
.pdp__price{
  font-weight: 1000;
  font-size: 34px;
  letter-spacing: 1px;
}
.pdp__price--sale{ color: #ff3b30; }
.pdp__badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,59,48,.20);
  border: 1px solid rgba(255,59,48,.45);
  color: rgba(255,255,255,.95);
  font-weight: 950;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: 12px;
}
.pdp__tax{
  color: rgba(255,255,255,.70);
  font-weight: 750;
  margin-bottom: 12px;
}
.pdp__features{
  background: rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 14px 14px;
  display:grid;
  gap: 10px;
  margin: 10px 0 14px;
}
.pdp__feature{
  display:flex;
  align-items:center;
  gap: 10px;
  font-weight: 950;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: rgba(255,255,255,.92);
  font-size: 13px;
}
.pdp__ico{
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.pdp__ico svg{
  width: 20px;
  height: 20px;
  stroke: var(--jr-accent);
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .95;
  filter: drop-shadow(0 0 10px rgba(247,196,0,.14));
}
.pdp__featureText{ display:inline-block; line-height: 1.2; }

.pdp__form{ display:grid; gap: 12px; }
.pdp__label{ font-weight: 900; text-transform: uppercase; letter-spacing: 1px; font-size: 12px; color: rgba(255,255,255,.75); }
.pdp__opts{ display:grid; gap: 14px; }
.pdp__labelRow{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.pdp__val{ font-weight: 900; color: rgba(242,195,0,.95); letter-spacing:.6px; }
.pdp__chips{ display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; }
.pdp__chipBtn{
  appearance:none;
  border-radius: 999px;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.85);
  font-weight: 900;
  letter-spacing: .4px;
  cursor: pointer;
}
.pdp__chipBtn:hover{ border-color: rgba(242,195,0,.25); background: rgba(242,195,0,.10); color: rgba(255,255,255,.95); }
.pdp__chipBtn.is-selected{
  border-color: rgba(242,195,0,.45);
  background: rgba(242,195,0,.18);
  color: rgba(255,255,255,.98);
  box-shadow: 0 0 0 3px rgba(242,195,0,.08);
}
.pdp__select{
  width: 100%;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(0,0,0,.25);
  color: rgba(255,255,255,.92);
  font-weight: 850;
}
.pdp__select--hidden{ display:none !important; }
.pdp__qtyRow{
  display:grid;
  grid-template-columns: 64px 1fr 64px;
  gap: 10px;
  align-items:center;
}
.pdp__qtyBtn{
  height: 54px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.25);
  color: rgba(255,255,255,.92);
  font-weight: 1000;
  font-size: 18px;
}
.pdp__qty{
  height: 54px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.18);
  color: rgba(255,255,255,.92);
  text-align:center;
  font-weight: 950;
  font-size: 16px;
}
.pdp__atc{
  height: 56px;
  border-radius: 14px;
  border: 0;
  background: var(--jr-yellow, #f2c300);
  color: #111;
  font-weight: 1000;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: 15px;
}
.pdp__atc:hover{ filter: brightness(1.05); }
.pdp__atc[disabled]{ opacity: .5; cursor:not-allowed; }

.pdp__label{
  display:block;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 950;
  color: rgba(255,255,255,.70);
  font-size: 12px;
  margin: 16px 0 10px;
}

/* Dawn/Shopify default card fallbacks (prevents white tiles if any default sections slip in) */
.card-wrapper .card,
.card-wrapper .card__inner,
.card-wrapper .card__content,
.card,
.card__inner,
.card__content,
.card__information,
.card-information{
  background: rgba(0,0,0,.55) !important;
  color: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 22px;
}
.card__media,
.card__media .media,
.card__media img{ border-radius: 18px; }
.price,
.price__regular,
.price-item{ color: rgba(255,255,255,.92) !important; }
.card-information__text,
.full-unstyled-link{ color: rgba(255,255,255,.92) !important; }

.pdp__compat{
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.10);
}
.pdp__compatLabel{
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 950;
  color: rgba(255,255,255,.75);
  font-size: 12px;
  margin-bottom: 10px;
}
.pdp__chip{
  display:inline-flex;
  padding: 10px 14px;
  border-radius: 999px;
  background: #19c15a;
  color: #061a0d;
  font-weight: 1000;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: 12px;
}

.pdp__acc{
  margin-top: 18px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.25);
  overflow:hidden;
}
.pdp__acc summary{
  cursor:pointer;
  padding: 16px 16px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 1000;
  color: rgba(255,255,255,.92);
  display:flex;
  justify-content: space-between;
  align-items:center;
}
.pdp__acc summary::-webkit-details-marker{ display:none; }
.pdp__acc summary::after{
  content: "▾";
  font-size: 16px;
  line-height: 1;
  opacity: .9;
  transform: rotate(0deg);
  transition: transform .2s ease;
}
.pdp__acc[open] summary::after{ transform: rotate(180deg); }
.pdp__accBody{
  padding: 0 16px 18px;
  color: rgba(255,255,255,.82);
  line-height: 1.55;
}


/* v26 mockup match: header/search/util row */
.hdr__top{
  max-width: 1320px;
  margin: 0 auto;
  padding: 18px 18px 12px;
  display: grid;
  grid-template-columns: 160px 1fr auto;
  gap: 18px;
  align-items: center;
}
.hdr__logo{ height: 42px; width: auto; object-fit: contain; }
.hdr__search{
  display:flex; align-items:center;
  border-radius: 12px;
  overflow:hidden;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
}
.hdr__search input{
  flex:1; padding: 14px 16px;
  background: transparent; border:0; outline:0;
  color: rgba(255,255,255,.92);
  font-weight: 800;
}
.hdr__search button{
  width: 56px; height: 48px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(242,195,0,.18);
  border:0; color: rgba(255,255,255,.95);
  font-weight: 1000; cursor:pointer;
}
.hdr__util{ display:flex; gap: 18px; align-items:center; justify-content:flex-end; }
.hdr__utilLink{
  display:flex; gap: 8px; align-items:center;
  color: rgba(255,255,255,.88);
  font-weight: 850;
  text-decoration:none;
  white-space: nowrap;
}
.hdr__utilLink span{ opacity:.95; }
@media (max-width: 980px){
  .hdr__top{ grid-template-columns: 1fr; gap: 12px; }
  .hdr__util{ justify-content: space-between; }
}

/* v26: hero banner like mockup */
.homeHero{
  margin: 18px auto 0;
  max-width: 1320px;
  padding: 0 18px;
}
.homeHero__inner{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.18));
  padding: 22px 22px;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 18px;
}
.homeHero__kicker{
  font-weight: 1000;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,.78);
  font-size: 12px;
}
.homeHero__title{
  margin: 6px 0 0;
  font-size: 34px;
  line-height: 1.05;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 1000;
}
.homeHero__title span{ color: rgba(242,195,0,.95); }
.homeHero__price{ margin-top: 10px; display:flex; gap: 12px; align-items:center; flex-wrap:wrap; }
.homeHero__was{ text-decoration: line-through; opacity:.7; font-weight: 900; }
.homeHero__now{ font-size: 26px; font-weight: 1100; color: rgba(242,195,0,.95); }
.homeHero__pill{
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(235, 51, 51, .18);
  border: 1px solid rgba(235, 51, 51, .45);
  font-weight: 950;
  text-transform: uppercase;
  font-size: 12px;
}
.homeHero__cta{
  padding: 14px 18px;
  border-radius: 14px;
  background: rgba(235, 51, 51, 1);
  color: #fff;
  font-weight: 1000;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration:none;
  white-space: nowrap;
}
@media (max-width: 860px){
  .homeHero__inner{ flex-direction: column; align-items:flex-start; }
  .homeHero__title{ font-size: 28px; }
}


/* v27: home hero image like provided mockup */
.homeHero__inner--withArt{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  align-items: center;
  gap: 22px;
  padding: 22px;
}
.homeHero__sub{
  margin-top: 10px;
  color: rgba(255,255,255,.72);
  font-weight: 800;
  max-width: 58ch;
}
.homeHero__ctaRow{
  display:flex;
  gap: 12px;
  margin-top: 16px;
  flex-wrap: wrap;
}
.homeHero__cta{ border-radius: 14px; padding: 14px 18px; font-weight: 1000; letter-spacing: 1px; text-transform: uppercase; text-decoration:none; }
.homeHero__cta--gold{
  background: rgba(242,195,0,1);
  color: #0b0b0b;
}
.homeHero__cta--ghost{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.92);
}
.homeHero__art{ position: relative; border: none; background: none; border-radius: 18px; overflow:hidden; }

.homeHero__art img{
  width:100%;
  height:auto;
  display:block;
}
@media (max-width: 980px){
  .homeHero__inner--withArt{ grid-template-columns: 1fr; }
}

/* v27: tidy mega menu like mockup (compact, aligned) */
.mega__panel{
  padding: 16px !important;
}
.mega__cols{
  gap: 18px !important;
  grid-template-columns: repeat(4, minmax(190px, 1fr)) !important;
}
.mega__head{
  font-size: 12px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.82) !important;
  margin-bottom: 10px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
}
.mega__col a{
  padding: 8px 0 !important;
  font-size: 14px !important;
  line-height: 1.1 !important;
  color: rgba(255,255,255,.76) !important;
}
.mega__col a:hover{
  color: rgba(242,195,0,.95) !important;
}
.mega__bottom{
  margin-top: 14px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(255,255,255,.10) !important;
}
@media (max-width: 1100px){
  .mega__cols{ grid-template-columns: repeat(2, minmax(180px, 1fr)) !important; }
}


.homeHero__artInner{ position: relative; width: 100%; height: 100%; overflow: hidden; }
.homeHero__artInner img{
  width: 100%;
  max-width: 100%;
  height: auto;
  display:block;
  transform: none;
  animation: none;
}

  to{ transform: translateX(0%); }
}
@media (max-width: 980px){
  .homeHero__artInner img{ width: 100%; transform: none; animation: none; }
}


/* v28: mega menu style to match reference image */
.mega__panel{
  max-width: 980px;
  margin: 0 auto;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(10,10,10,.94) !important;
  box-shadow: 0 40px 140px rgba(0,0,0,.80) !important;
}

.mega__cols{
  display:grid !important;
  grid-template-columns: 1.2fr 1fr .9fr !important;
  gap: 28px !important;
  align-items: start !important;
}

.mega__col{ min-width: 0; }
.mega__head{
  font-weight: 1000 !important;
  letter-spacing: 1.5px !important;
  font-size: 12px !important;
  opacity: .92 !important;
  text-transform: uppercase !important;
  margin: 2px 0 12px !important;
  padding: 0 0 10px !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
}
.mega__col ul{ margin: 0; padding: 0; list-style: none; }
.mega__col li{ margin: 0; padding: 0; }
.mega__col a{
  display:block !important;
  padding: 7px 0 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  color: rgba(255,255,255,.72) !important;
  text-decoration: none !important;
}
.mega__col a:hover{ color: rgba(242,195,0,.98) !important; }

/* brand logo grid inside mega menu */
.mega__brands{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 8px;
}
.mega__brands a{
  display:flex !important;
  align-items:center;
  justify-content:center;
  padding: 8px !important;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
}
.mega__brands img{
  width: 100%;
  height: 26px;
  object-fit: contain;
  filter: drop-shadow(0 6px 14px rgba(0,0,0,.45));
  opacity: .95;
}

.mega__bottom{
  display:flex !important;
  justify-content:center !important;
  margin-top: 16px !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(255,255,255,.10) !important;
}
.mega__bottom a{
  font-weight: 1000 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 12px 16px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(242,195,0,.28) !important;
  background: rgba(242,195,0,.10) !important;
  color: rgba(255,255,255,.92) !important;
}
@media (max-width: 1100px){
  .mega__panel{ max-width: 92vw; }
}
@media (max-width: 860px){
  .mega__cols{ grid-template-columns: 1fr !important; gap: 18px !important; }
  .mega__brands{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}


/* v29: static hero image (no motion) */
.homeHero__artInner img{
  width: 100% !important;
  transform: none !important;
  animation: none !important;
}


/* v29: mega menu reference layout */
.mega--ref .mega__panel{
  padding: 18px !important;
}
.mega--ref .mega__cols{
  grid-template-columns: 1.25fr 1.05fr .85fr !important;
}
.mega--ref .mega__spacer{ height: 14px; }
.mega--ref .mega__col--brands{
  display:flex;
  flex-direction: column;
}
.mega--ref .mega__bottom--center{
  margin-top: 14px !important;
  padding-top: 14px !important;
}


/* v31: STATIC hero image (no motion) */
.homeHero__artInner img{
  animation: none !important;
  transform: none !important;
}

/* v31: mega menu rebuilt to match reference (compact columns, clickable, no overlap) */
li.mega{ position: relative; }
.mega-menu{
  display:none;
  position:absolute;
  top: calc(100% + 12px);
  left: 0;
  min-width: 660px;
  max-width: 760px;
  padding: 22px 26px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(10,10,10,.96);
  box-shadow: 0 40px 140px rgba(0,0,0,.85);
  backdrop-filter: blur(14px);
  z-index: 9999;
}
li.mega:hover > .mega-menu,
li.mega:focus-within > .mega-menu{ display:block; }

/* keep open a moment when moving cursor */
.mega-menu::before{
  content:"";
  position:absolute;
  left:0; right:0;
  top:-14px; height:14px;
}

.megaGrid{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr .9fr;
  gap: 22px;
  align-items: start;
}
.megaHead{
  font-size: 12px;
  font-weight: 1000;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: rgba(255,255,255,.92);
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,.10);
  margin: 0 0 10px;
}
.megaHead--spaced{ margin-top: 16px; }

.megaList{ list-style:none; margin:0; padding:0; }
.megaList li{ margin:0; padding:0; }
.megaList a{
  display:block;
  padding: 7px 0;
  font-size: 14px;
  font-weight: 800;
  color: rgba(255,255,255,.72);
  text-decoration:none;
}
.megaList a:hover{ color: rgba(242,195,0,.98); }

.megaBlock--brands{ display:flex; flex-direction:column; }
.megaBrands{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}
.megaBrand{
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 6px;
  border-radius: 10px;
  border: none;
  background: transparent;
}
.megaBrand img{
  width:100%;
  height: 24px;
  object-fit: contain;
  opacity: .96;
}

.megaCta{ margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.10); }
.megaCtaBtn{
  display:block;
  text-align:center;
  padding: 12px 14px;
  border-radius: 12px;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: 1px;
  border: 1px solid rgba(242,195,0,.32);
  background: rgba(242,195,0,.10);
  color: rgba(255,255,255,.92);
  text-decoration:none;
}
.megaCtaBtn:hover{ background: rgba(242,195,0,.16); }

@media (max-width: 980px){
  .mega-menu{ min-width: 94vw; max-width: 94vw; left: 50%; transform: translateX(-50%); padding: 18px 16px; }
  .megaGrid{ grid-template-columns: 1fr 1fr; gap: 16px; }
  .megaBrands{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 640px){
  .megaGrid{ grid-template-columns: 1fr; }
}


/* v35: split hero layout + controller image (static) */
.homeHero__inner--split{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 22px;
  align-items: center;
  padding: 22px;
}
.homeHero__artFrame{
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.35);
  box-shadow: 0 22px 90px rgba(0,0,0,.65);
}
.homeHero__artImg{
  width: 100%;
  height: auto;
  display:block;
  object-fit: contain;
  background: rgba(0,0,0,.15);
  animation: none !important;
  transform: none !important;
}
@media (max-width: 980px){
  .homeHero__inner--split{ grid-template-columns: 1fr; }
}

/* v35: disable any leftover hero animations */
.homeHero__artInner img,.homeHero__art img{animation:none !important;transform:none !important;}


/* v35: mega menu match (compact like reference) */
.mega.mega--v35{
  width: min(980px, 92vw) !important;
  padding: 16px 16px 14px !important;
  border-radius: 18px !important;
  background: rgba(10,10,10,.94) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 40px 140px rgba(0,0,0,.80) !important;
}
.mega__cols--v35{
  display:grid !important;
  grid-template-columns: 1.05fr 1.2fr .95fr !important;
  gap: 26px !important;
  align-items:start !important;
}
.mega__cols--v35 .mega__head{
  font-weight: 1000 !important;
  letter-spacing: 1.6px !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
  color: rgba(255,255,255,.86) !important;
  margin: 2px 0 12px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
}
.mega__cols--v35 ul{ margin:0; padding:0; list-style:none; }
.mega__cols--v35 li{ margin:0; padding:0; }
.mega__cols--v35 a{
  display:block !important;
  padding: 7px 0 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  color: rgba(255,255,255,.72) !important;
  text-decoration:none !important;
}
.mega__cols--v35 a:hover{ color: rgba(242,195,0,.98) !important; }
.mega__spacer{ height: 12px; }
.mega__brands{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
}
.mega__brands a{
  display:flex !important;
  align-items:center;
  justify-content:center;
  padding: 10px !important;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
}
.mega__brands img{
  width: 100%;
  height: 26px;
  object-fit: contain;
}
.mega__bottom--v35{
  margin-top: 14px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(255,255,255,.10) !important;
}
.mega__bottom--v35 .mega__cta{
  display:inline-flex;
  justify-content:center;
  width: 100%;
  padding: 12px 14px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(242,195,0,.28) !important;
  background: rgba(242,195,0,.10) !important;
  font-weight: 1000 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
}
@media (max-width: 920px){
  .mega__cols--v35{ grid-template-columns: 1fr 1fr !important; }
  .mega__cols--v35 .mega__col:last-child{ grid-column: 1 / -1; }
  .mega__brands{ grid-template-columns: repeat(4, minmax(0,1fr)); }
}
@media (max-width: 520px){
  .mega__cols--v35{ grid-template-columns: 1fr !important; gap: 18px !important; }
  .mega__brands{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}

/* v36: ensure hero static */
.homeHero__artImg{animation:none !important;transform:none !important;}

/* v38 home mockup */
:root{--jr-accent:#f0c400;}
.jrHome{padding:18px 0 34px;}
.jrHome__heroCard{position:relative;
  margin:18px auto 18px;
  width:min(1220px, calc(100% - 32px));
  border-radius:26px;
  overflow:hidden;

  /* Background: subtle gold glow + dark scrim + hero image */
  background-image:
    radial-gradient(900px 520px at 14% 18%, rgba(240, 196, 0, 0.10), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, rgba(0,0,0,0.12), rgba(0,0,0,0.55)),
    var(--jr-hero-bg);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:65% 55%;

  border:1px solid rgba(255,255,255,0.10);
  box-shadow:0 18px 60px rgba(0,0,0,0.55);
  overflow:hidden;
}


.jrHome__heroGrid{display:grid;
  grid-template-columns: 1.05fr .95fr;
  align-items:center;
  gap:24px;
  padding:44px 44px;
  min-height:440px;
  position:relative;
}
.jrHome__kicker{letter-spacing:.22em;font-weight:700;color:rgba(255,255,255,0.85);font-size:12px;}
.jrHome__headline{margin:12px 0 12px;line-height:0.95;text-transform:uppercase;}
.jrHome__headlineA{display:block;font-size:clamp(36px,4.4vw,60px);font-weight:900;color:rgba(255,255,255,0.95);}

.jrHome__headlineB{display:block;font-size:clamp(36px,4.4vw,60px);font-weight:900;color:var(--jr-accent);}

.jrHome__sub{margin:14px 0 22px;color:rgba(255,255,255,0.72);font-size:18px;max-width:520px;}
.jrHome__actions{display:flex;gap:14px;flex-wrap:wrap;}
.jrBtn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 20px;border-radius:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;border:1px solid rgba(255,255,255,0.18);text-decoration:none;transition:transform .12s ease,background .12s ease,border-color .12s ease;}
.jrBtn:hover{transform:translateY(-1px);border-color:rgba(255,255,255,0.28);}
.jrBtn--primary{background:var(--jr-accent);color:#121212;border-color:rgba(0,0,0,0.25);}
.jrBtn--ghost{background:rgba(255,255,255,0.06);color:rgba(255,255,255,0.92);}
.jrHome__artWrap{
  position:relative;
  display:flex;
  justify-content:flex-end;
  align-items:flex-end;
  min-height:440px;
}

.jrHome__artFrame{
  background:transparent;
  border:0;
  box-shadow:none;

  width:min(560px,100%);
  aspect-ratio:16/11;
  border-radius:22px;
  background:radial-gradient(120% 100% at 10% 0%, rgba(255,255,255,0.06), rgba(0,0,0,0.45));
  border:1px solid rgba(255,255,255,0.14);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,0.35), 0 24px 70px rgba(0,0,0,0.55);
  overflow:hidden;
}
.jrHome__artImg{width:100%;height:100%;object-fit:contain;object-position:center right;display:block;}
.jrHome__brandCard{
  width:min(1220px, calc(100% - 32px));
  margin:0 auto;
  border-radius:26px;
  padding:18px 22px;
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.10);
}

/* v39: exact reference marquee + hero background composition */

/* Announcement marquee (continuous scroll like reference) */
.site-header > .announcement-bar{overflow:hidden;}
.announcement-bar__viewport{
  width:100%;
  overflow:hidden;
  /* soft fade on edges */
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
}
.announcement-bar__track{
  display:flex;
  align-items:center;
  width:max-content;
  gap:0;
  animation: jrMarquee 18s linear infinite;
  will-change: transform;
}
.announcement-bar__content{
  display:flex;
  align-items:center;
  gap:12px;
  white-space:nowrap;
  padding: 0 18px;
}
.announcement-bar__content > *{flex:0 0 auto;}
@keyframes jrMarquee{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
  .announcement-bar__track{animation:none;}
}

/* v55: marquee gapless + cart drawer + cart count */

/* Gapless marquee: JS sets --jr-marquee-shift to the width of one loop */
.announcement-bar__track{animation: jrMarqueeVar 22s linear infinite;}
@keyframes jrMarqueeVar{
  from{ transform: translateX(0); }
  to{ transform: translateX(calc(-1 * var(--jr-marquee-shift, 50%))); }
}

/* Cart button count badge */
.cart-btn{position:relative;}
.cart-btn__count{
  position:absolute;
  top:6px;
  left:auto;
  right:12px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font:600 11px/1 Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  color:#111;
  background:var(--jr-accent);
  border:1px solid rgba(0,0,0,.25);
}
.cart-btn__count:empty{display:none;}

/* Cart drawer */
.jr-cart{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  backdrop-filter: blur(6px);
  z-index:10010;
  display:none;
}
.jr-cart.is-open{display:block;}
.jr-cart__panel{
  position:absolute;
  top:16px;
  right:16px;
  width:min(420px, calc(100vw - 32px));
  height:calc(100vh - 32px);
  border-radius:22px;
  background:rgba(16,16,16,.92);
  border:1px solid rgba(255,255,255,.10);
  box-shadow: 0 20px 80px rgba(0,0,0,.55);
  display:flex;
  flex-direction:column;
}

.jr-cart__panel::before{
  content:"";
  position:absolute;
  inset:0;
  background: var(--jr-logo-url) center/260px no-repeat;
  opacity:.06;
  pointer-events:none;
}
.jr-cart__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 16px 10px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.jr-cart__close{
  width:36px;height:36px;border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:#fff;
}
.jr-cart__body{padding:14px 16px; overflow:auto; flex:1;}
.jr-cart__loading{opacity:.8;}
.jr-cart__item{display:grid; grid-template-columns:64px 1fr auto; gap:12px; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.07);}
.jr-cart__item img{width:64px; height:64px; object-fit:cover; border-radius:14px; border:1px solid rgba(255,255,255,.08);} 
.jr-cart__title{font:600 14px/1.2 Inter, system-ui; margin:0 0 6px;}
.jr-cart__meta{opacity:.8; font:500 12px/1.2 Inter, system-ui;}
.jr-cart__qty{display:flex; align-items:center; gap:8px;}
.jr-cart__qty button{width:28px;height:28px;border-radius:10px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);color:#fff;}
.jr-cart__qty input{width:44px; text-align:center; border-radius:10px; border:1px solid rgba(255,255,255,.10); background:rgba(0,0,0,.25); color:#fff; padding:6px 0;}
.jr-cart__price{font:700 13px/1 Inter, system-ui;}
.jr-cart__remove{margin-top:8px; display:inline-block; opacity:.75; font:600 12px/1 Inter, system-ui;}
.jr-cart__foot{padding:14px 16px 16px; border-top:1px solid rgba(255,255,255,.08);} 
.jr-cart__subtotal{display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; opacity:.95;}
.jr-cart__checkout, .jr-cart__view{
  display:flex; align-items:center; justify-content:center;
  height:46px; border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  text-decoration:none;
  font:700 14px/1 Inter, system-ui;
}
.jr-cart__checkout{background:var(--jr-accent); color:#111; border-color:rgba(0,0,0,.25);} 
.jr-cart__view{margin-top:10px; background:rgba(255,255,255,.04); color:#fff;}
.jr-cart__checkout.is-disabled{opacity:.55; pointer-events:none; filter:saturate(.6);}


/* Mega menu heading pill highlight (matches reference screenshot)
   - Headings are accent yellow
   - Subtle pill backdrop to lift off the dark panel
*/
.mega--ref .mega__head{
  display:inline-flex;
  align-items:center;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(240,196,0,.06);
  color:var(--jr-accent);
  letter-spacing:.12em;
}

/* Hero: rebuild to match reference (texture bg + controller photo + left scrim) */
.jrHome__heroCard{
  background-image: none !important;
  background: var(--jr-hero-tex) center/cover no-repeat !important;
}
.jrHome__heroCard::before{
  content:"";
  position:absolute;
  inset:0;
  /* Fade like reference: keep texture visible under text */
  background:
    radial-gradient(900px 520px at 14% 18%, rgba(240,196,0,0.12), rgba(0,0,0,0) 60%),
    linear-gradient(90deg,
      rgba(0,0,0,0.68) 0%,
      rgba(0,0,0,0.56) 38%,
      rgba(0,0,0,0.22) 62%,
      rgba(0,0,0,0.08) 78%,
      rgba(0,0,0,0) 92%
    ),
    linear-gradient(180deg, rgba(0,0,0,0.06), rgba(0,0,0,0.40));
  pointer-events:none;
  z-index:2;
}
.jrHome__heroCard::after{
  content:"";
  position:absolute;
  inset:0;
  background: var(--jr-hero-controller) no-repeat;
  background-size: 760px auto;
  background-position: right 18px center;
  pointer-events:none;
  z-index:0;
}
.jrHome__heroGrid{
  grid-template-columns: 1fr !important;
  padding:44px 44px !important;
  min-height: 470px !important;
  position:relative;
  z-index:1;
}
@media (max-width: 980px){
  .jrHome__heroCard::after{ background-size: 560px auto; background-position: right 14px center; }
  .jrHome__heroGrid{ min-height: 440px !important; }
}
@media (max-width: 720px){
  .jrHome__heroCard::after{ background-size: 420px auto; background-position: right -40px center; opacity: .95; }
  .jrHome__heroGrid{ padding:34px 22px !important; min-height: 520px !important; }
}
.jrHome__brandLabel{font-weight:800;letter-spacing:.18em;text-transform:uppercase;font-size:12px;color:rgba(255,255,255,0.72);margin-bottom:14px;}
.jrHome__brandRow{display:flex;align-items:center;gap:22px;overflow-x:auto;padding-bottom:6px;}
.jrHome__brandRow img{height:34px;width:auto;opacity:.92;filter:drop-shadow(0 8px 18px rgba(0,0,0,0.55));}
@media (max-width:860px){
  .jrHome__heroGrid{grid-template-columns:1fr;padding:28px 22px;}
  .jrHome__artWrap{justify-content:center;}
  .jrHome__brandRow img{height:28px;}
}


/* jrHome hero spacing */
@media (max-width: 900px){
  .jrHome__heroGrid{padding:28px 22px; min-height:360px;}
  .jrHome__copy{padding-right:0; max-width:560px;}
}

.cart-btn__icon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;}
.cart-btn__icon svg{width:18px;height:18px;display:block;}
.cart-btn__label{font-weight:700;}

/* Announcement */
.announcement{border-bottom:1px solid var(--border); background:rgba(0,0,0,.75);}
.announcement .marquee__track{color:var(--accent); font-family:Oswald, Inter, sans-serif; letter-spacing:.04em;}

/* Bottom pill */
.jrPill{
  width:min(1220px, calc(100% - 32px));
  margin:16px auto 0;
  border-radius:26px;
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.10);
  box-shadow:0 18px 60px rgba(0,0,0,0.45);
}
.jrPill__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:16px 18px;
}
.jrPill__label{
  font-family: Oswald, Inter, sans-serif;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:700;
  color:rgba(255,255,255,0.7);
  font-size:12px;
  padding-left:6px;
}
.jrPill__tiles{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
.jrPill__tile{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.10);
  text-decoration:none;
}
.jrPill__tile:hover{border-color:rgba(242,195,0,.35);transform:translateY(-1px);}
.jrPill__num{
  font-family: Oswald, Inter, sans-serif;
  font-weight:700;
  color:rgba(255,255,255,0.85);
  letter-spacing:.06em;
}
@media (max-width:860px){
  .jrPill__inner{flex-direction:column;align-items:flex-start;}
  .jrPill__tiles{justify-content:flex-start;}
}

.jrPill__icon{width:26px;height:18px;display:inline-flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.85);}
.jrPill__icon svg{width:26px;height:18px;display:block;}


/* ===== v-identical: header + announcement + hero match reference ===== */
.header{
  background:#050505;
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.header__inner{
  max-width: 1240px;
  margin: 0 auto;
  padding: 14px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}
.brand{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);}
.brand img.logo{height:20px;width:auto;display:block;opacity:.95;}
.navToggle{display:none;}

.menu{display:flex;align-items:center;gap:26px;list-style:none;margin:0;padding:0;}
.menu__link{
  display:inline-flex;
  align-items:center;
  padding:10px 8px;
  font-family: Oswald, Inter, sans-serif;
  text-transform:uppercase;
  font-size:13px;
  letter-spacing:1.2px;
  font-weight:700;
  color:rgba(255,255,255,0.88);
}
.menu__link:hover{color:#fff;}
.menu__link.is-active{color:#fff;position:relative;}
.menu__link.is-active::after{
  content:"";
  position:absolute;
  left:0;right:0;
  height:2px;
  bottom:-8px;
  background:rgba(255,255,255,0.9);
  border-radius:2px;
}

.cart-btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 18px;
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
}
.cart-btn:hover{background:rgba(255,255,255,0.06);}
.cart-btn svg{width:18px;height:18px;opacity:.95;}

.announcement-bar{
  background:#050505;
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.announcement-bar__inner{
  max-width:1240px;
  margin:0 auto;
  padding:10px 18px;
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:nowrap;
  white-space:nowrap;
  overflow:hidden;
  color: rgba(240,196,0,0.95);
  font-weight:700;
  font-size:14px;
}
.announcement-bar__inner > *{flex:0 0 auto;}

.announcement-bar__inner .sep{opacity:.8}

/* HERO */
.jrHome{padding:0;}
.jrHome__heroCard{
  width:100%;
  margin:0;
  border-radius:0;
  border:0;
  box-shadow:none;
  background-image:
    linear-gradient(90deg, rgba(0,0,0,0.78) 0%, rgba(0,0,0,0.55) 42%, rgba(0,0,0,0.22) 70%, rgba(0,0,0,0.10) 100%),
    radial-gradient(900px 520px at 16% 18%, rgba(240, 196, 0, 0.10), rgba(0,0,0,0) 60%),
    var(--jr-hero-bg);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
}
.jrHome__heroGrid{
  max-width:1240px;
  margin:0 auto;
  padding:64px 18px 54px;
  min-height:520px;
  grid-template-columns: 1.05fr .95fr;
  gap:30px;
}
.jrHome__kicker{opacity:.55;font-size:14px;letter-spacing:.22em;}
.jrHome__headlineA{font-size:clamp(44px,5.0vw,74px);}
.jrHome__headlineB{font-size:clamp(44px,5.0vw,74px);}
.jrHome__sub{font-size:18px;color:rgba(255,255,255,0.78);max-width:560px;margin-top:10px;}
.jrBtn{border-radius:999px;padding:16px 26px;}
.jrBtn--primary{background:rgba(240,196,0,1); color:#121212;}
.jrBtn--ghost{border:1px solid rgba(255,255,255,0.28);background:rgba(0,0,0,0.18);}

.jrHome__artWrap{position:relative;}
.jrHome__heroProduct{
  position:absolute;
  right:-40px;
  bottom:0;
  width:min(860px, 58vw);
  max-height:420px;
  height:auto;
  object-fit:contain;
  filter: drop-shadow(0 28px 60px rgba(0,0,0,0.65));
  transform: rotate(-2deg);
}


/* bottom pill placement more like reference */
.jrPill{max-width:1240px;margin:-26px auto 26px;padding:0 18px;}



/* === OVERRIDES: match reference hero + announcement === */
.announcement-bar{overflow:hidden;}
.announcement-bar__inner{
  animation:none !important;
  white-space:nowrap;
  flex-wrap:nowrap;
  justify-content:flex-start;
}
.announcement-bar__inner > *{flex:0 0 auto;}

.jrHome{padding:0;}
.jrHome__heroCard{
  width:100%;
  margin:0;
  border-radius:0;
  border:0;
  box-shadow:none;
  overflow:hidden;
  background-image:
    radial-gradient(900px 520px at 14% 18%, rgba(240, 196, 0, 0.10), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, rgba(0,0,0,0.10), rgba(0,0,0,0.55)),
    var(--jr-hero-bg);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:65% 55%;
}

.jrHome__heroGrid{
  width:100%;
  max-width:1380px;
  margin:0 auto;
  padding:78px 70px;
  min-height:560px;
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:56px;
  align-items:center;
}

.jrHome__copy{max-width:640px;}
.jrHome__kicker{letter-spacing:.24em;font-weight:700;color:rgba(255,255,255,0.65);font-size:12px;}
.jrHome__headline{margin:14px 0 14px;line-height:0.92;text-transform:uppercase;}
.jrHome__headlineA{display:block;font-size:clamp(48px,5.3vw,82px);font-weight:900;color:rgba(255,255,255,0.96);}
.jrHome__headlineB{display:block;font-size:clamp(48px,5.3vw,82px);font-weight:900;color:var(--jr-accent);}

.jrHome__sub{margin:16px 0 26px;font-size:18px;max-width:520px;color:rgba(255,255,255,0.82);}

.jrHome__artWrap{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  width:100%;
}

.jrHome__heroProduct{
  width:min(820px, 60vw);
  max-width:none;
  height:auto;
  display:block;
  transform:translateX(130px) translateY(10px);
  filter:drop-shadow(0 28px 60px rgba(0,0,0,.65));
  pointer-events:none;
  user-select:none;
}

@media (max-width: 990px){
  .jrHome__heroGrid{
    grid-template-columns:1fr;
    padding:56px 22px 34px;
    min-height:unset;
    gap:22px;
  }
  .jrHome__heroProduct{width:min(760px, 92vw); transform:none;}
  .announcement-bar__inner{white-space:normal; flex-wrap:wrap;}
}

/* ===== FINAL OVERRIDES: lock header + announcement to reference PNG ===== */
.site-header{
  background:#050505 !important;
  backdrop-filter:none !important;
  border-bottom:1px solid rgba(255,255,255,0.06) !important;
}

.header-inner{
  max-width:1240px;
  margin:0 auto;
  padding:14px 18px !important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}

.brand{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.08);
}
.brand img{
  height:20px !important;
  width:auto;
  display:block;
  opacity:.95;
}

.menu{gap:26px !important;}
.menu-link{
  padding:10px 8px !important;
  font-family: Oswald, Inter, sans-serif;
  text-transform:uppercase;
  font-size:13px !important;
  letter-spacing:1.2px;
  font-weight:700;
  color:rgba(255,255,255,0.88);
  opacity:1 !important;
}
.menu-link:hover{color:#fff !important;}
.menu-link.is-active{color:#fff !important;}
.menu-link.is-active::after{
  bottom:-8px !important;
  background:rgba(255,255,255,0.92) !important;
}

/* ===== FINAL POLISH: logo sizing + announcement bolt + mobile nav tidy ===== */
/* Logo was too small (make it visible but not huge) */
.brand{width:50px !important; height:50px !important;}
.brand img{height:26px !important; opacity:1 !important;}

@media (max-width: 920px){
  .brand{width:46px !important; height:46px !important;}
  .brand img{height:24px !important;}
}

/* Announcement bar: restore bolt icon + clean typography */
.announcement-bar__content{align-items:center !important;}
.announcement-bar__content .bolt{display:inline-flex; align-items:center; justify-content:center;}
.announcement-bar__content .bolt img{width:14px; height:14px; display:block; filter: drop-shadow(0 1px 0 rgba(0,0,0,.35));}

/* Mobile nav: clearer structure */
.mnav__links .mnav__primary{
  border-color: rgba(242,195,0,.26) !important;
  background: rgba(242,195,0,.10) !important;
  color: rgba(255,255,255,.92) !important;
}

.header-actions{gap:14px !important;}
.cart-btn{
  padding:12px 18px !important;
  gap:10px !important;
  border-radius:999px;
  background:rgba(255,255,255,0.04) !important;
  border:1px solid rgba(255,255,255,0.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
  color:rgba(255,255,255,0.92);
}
.cart-btn:hover{background:rgba(255,255,255,0.06) !important; border-color:rgba(255,255,255,0.16) !important; color:#fff !important;}
.cart-btn__icon svg{width:18px;height:18px;display:block;}

.announcement-bar{
  background:#050505;
  border-top:1px solid rgba(255,255,255,0.06);
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.announcement-bar__inner{
  max-width:1240px;
  margin:0 auto;
  padding:10px 18px;
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:nowrap;
  white-space:nowrap;
  overflow:hidden;
  color: rgba(240,196,0,0.95);
  font-weight:700;
  font-size:14px;
}
.announcement-bar__inner > *{flex:0 0 auto;}
.announcement-bar__inner .sep{opacity:.85}

/* ===== FIXES (Feb 2026): hero + pill placement + announcement visibility ===== */
/* Ensure announcement is always visible (it was previously inside the mega menu) */
.site-header > .announcement-bar{position:relative; z-index:50;}

/* Hero background should be the controller photo on the right, with a left-to-right dark fade behind the copy */
.jrHome{padding:0;}
.jrHome__heroCard{
  position:relative;
  border-radius:0 !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:hidden;
  background-image:
    linear-gradient(90deg, rgba(0,0,0,0.86) 0%, rgba(0,0,0,0.72) 42%, rgba(0,0,0,0.28) 72%, rgba(0,0,0,0.10) 100%),
    radial-gradient(900px 520px at 16% 18%, rgba(240,196,0,0.10), rgba(0,0,0,0) 60%),
    var(--jr-hero-bg);
  background-repeat:no-repeat;
  background-size:cover;
  background-position: right center;
}

/* Remove the right-column “boxed image” layout – the image is in the background now */
.jrHome__heroGrid{
  max-width:1240px;
  margin:0 auto;
  padding:64px 18px 74px;
  min-height:520px;
  display:grid;
  grid-template-columns:1fr;
  gap:0;
}

/* Keep the copy sitting comfortably on the left like the reference */
.jrHome__copy{max-width:680px; padding-right:0;}

/* Pill should sit directly under the hero and overlap it (not drift down to the footer) */
.jrPill{
  position:relative;
  z-index:10;
  width:min(1220px, calc(100% - 32px));
  margin:-34px auto 26px;
}

@media (max-width: 900px){
  .jrHome__heroGrid{padding:42px 18px 64px; min-height:420px;}
  .jrHome__headlineA,.jrHome__headlineB{font-size:clamp(40px,8vw,64px);}
}

/* ===== v50: HARD LOCK to reference PNG (hero / marquee / mega menu) ===== */

/* Ensure homepage block reserves space so the pill never overlaps footer */
.jrHome{padding:18px 0 70px !important;}

/* Hero card matches reference: rounded, centered, full-bleed background behind text */
.jrHome__heroCard{
  width:min(1220px, calc(100% - 32px)) !important;
  margin:18px auto 0 !important;
  border-radius:26px !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,0.10) !important;
  box-shadow:0 18px 60px rgba(0,0,0,0.55) !important;
  background: var(--jr-hero-tex) center/cover no-repeat !important;
}

/* Fade/scrim must NOT kill the texture on the left – keep it visible like the reference */
.jrHome__heroCard::before{
  background:
    radial-gradient(900px 520px at 14% 18%, rgba(240, 196, 0, 0.12), rgba(0,0,0,0) 62%),
    linear-gradient(90deg, rgba(0,0,0,0.62) 0%, rgba(0,0,0,0.52) 42%, rgba(0,0,0,0.20) 66%, rgba(0,0,0,0.06) 78%, rgba(0,0,0,0) 92%),
    linear-gradient(180deg, rgba(0,0,0,0.10), rgba(0,0,0,0.55))
    !important;
}

/* Controller photo is a layer ON TOP of texture and must extend behind the copy */
.jrHome__heroCard::after{
  background: var(--jr-hero-controller) no-repeat !important;
  background-size: 760px auto !important;
  background-position: right 26px center !important;
  opacity: 1 !important;
}

/* Copy spacing like reference */
.jrHome__heroGrid{
  padding:72px 70px 78px !important;
  min-height: 560px !important;
  grid-template-columns: 1fr !important;
}

/* Bottom pill overlaps hero but stays ABOVE footer */
.jrPill{
  width:min(1220px, calc(100% - 32px)) !important;
  margin:-44px auto 0 !important;
  position:relative !important;
  z-index: 5 !important;
}

/* Announcement bar: brand colors + smooth marquee */
.announcement-bar{
  background: rgba(0,0,0,0.70) !important;
  border-bottom:1px solid rgba(255,255,255,0.08) !important;
}
.announcement-bar__viewport{padding:8px 0 !important;}
.announcement-bar__content{
  font-family: Oswald, Inter, sans-serif !important;
  font-weight:700 !important;
  letter-spacing: .04em !important;
  color: rgba(240,196,0,0.95) !important;
}
.announcement-bar__content .sep{color: rgba(240,196,0,0.95) !important; opacity: .95 !important;}
.announcement-bar__track{animation-duration: 22s !important;}

/* Fix squished PARTS mega menu: correct width + 4 columns + spacing */
.mega-menu--parts{
  width:min(1240px, calc(100vw - 52px)) !important;
  left:50% !important;
  transform: translateX(-50%) !important;
  right:auto !important;
  top: calc(100% + 12px) !important;
  padding:26px 26px 22px !important;
  border-radius:26px !important;
}
.mega-menu--parts .megaGrid{
  display:grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap:44px !important;
  align-items:start !important;
}
.mega-menu--parts .megaBlock{min-width:0 !important;}
.mega-menu--parts .megaHead{margin-bottom:14px !important;}
.mega-menu--parts .megaLink{padding:8px 0 !important;}
.mega-menu--parts .megaBrands{grid-template-columns: repeat(4, minmax(0,1fr)) !important; gap:12px !important;}
.mega-menu--parts .megaCta{margin-top:18px !important; justify-content:flex-end !important;}

@media (max-width: 980px){
  .jrHome__heroGrid{padding:56px 38px 70px !important; min-height:520px !important;}
  .jrHome__heroCard::after{background-size: 600px auto !important; background-position: right 12px center !important;}
  .mega-menu--parts .megaGrid{grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap:28px !important;}
  .mega-menu--parts .megaBlock:last-child{grid-column: 1 / -1 !important;}
}
@media (max-width: 720px){
  .jrHome__heroGrid{padding:42px 22px 76px !important; min-height:560px !important;}
  .jrHome__heroCard::after{background-size: 430px auto !important; background-position: right -40px center !important; opacity:.95 !important;}
  .mega-menu--parts{width:calc(100vw - 24px) !important; padding:18px 16px !important;}
  .mega-menu--parts .megaGrid{grid-template-columns: 1fr !important; gap:18px !important;}
  .mega-menu--parts .megaBrands{grid-template-columns: repeat(3, minmax(0,1fr)) !important;}
}


/* v40: Parts mega menu sizing (match reference wide panel) */
.mega-menu--parts{
  min-width: 1120px;
  max-width: 1240px;
  left: 50%;
  transform: translateX(-50%);
}
.mega-menu--parts .megaGrid{
  grid-template-columns: 280px 280px 280px 1fr;
  gap: 44px;
}
.mega-menu--parts .megaHead{ white-space: normal; }
@media (max-width: 980px){
  .mega-menu--parts{ min-width: 94vw; max-width: 94vw; left: 50%; transform: translateX(-50%); }
  .mega-menu--parts .megaGrid{ grid-template-columns: 1fr 1fr; gap: 18px; }
}

/* v41: final hero + mega menu corrections (reference match) */
.jrHome__heroCard{ position:relative !important; }
.jrHome__heroCard::after{ z-index:0 !important; }
.jrHome__heroCard::before{ z-index:1 !important; pointer-events:none !important; content:"" !important; position:absolute !important; inset:0 !important;
  background:
    radial-gradient(900px 520px at 14% 18%, rgba(240,196,0,0.12), rgba(0,0,0,0) 60%),
    linear-gradient(90deg, rgba(0,0,0,0.68) 0%, rgba(0,0,0,0.56) 38%, rgba(0,0,0,0.22) 62%, rgba(0,0,0,0.08) 78%, rgba(0,0,0,0) 92%),
    linear-gradient(180deg, rgba(0,0,0,0.06), rgba(0,0,0,0.40))
    !important;
}
.jrHome__heroGrid{ position:relative !important; z-index:2 !important; }

/* Parts mega menu: wide 4-column grid like reference */
.mega-menu--parts{ min-width: 1120px !important; max-width: 1240px !important; left:50% !important; transform: translateX(-50%) !important; }
.mega-menu--parts .megaGrid{ grid-template-columns: 280px 280px 280px 1fr !important; gap: 44px !important; }
.mega-menu--parts .megaBrands{ grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
.mega-menu--parts .megaBrand img{ height: 26px !important; }

/* =========================================================
   REFERENCE LOCK v42 (do not remove)
   Fixes: hero background behind text + Parts mega menu sizing
   ========================================================= */

/* HERO: ensure texture + controller sit behind ALL copy (no solid block) */
.template-index .jrHome__heroCard{
  background-image: var(--jr-hero-tex) !important;
  background-size: cover !important;
  background-position: center right !important;
  background-repeat: no-repeat !important;
}
.template-index .jrHome__heroCard::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background-image: var(--jr-hero-controller) !important;
  background-repeat: no-repeat !important;
  background-size: 820px auto !important;
  background-position: right 14px center !important;
  opacity: 1 !important;
  z-index: 0 !important;
  pointer-events:none !important;
}
.template-index .jrHome__heroCard::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  /* Match reference: dark left fade BUT keep texture visible under text */
  background:
    linear-gradient(90deg,
      rgba(0,0,0,.80) 0%,
      rgba(0,0,0,.58) 34%,
      rgba(0,0,0,.30) 54%,
      rgba(0,0,0,.12) 66%,
      rgba(0,0,0,0) 78%),
    radial-gradient(1200px 700px at 35% 18%, rgba(0,0,0,.18), rgba(0,0,0,0) 58%),
    linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.38));
  z-index: 1 !important;
  pointer-events:none !important;
}
.template-index .jrHome__heroGrid{ position:relative !important; z-index:2 !important; }
.template-index .jrHome__heroGrid{
  min-height: 560px !important;
  padding: 64px 62px 92px !important;
}
@media (max-width: 980px){
  .template-index .jrHome__heroCard::after{ background-size: 600px auto !important; background-position: right 10px center !important; }
  .template-index .jrHome__heroGrid{ min-height: 520px !important; padding: 52px 34px 88px !important; }
}
@media (max-width: 720px){
  .template-index .jrHome__heroCard::after{ background-size: 460px auto !important; background-position: right -30px center !important; }
  .template-index .jrHome__heroGrid{ min-height: 560px !important; padding: 44px 20px 96px !important; }
}

/* PARTS mega menu: the LIVE header uses .mega.mega--ref in layout/theme.liquid.
   Force it to the correct reference size and prevent "squished" columns. */
.site-header .has-mega{ position:relative !important; }
.site-header .has-mega > .mega.mega--ref{
  /* Dropdown positioning: keep fixed so it sits under the header,
     but align to the PARTS trigger (not centered like a modal). */
  position:fixed !important;
  top: var(--jr-mega-top, 98px) !important;
  left: var(--jr-mega-left, 24px) !important;
  transform: none !important;
  width: min(760px, calc(100vw - 32px)) !important;
  padding: 0 !important;
  display: none !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  background: none !important;
  z-index: 9999 !important;
}
.site-header .has-mega:hover > .mega.mega--ref,
.site-header .has-mega:focus-within > .mega.mega--ref,
.site-header .has-mega.is-open > .mega.mega--ref{ display:block !important; }

/* Hover bridge (JS positions this element dynamically between trigger and panel) */
.jr-mega-bridge{
  display:none;
  pointer-events:auto;
  background:transparent;
}

.site-header .mega--ref .mega__title{
  position:absolute !important;
  left: 24px !important;
  top: 18px !important;
  z-index: 2 !important;
  display:flex !important;
  align-items:center !important;
  gap: 10px !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.92) !important;
}

.site-header .mega--ref .mega__titleLogo{
  width: 26px !important;
  height: 26px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  padding: 6px !important;
  object-fit: contain !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.55) !important;
}
.site-header .mega--ref .mega__panel{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding: 58px 26px 18px !important; /* space for title */
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(10,10,10,.94) !important;
  box-shadow: 0 40px 140px rgba(0,0,0,.80) !important;
  backdrop-filter: blur(12px) !important;
}
.site-header .mega--ref .mega__cols{
  display:grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 40px !important;
  align-items: start !important;
}
.site-header .mega--ref .mega__brands{ grid-template-columns: repeat(5, minmax(0,1fr)) !important; }

/* Browse All Parts centered at the bottom, like the reference */
.site-header .mega--ref .mega__bottom--center{
  margin-top: 18px !important;
  display:flex !important;
  justify-content:center !important;
}
.site-header .mega--ref .mega__cta{
  width: min(360px, 100%) !important;
  text-align:center !important;
}

@media (max-width: 980px){
  .site-header .has-mega > .mega.mega--ref{ width: min(720px, calc(100vw - 24px)) !important; }
  .site-header .mega--ref .mega__brands{ grid-template-columns: repeat(4, minmax(0,1fr)) !important; }
}
@media (max-width: 720px){
  .site-header .mega--ref .mega__cols{ grid-template-columns: 1fr !important; gap: 18px !important; }
  .site-header .mega--ref .mega__brands{ grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
}

/* FOOTER: bring brand logos strip back */
.footer-logos{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 16px;
  flex-wrap: wrap;
  opacity: .9;
}
.footer-logos img{
  height: 22px;
  width:auto;
  object-fit: contain;
  filter: drop-shadow(0 10px 20px rgba(0,0,0,.55));
}

/* INDEX: bring footer closer (reduce extra empty space under hero) */
.template-index .jrHome{ padding: 0 0 12px !important; }
.template-index .jrHome__heroCard{ margin-bottom: 0 !important; }
@media (max-width: 820px){
  .footer-logos{ display:flex; justify-content:center; }
}

/* ==============================
   JR Finishing: header extras
   ============================== */

/* Announcement bolt should be clearly visible in theme gold */
.announcement-bar__content .bolt img{
  width: 14px;
  height: 14px;
  display: block;
  margin: 0 6px;
  filter: brightness(0) saturate(100%) invert(78%) sepia(58%) saturate(625%) hue-rotate(1deg) brightness(100%) contrast(98%);
}

/* Search pill beside cart */
.header-actions{
  display:flex;
  align-items:center;
  gap: 12px;
}
.header-search{
  position: relative;
  display:flex;
  align-items:center;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.28);
  border-radius: 999px;
  padding: 8px 10px;
  min-width: 220px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
  backdrop-filter: blur(10px);
}

/* Scrollable hint text inside the search pill (before focus/click) */
.header-search__marquee{
  position:absolute;
  left: 14px;
  right: 46px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events:none;
  overflow:hidden;
  white-space: nowrap;
  opacity: .78;
}
.header-search__marquee span{
  display:inline-block;
  padding-left: 100%;
  animation: jrSearchMarquee 8.5s linear infinite;
  font-size: 13px;
  color: rgba(255,255,255,.58);
}
@keyframes jrSearchMarquee{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(-100%); }
}
.header-search.is-active .header-search__marquee{ opacity: 0; }
.header-search__input{
  width: 100%;
  background: transparent;
  border: 0;
  outline: none;
  color: rgba(255,255,255,.9);
  font-family: inherit;
  font-size: 13px;
  letter-spacing: .02em;
  position: relative;
  z-index: 2;
}
.header-search__input::placeholder{ color: rgba(255,255,255,.45); }
.header-search__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border: 0;
  background: transparent;
  color: rgba(240,196,0,.95);
  padding: 0 2px 0 8px;
  cursor: pointer;
}
.header-search__btn svg{ width: 18px; height: 18px; }
@media (max-width: 820px){
  .header-search{ display:none; }
}

/* Social icons beside ACCESSORIES */
.has-social{ display:flex; align-items:center; gap: 10px; }
.has-social .menu-link{ margin-right: 4px; }

/* Social icons in header actions (next to search) */
.header-social{ display:flex; align-items:center; gap: 10px; margin-right: 12px; }
@media (max-width: 820px){
  /* Keep FB/IG visible on mobile header */
  .header-social{ display:flex; gap: 8px; margin-right: 8px; }
  .social-link{ width: 30px; height: 30px; }
}
.social-link{
  width: 32px;
  height: 32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.18);
  color: rgba(240,196,0,.95);
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.social-link svg{ width: 16px; height: 16px; }
.social-link:hover{
  transform: translateY(-1px);
  background: rgba(240,196,0,.08);
  border-color: rgba(240,196,0,.35);
}

/* Mega menu hover buffer so it doesn't "drop" while moving cursor */
.mega.mega--ref::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-18px;
  height:18px;
}

/* Loader (on-brand)
   Black screen + big spinning logo, subtle glow, and a clean progress bar.
   When load completes: lightning flash + quick logo spin, then fade out.
*/
.jr-loader{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#000;
}

/* Announcement bar – keep it on-brand (white text, accent separators + bolt) */
.announcement-bar{
  color: rgba(236,236,236,.92) !important;
}
.announcement-bar__content span{ color: inherit !important; }
.announcement-bar__content .sep{ color: var(--jr-accent) !important; opacity: .95 !important; }
.announcement-bar__content .bolt img{
  width: 18px !important;
  height: 18px !important;
  /* Use the original bolt artwork (no forced gold tint) */
  filter: drop-shadow(0 2px 0 rgba(0,0,0,.35)) !important;
}

.jr-loader__stage{
  position: relative;
  width: min(680px, 94vw);
  padding: 18px 18px 22px;
  text-align:center;
}

/* subtle in-theme texture + glow (kept very restrained) */
.jr-loader__fx{
  position:absolute;
  inset:-40px;
  pointer-events:none;
  background:
    radial-gradient(45% 40% at 50% 40%, rgba(240,196,0,.16) 0%, rgba(240,196,0,0) 58%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.025) 0 10px, rgba(255,255,255,0) 10px 20px);
  opacity: .55;
  filter: blur(.2px);
}

.jr-loader__logo{
  position: relative;
  display:block;
  margin: 0 auto;
  height: 140px;
  width: auto;
  opacity: .98;
  transform-origin: 50% 50%;
  animation: jrLogoSpin 2.2s linear infinite;
  filter:
    drop-shadow(0 26px 70px rgba(0,0,0,.9))
    drop-shadow(0 0 22px rgba(240,196,0,.16));
}

.jr-loader__stage::before{
  content:"";
  position:absolute;
  left:50%;
  top: 64px;
  width: 320px;
  height: 320px;
  transform: translate(-50%,-50%);
  border-radius: 999px;
  background: radial-gradient(circle, rgba(240,196,0,.12) 0%, rgba(240,196,0,0) 62%);
  filter: blur(2px);
  opacity: .9;
  pointer-events:none;
}

@media (max-width: 560px){
  .jr-loader__logo{ height: 112px; }
  .jr-loader__stage::before{ width: 250px; height: 250px; top: 58px; }
}

@keyframes jrLogoSpin{
  0%{ transform: rotate(0deg) scale(1); }
  100%{ transform: rotate(360deg) scale(1); }
}

.jr-loader__bar{
  position: relative;
  width: min(460px, 86vw);
  height: 12px;
  margin: 18px auto 0;
  border-radius: 999px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.10);
  overflow: hidden;
  box-shadow: inset 0 0 20px rgba(0,0,0,.55);
}

.jr-loader__barFill{
  position:absolute;
  inset: 0;
  transform: translateX(-60%);
  background: linear-gradient(90deg,
    rgba(240,196,0,0) 0%,
    rgba(240,196,0,.22) 20%,
    rgba(240,196,0,.95) 45%,
    rgba(240,196,0,.24) 70%,
    rgba(240,196,0,0) 100%);
  filter: drop-shadow(0 0 14px rgba(240,196,0,.25));
  animation: jrBarSweep 1.0s ease-in-out infinite;
}

@keyframes jrBarSweep{
  0%{ transform: translateX(-65%); }
  100%{ transform: translateX(65%); }
}

/* Lightning FX (hidden until complete) */
.jr-loader__zap{
  position:absolute;
  left:50%;
  top: 50%;
  width: 340px;
  transform: translate(-50%,-50%) rotate(-12deg);
  opacity: 0;
  pointer-events:none;
}
.jr-loader__zap img{
  width:100%;
  height:auto;
  filter: invert(78%) sepia(97%) saturate(630%) hue-rotate(5deg) brightness(1.06) contrast(1.05)
          drop-shadow(0 18px 55px rgba(240,196,0,.28));
}

/* Completion sequence */
.jr-loader.is-complete .jr-loader__logo{
  animation: jrLogoFinish .85s cubic-bezier(.2,.9,.2,1) 1;
}
.jr-loader.is-complete .jr-loader__barFill{ animation: none; opacity: .95; }
.jr-loader.is-complete .jr-loader__zap{ animation: jrZap .75s ease-out 1; }
.jr-loader.is-complete .jr-loader__stage::after{
  content:"";
  position:absolute;
  inset:-60px;
  background: linear-gradient(115deg, rgba(240,196,0,0) 0%, rgba(240,196,0,.30) 38%, rgba(240,196,0,0) 70%);
  transform: translateX(-60%) skewX(-12deg);
  animation: jrLoaderFlash .72s ease-out 1;
  pointer-events:none;
}

@keyframes jrLogoFinish{
  0%{ transform: rotate(0deg) scale(1); }
  65%{ transform: rotate(290deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@keyframes jrZap{
  0%{ opacity: 0; transform: translate(-50%,-50%) rotate(-12deg) scale(.92); }
  15%{ opacity: .95; }
  55%{ opacity: .9; }
  100%{ opacity: 0; transform: translate(-50%,-56%) rotate(-12deg) scale(1.04); }
}

@keyframes jrLoaderFlash{
  0%{ transform: translateX(-60%) skewX(-12deg); opacity: 0; }
  15%{ opacity: 1; }
  100%{ transform: translateX(70%) skewX(-12deg); opacity: 0; }
}

.jr-loader.is-done{ opacity: 0; transition: opacity .5s ease; }

@media (prefers-reduced-motion: reduce){
  .jr-loader__logo, .jr-loader__barFill{ animation: none !important; }
}

/* ===== JR Theme hotfix: mega menu layout + collections page + product tiles ===== */
.announcement-bar__content { display:flex; align-items:center; gap:10px; }
.announcement-bar__content .abolt{ width:16px; height:16px; object-fit:contain; filter: drop-shadow(0 0 6px rgba(245,203,0,.35)); }

.mega-menu--parts { left: 0; right: 0; width: 100%; max-width: 1320px; margin: 0 auto; }
.megaShell{ display:grid; grid-template-columns: 1.05fr .95fr; gap:24px; padding:18px; }
.megaContent{ min-width:0; }
.megaMedia{ border-radius:20px; overflow:hidden; background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); }
.megaMedia img{ width:100%; height:100%; object-fit:cover; opacity:.88; transform: translateZ(0); }
.megaGrid3{ display:grid; grid-template-columns: 1.05fr 1fr; gap:26px; }
.megaTitleRow{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.megaDot{ width:28px; height:28px; border-radius:999px; border:1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.04); }
.megaTitle{ font-size:20px; letter-spacing:.14em; font-weight:800; }
.megaHead{ display:inline-flex; align-items:center; padding:8px 14px; border-radius:999px; background: rgba(245,203,0,.10); color: var(--jr-yellow,#f5cb00); font-weight:800; letter-spacing:.14em; font-size:12px; margin: 6px 0 10px; }
.megaHead--mt{ margin-top:18px; }
.megaLink{ display:block; padding:9px 0; color: rgba(255,255,255,.82); font-weight:650; text-decoration:none; }
.megaLink:hover{ color:#fff; text-shadow: 0 0 10px rgba(245,203,0,.15); }
.megaBrands{ display:flex; flex-wrap:wrap; gap:12px; margin-top:10px; }
.megaBrand{ width:92px; height:58px; border-radius:16px; display:flex; align-items:center; justify-content:center; background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.10); }
.megaBrand img{ max-width:70px; max-height:28px; object-fit:contain; filter: drop-shadow(0 0 10px rgba(0,0,0,.35)); }
.megaBrand:hover{ border-color: rgba(245,203,0,.35); box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.megaCta{ margin-top:16px; }
.megaCtaBtn{ display:inline-flex; width:100%; align-items:center; justify-content:center; gap:10px; padding:14px 18px; border-radius:14px; background: rgba(245,203,0,.10); border:1px solid rgba(245,203,0,.25); color:#fff; font-weight:850; letter-spacing:.10em; text-decoration:none; }
.megaCtaBtn:hover{ background: rgba(245,203,0,.14); border-color: rgba(245,203,0,.35); }

.mega-menu--parts{ max-height: calc(100vh - 170px); overflow:auto; }
.mega-menu--parts::-webkit-scrollbar{ width:10px; }
.mega-menu--parts::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.12); border-radius:10px; }
.mega-menu--parts::-webkit-scrollbar-thumb:hover{ background: rgba(245,203,0,.18); }

@media (max-width: 980px){
  .megaShell{ grid-template-columns: 1fr; }
  .megaMedia{ display:none; }
  .megaGrid3{ grid-template-columns:1fr; }
  .megaBrand{ width:88px; height:56px; }
}

/* Featured / product tiles: dark theme (was white) */
.ptile.pcw{ background: rgba(255,255,255,.04) !important; border:1px solid rgba(255,255,255,.10) !important; box-shadow: 0 20px 60px rgba(0,0,0,.55) !important; }
.ptile.pcw .ptitle, .ptile.pcw .pvendor, .ptile.pcw .pprice{ color: rgba(255,255,255,.88) !important; }
.ptile.pcw .pmedia{ background: rgba(0,0,0,.25) !important; border-color: rgba(255,255,255,.10) !important; }
.ptile.pcw .pmedia img{ mix-blend-mode: normal; }

/* Collections list page (new template) */
.collections-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap:18px; }
@media (max-width: 1100px){ .collections-grid{ grid-template-columns: repeat(3, 1fr);} }
@media (max-width: 820px){ .collections-grid{ grid-template-columns: repeat(2, 1fr);} }
@media (max-width: 520px){ .collections-grid{ grid-template-columns: 1fr;} }
.ctile{ display:block; text-decoration:none; border-radius:22px; background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.10); overflow:hidden; box-shadow: 0 22px 60px rgba(0,0,0,.55); }
.ctile__img{ aspect-ratio: 4/3; background: rgba(0,0,0,.35); display:flex; align-items:center; justify-content:center; }
.ctile__img img{ width:100%; height:100%; object-fit:cover; opacity:.92; }
.ctile__body{ padding:16px 16px 18px; }
.ctile__title{ color:#fff; font-weight:900; letter-spacing:.10em; text-transform:uppercase; font-size:14px; }
.ctile__count{ margin-top:8px; color: rgba(255,255,255,.70); font-weight:650; }
.ctile:hover{ border-color: rgba(245,203,0,.35); transform: translateY(-2px); }

/* =========================================================
   JR – Theme hardening pass (cart/search/cards/collections)
   ========================================================= */

/* Product cards: force theme-dark (fix any lingering "white cards") */
.pcw{background:rgba(0,0,0,.34) !important;border:1px solid rgba(255,255,255,.10) !important}
.pcw .pcw__img{background:rgba(255,255,255,.03) !important}
.pcw .pcw__title{color:#fff !important}
.pcw .pcw__vendor{color:rgba(255,255,255,.70) !important}
.pcw .pcw__price{color:#f5cc00 !important}

/* Shopify/Dawn-ish card classes (collection/search/featured products) */
.card, .card__inner, .card__content, .card__information{background:rgba(0,0,0,.28) !important}
.card{border:1px solid rgba(255,255,255,.10) !important;border-radius:22px !important;overflow:hidden}
.card__media{background:rgba(255,255,255,.03) !important}
.card__heading, .card__heading a{color:#fff !important}
.price__regular .price-item, .price-item{color:#f5cc00 !important}

/* Make grids a touch tighter/sleeker */
.collection .grid, .srch__grid{gap:18px !important}
.ptile{border-radius:22px}
.ptile__img{border-radius:16px}
.ptile__title{font-size:16px}
.ptile__meta{font-size:12px}
.ptile__price{font-size:14px}

/* Product page: image area + buttons aligned to theme */
.pdp__mediaInner{background:rgba(255,255,255,.03) !important}
.product-form__submit, button[name="add"], .product-form button[type="submit"]{
  background:#f5cc00 !important;
  color:#0b0b0b !important;
  border:0 !important;
  border-radius:16px !important;
  font-weight:900 !important;
  letter-spacing:.10em !important;
  text-transform:uppercase !important;
}
.product-form__submit:hover, button[name="add"]:hover, .product-form button[type="submit"]:hover{filter:brightness(1.06)}

/* /collections (collection index) tidy */
.listcols{max-width:1200px;margin:0 auto;padding:40px 22px}
.listcols h1{color:#fff;margin:0 0 18px}
.listcols ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.listcols li{margin:0}
.listcols a{display:block;padding:18px 18px;border-radius:18px;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.10);color:#fff}
.listcols a:hover{border-color:rgba(245,204,0,.55);box-shadow:0 0 0 1px rgba(245,204,0,.22) inset}
.listcols a small{display:block;color:rgba(255,255,255,.70);margin-top:6px}
@media (max-width: 900px){.listcols ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 600px){.listcols{padding:26px 16px}.listcols ul{grid-template-columns:1fr}}

/* Cart page styling */
.cartpage{padding:44px 18px}
.cartpage__wrap{max-width:1200px;margin:0 auto}
.cartpage__title{margin:0 0 18px;color:#fff;letter-spacing:.08em;text-transform:uppercase}
.cartpage__empty{background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.10);border-radius:22px;padding:26px}
.cartpage__grid{display:grid;grid-template-columns:1.6fr .8fr;gap:18px;align-items:start}
.cartpage__items{background:rgba(0,0,0,.20);border:1px solid rgba(255,255,255,.08);border-radius:22px;padding:16px}
.citem{display:grid;grid-template-columns:96px 1fr 160px 32px;gap:14px;align-items:center;padding:14px;border-radius:18px}
.citem + .citem{margin-top:10px;border-top:1px solid rgba(255,255,255,.06)}
.citem__img img{width:96px;height:96px;object-fit:cover;border-radius:16px;background:rgba(255,255,255,.03)}
.citem__title{color:#fff;font-weight:800;display:block}
.citem__variant{color:rgba(255,255,255,.65);font-size:12px;margin-top:2px}
.citem__price{color:#f5cc00;font-weight:900;margin-top:8px}
.citem__qty{display:flex;gap:10px;justify-content:flex-end;align-items:center}
.qtybtn{width:38px;height:38px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#fff;font-size:18px;line-height:1}
.qtyinp{width:64px;height:38px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.25);color:#fff;text-align:center}
.citem__remove{color:rgba(255,255,255,.65);font-size:22px;text-decoration:none;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:10px}
.citem__remove:hover{color:#fff;background:rgba(255,255,255,.06)}
.csum{background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.10);border-radius:22px;padding:18px;position:sticky;top:110px}
.csum__row{display:flex;justify-content:space-between;gap:12px;color:#fff;font-size:16px}
.csum__note{color:rgba(255,255,255,.65);margin:10px 0 14px;font-size:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:48px;padding:0 18px;border-radius:16px;text-decoration:none}
.btn--primary{background:#f5cc00;color:#0b0b0b;font-weight:900;letter-spacing:.10em;text-transform:uppercase}
.btn--ghost{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);color:#fff}
.btn--ghost:hover{border-color:rgba(245,204,0,.45)}
.csum__checkout{width:100%;margin-top:6px}
.csum__update,.csum__continue{width:100%;margin-top:10px}
@media (max-width: 900px){.cartpage__grid{grid-template-columns:1fr}.csum{position:static}.citem{grid-template-columns:84px 1fr 120px 32px}.citem__img img{width:84px;height:84px}}

/* =========================================================
   JR polish pass: compatibility badges + mobile social icons
   ========================================================= */

/* Product tile compatibility badge (uses product tag: "Fits: X" or "Fits X") */
.ptile__fit{
  margin-top: 6px;
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(240,196,0,.92);
  opacity: .95;
}

/* PDP compatibility chip */
.pdp__fit{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 10px 0 2px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(240,196,0,.08);
  border: 1px solid rgba(240,196,0,.24);
  color: rgba(240,196,0,.96);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .10em;
  text-transform: uppercase;
}

/* Mobile header social: prevent "glitch" sizing/offset */
.header-social, .social-link{ line-height: 0; }
.social-link svg{ display:block; width: 16px; height: 16px; }

/* --- vFinal: Mobile polish pass (header, grid, cart drawer) --- */
@media (max-width: 820px){
  /* iOS safe-area + remove right-edge "gap" */
  .site-header{
    left:0; right:0; width:100%;
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
  .announcement-bar{
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }

  /* Header spacing + alignment */
  .site-header .header-inner{padding:10px 12px; gap:10px;}
  .site-header .brand .logo{height:34px; width:auto;}
  .navToggle{width:44px; height:44px; border-radius:14px;}

  /* Product grids: reduce "tile" feel + improve density */
  .grid{gap:12px !important;}
  .product-grid{gap:12px !important;}
  .product-card, .card-product, .ptile, .product-tile{border-radius:16px !important;}
  .product-card__info, .card__content{padding:10px 10px 12px !important;}
  .product-card__title, .card__heading{font-size:14px !important; line-height:1.25 !important;}
  .price, .product-card__price{font-size:13px !important;}

  /* Cart drawer: make it feel native on phones */
  .jr-cart__panel{
    /* Slightly inset + rounded so it feels less "massive" on mobile */
    top:10px;
    right:10px;
    left:10px;
    bottom:10px;
    width:auto;
    height:auto;
    border-radius:22px;
  }
  .jr-cart__head{padding:14px 14px 10px;}
  .jr-cart__body{padding:12px 14px;}
  .jr-cart__foot{padding:12px 14px 14px;}
  .jr-cart__item{grid-template-columns:56px 1fr auto; gap:10px;}
  .jr-cart__item img{width:56px; height:56px; border-radius:12px;}
  .jr-cart__qty button{width:26px; height:26px; border-radius:9px;}
  .jr-cart__qty input{width:40px; border-radius:9px; padding:5px 0;}
  .jr-cart__checkout, .jr-cart__view{height:46px; font-size:13px;}
}


/* --- Mobile: align page + remove right-shift overflow --- */
@media (max-width: 749px){
  html, body{ width:100%; max-width:100%; }
  #MainContent{ overflow-x:hidden; }
  /* Use the outer .page padding only (avoid double-padding and odd overflows) */
  .pdp{ padding: 0 !important; gap: 14px !important; }
  .pdp__mediaInner{ padding: 14px !important; min-height: unset !important; }
  .pdp__img{ max-height: 420px !important; }
  .pdp__thumb img{ width: 60px !important; height: 60px !important; }
  /* Anything that accidentally becomes wider than the viewport */
  .page, .pdp, .pdp__media, .pdp__info{ max-width: 100% !important; }
  img, video, iframe, svg{ max-width: 100% !important; }
}

/* === Mobile centering + tighter PDP (final polish) === */
html, body{ width:100%; max-width:100%; overflow-x: clip; }
@supports not (overflow: clip){
  html, body{ overflow-x:hidden; }
}
#MainContent, main, .page, .pdp{ max-width:100%; overflow-x: clip; }

@media (max-width: 749px){
  /* Prevent any long text from forcing horizontal scroll */
  .pdp__title, .pdp__fit, .pdp__vendor{ overflow-wrap:anywhere; word-break: break-word; }
  .pdp__title{ font-size: 26px !important; letter-spacing: .6px !important; }
  .pdp__price{ font-size: 30px !important; letter-spacing: .6px !important; }
  .pdp__compare{ font-size: 18px !important; }
  .pdp__badge{ padding: 5px 10px !important; font-size: 12px !important; }

  /* Reduce card bloat */
  .pdp__info{ padding: 12px 12px 14px !important; border-radius: 14px !important; }
  .pdp__mediaInner{ padding: 10px !important; border-radius: 14px !important; }

  /* Slightly smaller image and thumbs for better balance */
  .pdp__img{ width: min(100%, 84vw) !important; max-height: 320px !important; }
  .pdp__thumb img{ width: 56px !important; height: 56px !important; }

  /* Variant chips + qty tighter so they don't feel oversized */
  .pdp__chipBtn{ padding: 8px 12px !important; font-size: 14px !important; }
  .pdp__qty{ height: 52px !important; }
  .pdp__btn{ height: 52px !important; }
}



/* === Mobile PDP: size down ATC + fix qty/variant overflow === */
@media (max-width: 749px){
  .pdp__chips{
    display:flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    overflow: visible !important;
  }
  .pdp__chipBtn{
    padding: 10px 14px !important;
    font-size: 14px !important;
    border-radius: 999px !important;
    max-width: 100% !important;
  }

  .pdp__qtyRow{
    width: 100% !important;
    max-width: 100% !important;
    display:flex !important;
    align-items:center !important;
    gap: 10px !important;
  }
  
  /* Center quantity controls under ATC on mobile */
  .pdp__qtyRow{ justify-content:center !important; }
  .pdp__qty{ flex: 0 0 96px !important; max-width: 96px !important; text-align:center !important; }
.pdp__qtyBtn{
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 14px !important;
    line-height: 44px !important;
    font-size: 18px !important;
  }
  .pdp__qty{
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 72px !important;
    max-width: 140px !important;
    height: 44px !important;
    border-radius: 14px !important;
    font-size: 16px !important;
  }

  .pdp__atc{
    height: 48px !important;
    padding: 12px 14px !important;
    font-size: 15px !important;
    border-radius: 16px !important;
  }

  /* Keep option chips from overflowing on mobile */
  .pdp__chips{ max-width:100% !important; overflow:hidden !important; }
  .pdp__opt{ max-width:100% !important; }
}


/* Mega menu brand logo grid (desktop + mobile) */
.mega__col--brands .mega__brands{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:10px;
}
.mega__col--brands .mega__brand{
  width:54px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.10);
  border-radius:10px;
  background:rgba(0,0,0,.25);
}
.mega__col--brands .mega__brand img{
  max-width:40px;
  max-height:22px;
  width:auto;
  height:auto;
  display:block;
}
.mega__col--brands .mega__brandText{
  font-size:11px;
  line-height:1;
  opacity:.85;
  text-align:center;
  padding:0 6px;
}
@media (max-width: 900px){
  .mega__col--brands .mega__brand{width:56px;height:42px;}
}


/* Mobile menu brand logos grid */
.mnav__group--brands .mnav__brands{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:10px;}
.mnav__brand{display:flex;align-items:center;justify-content:center;padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.02);}
.mnav__brand img{width:100%;height:20px;object-fit:contain;}


/* JR pagination */
.pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin: 42px auto 12px;
  flex-wrap:wrap;
}
.pagination__pages{
  display:flex;
  align-items:center;
  gap:10px;
}
.pagelink{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  height:44px;
  padding:0 18px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(10,10,10,.88);
  color:#fff;
  text-decoration:none;
  font-weight:700;
  letter-spacing:.02em;
  transition:all .18s ease;
  box-shadow:0 12px 30px rgba(0,0,0,.22);
}
.pagelink:hover{
  border-color:rgba(240,196,0,.5);
  color:#f0c400;
  transform:translateY(-1px);
}
.pagelink--number{
  min-width:44px;
  padding:0 10px;
}
.pagelink--number.is-active{
  background:linear-gradient(180deg,#f0c400,#c89d00);
  color:#111;
  border-color:#f0c400;
}
.pagelink.is-disabled{
  opacity:.35;
  pointer-events:none;
}
@media (max-width: 820px){
  .pagination{
    gap:10px;
  }
  .pagination__pages{
    order:3;
    width:100%;
    justify-content:center;
    flex-wrap:wrap;
  }
  .pagelink{
    height:40px;
    min-width:40px;
    font-size:13px;
  }
}

/* Mobile nav search */
.mnav-search{
  display:none;
}
@media (max-width:820px){
  .mnav-search{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0 0 18px;
    padding:10px 12px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:18px;
    background:rgba(0,0,0,.28);
    box-shadow:0 10px 25px rgba(0,0,0,.2);
  }
  .mnav-search__input{
    flex:1;
    border:0;
    outline:none;
    background:transparent;
    color:#fff;
    font-size:14px;
    font-family:inherit;
  }
  .mnav-search__input::placeholder{
    color:rgba(255,255,255,.5);
  }
  .mnav-search__btn{
    width:38px;
    height:38px;
    border-radius:999px;
    border:1px solid rgba(240,196,0,.25);
    background:rgba(240,196,0,.08);
    color:#f0c400;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  .mnav-search__btn svg{
    width:18px;
    height:18px;
  }
}


/* =========================================================
   J&R UX refresh v2 - parser-safe build
   Keeps existing black/yellow identity and logo.
   ========================================================= */
.jr-simple-nav{display:flex;align-items:center;justify-content:center;min-width:0;}
.jr-simple-nav .menu{gap:12px;justify-content:center;}
.jr-nav-dropdown{width:430px!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:12px!important;}
.has-dropdown:hover .dropdown.jr-nav-dropdown{display:grid;}
.jr-nav-dropdown a{min-width:0;}
.jr-nav-dropdown--parts{width:460px!important;}
.header-inner{max-width:1380px;}
.header-search{max-width:240px;}
.mnav__single{display:flex;align-items:center;justify-content:space-between;padding:14px 2px;border-bottom:1px solid rgba(255,255,255,.08);font:800 14px/1.2 Oswald,Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;}
.mnav__single span{color:var(--accent);}

.template-index #MainContent{background:#101010;}
.template-index .jrHome--refresh{padding-bottom:54px!important;}
.template-index .jrHome--refresh .jrHome__heroCard{margin-bottom:0!important;border-bottom-left-radius:28px;border-bottom-right-radius:28px;}
.template-index .jrHome--refresh .jrHome__copy{max-width:710px;}
.template-index .jrHome--refresh .jrHome__sub{max-width:620px;}
.jrHomeSearch{margin-top:28px;max-width:650px;}
.jrHomeSearch__label{display:block;margin:0 0 8px;font:800 11px/1 Oswald,Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.72);}
.jrHomeSearch__row{display:flex;align-items:stretch;padding:5px;border:1px solid rgba(255,255,255,.15);border-radius:15px;background:rgba(5,5,5,.72);box-shadow:0 14px 40px rgba(0,0,0,.26);}
.jrHomeSearch__row input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#fff;padding:12px 13px;font:600 14px/1.2 Inter,sans-serif;}
.jrHomeSearch__row input::placeholder{color:rgba(255,255,255,.48);}
.jrHomeSearch__row button{border:1px solid rgba(0,0,0,.2);border-radius:11px;background:var(--accent);color:#111;padding:0 18px;font:900 12px/1 Oswald,sans-serif;letter-spacing:.09em;cursor:pointer;}
.jrTrustBar{max-width:1220px;margin:14px auto 0;padding:0 16px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
.jrTrustBar>div{min-height:76px;padding:14px 16px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:rgba(255,255,255,.025);display:flex;flex-direction:column;justify-content:center;gap:4px;}
.jrTrustBar strong{font:800 12px/1.1 Oswald,sans-serif;letter-spacing:.08em;color:var(--accent);}
.jrTrustBar span{font-size:12px;color:rgba(255,255,255,.65);}
.jrHomeSection{max-width:1220px;margin:0 auto;padding:56px 16px 0;}
.jrHomeSection__head{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:18px;}
.jrHomeSection__kicker{display:block;margin-bottom:6px;font:800 10px/1 Oswald,sans-serif;letter-spacing:.18em;color:var(--accent);}
.jrHomeSection__head h2,.jrHomeSEO h2{margin:0;font:900 clamp(28px,3vw,42px)/1 Oswald,Inter,sans-serif;text-transform:uppercase;}
.jrHomeSection__head p{max-width:470px;margin:0;color:rgba(255,255,255,.62);font-size:14px;}
.jrHomeSection__more{font-weight:800;font-size:13px;color:var(--accent);white-space:nowrap;}
.jrBikeChooser{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
.jrBikeBrand{overflow:hidden;border:1px solid rgba(255,255,255,.10);border-radius:22px;background:radial-gradient(100% 120% at 0 0,rgba(242,195,0,.08),transparent 55%),rgba(255,255,255,.025);box-shadow:0 20px 50px rgba(0,0,0,.22);}
.jrBikeBrand__head{min-height:94px;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid rgba(255,255,255,.08);}
.jrBikeBrand__head img{width:auto;max-width:150px;max-height:42px;object-fit:contain;}
.jrBikeBrand__head>span{font-size:12px;font-weight:800;color:rgba(255,255,255,.68);white-space:nowrap;}
.jrBikeBrand__head b{color:var(--accent);}
.jrBikeBrand__links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.06);}
.jrBikeBrand__links a{min-height:52px;padding:12px 15px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#141414;color:rgba(255,255,255,.82);font-weight:750;font-size:13px;}
.jrBikeBrand__links a:hover{background:rgba(242,195,0,.08);color:#fff;}
.jrBikeBrand__links a span{color:var(--accent);font-size:18px;}
.jrCategoryGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
.jrCategoryCard{position:relative;min-height:108px;padding:18px;border:1px solid rgba(255,255,255,.10);border-radius:18px;background:linear-gradient(135deg,rgba(255,255,255,.045),rgba(255,255,255,.015));display:flex;align-items:flex-end;justify-content:space-between;overflow:hidden;transition:transform .14s ease,border-color .14s ease,background .14s ease;}
.jrCategoryCard:hover{transform:translateY(-2px);border-color:rgba(242,195,0,.34);background:linear-gradient(135deg,rgba(242,195,0,.08),rgba(255,255,255,.02));}
.jrCategoryCard__label{font:850 15px/1.1 Oswald,sans-serif;text-transform:uppercase;letter-spacing:.04em;}
.jrCategoryCard__arrow{color:var(--accent);font-size:20px;}
.jrHomeSEO{max-width:1220px;margin:56px auto 0;padding:30px;display:grid;grid-template-columns:170px 1fr;align-items:center;gap:30px;border:1px solid rgba(255,255,255,.09);border-radius:24px;background:radial-gradient(70% 150% at 0 0,rgba(242,195,0,.10),transparent 60%),rgba(255,255,255,.02);}
.jrHomeSEO__logo{display:flex;align-items:center;justify-content:center;min-height:120px;border-right:1px solid rgba(255,255,255,.08);padding-right:28px;}
.jrHomeSEO__logo img{max-width:130px;max-height:76px;object-fit:contain;}
.jrHomeSEO p{max-width:850px;margin:13px 0 0;color:rgba(255,255,255,.64);font-size:14px;line-height:1.7;}
.jrHomeSEO__actions{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;}
.jrHomeSEO__actions a{color:var(--accent);font-weight:800;font-size:13px;}
.jrCollectionQuick{max-width:1240px;margin:0 auto;padding:0 18px 14px;display:flex;align-items:center;gap:12px;}
.jrCollectionQuick__label{flex:0 0 auto;font:800 10px/1 Oswald,sans-serif;letter-spacing:.14em;color:var(--accent);}
.jrCollectionQuick__scroll{display:flex;gap:8px;overflow-x:auto;scrollbar-width:thin;padding:6px 0 8px;}
.jrCollectionQuick__scroll a{flex:0 0 auto;padding:8px 11px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(255,255,255,.025);font-size:12px;font-weight:700;color:rgba(255,255,255,.72);}
.jrCollectionQuick__scroll a:hover{color:#fff;border-color:rgba(242,195,0,.3);background:rgba(242,195,0,.08);}
@media(max-width:1180px){.jr-simple-nav .menu{gap:6px}.menu-link{font-size:11px;padding-inline:3px}.header-social{display:none!important}.header-search{max-width:205px}}
@media(max-width:980px){.jrTrustBar{grid-template-columns:repeat(2,minmax(0,1fr));}.jrCategoryGrid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:720px){.template-index .jrHome--refresh .jrHome__heroGrid{padding:34px 20px 78px!important;}.template-index .jrHome--refresh .jrHome__headlineA,.template-index .jrHome--refresh .jrHome__headlineB{font-size:clamp(38px,11vw,58px)!important;}.jrTrustBar{grid-template-columns:1fr 1fr;gap:7px;}.jrHomeSection{padding-top:42px;}.jrHomeSection__head{display:block;}.jrHomeSection__head p,.jrHomeSection__more{margin-top:10px;}.jrBikeChooser{grid-template-columns:1fr;}.jrCategoryGrid{grid-template-columns:1fr 1fr;gap:8px;}.jrHomeSEO{margin:42px 14px 0;padding:22px;grid-template-columns:1fr;}.jrHomeSEO__logo{display:none;}.jrCollectionQuick{display:block;}}
@media(max-width:420px){.jrTrustBar{grid-template-columns:1fr;}}


/* =========================================================
   J&R UX refresh v3 - stable menus + working contact section
   ========================================================= */
@media (min-width: 921px){
  .site-header .has-dropdown > .dropdown{
    display:block !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateY(8px) !important;
    transition:opacity .14s ease, transform .14s ease, visibility 0s linear .14s !important;
    transform-origin:top left;
  }
  .site-header .has-dropdown > .dropdown.jr-nav-dropdown{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    width:min(430px,calc(100vw - 32px)) !important;
    min-width:0 !important;
    gap:4px !important;
    padding:12px !important;
  }
  .site-header .has-dropdown > .dropdown.jr-nav-dropdown--parts{
    width:min(480px,calc(100vw - 32px)) !important;
  }
  .site-header .has-dropdown > .dropdown:not(.jr-nav-dropdown){
    width:280px !important;
    min-width:280px !important;
  }
  .site-header .has-dropdown:hover > .dropdown,
  .site-header .has-dropdown.is-open > .dropdown,
  .site-header .has-dropdown:focus-within > .dropdown{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
    transition:opacity .14s ease, transform .14s ease, visibility 0s !important;
  }
  .site-header .dropdown a{
    min-height:42px;
    box-sizing:border-box;
  }
}

#contact{scroll-margin-top:150px;}
.jrContact{
  max-width:1220px;
  margin:0 auto;
  padding:64px 16px 18px;
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:28px;
  align-items:start;
}
.jrContact__intro{
  padding:28px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(242,195,0,.08),rgba(255,255,255,.02));
}
.jrContact__intro h2{
  margin:8px 0 12px;
  font:900 clamp(30px,4vw,48px)/.98 Oswald,Inter,sans-serif;
  text-transform:uppercase;
}
.jrContact__intro p{margin:0;color:rgba(255,255,255,.68);line-height:1.7;}
.jrContact__socials{display:grid;gap:10px;margin-top:22px;}
.jrContact__socials a{color:var(--accent);font-weight:800;}
.jrContact__card{
  padding:24px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:22px;
  background:rgba(255,255,255,.025);
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}
.jrContactForm__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.jrContactForm label{display:grid;gap:7px;}
.jrContactForm label>span{font:800 11px/1 Oswald,Inter,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.72);}
.jrContactForm label em{font-style:normal;font-weight:500;color:rgba(255,255,255,.38);}
.jrContactForm input,.jrContactForm textarea{
  width:100%;box-sizing:border-box;border:1px solid rgba(255,255,255,.12);border-radius:12px;
  background:#0b0b0b;color:#fff;padding:13px 14px;outline:none;font:500 14px/1.35 Inter,sans-serif;
}
.jrContactForm input:focus,.jrContactForm textarea:focus{border-color:rgba(242,195,0,.72);box-shadow:0 0 0 3px rgba(242,195,0,.08);}
.jrContactForm__message{margin-top:14px;}
.jrContactForm__submit{
  margin-top:16px;border:0;border-radius:12px;background:var(--accent);color:#111;padding:14px 18px;
  font:900 12px/1 Oswald,Inter,sans-serif;letter-spacing:.09em;cursor:pointer;
}
.jrContactForm__submit span{margin-left:8px;}
.jrContactForm__success{margin-bottom:16px;padding:12px 14px;border:1px solid rgba(242,195,0,.35);border-radius:12px;background:rgba(242,195,0,.08);color:#fff;}
.jrContactForm .errors{margin:0 0 16px;padding:12px 14px;border:1px solid rgba(255,100,100,.3);border-radius:12px;background:rgba(255,100,100,.06);}
@media(max-width:820px){
  .jrContact{grid-template-columns:1fr;padding-top:48px;}
  .jrContactForm__grid{grid-template-columns:1fr;}
  .jrContact__intro,.jrContact__card{padding:20px;}
}

.page-shell{max-width:1050px;margin:0 auto;padding:54px 16px;}
.page-card{padding:28px;border:1px solid rgba(255,255,255,.09);border-radius:22px;background:rgba(255,255,255,.025);}
.page-card h1{margin:0 0 18px;font:900 clamp(32px,5vw,54px)/1 Oswald,Inter,sans-serif;text-transform:uppercase;}
.page-card .rte{color:rgba(255,255,255,.75);line-height:1.75;}

/* =========================================================
   J&R standalone Contact page v4
   ========================================================= */
.jrContactPage{padding:34px 16px 72px;background:radial-gradient(900px 500px at 10% 0,rgba(242,195,0,.08),transparent 62%),#090909;color:#fff;}
.jrContactPage__shell{max-width:1220px;margin:0 auto;}
.jrContactPage__hero{position:relative;overflow:hidden;min-height:280px;padding:38px;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:28px;align-items:center;border:1px solid rgba(255,255,255,.10);border-radius:26px;background:linear-gradient(135deg,rgba(255,255,255,.045),rgba(255,255,255,.012));box-shadow:0 28px 80px rgba(0,0,0,.28);}
.jrContactPage__hero:after{content:"";position:absolute;inset:auto -120px -180px auto;width:420px;height:420px;border-radius:50%;background:rgba(242,195,0,.06);filter:blur(2px);pointer-events:none;}
.jrContactPage__heroCopy{position:relative;z-index:1;}
.jrContactPage__kicker{display:block;margin-bottom:9px;font:900 11px/1 Oswald,Inter,sans-serif;letter-spacing:.18em;color:var(--accent);}
.jrContactPage__hero h1{max-width:780px;margin:0;font:900 clamp(40px,5.3vw,72px)/.94 Oswald,Inter,sans-serif;letter-spacing:-.02em;text-transform:uppercase;}
.jrContactPage__lead{max-width:720px;margin:18px 0 0;color:rgba(255,255,255,.68);font-size:15px;line-height:1.75;}
.jrContactPage__pageContent{margin-top:15px;color:rgba(255,255,255,.68);}
.jrContactPage__quickLinks{display:flex;flex-wrap:wrap;gap:9px;margin-top:25px;}
.jrContactPage__quickLinks a{display:inline-flex;align-items:center;gap:10px;padding:10px 13px;border:1px solid rgba(255,255,255,.11);border-radius:999px;background:rgba(255,255,255,.025);color:#fff;font-size:12px;font-weight:800;transition:.15s ease;}
.jrContactPage__quickLinks a span{color:var(--accent);font-size:16px;}
.jrContactPage__quickLinks a:hover{border-color:rgba(242,195,0,.45);background:rgba(242,195,0,.08);transform:translateY(-1px);}
.jrContactPage__logoPanel{position:relative;z-index:1;min-height:190px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;border-left:1px solid rgba(255,255,255,.08);}
.jrContactPage__logoPanel img{width:min(210px,78%);max-height:112px;object-fit:contain;filter:drop-shadow(0 14px 28px rgba(0,0,0,.4));}
.jrContactPage__logoPanel span{font:900 10px/1 Oswald,Inter,sans-serif;letter-spacing:.22em;color:rgba(255,255,255,.43);}
.jrContactPage__grid{display:grid;grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr);gap:18px;margin-top:18px;align-items:start;}
.jrContactPage__aside{display:grid;gap:18px;}
.jrContactInfoCard,.jrContactSocialCard,.jrContactPage__formCard{border:1px solid rgba(255,255,255,.09);border-radius:22px;background:rgba(255,255,255,.025);box-shadow:0 20px 55px rgba(0,0,0,.22);}
.jrContactInfoCard{padding:25px;}
.jrContactInfoCard__eyebrow{display:block;font:900 10px/1 Oswald,Inter,sans-serif;letter-spacing:.16em;color:var(--accent);}
.jrContactInfoCard h2{margin:9px 0 10px;font:900 25px/1 Oswald,Inter,sans-serif;text-transform:uppercase;}
.jrContactInfoCard>p{margin:0;color:rgba(255,255,255,.62);font-size:13px;line-height:1.65;}
.jrContactInfoCard ul{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:11px;}
.jrContactInfoCard li{display:grid;grid-template-columns:36px 1fr;gap:11px;align-items:start;padding-top:11px;border-top:1px solid rgba(255,255,255,.07);}
.jrContactInfoCard li>span{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:rgba(242,195,0,.12);color:var(--accent);font:900 10px/1 Oswald,sans-serif;}
.jrContactInfoCard li strong{display:block;font-size:13px;}
.jrContactInfoCard li small{display:block;margin-top:3px;color:rgba(255,255,255,.48);font-size:11px;line-height:1.5;}
.jrContactSocialCard{padding:20px;}
.jrContactSocialCard>.jrContactInfoCard__eyebrow{margin:2px 5px 12px;}
.jrContactSocialCard>a{display:grid;grid-template-columns:38px 1fr auto;gap:11px;align-items:center;padding:12px 10px;border-top:1px solid rgba(255,255,255,.07);color:#fff;}
.jrContactSocialCard>a:hover strong,.jrContactSocialCard>a:hover b{color:var(--accent);}
.jrContactSocialCard__icon{width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(242,195,0,.25);border-radius:10px;background:rgba(242,195,0,.08);color:var(--accent);font:900 12px/1 Inter,sans-serif;}
.jrContactSocialCard strong{display:block;font-size:13px;}
.jrContactSocialCard small{display:block;margin-top:2px;color:rgba(255,255,255,.46);font-size:11px;}
.jrContactSocialCard b{color:rgba(255,255,255,.45);font-size:18px;}
.jrContactPage__formCard{padding:28px;}
.jrContactPage__formHead{margin-bottom:22px;}
.jrContactPage__formHead h2{margin:7px 0 8px;font:900 clamp(29px,3vw,40px)/1 Oswald,Inter,sans-serif;text-transform:uppercase;}
.jrContactPage__formHead p{margin:0;color:rgba(255,255,255,.58);font-size:13px;line-height:1.6;}
.jrContactPageForm__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;}
.jrContactPageForm label{display:grid;gap:7px;}
.jrContactPageForm label>span{font:850 10px/1 Oswald,Inter,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.72);}
.jrContactPageForm label em{font-style:normal;font-weight:500;color:rgba(255,255,255,.36);}
.jrContactPageForm input,.jrContactPageForm select,.jrContactPageForm textarea{width:100%;box-sizing:border-box;border:1px solid rgba(255,255,255,.11);border-radius:12px;background:#0b0b0b;color:#fff;padding:13px 14px;outline:none;font:500 14px/1.35 Inter,sans-serif;transition:border-color .14s ease,box-shadow .14s ease;}
.jrContactPageForm select{appearance:auto;}
.jrContactPageForm input::placeholder,.jrContactPageForm textarea::placeholder{color:rgba(255,255,255,.27);}
.jrContactPageForm input:focus,.jrContactPageForm select:focus,.jrContactPageForm textarea:focus{border-color:rgba(242,195,0,.7);box-shadow:0 0 0 3px rgba(242,195,0,.08);}
.jrContactPageForm__message{margin-top:13px;}
.jrContactPageForm__footer{display:flex;align-items:center;gap:18px;margin-top:16px;}
.jrContactPageForm__footer button{flex:0 0 auto;border:0;border-radius:12px;background:var(--accent);color:#111;padding:14px 19px;font:900 12px/1 Oswald,Inter,sans-serif;letter-spacing:.09em;cursor:pointer;box-shadow:0 9px 24px rgba(242,195,0,.12);}
.jrContactPageForm__footer button:hover{filter:brightness(1.05);transform:translateY(-1px);}
.jrContactPageForm__footer small{max-width:430px;color:rgba(255,255,255,.37);font-size:10px;line-height:1.55;}
.jrContactPageForm__success,.jrContactPageForm__errors{margin:0 0 16px;padding:14px 15px;border-radius:12px;font-size:12px;line-height:1.5;}
.jrContactPageForm__success{display:grid;gap:2px;border:1px solid rgba(242,195,0,.28);background:rgba(242,195,0,.09);color:#fff;}
.jrContactPageForm__success strong{color:var(--accent);}
.jrContactPageForm__errors{border:1px solid rgba(255,99,99,.35);background:rgba(255,70,70,.07);}
.jrContactPageForm__errors ul{margin:0;padding-left:18px;}
@media(max-width:900px){.jrContactPage__hero{grid-template-columns:1fr;padding:28px;}.jrContactPage__logoPanel{display:none;}.jrContactPage__grid{grid-template-columns:1fr;}.jrContactPage__aside{grid-template-columns:repeat(2,minmax(0,1fr));}.jrContactPage__formCard{order:-1;}}
@media(max-width:650px){.jrContactPage{padding:18px 12px 50px;}.jrContactPage__hero{padding:24px 20px;border-radius:20px;}.jrContactPage__hero h1{font-size:clamp(38px,12vw,54px);}.jrContactPage__lead{font-size:13px;}.jrContactPage__quickLinks{display:grid;}.jrContactPage__quickLinks a{justify-content:space-between;}.jrContactPage__aside{grid-template-columns:1fr;}.jrContactPage__formCard,.jrContactInfoCard,.jrContactSocialCard{border-radius:18px;}.jrContactPage__formCard{padding:20px;}.jrContactPageForm__grid{grid-template-columns:1fr;}.jrContactPageForm__footer{display:grid;}.jrContactPageForm__footer button{width:100%;}.jrContactPageForm__footer small{text-align:center;}}


/* =========================================================
   J&R mobile UX v5 - clean phone header, drawer and homepage
   ========================================================= */
@media (max-width: 920px){
  .site-header{position:sticky!important;top:0!important;}
  .header-inner{
    min-height:62px!important;
    padding:8px 12px!important;
    gap:8px!important;
  }
  .brand{width:44px!important;height:44px!important;flex:0 0 44px!important;}
  .brand img{height:24px!important;max-width:34px!important;object-fit:contain!important;}
  .nav,.header-search,.header-social{display:none!important;}
  .header-actions{margin-left:auto!important;gap:7px!important;}
  .cart-btn{
    width:44px!important;height:44px!important;padding:0!important;
    display:grid!important;place-items:center!important;position:relative!important;
    border-radius:12px!important;
  }
  .cart-btn__label{display:none!important;}
  .cart-btn__icon{display:grid!important;place-items:center!important;}
  .cart-btn__icon svg{width:19px!important;height:19px!important;}
  .cart-btn__count{
    position:absolute!important;right:-4px!important;top:-5px!important;
    min-width:18px!important;height:18px!important;padding:0 4px!important;
    display:grid!important;place-items:center!important;border-radius:999px!important;
    background:var(--accent)!important;color:#111!important;border:2px solid #050505!important;
    font:900 10px/1 Inter,sans-serif!important;
  }
  .hamburger{
    display:grid!important;place-items:center!important;width:44px!important;height:44px!important;
    padding:0!important;border-radius:12px!important;font-size:0!important;position:relative!important;
  }
  .hamburger::before{content:"";width:19px;height:14px;background:linear-gradient(currentColor,currentColor) 0 0/100% 2px no-repeat,linear-gradient(currentColor,currentColor) 0 6px/100% 2px no-repeat,linear-gradient(currentColor,currentColor) 0 12px/100% 2px no-repeat;}

  .announcement-bar__viewport{padding:6px 0!important;}
  .announcement-bar__content{font-size:11px!important;letter-spacing:.02em!important;gap:8px!important;}
  .announcement-bar__content .bolt img{width:11px!important;height:11px!important;}

  .mnav{
    display:block!important;opacity:0;visibility:hidden;pointer-events:none;
    background:rgba(0,0,0,.72)!important;transition:opacity .18s ease,visibility 0s linear .18s;
  }
  .mnav.is-open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .18s ease,visibility 0s;}
  .mnav__panel{
    width:100%!important;max-width:none!important;height:100dvh!important;right:0!important;
    transform:translateX(100%);transition:transform .22s cubic-bezier(.2,.8,.2,1);
    background:#0a0a0a!important;border-left:0!important;box-shadow:none!important;
  }
  .mnav.is-open .mnav__panel{transform:translateX(0);}
  .mnav__head{
    flex:0 0 auto!important;min-height:64px!important;padding:10px 14px!important;
    background:#080808!important;border-bottom:1px solid rgba(255,255,255,.09)!important;
    padding-top:max(10px,env(safe-area-inset-top))!important;
  }
  .mnav__brand{color:#fff!important;text-decoration:none!important;gap:10px!important;}
  .mnav__brand img{height:28px!important;max-width:42px!important;object-fit:contain!important;}
  .mnav__brand strong{font:900 13px/1 Oswald,Inter,sans-serif!important;letter-spacing:.12em!important;}
  .mnav__headActions{display:flex;align-items:center;gap:8px;margin-left:auto;}
  .mnav__cartTop,.mnav__close{
    width:42px!important;height:42px!important;padding:0!important;border-radius:12px!important;
    display:grid!important;place-items:center!important;border:1px solid rgba(255,255,255,.11)!important;
    background:rgba(255,255,255,.035)!important;color:#fff!important;
  }
  .mnav__cartTop{position:relative!important;}
  .mnav__cartTop svg{width:19px!important;height:19px!important;}
  .mnav__cartTop>span{position:absolute;right:-4px;top:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:99px;display:grid;place-items:center;background:var(--accent);color:#111;border:2px solid #080808;font:900 9px/1 Inter,sans-serif;}
  .mnav__close{font-size:20px!important;line-height:1!important;}
  .mnav__body{
    flex:1 1 auto!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;
    padding:14px 14px calc(24px + env(safe-area-inset-bottom))!important;
  }
  .mnav-search{
    display:flex!important;margin:0 0 12px!important;padding:6px 7px 6px 13px!important;
    min-height:50px!important;border-radius:14px!important;background:#111!important;
    border-color:rgba(255,255,255,.10)!important;box-shadow:none!important;
  }
  .mnav-search__input{font-size:16px!important;min-width:0!important;}
  .mnav-search__btn{width:38px!important;height:38px!important;flex:0 0 38px!important;border-radius:10px!important;}
  .mnav__topLinks{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px;}
  .mnav__single{
    min-height:47px!important;padding:0 12px!important;border:1px solid rgba(255,255,255,.09)!important;
    border-radius:12px!important;background:rgba(255,255,255,.025)!important;font-size:12px!important;
  }
  .mnav__sectionLabel{margin:0 2px 8px;color:rgba(242,195,0,.88);font:800 10px/1 Oswald,Inter,sans-serif;letter-spacing:.16em;}
  .mnav__item{
    margin:0 0 8px!important;padding:0!important;border-radius:14px!important;
    background:#101010!important;border:1px solid rgba(255,255,255,.09)!important;overflow:hidden!important;
  }
  .mnav__summary{
    min-height:52px!important;padding:0 14px!important;font-size:13px!important;letter-spacing:.08em!important;
    color:#fff!important;user-select:none!important;-webkit-tap-highlight-color:transparent;
  }
  .mnav__summary .mnav__chev{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:rgba(255,255,255,.04);color:var(--accent);font-size:19px;transition:transform .16s ease;}
  .mnav__item[open] .mnav__summary{color:#fff!important;border-bottom:1px solid rgba(255,255,255,.07);}
  .mnav__item[open] .mnav__chev{transform:rotate(45deg);}
  .mnav__links{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:1px!important;margin:0!important;background:rgba(255,255,255,.06)!important;}
  .mnav__links a{
    min-height:47px!important;padding:11px 12px!important;border:0!important;border-radius:0!important;
    background:#0d0d0d!important;color:rgba(255,255,255,.82)!important;font-size:12px!important;font-weight:700!important;
    display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;
  }
  .mnav__links a span{color:var(--accent);font-size:15px;}
  .mnav__links .mnav__primary{
    grid-column:1/-1!important;min-height:49px!important;background:rgba(242,195,0,.10)!important;
    color:#fff!important;font:850 11px/1.2 Oswald,Inter,sans-serif!important;letter-spacing:.06em!important;
  }
  .mnav__support{margin-top:16px;border:1px solid rgba(242,195,0,.25);border-radius:14px;background:linear-gradient(135deg,rgba(242,195,0,.10),rgba(255,255,255,.02));}
  .mnav__support a{padding:15px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
  .mnav__support strong{font:850 11px/1.2 Oswald,Inter,sans-serif;letter-spacing:.06em;}
  .mnav__support span{color:var(--accent);font-size:12px;font-weight:800;white-space:nowrap;}
  .mnav__socialBottom{display:flex;gap:16px;padding:18px 2px 4px;color:rgba(255,255,255,.58);font-size:12px;font-weight:700;}
  .mnav__socialBottom a{color:inherit;}
}

@media (max-width: 720px){
  .template-index .jrHome--refresh{padding-bottom:34px!important;}
  .template-index .jrHome--refresh .jrHome__heroCard{
    width:calc(100% - 20px)!important;margin:10px auto 0!important;border-radius:18px!important;
    min-height:0!important;
  }
  .template-index .jrHome--refresh .jrHome__heroCard::after{
    background-size:340px auto!important;background-position:right -115px bottom 12px!important;opacity:.68!important;
  }
  .template-index .jrHome--refresh .jrHome__heroCard::before{
    background:linear-gradient(180deg,rgba(0,0,0,.76) 0%,rgba(0,0,0,.68) 56%,rgba(0,0,0,.54) 100%),radial-gradient(600px 360px at 10% 10%,rgba(242,195,0,.12),transparent 65%)!important;
  }
  .template-index .jrHome--refresh .jrHome__heroGrid{
    min-height:0!important;padding:34px 18px 34px!important;
  }
  .template-index .jrHome--refresh .jrHome__kicker{font-size:10px!important;letter-spacing:.16em!important;}
  .template-index .jrHome--refresh .jrHome__headline{margin:10px 0 12px!important;}
  .template-index .jrHome--refresh .jrHome__headlineA,
  .template-index .jrHome--refresh .jrHome__headlineB{font-size:clamp(36px,12vw,50px)!important;line-height:.92!important;}
  .template-index .jrHome--refresh .jrHome__sub{font-size:14px!important;line-height:1.55!important;max-width:92%!important;margin:13px 0 18px!important;}
  .template-index .jrHome__actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;}
  .template-index .jrHome__actions .jrBtn{min-height:44px!important;padding:10px 9px!important;font-size:11px!important;justify-content:center!important;}
  .template-index .jrHome__actions .jrBtn:last-child{grid-column:1/-1!important;}
  .jrHomeSearch{margin-top:18px!important;}
  .jrHomeSearch__row{padding:4px!important;border-radius:13px!important;}
  .jrHomeSearch__row input{font-size:16px!important;padding:11px!important;}
  .jrHomeSearch__row button{padding:0 13px!important;font-size:10px!important;}
  .jrTrustBar{margin-top:8px!important;padding:0 10px!important;grid-template-columns:1fr 1fr!important;gap:6px!important;}
  .jrTrustBar>div{min-height:68px!important;padding:11px!important;border-radius:12px!important;}
  .jrTrustBar strong{font-size:10px!important;}.jrTrustBar span{font-size:10px!important;line-height:1.3!important;}
  .jrHomeSection{padding:34px 10px 0!important;}
  .jrHomeSection__head{margin-bottom:12px!important;}
  .jrHomeSection__head h2{font-size:28px!important;}
  .jrHomeSection__head p{font-size:12px!important;line-height:1.5!important;}
  .jrBikeChooser{gap:10px!important;}
  .jrBikeBrand{border-radius:16px!important;}
  .jrBikeBrand__head{min-height:74px!important;padding:14px!important;}
  .jrBikeBrand__head img{max-width:120px!important;max-height:34px!important;}
  .jrBikeBrand__head>span{font-size:10px!important;}
  .jrBikeBrand__links a{min-height:46px!important;padding:10px 12px!important;font-size:12px!important;}
  .jrCategoryGrid{grid-template-columns:1fr 1fr!important;gap:7px!important;}
  .jrCategoryCard{min-height:82px!important;padding:13px!important;border-radius:14px!important;}
  .jrCategoryCard__label{font-size:13px!important;}
  .jrHomeSEO{margin:34px 10px 0!important;padding:18px!important;border-radius:16px!important;}
  .jrHomeSEO h2{font-size:27px!important;line-height:1.05!important;}
  .jrHomeSEO p{font-size:12px!important;line-height:1.6!important;}
  .jrContact{padding:34px 10px 8px!important;gap:12px!important;}
}

@media (max-width: 380px){
  .mnav__links{grid-template-columns:1fr!important;}
  .mnav__links .mnav__primary{grid-column:auto!important;}
  .jrTrustBar{grid-template-columns:1fr!important;}
  .template-index .jrHome__actions{grid-template-columns:1fr!important;}
  .template-index .jrHome__actions .jrBtn:last-child{grid-column:auto!important;}
}

/* =========================================================
   J&R contact mobile polish v6
   - keeps desktop contact layout intact
   - puts useful details immediately above message box on mobile
   ========================================================= */
.jrContactPageForm__mobileGuide{display:none;}

@media (max-width:650px){
  .jrContactPage{
    padding:12px 10px 42px!important;
    background:radial-gradient(560px 300px at 0 0,rgba(242,195,0,.07),transparent 68%),#090909!important;
  }
  .jrContactPage__shell{width:100%;}
  .jrContactPage__hero{
    min-height:0!important;
    padding:20px 17px!important;
    border-radius:16px!important;
    box-shadow:none!important;
  }
  .jrContactPage__hero:after{width:260px!important;height:260px!important;right:-120px!important;bottom:-150px!important;}
  .jrContactPage__hero h1{
    font-size:clamp(34px,10vw,45px)!important;
    line-height:.96!important;
    max-width:12ch!important;
  }
  .jrContactPage__lead{
    margin-top:12px!important;
    font-size:12.5px!important;
    line-height:1.6!important;
  }
  .jrContactPage__quickLinks{display:none!important;}
  .jrContactPage__grid{margin-top:10px!important;gap:10px!important;}
  .jrContactPage__formCard{
    padding:17px 14px!important;
    border-radius:16px!important;
    box-shadow:none!important;
    background:rgba(255,255,255,.022)!important;
  }
  .jrContactPage__formHead{margin-bottom:16px!important;}
  .jrContactPage__formHead h2{
    font-size:28px!important;
    margin:6px 0 7px!important;
  }
  .jrContactPage__formHead p{font-size:12px!important;line-height:1.55!important;}
  .jrContactPageForm__grid{gap:10px!important;}
  .jrContactPageForm__field--name{order:1;}
  .jrContactPageForm__field--email{order:2;}
  .jrContactPageForm__field--type{order:3;}
  .jrContactPageForm__field--phone{order:4;}
  .jrContactPageForm__field--bike{order:5;}
  .jrContactPageForm__field--order{order:6;}
  .jrContactPageForm label{gap:6px!important;}
  .jrContactPageForm label>span{font-size:9.5px!important;letter-spacing:.085em!important;}
  .jrContactPageForm input,.jrContactPageForm select,.jrContactPageForm textarea{
    min-height:46px!important;
    padding:12px 12px!important;
    border-radius:11px!important;
    font-size:16px!important; /* prevents iOS form zoom */
  }
  .jrContactPageForm select{padding-right:34px!important;}
  .jrContactPageForm__mobileGuide{
    display:block!important;
    margin:13px 0 12px!important;
    padding:13px!important;
    border:1px solid rgba(242,195,0,.18)!important;
    border-radius:12px!important;
    background:rgba(242,195,0,.055)!important;
  }
  .jrContactPageForm__mobileGuide>strong{
    display:block!important;
    color:var(--accent)!important;
    font:900 12px/1 Oswald,Inter,sans-serif!important;
    letter-spacing:.08em!important;
    text-transform:uppercase!important;
  }
  .jrContactPageForm__mobileGuide>p{
    margin:5px 0 9px!important;
    color:rgba(255,255,255,.58)!important;
    font-size:11px!important;
    line-height:1.5!important;
  }
  .jrContactPageForm__mobileGuideRows{display:grid!important;gap:7px!important;}
  .jrContactPageForm__mobileGuideRows span{
    display:block!important;
    color:rgba(255,255,255,.63)!important;
    font-size:11px!important;
    line-height:1.45!important;
  }
  .jrContactPageForm__mobileGuideRows b{color:#fff!important;margin-right:4px!important;}
  .jrContactPageForm__message{margin-top:0!important;}
  .jrContactPageForm__message textarea{
    min-height:150px!important;
    resize:vertical!important;
    line-height:1.5!important;
  }
  .jrContactPageForm__footer{gap:9px!important;margin-top:12px!important;}
  .jrContactPageForm__footer button{
    min-height:48px!important;
    border-radius:11px!important;
    font-size:12px!important;
  }
  .jrContactPageForm__footer small{font-size:9.5px!important;line-height:1.45!important;}

  /* The same guidance is now inside the form on phones, so avoid duplication. */
  .jrContactPage__aside{display:block!important;}
  .jrContactInfoCard{display:none!important;}
  .jrContactSocialCard{
    margin-top:0!important;
    padding:14px!important;
    border-radius:16px!important;
    box-shadow:none!important;
  }
  .jrContactSocialCard>.jrContactInfoCard__eyebrow{margin:1px 4px 9px!important;}
  .jrContactSocialCard>a{padding:11px 7px!important;}
  .jrContactSocialCard__icon{width:32px!important;height:32px!important;}
}

/* =========================================================
   J&R UX refresh v7 - collection navigation + tighter headers
   Keeps existing logo / colours / brand styling unchanged.
   ========================================================= */
.page--collection .jrBreadcrumb{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  margin:0 0 10px;
  color:rgba(255,255,255,.46);
  font-size:11px;
  font-weight:700;
  letter-spacing:.02em;
}
.page--collection .jrBreadcrumb a{
  color:rgba(255,255,255,.62);
  text-decoration:none;
}
.page--collection .jrBreadcrumb a:hover{color:var(--accent);}
.page--collection .jrBreadcrumb [aria-current="page"]{color:rgba(255,255,255,.48);}

.page--collection .jrCollectionHead{
  display:block;
  padding:6px 0 16px;
  margin-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.page--collection .jrCollectionHead__titleRow{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
}
.page--collection .jrCollectionHead__count{
  flex:0 0 auto;
  margin-bottom:4px;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;
  background:rgba(255,255,255,.025);
  color:rgba(255,255,255,.50);
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.page--collection .page__desc{
  max-width:900px;
  margin:10px 0 0;
  color:rgba(255,255,255,.70);
  font-size:14px;
  font-weight:600;
  line-height:1.65;
}
.page--collection .page__desc p{margin:0;}
.page--collection .page__desc p + p{margin-top:8px;}

.page--collection .jrCollectionQuick{
  max-width:none;
  margin:0 0 22px;
  padding:0 0 16px;
  display:block;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.page--collection .jrCollectionQuick__label{
  display:block;
  margin:0 0 9px;
  font:800 10px/1 Oswald,sans-serif;
  letter-spacing:.14em;
  color:var(--accent);
}
.page--collection .jrCollectionQuick__scroll{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  overflow:visible;
  padding:0;
}
.page--collection .jrCollectionQuick__scroll a,
.page--collection .jrCollectionQuick__scroll > span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  background:rgba(255,255,255,.025);
  color:rgba(255,255,255,.76);
  font-size:12px;
  font-weight:800;
  line-height:1;
  text-decoration:none;
  white-space:nowrap;
  transition:border-color .14s ease,background .14s ease,color .14s ease,transform .14s ease;
}
.page--collection .jrCollectionQuick__scroll a:hover{
  transform:translateY(-1px);
  color:#fff;
  border-color:rgba(242,195,0,.34);
  background:rgba(242,195,0,.08);
}
.page--collection .jrCollectionQuick__scroll a.is-active{
  color:#0a0a0a;
  border-color:var(--accent);
  background:var(--accent);
}
.page--collection .jrCollectionQuick__scroll > span.is-disabled{
  opacity:.48;
  cursor:default;
}
.page--collection .jrCollectionQuick__scroll > span.is-disabled small{
  margin-left:6px;
  font-size:8px;
  letter-spacing:.05em;
  text-transform:uppercase;
}

@media(max-width:720px){
  .page--collection{padding-top:12px;}
  .page--collection .jrBreadcrumb{margin-bottom:8px;font-size:10px;}
  .page--collection .jrCollectionHead{padding-bottom:13px;margin-bottom:12px;}
  .page--collection .jrCollectionHead__titleRow{align-items:center;gap:10px;}
  .page--collection .jrCollectionHead__count{margin:0;padding:5px 8px;font-size:9px;}
  .page--collection .page__title{font-size:clamp(28px,8.8vw,38px);}
  .page--collection .page__desc{margin-top:8px;font-size:13px;line-height:1.55;}
  .page--collection .jrCollectionQuick{margin-bottom:16px;padding-bottom:13px;}
  .page--collection .jrCollectionQuick__label{margin-bottom:8px;}
  .page--collection .jrCollectionQuick__scroll{
    flex-wrap:nowrap;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    margin-right:-10px;
    padding-right:10px;
  }
  .page--collection .jrCollectionQuick__scroll::-webkit-scrollbar{display:none;}
  .page--collection .jrCollectionQuick__scroll a,
  .page--collection .jrCollectionQuick__scroll > span{
    flex:0 0 auto;
    min-height:38px;
    padding:9px 13px;
    scroll-snap-align:start;
  }
}

/* =========================================================
   J&R v8 Homepage UX refresh
   Keeps existing brand/logo/colour system. Layout + usability only.
   ========================================================= */
.template-index .jrHome--v8{padding-bottom:56px!important;}
.template-index .jrHome--v8 .jrHome__heroCard{margin-bottom:0!important;border-bottom-left-radius:28px;border-bottom-right-radius:28px;}
.template-index .jrHome--v8 .jrHome__copy{max-width:730px;}
.template-index .jrHome--v8 .jrHome__sub{max-width:620px;line-height:1.65;}
.jrHomeSearch--hero{max-width:680px;}
.jrHomeSearch__tips{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;color:rgba(255,255,255,.52);font-size:10px;font-weight:800;letter-spacing:.06em;}
.jrHomeSearch__tips span{color:rgba(255,255,255,.36);}
.jrHomeSearch__tips a{padding:5px 8px;border:1px solid rgba(255,255,255,.09);border-radius:999px;color:rgba(255,255,255,.72);background:rgba(255,255,255,.025);}
.jrHomeSearch__tips a:hover{border-color:rgba(242,195,0,.32);color:#fff;background:rgba(242,195,0,.07);}
.jrTrustBar--v8{margin-top:12px;}
.jrHomeSection--finder{padding-top:48px;}
.jrBikeChooser--v8{gap:18px;}
.jrBikeChooser--v8 .jrBikeBrand{border-radius:24px;}
.jrBikeChooser--v8 .jrBikeBrand__head{min-height:88px;}
.jrBikeBrand__modelTitle{padding:12px 18px 9px;color:var(--accent);font:800 10px/1 Oswald,Inter,sans-serif;letter-spacing:.14em;background:#121212;border-bottom:1px solid rgba(255,255,255,.06);}
.jrBikeBrand__models{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.06);}
.jrBikeBrand__models--four{grid-template-columns:repeat(2,minmax(0,1fr));}
.jrBikeBrand__models a{position:relative;min-height:76px;padding:14px 40px 13px 15px;background:#141414;display:flex;flex-direction:column;justify-content:center;gap:4px;}
.jrBikeBrand__models a:hover{background:rgba(242,195,0,.075);}
.jrBikeBrand__models strong{font:850 15px/1.05 Oswald,Inter,sans-serif;letter-spacing:.03em;color:#fff;text-transform:uppercase;}
.jrBikeBrand__models small{font-size:11px;color:rgba(255,255,255,.5);}
.jrBikeBrand__models a>span{position:absolute;right:15px;top:50%;transform:translateY(-50%);font-size:22px;color:var(--accent);}
.jrBikeBrand__miniLinks{display:flex;gap:7px;flex-wrap:wrap;padding:12px 14px 14px;background:#101010;}
.jrBikeBrand__miniLinks a{padding:7px 10px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(255,255,255,.025);color:rgba(255,255,255,.72);font-size:11px;font-weight:800;}
.jrBikeBrand__miniLinks a:hover{border-color:rgba(242,195,0,.3);color:#fff;background:rgba(242,195,0,.07);}
.jrCategoryGrid--v8{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
.jrCategoryGrid--v8 .jrCategoryCard{min-height:126px;align-items:flex-end;}
.jrCategoryGrid--v8 .jrCategoryCard>span{display:flex;min-width:0;flex-direction:column;gap:7px;}
.jrCategoryGrid--v8 .jrCategoryCard b{font:850 16px/1.05 Oswald,Inter,sans-serif;text-transform:uppercase;letter-spacing:.035em;}
.jrCategoryGrid--v8 .jrCategoryCard small{max-width:190px;color:rgba(255,255,255,.50);font-size:11px;line-height:1.45;}
.jrCategoryGrid--v8 .jrCategoryCard i{font-style:normal;color:var(--accent);font-size:21px;}
.jrHomeProductRail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.jrHomeProductRail__item{min-width:0;}
.jrHomeProductRail .ptile{height:100%;}
.jrHomeSupport{max-width:1220px;margin:56px auto 0;padding:30px 32px;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,.55fr);gap:30px;align-items:center;border:1px solid rgba(255,255,255,.09);border-radius:24px;background:radial-gradient(70% 160% at 0 0,rgba(242,195,0,.105),transparent 58%),rgba(255,255,255,.02);overflow:hidden;}
.jrHomeSupport h2{max-width:780px;margin:0;font:900 clamp(30px,3.5vw,48px)/.98 Oswald,Inter,sans-serif;text-transform:uppercase;letter-spacing:-.01em;}
.jrHomeSupport p{max-width:730px;margin:14px 0 0;color:rgba(255,255,255,.62);font-size:14px;line-height:1.65;}
.jrHomeSupport__actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;}
.jrHomeSupport__brand{min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;border-left:1px solid rgba(255,255,255,.08);}
.jrHomeSupport__brand img{max-width:180px;max-height:100px;object-fit:contain;}
.jrHomeSupport__brand span{font:800 11px/1 Oswald,Inter,sans-serif;letter-spacing:.15em;color:var(--accent);text-align:center;}
.jrHomeSEO--v8{margin-top:26px;}

@media(max-width:980px){
  .jrBikeBrand__models{grid-template-columns:1fr 1fr;}
  .jrCategoryGrid--v8{grid-template-columns:repeat(2,minmax(0,1fr));}
  .jrHomeProductRail{grid-template-columns:repeat(2,minmax(0,1fr));}
  .jrHomeSupport{grid-template-columns:1fr;}
  .jrHomeSupport__brand{min-height:auto;border-left:0;border-top:1px solid rgba(255,255,255,.08);padding-top:24px;}
}

@media(max-width:720px){
  .template-index .jrHome--v8 .jrHome__heroGrid{padding:32px 18px 72px!important;min-height:560px!important;}
  .template-index .jrHome--v8 .jrHome__headlineA,.template-index .jrHome--v8 .jrHome__headlineB{font-size:clamp(38px,11vw,56px)!important;}
  .jrHomeSearch--hero{margin-top:22px;}
  .jrHomeSearch__row{border-radius:13px;}
  .jrHomeSearch__row input{font-size:16px;padding:12px 10px;}
  .jrHomeSearch__row button{padding:0 13px;}
  .jrHomeSearch__tips{gap:6px;}
  .jrTrustBar--v8{grid-template-columns:1fr 1fr;gap:7px;padding-inline:12px;}
  .jrTrustBar--v8>div{min-height:70px;padding:12px;}
  .jrHomeSection{padding-left:12px;padding-right:12px;}
  .jrHomeSection--finder{padding-top:38px;}
  .jrBikeChooser--v8{grid-template-columns:1fr;gap:12px;}
  .jrBikeChooser--v8 .jrBikeBrand__head{min-height:74px;padding:14px 16px;}
  .jrBikeChooser--v8 .jrBikeBrand__head img{max-width:126px;max-height:36px;}
  .jrBikeChooser--v8 .jrBikeBrand__head>span{font-size:10px;}
  .jrBikeBrand__models,.jrBikeBrand__models--four{grid-template-columns:1fr 1fr;}
  .jrBikeBrand__models a{min-height:70px;padding:12px 34px 12px 13px;}
  .jrBikeBrand__models strong{font-size:14px;}
  .jrBikeBrand__miniLinks{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:13px;}
  .jrBikeBrand__miniLinks::-webkit-scrollbar{display:none;}
  .jrBikeBrand__miniLinks a{flex:0 0 auto;}
  .jrCategoryGrid--v8{grid-template-columns:1fr 1fr;gap:8px;}
  .jrCategoryGrid--v8 .jrCategoryCard{min-height:112px;padding:14px;}
  .jrCategoryGrid--v8 .jrCategoryCard b{font-size:14px;}
  .jrCategoryGrid--v8 .jrCategoryCard small{font-size:10px;}
  .jrHomeProductRail{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:8px;scrollbar-width:none;}
  .jrHomeProductRail::-webkit-scrollbar{display:none;}
  .jrHomeProductRail__item{flex:0 0 min(74vw,280px);scroll-snap-align:start;}
  .jrHomeSupport{margin:42px 12px 0;padding:22px;border-radius:20px;}
  .jrHomeSupport h2{font-size:clamp(28px,8vw,40px);}
  .jrHomeSupport__brand img{max-width:145px;}
  .jrHomeSEO--v8{margin-top:18px;}
}

@media(max-width:420px){
  .jrTrustBar--v8{grid-template-columns:1fr;}
  .jrCategoryGrid--v8{grid-template-columns:1fr 1fr;}
  .jrHome__actions .jrBtn{flex:1 1 calc(50% - 6px);justify-content:center;}
  .jrHome__actions .jrBtn:last-child{flex-basis:100%;}
}

/* =========================================================
   J&R homepage polish v9
   - balanced Surron/Talaria model panels
   - cleaner part-type finder
   - less repetitive lower homepage shopping UI
   ========================================================= */
.jrBikeBrand__allTile{
  background:linear-gradient(135deg,rgba(242,195,0,.11),#141414)!important;
}
.jrBikeBrand__allTile strong{color:var(--accent)!important;}
.jrBikeBrand__allTile small{color:rgba(255,255,255,.62)!important;}

.jrHomeSection--partsFinder .jrHomeSection__head{align-items:end;}
.jrPartsFinder{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.jrPartsFinder>a{
  min-height:82px;
  padding:16px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(255,255,255,.035),rgba(255,255,255,.015));
  transition:border-color .16s ease,background .16s ease,transform .16s ease;
}
.jrPartsFinder>a:hover{
  border-color:rgba(242,195,0,.34);
  background:linear-gradient(135deg,rgba(242,195,0,.085),rgba(255,255,255,.018));
  transform:translateY(-1px);
}
.jrPartsFinder>a>span{display:grid;gap:5px;min-width:0;}
.jrPartsFinder b{
  color:#fff;
  font:850 16px/1.05 Oswald,Inter,sans-serif;
  text-transform:uppercase;
  letter-spacing:.035em;
}
.jrPartsFinder small{color:rgba(255,255,255,.5);font-size:11px;line-height:1.4;}
.jrPartsFinder i{font-style:normal;color:var(--accent);font-size:22px;flex:0 0 auto;}
.jrPartsFinder__all{
  border-color:rgba(242,195,0,.20)!important;
  background:linear-gradient(135deg,rgba(242,195,0,.09),rgba(255,255,255,.02))!important;
}
.jrPartsFinder__all b{color:var(--accent);}

@media(max-width:720px){
  .jrPartsFinder{grid-template-columns:1fr!important;gap:7px!important;}
  .jrPartsFinder>a{min-height:66px!important;padding:13px 14px!important;border-radius:13px!important;}
  .jrPartsFinder b{font-size:14px!important;}
  .jrPartsFinder small{font-size:10px!important;}
}

/* =========================================================
   J&R v10 Homepage refinement
   Professional, symmetric bike chooser + category-first parts finder.
   Brand assets and colour system unchanged.
   ========================================================= */
.template-index .jrBikeBrand__head .jrBikeBrand__allCta{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 11px;
  border:1px solid rgba(242,195,0,.30);
  border-radius:999px;
  background:rgba(242,195,0,.075);
  color:var(--accent);
  font-weight:900;
  letter-spacing:.035em;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
.template-index .jrBikeBrand__head:hover .jrBikeBrand__allCta{
  background:rgba(242,195,0,.13);
  border-color:rgba(242,195,0,.50);
  transform:translateX(1px);
}
.template-index .jrBikeBrand__head .jrBikeBrand__allCta b{color:var(--accent);font-size:15px;}
.template-index .jrBikeBrand__models a{background:#141414!important;}
.template-index .jrBikeBrand__models a:hover{background:rgba(242,195,0,.075)!important;}
.template-index .jrBikeBrand__models strong{color:#fff!important;}
.template-index .jrBikeBrand__models small{color:rgba(255,255,255,.5)!important;}
.template-index .jrBikeBrand__soon{
  flex:0 0 auto;
  padding:7px 10px;
  border:1px dashed rgba(242,195,0,.20);
  border-radius:999px;
  color:rgba(255,255,255,.46);
  font-size:11px;
  font-weight:800;
}
.template-index .jrBikeBrand__soon em{font-style:normal;color:var(--accent);font-size:9px;text-transform:uppercase;letter-spacing:.08em;}

.template-index .jrHomeSection--partsFinder{padding-top:54px;}
.template-index .jrHomeSection__head--parts{margin-bottom:20px;}
.template-index .jrPartsMatrix{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.template-index .jrPartsRow{
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,255,255,.032),rgba(255,255,255,.012));
}
.template-index .jrPartsRow__main{
  min-height:82px;
  padding:17px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-bottom:1px solid rgba(255,255,255,.07);
  transition:background .16s ease;
}
.template-index .jrPartsRow__main:hover{background:rgba(242,195,0,.055);}
.template-index .jrPartsRow__main>span{display:grid;gap:6px;min-width:0;}
.template-index .jrPartsRow__main b{
  color:#fff;
  font:900 18px/1 Oswald,Inter,sans-serif;
  text-transform:uppercase;
  letter-spacing:.035em;
}
.template-index .jrPartsRow__main small{color:rgba(255,255,255,.52);font-size:11px;line-height:1.4;}
.template-index .jrPartsRow__main i{font-style:normal;color:var(--accent);font-size:24px;}
.template-index .jrPartsRow__brands{
  min-height:52px;
  padding:10px 13px;
  display:flex;
  align-items:center;
  gap:8px;
  background:#101010;
}
.template-index .jrPartsRow__brands>span{
  margin-right:2px;
  color:rgba(255,255,255,.35);
  font:800 9px/1 Oswald,Inter,sans-serif;
  letter-spacing:.13em;
}
.template-index .jrPartsRow__brands a{
  padding:7px 11px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;
  background:rgba(255,255,255,.025);
  color:rgba(255,255,255,.76);
  font-size:11px;
  font-weight:850;
}
.template-index .jrPartsRow__brands a:hover{
  border-color:rgba(242,195,0,.32);
  background:rgba(242,195,0,.075);
  color:#fff;
}
.template-index .jrPartsSecondary{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}
.template-index .jrPartsSecondary a{
  min-height:54px;
  padding:12px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:#121212;
  color:rgba(255,255,255,.78);
  font:850 12px/1 Oswald,Inter,sans-serif;
  text-transform:uppercase;
  letter-spacing:.035em;
}
.template-index .jrPartsSecondary a:hover{border-color:rgba(242,195,0,.28);background:rgba(242,195,0,.055);color:#fff;}
.template-index .jrPartsSecondary i{font-style:normal;color:var(--accent);font-size:18px;}
.template-index .jrPartsSecondary__all{
  border-color:rgba(242,195,0,.25)!important;
  background:linear-gradient(135deg,rgba(242,195,0,.10),#121212)!important;
  color:var(--accent)!important;
}

/* v10 intentionally removes homepage product rail; the store is category-led first. */
.template-index .jrHomeSection--products{display:none!important;}

@media(max-width:900px){
  .template-index .jrPartsSecondary{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:720px){
  .template-index .jrBikeBrand__head .jrBikeBrand__allCta{padding:7px 9px;font-size:9px!important;}
  .template-index .jrBikeBrand__soon{padding:7px 9px;}
  .template-index .jrPartsMatrix{grid-template-columns:1fr;gap:8px;}
  .template-index .jrPartsRow{border-radius:15px;}
  .template-index .jrPartsRow__main{min-height:72px;padding:14px 14px;}
  .template-index .jrPartsRow__main b{font-size:16px;}
  .template-index .jrPartsRow__main small{font-size:10px;}
  .template-index .jrPartsRow__brands{min-height:48px;padding:9px 11px;overflow-x:auto;scrollbar-width:none;}
  .template-index .jrPartsRow__brands::-webkit-scrollbar{display:none;}
  .template-index .jrPartsRow__brands>*{flex:0 0 auto;}
  .template-index .jrPartsSecondary{grid-template-columns:1fr 1fr;gap:7px;}
  .template-index .jrPartsSecondary a{min-height:50px;padding:11px 12px;font-size:11px;}
}
@media(max-width:420px){
  .template-index .jrBikeBrand__head{align-items:center;}
  .template-index .jrBikeBrand__head .jrBikeBrand__allCta{white-space:nowrap;}
  .template-index .jrPartsSecondary{grid-template-columns:1fr 1fr;}
}

/* =========================================================
   J&R v11 Homepage — visual retail category showcase
   Replaces the utility-style parts finder with real collection imagery.
   Brand colours and logo remain unchanged.
   ========================================================= */
.template-index .jrBikeBrand__head .jrBikeBrand__allCta{
  background:var(--accent)!important;
  border-color:var(--accent)!important;
  color:#090909!important;
  box-shadow:0 8px 24px rgba(242,195,0,.10);
}
.template-index .jrBikeBrand__head:hover .jrBikeBrand__allCta{
  background:#ffd20a!important;
  border-color:#ffd20a!important;
  color:#050505!important;
}
.template-index .jrBikeBrand__head .jrBikeBrand__allCta b{color:#050505!important;}

.template-index .jrHomeSection--partsShowcase{padding-top:58px;}
.template-index .jrHomeSection__head--partsShowcase{margin-bottom:20px;align-items:end;}
.template-index .jrPartShowcase{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.template-index .jrPartShowcase__card{
  position:relative;
  min-height:260px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  background:#111;
  isolation:isolate;
  box-shadow:0 18px 44px rgba(0,0,0,.16);
}
.template-index .jrPartShowcase__card::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:3px;
  background:var(--accent);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .22s ease;
  z-index:4;
}
.template-index .jrPartShowcase__card:hover::after{transform:scaleX(1);}
.template-index .jrPartShowcase__media{
  position:absolute;
  inset:0;
  z-index:0;
  background:radial-gradient(circle at 70% 25%,rgba(242,195,0,.08),transparent 42%),#111;
}
.template-index .jrPartShowcase__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:saturate(.92) contrast(1.03);
  transform:scale(1.01);
  transition:transform .28s ease,filter .28s ease;
}
.template-index .jrPartShowcase__card:hover .jrPartShowcase__media img{
  transform:scale(1.045);
  filter:saturate(1) contrast(1.06);
}
.template-index .jrPartShowcase__shade{
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg,rgba(7,7,7,.06) 5%,rgba(7,7,7,.30) 42%,rgba(7,7,7,.94) 100%);
}
.template-index .jrPartShowcase__content{
  position:absolute;
  z-index:2;
  left:18px;
  right:18px;
  bottom:18px;
  display:grid;
  gap:5px;
}
.template-index .jrPartShowcase__content small{
  color:var(--accent);
  font:850 9px/1 Oswald,Inter,sans-serif;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.template-index .jrPartShowcase__content b{
  color:#fff;
  font:900 22px/1.02 Oswald,Inter,sans-serif;
  text-transform:uppercase;
  letter-spacing:.025em;
}
.template-index .jrPartShowcase__content em{
  color:rgba(255,255,255,.60);
  font-style:normal;
  font-size:11px;
  line-height:1.4;
}
.template-index .jrPartShowcase__content i{
  margin-top:8px;
  color:#fff;
  font:850 10px/1 Oswald,Inter,sans-serif;
  font-style:normal;
  letter-spacing:.065em;
}
.template-index .jrPartShowcase__card:hover .jrPartShowcase__content i{color:var(--accent);}
.template-index .jrPartShowcase__card--compact{min-height:220px;}
.template-index .jrPartShowcase__card--compact .jrPartShowcase__content b{font-size:19px;}
.template-index .jrPartShowcase__card--all{
  min-height:220px;
  background:
    radial-gradient(85% 150% at 100% 0,rgba(242,195,0,.22),transparent 60%),
    linear-gradient(145deg,#17140a 0%,#111 55%,#0b0b0b 100%);
  border-color:rgba(242,195,0,.22);
}
.template-index .jrPartShowcase__allMark{
  position:absolute;
  right:16px;
  top:12px;
  color:rgba(242,195,0,.10);
  font:900 70px/1 Oswald,Inter,sans-serif;
  letter-spacing:-.04em;
  z-index:0;
}
.template-index .jrPartShowcase__card--all .jrPartShowcase__content b,
.template-index .jrPartShowcase__card--all .jrPartShowcase__content i{color:var(--accent);}

.template-index .jrPartHelp{
  margin-top:10px;
  padding:13px 15px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:rgba(255,255,255,.018);
  color:rgba(255,255,255,.60);
  font-size:11px;
}
.template-index .jrPartHelp strong{color:#fff;}
.template-index .jrPartHelp a{
  flex:0 0 auto;
  color:var(--accent);
  font:850 10px/1 Oswald,Inter,sans-serif;
  letter-spacing:.06em;
}

/* Retire old finder UI completely in v11. */
.template-index .jrPartsMatrix,
.template-index .jrPartsSecondary,
.template-index .jrPartsFinder{display:none!important;}

@media(max-width:1050px){
  .template-index .jrPartShowcase{grid-template-columns:repeat(2,minmax(0,1fr));}
  .template-index .jrPartShowcase__card,
  .template-index .jrPartShowcase__card--compact,
  .template-index .jrPartShowcase__card--all{min-height:240px;}
}
@media(max-width:720px){
  .template-index .jrHomeSection--partsShowcase{padding-top:42px;}
  .template-index .jrHomeSection__head--partsShowcase{margin-bottom:14px;}
  .template-index .jrPartShowcase{grid-template-columns:1fr 1fr;gap:7px;}
  .template-index .jrPartShowcase__card,
  .template-index .jrPartShowcase__card--compact,
  .template-index .jrPartShowcase__card--all{min-height:190px;border-radius:14px;}
  .template-index .jrPartShowcase__content{left:12px;right:12px;bottom:12px;gap:4px;}
  .template-index .jrPartShowcase__content b{font-size:16px;}
  .template-index .jrPartShowcase__content em{font-size:9px;line-height:1.25;}
  .template-index .jrPartShowcase__content i{font-size:8px;margin-top:5px;}
  .template-index .jrPartShowcase__allMark{font-size:48px;right:10px;top:9px;}
  .template-index .jrPartHelp{align-items:flex-start;flex-direction:column;gap:8px;padding:12px;}
}
@media(max-width:390px){
  .template-index .jrPartShowcase{grid-template-columns:1fr;}
  .template-index .jrPartShowcase__card,
  .template-index .jrPartShowcase__card--compact,
  .template-index .jrPartShowcase__card--all{min-height:210px;}
}

/* =========================================================
   J&R v12 Homepage — clean professional Parts Department
   Premium navigation-first layout; no product imagery/cards.
   Brand colours/logo unchanged.
   ========================================================= */
.template-index .jrHomeSection--partsShowcase,
.template-index .jrHomeSupport{display:none!important;}

.template-index .jrHomeSection--department{
  padding-top:58px;
}
.template-index .jrHomeSection__head--department{
  margin-bottom:18px;
  align-items:end;
}
.template-index .jrDepartment{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.template-index .jrDepartment__item{
  min-height:88px;
  display:grid;
  grid-template-columns:52px minmax(0,1fr) 34px;
  align-items:center;
  gap:14px;
  padding:15px 17px;
  border:1px solid rgba(255,255,255,.085);
  border-radius:16px;
  background:linear-gradient(110deg,#121212 0%,#101010 100%);
  color:#fff;
  box-shadow:0 12px 34px rgba(0,0,0,.12);
  transition:border-color .16s ease,background .16s ease,transform .16s ease;
}
.template-index .jrDepartment__item:hover{
  transform:translateY(-1px);
  border-color:rgba(242,195,0,.34);
  background:linear-gradient(110deg,rgba(242,195,0,.075),#111 36%,#101010 100%);
}
.template-index .jrDepartment__num{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid rgba(242,195,0,.20);
  border-radius:11px;
  background:rgba(242,195,0,.055);
  color:var(--accent);
  font:900 11px/1 Oswald,Inter,sans-serif;
  letter-spacing:.08em;
}
.template-index .jrDepartment__copy{
  min-width:0;
  display:grid;
  gap:5px;
}
.template-index .jrDepartment__copy strong{
  color:#fff;
  font:900 18px/1 Oswald,Inter,sans-serif;
  text-transform:uppercase;
  letter-spacing:.035em;
}
.template-index .jrDepartment__copy small{
  color:rgba(255,255,255,.50);
  font-size:11px;
  line-height:1.35;
}
.template-index .jrDepartment__arrow{
  color:var(--accent);
  font-size:23px;
  line-height:1;
  text-align:right;
  transition:transform .16s ease;
}
.template-index .jrDepartment__item:hover .jrDepartment__arrow{transform:translateX(3px);}
.template-index .jrDepartment__item--all{
  border-color:rgba(242,195,0,.24);
  background:linear-gradient(110deg,rgba(242,195,0,.11),#13120c 35%,#101010 100%);
}
.template-index .jrDepartment__item--all .jrDepartment__num{
  background:var(--accent);
  border-color:var(--accent);
  color:#070707;
  font-size:10px;
}
.template-index .jrDepartment__item--all .jrDepartment__copy strong{color:var(--accent);}

.template-index .jrDepartmentHelp{
  margin-top:10px;
  min-height:70px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:14px 16px 14px 18px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:#0f0f0f;
}
.template-index .jrDepartmentHelp>div{display:grid;gap:4px;}
.template-index .jrDepartmentHelp>div span{
  color:var(--accent);
  font:850 9px/1 Oswald,Inter,sans-serif;
  letter-spacing:.14em;
}
.template-index .jrDepartmentHelp>div strong{
  color:rgba(255,255,255,.82);
  font-size:12px;
}
.template-index .jrDepartmentHelp>a{
  flex:0 0 auto;
  min-height:40px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:0 14px;
  border-radius:11px;
  background:var(--accent);
  color:#080808;
  font:900 10px/1 Oswald,Inter,sans-serif;
  letter-spacing:.05em;
}
.template-index .jrDepartmentHelp>a:hover{background:#ffd20a;}

/* Keep both bike-family primary CTAs equally prominent. */
.template-index .jrBikeBrand--surron .jrBikeBrand__allCta,
.template-index .jrBikeBrand--talaria .jrBikeBrand__allCta{
  background:var(--accent)!important;
  border-color:var(--accent)!important;
  color:#090909!important;
}
.template-index .jrBikeBrand--surron .jrBikeBrand__allCta b,
.template-index .jrBikeBrand--talaria .jrBikeBrand__allCta b{color:#090909!important;}

/* Slightly cleaner lower SEO block so it does not compete with shopping UI. */
.template-index .jrHomeSEO--v8{
  margin-top:34px;
  opacity:.92;
}

@media(max-width:860px){
  .template-index .jrDepartment{grid-template-columns:1fr;}
}
@media(max-width:720px){
  .template-index .jrHomeSection--department{padding-top:42px;}
  .template-index .jrHomeSection__head--department{margin-bottom:13px;}
  .template-index .jrDepartment{gap:7px;}
  .template-index .jrDepartment__item{
    min-height:72px;
    grid-template-columns:42px minmax(0,1fr) 26px;
    gap:11px;
    padding:12px 13px;
    border-radius:14px;
  }
  .template-index .jrDepartment__num{
    width:36px;
    height:36px;
    border-radius:10px;
    font-size:10px;
  }
  .template-index .jrDepartment__copy strong{font-size:15px;}
  .template-index .jrDepartment__copy small{font-size:10px;}
  .template-index .jrDepartment__arrow{font-size:20px;}
  .template-index .jrDepartmentHelp{
    align-items:flex-start;
    flex-direction:column;
    gap:11px;
    padding:14px;
  }
  .template-index .jrDepartmentHelp>a{width:100%;justify-content:center;}
}

/* =========================================================
   J&R v13 Homepage — compact Shop by Part navigation
   Replaces Parts Department with a lighter premium strip.
   Brand colours/logo unchanged.
   ========================================================= */
.template-index .jrHomeSection--department{display:none!important;}
.template-index .jrHomeSection--partNav{padding-top:54px;}
.template-index .jrHomeSection__head--partNav{margin-bottom:16px;align-items:end;}
.template-index .jrPartNav{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}
.template-index .jrPartNav a{
  min-height:72px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:13px 15px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:#111;
  color:#fff;
  transition:background .15s ease,border-color .15s ease,transform .15s ease;
}
.template-index .jrPartNav a:hover{
  transform:translateY(-1px);
  border-color:rgba(242,195,0,.42);
  background:#15140f;
}
.template-index .jrPartNav a span{
  flex:0 0 auto;
  min-width:30px;
  color:var(--accent);
  font:900 9px/1 Oswald,Inter,sans-serif;
  letter-spacing:.10em;
}
.template-index .jrPartNav a strong{
  color:#fff;
  font:900 15px/1 Oswald,Inter,sans-serif;
  letter-spacing:.025em;
  text-transform:uppercase;
}
.template-index .jrPartNav .jrPartNav__all{
  background:var(--accent);
  border-color:var(--accent);
}
.template-index .jrPartNav .jrPartNav__all span,
.template-index .jrPartNav .jrPartNav__all strong{color:#080808;}
.template-index .jrPartNav .jrPartNav__all:hover{background:#ffd20a;border-color:#ffd20a;}

.template-index .jrPartAssist{
  margin-top:9px;
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:11px 14px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:13px;
  background:rgba(255,255,255,.025);
}
.template-index .jrPartAssist span{color:rgba(255,255,255,.58);font-size:11px;}
.template-index .jrPartAssist span b{color:#fff;font-weight:800;}
.template-index .jrPartAssist a{
  flex:0 0 auto;
  color:var(--accent);
  font:900 10px/1 Oswald,Inter,sans-serif;
  letter-spacing:.05em;
}

@media(max-width:920px){
  .template-index .jrPartNav{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:720px){
  .template-index .jrHomeSection--partNav{padding-top:40px;}
  .template-index .jrHomeSection__head--partNav{margin-bottom:12px;}
  .template-index .jrPartNav{
    display:flex;
    overflow-x:auto;
    gap:7px;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    padding-bottom:2px;
  }
  .template-index .jrPartNav::-webkit-scrollbar{display:none;}
  .template-index .jrPartNav a{
    flex:0 0 132px;
    min-height:64px;
    scroll-snap-align:start;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:7px;
    padding:11px 12px;
  }
  .template-index .jrPartNav a strong{font-size:13px;}
  .template-index .jrPartNav a span{font-size:8px;}
  .template-index .jrPartAssist{align-items:flex-start;flex-direction:column;gap:7px;padding:11px 12px;}
}


/* v14 clean homepage — no duplicate parts section */
.template-index .jrHomeSupportStrip{
  max-width:1220px;
  margin:30px auto 0;
  padding:22px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border:1px solid rgba(242,195,0,.26);
  border-radius:20px;
  background:linear-gradient(135deg,rgba(242,195,0,.10),rgba(255,255,255,.025));
}
.template-index .jrHomeSupportStrip__copy{min-width:0;}
.template-index .jrHomeSupportStrip__copy strong{
  display:block;
  margin-top:5px;
  font:900 clamp(20px,2.2vw,28px)/1.08 Oswald,Inter,sans-serif;
  text-transform:uppercase;
  letter-spacing:.01em;
}
.template-index .jrHomeSupportStrip__copy p{
  margin:7px 0 0;
  color:rgba(255,255,255,.64);
  font-size:13px;
  line-height:1.55;
}
.template-index .jrHomeSupportStrip .jrBtn{flex:0 0 auto;white-space:nowrap;}
@media(max-width:720px){
  .template-index .jrHomeSupportStrip{
    margin:22px 12px 0;
    padding:18px;
    align-items:flex-start;
    flex-direction:column;
    gap:14px;
    border-radius:16px;
  }
  .template-index .jrHomeSupportStrip__copy strong{font-size:22px;}
  .template-index .jrHomeSupportStrip__copy p{font-size:12px;}
  .template-index .jrHomeSupportStrip .jrBtn{width:100%;justify-content:center;}
}

/* =========================================================
   J&R v15 FINAL MOBILE POLISH
   Mobile-only refinement. Brand colours/logo remain unchanged.
   ========================================================= */
@media (max-width: 920px){
  /* Header: compact, stable and thumb-friendly */
  .site-header .header-inner{
    min-height:58px!important;
    padding:7px 10px!important;
    gap:7px!important;
  }
  .site-header .brand{width:42px!important;height:42px!important;flex:0 0 42px!important;}
  .site-header .brand img.logo{height:27px!important;max-width:38px!important;}
  .site-header .cart-btn,.site-header .hamburger{width:42px!important;height:42px!important;border-radius:11px!important;}
  .site-header .header-actions{gap:6px!important;}
  .announcement-bar__viewport{padding:5px 0!important;}
  .announcement-bar__content{font-size:10px!important;gap:7px!important;}

  /* Drawer: slightly narrower reading width on tablets, full-screen on phones */
  .mnav__body{padding-inline:12px!important;}
  .mnav__item{margin-bottom:7px!important;}
  .mnav__summary{min-height:50px!important;padding-inline:13px!important;}
  .mnav__links a{min-height:48px!important;}
}

@media (max-width: 720px){
  /* Homepage hero: less vertical bulk, stronger first screen */
  .template-index .jrHome--v8{padding-bottom:28px!important;}
  .template-index .jrHome--v8 .jrHome__heroCard{
    width:calc(100% - 16px)!important;
    margin:8px auto 0!important;
    border-radius:17px!important;
    overflow:hidden!important;
  }
  .template-index .jrHome--v8 .jrHome__heroGrid{
    min-height:0!important;
    padding:28px 16px 27px!important;
  }
  .template-index .jrHome--v8 .jrHome__heroCard::after{
    background-size:315px auto!important;
    background-position:right -120px bottom 8px!important;
    opacity:.50!important;
  }
  .template-index .jrHome--v8 .jrHome__heroCard::before{
    background:linear-gradient(180deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.73) 58%,rgba(0,0,0,.62) 100%),radial-gradient(520px 310px at 0 0,rgba(242,195,0,.12),transparent 68%)!important;
  }
  .template-index .jrHome--v8 .jrHome__kicker{font-size:9px!important;letter-spacing:.15em!important;}
  .template-index .jrHome--v8 .jrHome__headline{margin:9px 0 10px!important;}
  .template-index .jrHome--v8 .jrHome__headlineA,
  .template-index .jrHome--v8 .jrHome__headlineB{
    font-size:clamp(34px,10.7vw,48px)!important;
    line-height:.94!important;
  }
  .template-index .jrHome--v8 .jrHome__sub{
    max-width:94%!important;
    margin:11px 0 15px!important;
    font-size:13px!important;
    line-height:1.48!important;
  }

  /* Primary actions: predictable 2 + 1 layout */
  .template-index .jrHome__actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important;}
  .template-index .jrHome__actions .jrBtn{
    min-height:43px!important;
    padding:9px 8px!important;
    border-radius:11px!important;
    font-size:10px!important;
    justify-content:center!important;
  }
  .template-index .jrHome__actions .jrBtn:last-child{grid-column:1/-1!important;}

  /* Hero search: easy to use without taking over the first screen */
  .template-index .jrHomeSearch--hero{margin-top:16px!important;}
  .template-index .jrHomeSearch__label{font-size:9px!important;margin-bottom:6px!important;}
  .template-index .jrHomeSearch__row{min-height:48px!important;padding:4px!important;border-radius:12px!important;}
  .template-index .jrHomeSearch__row input{padding:10px!important;font-size:16px!important;}
  .template-index .jrHomeSearch__row button{min-width:68px!important;padding:0 10px!important;font-size:9px!important;border-radius:9px!important;}
  .template-index .jrHomeSearch__tips{
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    gap:6px!important;
    margin-top:8px!important;
    padding-bottom:2px!important;
    scrollbar-width:none!important;
  }
  .template-index .jrHomeSearch__tips::-webkit-scrollbar{display:none!important;}
  .template-index .jrHomeSearch__tips>*{flex:0 0 auto!important;}
  .template-index .jrHomeSearch__tips a{padding:5px 7px!important;font-size:9px!important;}

  /* Trust benefits: horizontal rail instead of a tall 2x2 block */
  .template-index .jrTrustBar--v8{
    display:flex!important;
    overflow-x:auto!important;
    gap:7px!important;
    margin-top:8px!important;
    padding:0 8px 3px!important;
    scroll-snap-type:x proximity!important;
    scrollbar-width:none!important;
  }
  .template-index .jrTrustBar--v8::-webkit-scrollbar{display:none!important;}
  .template-index .jrTrustBar--v8>div{
    flex:0 0 174px!important;
    min-height:57px!important;
    padding:10px 11px!important;
    border-radius:12px!important;
    scroll-snap-align:start!important;
  }
  .template-index .jrTrustBar--v8 strong{font-size:9px!important;}
  .template-index .jrTrustBar--v8 span{font-size:9.5px!important;line-height:1.3!important;}

  /* Shop by Bike: consistent Surron/Talaria cards */
  .template-index .jrHomeSection--finder{padding:30px 9px 0!important;}
  .template-index .jrHomeSection__head{margin-bottom:12px!important;}
  .template-index .jrHomeSection__head h2{font-size:27px!important;}
  .template-index .jrHomeSection__head p{margin-top:8px!important;font-size:11.5px!important;line-height:1.5!important;}
  .template-index .jrBikeChooser--v8{gap:10px!important;}
  .template-index .jrBikeChooser--v8 .jrBikeBrand{border-radius:15px!important;box-shadow:none!important;}
  .template-index .jrBikeChooser--v8 .jrBikeBrand__head{
    min-height:68px!important;
    padding:11px 12px!important;
    gap:10px!important;
  }
  .template-index .jrBikeChooser--v8 .jrBikeBrand__head img{max-width:108px!important;max-height:31px!important;}
  .template-index .jrBikeBrand__head .jrBikeBrand__allCta{
    min-height:32px!important;
    padding:0 9px!important;
    border-radius:9px!important;
    font-size:8.5px!important;
    letter-spacing:.025em!important;
  }
  .template-index .jrBikeBrand__modelTitle{padding:9px 12px 7px!important;font-size:8.5px!important;}
  .template-index .jrBikeBrand__models,
  .template-index .jrBikeBrand__models--four{grid-template-columns:1fr 1fr!important;}
  .template-index .jrBikeBrand__models a{
    min-height:62px!important;
    padding:10px 30px 10px 11px!important;
  }
  .template-index .jrBikeBrand__models strong{font-size:12.5px!important;}
  .template-index .jrBikeBrand__models small{font-size:9.5px!important;line-height:1.25!important;}
  .template-index .jrBikeBrand__models a>span{right:11px!important;font-size:18px!important;}
  .template-index .jrBikeBrand__miniLinks{
    gap:6px!important;
    padding:9px 10px 10px!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }
  .template-index .jrBikeBrand__miniLinks::-webkit-scrollbar{display:none!important;}
  .template-index .jrBikeBrand__miniLinks a,
  .template-index .jrBikeBrand__soon{
    flex:0 0 auto!important;
    min-height:31px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:6px 9px!important;
    font-size:9.5px!important;
  }

  /* Support bar: compact finish to homepage */
  .template-index .jrHomeSupportStrip{
    margin:18px 9px 0!important;
    padding:15px!important;
    gap:11px!important;
    border-radius:14px!important;
  }
  .template-index .jrHomeSupportStrip__copy strong{font-size:20px!important;}
  .template-index .jrHomeSupportStrip__copy p{margin-top:5px!important;font-size:11px!important;}
  .template-index .jrHomeSupportStrip .jrBtn{min-height:43px!important;width:100%!important;justify-content:center!important;}

  /* Collection pages: keep quick navigation compact and swipeable */
  .page--collection{padding-left:10px!important;padding-right:10px!important;}
  .page--collection .jrCollectionHead__titleRow{align-items:flex-start!important;}
  .page--collection .jrCollectionHead__count{margin-top:2px!important;}
  .page--collection .jrCollectionQuick__scroll{margin-right:-10px!important;padding-right:10px!important;}
  .page--collection .jrCollectionQuick__scroll a,
  .page--collection .jrCollectionQuick__scroll>span{min-height:36px!important;padding:8px 11px!important;font-size:10.5px!important;}

  /* Contact: reduce dead space while keeping fields easy to tap */
  .jrContactPage{padding:10px 9px 38px!important;}
  .jrContactPage__hero{padding:18px 15px!important;border-radius:15px!important;}
  .jrContactPage__hero h1{font-size:clamp(32px,9.6vw,42px)!important;}
  .jrContactPage__grid{margin-top:8px!important;gap:8px!important;}
  .jrContactPage__formCard{padding:15px 12px!important;border-radius:15px!important;}
  .jrContactPageForm__grid{gap:9px!important;}
  .jrContactPageForm input,.jrContactPageForm select{min-height:45px!important;}
  .jrContactPageForm__message textarea{min-height:138px!important;}
}

@media (max-width: 380px){
  .template-index .jrHome__actions{grid-template-columns:1fr!important;}
  .template-index .jrHome__actions .jrBtn:last-child{grid-column:auto!important;}
  .template-index .jrBikeBrand__head{align-items:flex-start!important;flex-direction:column!important;}
  .template-index .jrBikeBrand__head .jrBikeBrand__allCta{align-self:stretch!important;justify-content:center!important;}
  .mnav__topLinks{grid-template-columns:1fr!important;}
}