:root{color-scheme:light only}
/* ============================================================
   合和图文 · topbar.css
   全站统一页头 = 文创打样页(service-wenchuang.html)同款导航栏
   与文创页内联样式逐条对齐，保证跨页面导航栏零跳动。
   注意：service-wenchuang.html 不引用本文件（自带同款内联样式）。
   ============================================================ */

.topbar{display:flex;align-items:center;justify-content:space-between;padding:20px clamp(22px,6vw,88px);border-bottom:1px solid #D0D0C8;background:#F5F3ED;position:relative;z-index:2}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.04em}
.topnav{display:flex;gap:clamp(12px,1.8vw,28px);flex-wrap:nowrap;flex:1;justify-content:center;margin:0 clamp(16px,3vw,40px);min-width:0}
.topnav a{font-size:14.5px;font-weight:600;letter-spacing:.04em;color:#17191F;text-decoration:none;padding-bottom:4px;border-bottom:2px solid transparent;transition:color .15s;white-space:nowrap}
.topnav a:hover{color:#17191F}
.topnav a.on{color:#17191F;font-weight:800;border-bottom-color:#FF4B35}
.nav-note{color:#666666;font-size:12.5px;letter-spacing:.1em;white-space:nowrap}

@media(max-width:1250px){.topbar{padding-left:24px;padding-right:24px}.topnav{gap:16px;margin:0 16px}}
@media(max-width:1024px){.nav-note{display:none}}
@media(max-width:700px){
  .topbar{flex-wrap:wrap;padding:14px 16px 0}
  .nav-note{display:block;order:2;width:100%;font-size:11px;letter-spacing:.06em;margin-top:2px}
  .topnav{display:flex;flex:0 0 100%;box-sizing:border-box;order:3;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:20px;margin:8px -16px 0;padding:8px 16px 10px;justify-content:flex-start;scrollbar-width:none}
  .nav-note{box-sizing:border-box}
  .topnav::-webkit-scrollbar{display:none}
  .topnav a{font-size:14px;white-space:nowrap}
}