.jpc-nav { background:#fff; border-bottom:1px solid #F3E8FF; position:relative; z-index:100; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; }
.jpc-bar { position:relative !important; width:100% !important; max-width:100% !important; margin:0 !important; padding:0 clamp(8px,2vw,40px) !important; display:flex !important; align-items:stretch !important; height:64px !important; box-sizing:border-box !important; background:#fff !important; }
.jpc-items { display:flex !important; flex-wrap:nowrap !important; align-items:stretch !important; justify-content:space-between !important; list-style:none !important; margin:0 !important; padding:0 !important; width:100% !important; flex:1 1 100% !important; height:100% !important; gap:2px !important; }
.jpc-ni { position:static !important; display:flex !important; flex:1 1 auto !important; min-width:0 !important; margin:0 !important; padding:0 !important; justify-content:center !important; }
.jpc-nl, a.jpc-nl, a.jpc-nl:visited, a.jpc-nl:active { display:flex !important; align-items:center !important; justify-content:center !important; gap:6px !important; padding:0 clamp(2px,.5vw,10px) !important; width:100% !important; height:64px !important; color:#24142D !important; font-size:clamp(11px,1vw,14px) !important; font-weight:600 !important; letter-spacing:.01em !important; text-decoration:none !important; border:0 !important; box-shadow:none !important; white-space:nowrap !important; overflow:hidden !important; box-sizing:border-box !important; background:transparent !important; border-bottom:2px solid transparent !important; }
.jpc-nl:hover, .jpc-ni:hover > .jpc-nl, .jpc-ni:focus-within > .jpc-nl { color:#6A0DAD !important; background:#F3E8FF !important; text-decoration:none !important; border-bottom:2px solid #6A0DAD !important; }
.jpc-nl-icon { width:20px !important; height:20px !important; object-fit:contain !important; flex:0 0 auto !important; display:inline-block !important; }
@media (max-width:1200px) and (min-width:1024px) { .jpc-nl-icon { display:none !important; } }
.jpc-caret { font-size:9px !important; color:#6B5377 !important; }
.jpc-ni:hover .jpc-caret { color:#6A0DAD !important; }

/* ===== Dropdown：对齐容器，绝不溢出视口 ===== */
.jpc-dd { display:none; position:absolute; left:0; right:0; top:100%; background:#fff; border-top:1px solid #F3E8FF; border-bottom:1px solid #D9C4F0; box-shadow:0 24px 60px rgba(59,23,94,.16); }
.jpc-ni:hover > .jpc-dd,
.jpc-ni:focus-within > .jpc-dd { display:block; }
.jpc-dd-in { max-width:1440px; margin:0 auto; padding:28px 32px 24px; display:grid; grid-auto-flow:column; grid-auto-columns:1fr; gap:0; }
.jpc-dd-col { padding:0 28px; border-right:1px solid #F3E8FF; min-width:0; }
.jpc-dd-col:last-child { border-right:0; }
.jpc-dd-h { font-size:12px; font-weight:800; color:#3B175E; text-transform:uppercase; letter-spacing:.8px; margin:0 0 10px; padding-bottom:8px; border-bottom:2px solid #F3E8FF; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.jpc-dd-group + .jpc-dd-group { margin-top:24px; }
.jpc-dd ul { list-style:none; margin:0; padding:0; }
.jpc-dd li + li { margin-top:2px; }
.jpc-dd li a { display:flex; align-items:center; gap:10px; padding:7px 8px; border-radius:6px; color:#24142D; font-size:14px; text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.jpc-dd li a:hover, .jpc-dd li a:focus { color:#6A0DAD; background:#F3E8FF; }
.jpc-dd-t { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.jpc-dd-more-li { margin-top:8px; }
.jpc-dd-more { font-size:13.5px; font-weight:700; color:#6A0DAD; padding:6px 8px; }
.jpc-dd-more:hover { color:#3B175E; }
.jpc-dd-logo { width:22px; height:22px; object-fit:contain; flex:0 0 auto; }
.jpc-dd-avatar { width:22px; height:22px; border-radius:50%; background:#F3E8FF; color:#3B175E; font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.jpc-dd-brand { background:#FBF7FF; border-radius:12px; padding:18px 20px; }
.jpc-brand-logo { display:block; width:52px; height:52px; object-fit:contain; margin-bottom:12px; }
.jpc-dd-viewall { display:block !important; text-align:left !important; padding:12px 32px !important; font-size:13px !important; font-weight:700 !important; color:#6A0DAD !important; text-decoration:none !important; border-top:1px solid #F3E8FF !important; }
.jpc-dd-viewall:hover { background:#F3E8FF; color:#3B175E; }

/* ===== Burger ===== */
.jpc-burger { display:none; margin-right:auto; background:none; border:0; cursor:pointer; width:40px; height:40px; padding:8px; }
.jpc-burger span { display:block; height:2px; background:#3B175E; border-radius:2px; margin:5px 0; transition:.2s; }
.jpc-open .jpc-burger span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.jpc-open .jpc-burger span:nth-child(2) { opacity:0; }
.jpc-open .jpc-burger span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* ===== Mobile drawer ===== */
.jpc-mobile { position:fixed; inset:60px 0 0; background:#fff; overflow:auto; padding:10px 18px 60px; z-index:99; }
.jpc-m-link, a.jpc-m-link, a.jpc-m-link:visited { display:flex !important; justify-content:space-between !important; align-items:center !important; width:100% !important; box-sizing:border-box !important; padding:13px 4px !important; font-size:15px !important; font-weight:700 !important; color:#24142D !important; text-decoration:none !important; border:0 !important; border-bottom:1px solid #F3E8FF !important; box-shadow:none !important; background:transparent !important; }
.jpc-m-details { border-bottom:1px solid #F3E8FF; }
.jpc-m-details summary { display:flex; justify-content:space-between; align-items:center; padding:13px 4px; font-size:15px; font-weight:700; color:#24142D; cursor:pointer; list-style:none; }
.jpc-m-details summary::-webkit-details-marker { display:none; }
.jpc-m-details[open] .jpc-m-plus { transform:rotate(45deg); }
.jpc-m-plus { font-size:18px; color:#6A0DAD; transition:.2s; }
.jpc-m-body .jpc-dd { display:block !important; position:static !important; width:auto !important; max-width:100% !important; min-width:0 !important; left:auto !important; right:auto !important; top:auto !important; transform:none !important; box-shadow:none !important; border:0 !important; background:transparent !important; padding:0 !important; margin:0 !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; z-index:auto !important; }
.jpc-m-body .jpc-dd-in { display:block !important; max-width:100% !important; margin:0 !important; padding:6px 0 4px !important; gap:0 !important; }
.jpc-m-body .jpc-dd-col { display:block !important; width:auto !important; max-width:100% !important; flex:none !important; border:0 !important; padding:0 0 8px !important; margin:0 !important; }
.jpc-m-body .jpc-dd-brand { background:none !important; padding:6px 0 !important; }
.jpc-m-body .jpc-dd-viewall { border-top:0 !important; text-align:left !important; padding:8px 0 !important; }
.jpc-m-body .jpc-brand-logo { display:none !important; }
.jpc-m-body .jpc-dd ul { padding-left:0 !important; margin:0 !important; }
.jpc-m-all { display:block; padding:8px 4px 14px; color:#6A0DAD; font-size:13.5px; font-weight:700; text-decoration:none; }

/* keep dropdowns visible outside theme header */
header, .site-header, .section-header, .header, .shopline-header { overflow:visible !important; }
@media (max-width:1023px) {
  .jpc-items { display:none !important; }
  .jpc-burger { display:block !important; }
  .jpc-bar { height:56px !important; }
  .jpc-mobile { inset:56px 0 0 !important; }
}
@media (min-width:1024px) {
  .jpc-mobile { display:none !important; }
}
/* hide theme's own mobile hamburger button (we use jpc-burger instead) */
.header-action-bar__menu { display:none !important; }

/* ===== TeamProKit 主题补丁 ===== */
.jpc-nav, .jpc-nav * { font-family:Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important; }
/* 主题自定义区块会把内容塞进 .rte / .page-width 里，这里强行拉满 */
.rte:has(> .jpc-nav), .custom-sline__inner:has(> .rte > .jpc-nav) {
  align-self:stretch !important; width:100% !important; max-width:100% !important; min-width:0 !important;
}
.jpc-nav { width:100% !important; max-width:100% !important; }
.jpc-dd-in { max-width:1760px !important; }