/* ===========================================================
   gen.微波连接器.公司 —— 原创设计系统 (mwc- 前缀)
   配色：深空墨蓝黑 #0B1320 / 信号金 #D9A441 / 频谱青 #1FC8B8 / 行动橙 #F2784B
   强制：面包屑与正文 H2 左缘严格对齐（--h2-inset）
   =========================================================== */

:root {
  --mwc-bg: #0B1320;
  --mwc-bg-2: #0F1B2D;
  --mwc-surface: #16233A;
  --mwc-surface-2: #1C2C47;
  --mwc-border: #2A3A55;
  --mwc-border-soft: #22324C;
  --mwc-gold: #D9A441;
  --mwc-teal: #1FC8B8;
  --mwc-orange: #F2784B;
  --mwc-text: #E6ECF5;
  --mwc-text-dim: #9FB0C7;
  --mwc-text-faint: #6E8099;
  --mwc-maxw: 1200px;
  --mwc-nav-h: 64px;
  --h2-inset: 16px;            /* 文章/列表/产品：面包屑与 H2 对齐值 */
  --mwc-radius: 14px;
  --mwc-shadow: 0 8px 30px rgba(0,0,0,.35);
  font-synthesis: none;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(31,200,184,.10), transparent 60%),
    radial-gradient(900px 500px at -10% 10%, rgba(217,164,65,.10), transparent 55%),
    var(--mwc-bg);
  color: var(--mwc-text);
  font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
  line-height: 1.75;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--mwc-teal); text-decoration: none; transition: color .15s; }
a:hover { color: var(--mwc-gold); }

h1,h2,h3,h4 { line-height: 1.3; font-weight: 700; }
h1 { font-size: 30px; margin: 0 0 18px; letter-spacing: .2px; }
h2 { font-size: 23px; margin: 34px 0 14px; padding-bottom: 8px; border-bottom: 1px solid var(--mwc-border-soft); }
h3 { font-size: 19px; margin: 24px 0 10px; color: var(--mwc-gold); }
h4 { font-size: 16px; margin: 18px 0 8px; color: var(--mwc-teal); }

p { margin: 0 0 14px; color: var(--mwc-text); }
ul, ol { margin: 0 0 14px; padding-left: 22px; }
li { margin: 6px 0; }
code, .mwc-mono { font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; }

/* ---------- 顶部固定导航 ---------- */
.mwc-nav {
  position: sticky; top: 0; z-index: 50;
  height: var(--mwc-nav-h);
  display: flex; align-items: center; gap: 18px;
  padding: 0 22px;
  background: rgba(11,19,32,.86);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--mwc-border);
}
.mwc-nav .mwc-brand {
  font-weight: 800; font-size: 18px; letter-spacing: .3px;
  color: var(--mwc-text); display: flex; align-items: center; gap: 10px;
}
.mwc-nav .mwc-brand .mwc-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: linear-gradient(135deg, var(--mwc-gold), var(--mwc-teal));
  box-shadow: 0 0 12px rgba(31,200,184,.6);
}
.mwc-nav .mwc-brand b { color: var(--mwc-gold); }
.mwc-nav .mwc-spacer { flex: 1; }
.mwc-nav .mwc-menu { display: flex; align-items: center; gap: 4px; }
.mwc-nav .mwc-menu > li { position: relative; list-style: none; }
.mwc-nav .mwc-menu > li > a, .mwc-nav .mwc-menu > li > button {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 14px; color: var(--mwc-text-dim); background: none; border: 0;
  font-size: 15px; cursor: pointer; border-radius: 8px; font-family: inherit;
}
.mwc-nav .mwc-menu > li > a:hover, .mwc-nav .mwc-menu > li > button:hover { color: var(--mwc-text); background: var(--mwc-surface); }
.mwc-nav .mwc-menu .mwc-caret::after { content: "▾"; font-size: 11px; opacity: .7; }
.mwc-nav .mwc-sub {
  position: absolute; top: 100%; left: 0; min-width: 200px;
  background: var(--mwc-surface); border: 1px solid var(--mwc-border);
  border-radius: 10px; padding: 8px; box-shadow: var(--mwc-shadow);
  display: none; z-index: 60;
}
.mwc-nav .mwc-menu > li:hover .mwc-sub,
.mwc-nav .mwc-menu > li:focus-within .mwc-sub { display: block; }
.mwc-nav .mwc-sub a { display: block; padding: 8px 12px; border-radius: 6px; color: var(--mwc-text-dim); }
.mwc-nav .mwc-sub a:hover { background: var(--mwc-surface-2); color: var(--mwc-text); }
.mwc-nav .mwc-burger { display: none; background: none; border: 0; color: var(--mwc-text); font-size: 24px; cursor: pointer; }

/* ---------- 容器 ---------- */
.mwc-container { max-width: var(--mwc-maxw); margin: 0 auto; padding: 0 22px; }
.mwc-section { padding: 56px 0; }

/* ---------- 面包屑 ---------- */
.mwc-breadcrumb {
  font-size: 13.5px; color: var(--mwc-text-faint);
  padding-left: var(--h2-inset);
  margin: 18px 0 6px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
.mwc-breadcrumb a { color: var(--mwc-text-dim); }
.mwc-breadcrumb a:hover { color: var(--mwc-gold); }
.mwc-breadcrumb .mwc-sep { color: var(--mwc-text-faint); opacity: .6; }
.mwc-breadcrumb .mwc-cur { color: var(--mwc-text); }

/* ---------- 布局栅格 ---------- */
.mwc-article-layout {
  display: grid; grid-template-columns: minmax(0,1fr) 240px;
  gap: 36px; max-width: var(--mwc-maxw); margin: 0 auto; padding: 0 22px 60px;
}
.mwc-list-layout { max-width: var(--mwc-maxw); margin: 0 auto; padding: 0 22px 60px; }
.mwc-list-layout .mwc-layout-grid {
  display: grid; grid-template-columns: 240px minmax(0,1fr);
  gap: 36px; align-items: start;
}
.mwc-page-layout {
  --h2-inset: 48px;                 /* 页面卡片：面包屑与内容对齐值 */
  max-width: 920px; margin: 0 auto; padding: 0 22px 60px;
}
.mwc-content-main { min-width: 0; }
.mwc-article-inner, .mwc-page-inner { padding-left: var(--h2-inset); }

/* ---------- 摘要 / 结论块 ---------- */
.mwc-content-main > blockquote,
.mwc-article-inner > blockquote,
blockquote {
  margin: 18px 0; padding: 14px 18px;
  border-left: 4px solid var(--mwc-gold);
  background: linear-gradient(90deg, rgba(217,164,65,.10), rgba(217,164,65,.02));
  border-radius: 0 10px 10px 0; color: var(--mwc-text);
}
blockquote.mwc-conclusion {
  border-left-color: var(--mwc-teal);
  background: linear-gradient(90deg, rgba(31,200,184,.12), rgba(31,200,184,.02));
}
.mwc-keywords { font-size: 14px; color: var(--mwc-text-dim); margin: 10px 0 8px; }
.mwc-keywords b { color: var(--mwc-gold); font-weight: 600; }
.mwc-time { font-size: 13px; color: var(--mwc-text-faint); margin: 6px 0 18px; }

/* ---------- 表格（含 Markdown 裸 table 全覆盖，[M26]） ---------- */
.mwc-content-main table, .mwc-page-main table, table.mwc-spec {
  width: 100%; border-collapse: collapse; margin: 16px 0 20px;
  font-size: 14.5px; border: 1px solid var(--mwc-border);
}
.mwc-content-main table th, .mwc-page-main table th, table.mwc-spec th {
  background: linear-gradient(180deg, #1E3A5F, #16294A);
  color: #fff; text-align: left; padding: 10px 12px; font-weight: 600;
  border: 1px solid var(--mwc-border);
}
.mwc-content-main table td, .mwc-page-main table td, table.mwc-spec td {
  padding: 9px 12px; border: 1px solid #334864; color: var(--mwc-text);
}
.mwc-content-main table tr:nth-child(even) td,
.mwc-page-main table tr:nth-child(even) td,
table.mwc-spec tr:nth-child(even) td { background: rgba(255,255,255,.03); }

/* ---------- 详情页目录（原生 details，sticky） ---------- */
.mwc-toc-aside { position: sticky; top: calc(var(--mwc-nav-h) + 16px); align-self: start; }
.mwc-toc-panel {
  border: 1px solid var(--mwc-border); border-radius: 12px;
  background: var(--mwc-surface); padding: 6px; max-height: calc(100vh - 110px); overflow: auto;
}
.mwc-toc-panel > summary {
  cursor: pointer; padding: 10px 14px; font-weight: 700; color: var(--mwc-gold);
  list-style: none; display: flex; align-items: center; justify-content: space-between;
}
.mwc-toc-panel > summary::-webkit-details-marker { display: none; }
.mwc-toc-panel > summary::after { content: "▾"; transition: transform .2s; }
.mwc-toc-panel:not([open]) > summary::after { transform: rotate(-90deg); }
.mwc-toc-panel ol { margin: 0; padding: 4px 14px 12px 30px; }
.mwc-toc-panel li { margin: 7px 0; }
.mwc-toc-panel a { color: var(--mwc-text-dim); font-size: 14px; }
.mwc-toc-panel a:hover { color: var(--mwc-gold); }

/* ---------- 列表页分类侧栏（原生 details） ---------- */
.mwc-cat-side { position: sticky; top: calc(var(--mwc-nav-h) + 16px); align-self: start; }
.mwc-cat-panel {
  border: 1px solid var(--mwc-border); border-radius: 12px;
  background: var(--mwc-surface); overflow: hidden;
}
.mwc-cat-panel > summary {
  cursor: pointer; padding: 12px 16px; font-weight: 700; color: var(--mwc-gold);
  list-style: none; display: flex; align-items: center; justify-content: space-between;
  background: var(--mwc-surface-2);
}
.mwc-cat-panel > summary::-webkit-details-marker { display: none; }
.mwc-cat-panel > summary::after { content: "▾"; transition: transform .2s; }
.mwc-cat-panel:not([open]) > summary::after { transform: rotate(-90deg); }
.mwc-category-list { list-style: none; margin: 0; padding: 8px; }
.mwc-category-list li a {
  display: block; padding: 9px 12px; border-radius: 8px; color: var(--mwc-text-dim); font-size: 14.5px;
}
.mwc-category-list li a:hover, .mwc-category-list li a.mwc-active {
  background: var(--mwc-surface-2); color: var(--mwc-gold);
}

/* ---------- 卡片（列表页 / 首页） ---------- */
.mwc-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
.mwc-card {
  display: block; background: var(--mwc-surface); border: 1px solid var(--mwc-border);
  border-radius: var(--mwc-radius); padding: 18px; transition: transform .15s, border-color .15s, box-shadow .15s;
}
.mwc-card:hover { transform: translateY(-3px); border-color: var(--mwc-gold); box-shadow: var(--mwc-shadow); }
.mwc-card h3 { margin: 0 0 8px; font-size: 17px; }
.mwc-card .mwc-card-meta { font-size: 12.5px; color: var(--mwc-text-faint); margin-bottom: 8px; }
.mwc-card p { font-size: 14px; color: var(--mwc-text-dim); margin: 0; }
.mwc-card .mwc-tag { display: inline-block; font-size: 12px; color: var(--mwc-teal); border: 1px solid var(--mwc-border); border-radius: 999px; padding: 2px 10px; margin: 8px 6px 0 0; }

/* ---------- FAQ（裸 details，[M2]） ---------- */
.mwc-article-inner details, .mwc-page-inner details, .mwc-product-inner details {
  border: 1px solid var(--mwc-border); border-radius: 10px; margin: 10px 0; background: var(--mwc-surface);
}
.mwc-article-inner details summary, .mwc-page-inner details summary, .mwc-product-inner details summary {
  cursor: pointer; padding: 13px 16px; font-weight: 600; color: var(--mwc-text);
  list-style: none; display: flex; align-items: center; gap: 8px;
}
.mwc-article-inner details summary::-webkit-details-marker { display: none; }
.mwc-article-inner details summary::before,
.mwc-page-inner details summary::before,
.mwc-product-inner details summary::before { content: "＋"; color: var(--mwc-gold); font-weight: 800; }
.mwc-article-inner details[open] summary::before,
.mwc-page-inner details[open] summary::before,
.mwc-product-inner details[open] summary::before { content: "－"; }
.mwc-article-inner details p, .mwc-page-inner details p, .mwc-product-inner details p { padding: 0 16px 14px; margin: 0; color: var(--mwc-text-dim); }

/* ---------- 实践经验 callout ---------- */
.mwc-case {
  border: 1px solid var(--mwc-teal); border-radius: 12px; padding: 14px 18px; margin: 16px 0;
  background: linear-gradient(90deg, rgba(31,200,184,.10), transparent);
}
.mwc-case b { color: var(--mwc-teal); }

/* ---------- 标签 ---------- */
.tag-text { display: inline-block; font-size: 12px; color: var(--mwc-teal); background: rgba(31,200,184,.10); border: 1px solid var(--mwc-border); border-radius: 999px; padding: 2px 10px; margin: 0 6px 6px 0; }

/* ---------- 悬浮胶囊 ---------- */
.mwc-float {
  position: fixed; right: 18px; top: 50%; transform: translateY(-50%);
  display: flex; flex-direction: column; gap: 10px; z-index: 80;
}
.mwc-float button {
  display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
  padding: 10px 16px; border: 0; border-radius: 999px; cursor: pointer;
  font-family: inherit; font-size: 13.5px; font-weight: 600; color: #0B1320;
  background: linear-gradient(135deg, var(--mwc-gold), var(--mwc-teal));
  box-shadow: 0 6px 18px rgba(0,0,0,.4); transition: transform .15s, filter .15s;
}
.mwc-float button:hover { transform: scale(1.05); filter: brightness(1.08); }
.mwc-float .mwc-float-icon { font-size: 16px; }

/* 名片弹层 */
.mwc-card-mask {
  position: fixed; inset: 0; background: rgba(0,0,0,.7); display: none;
  align-items: center; justify-content: center; z-index: 100;
}
.mwc-card-mask.mwc-show { display: flex; }
.mwc-card-mask img { max-width: 90vw; max-height: 90vh; border-radius: 8px; box-shadow: var(--mwc-shadow); }
.mwc-card-mask .mwc-card-close {
  position: absolute; top: 20px; right: 24px; font-size: 30px; color: #fff; background: none; border: 0; cursor: pointer;
}

/* ---------- 首页 hero ---------- */
.mwc-hero {
  position: relative; padding: 90px 0 70px; overflow: hidden;
  border-bottom: 1px solid var(--mwc-border);
}
.mwc-hero .mwc-hero-glow {
  position: absolute; width: 520px; height: 520px; right: -120px; top: -160px;
  background: radial-gradient(circle, rgba(31,200,184,.22), transparent 65%); pointer-events: none;
}
.mwc-hero h1 { font-size: 42px; max-width: 760px; }
.mwc-hero { text-align: center; }
.mwc-hero h1 { margin-left: auto; margin-right: auto; }
.mwc-hero .mwc-hero-sub { font-size: 18px; color: var(--mwc-text-dim); max-width: 640px; margin: 16px auto 26px; }
.mwc-hero .mwc-hero-cta { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; }
.mwc-btn {
  display: inline-flex; align-items: center; gap: 8px; padding: 13px 24px; border-radius: 999px;
  font-weight: 700; cursor: pointer; border: 1px solid transparent; font-size: 15px;
}
.mwc-btn-gold { background: linear-gradient(135deg, var(--mwc-gold), #E7B85C); color: #0B1320; }
.mwc-btn-ghost { background: transparent; border-color: var(--mwc-border); color: var(--mwc-text); }
.mwc-btn:hover { filter: brightness(1.08); }

.mwc-stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 44px; }
.mwc-stat { background: var(--mwc-surface); border: 1px solid var(--mwc-border); border-radius: 12px; padding: 18px; }
.mwc-stat b { display: block; font-size: 26px; color: var(--mwc-gold); }
.mwc-stat span { font-size: 13px; color: var(--mwc-text-dim); }

.mwc-sec-title { font-size: 26px; margin: 0 0 6px; }
.mwc-sec-sub { color: var(--mwc-text-dim); margin: 0 0 26px; }

.mwc-capsules { display: flex; flex-wrap: wrap; gap: 12px; }
.mwc-capsule {
  padding: 10px 18px; border-radius: 999px; border: 1px solid var(--mwc-border);
  background: var(--mwc-surface); color: var(--mwc-text); font-size: 14px;
}
.mwc-capsule b { color: var(--mwc-teal); }

/* ---------- 页脚 ---------- */
.mwc-footer { border-top: 1px solid var(--mwc-border); background: var(--mwc-bg-2); padding: 40px 0 28px; margin-top: 40px; }
.mwc-footer .mwc-footer-cols { display: grid; grid-template-columns: 2.2fr 1fr 1fr; gap: 26px; }
.mwc-footer h4 { color: var(--mwc-gold); margin-top: 0; }
.mwc-footer a { color: var(--mwc-text-dim); display: block; margin: 6px 0; font-size: 14px; }
.mwc-footer .mwc-copy { margin-top: 26px; padding-top: 16px; border-top: 1px solid var(--mwc-border); color: var(--mwc-text-faint); font-size: 13px; }

/* ---------- 404 ---------- */
.mwc-404 { text-align: center; padding: 120px 0; }
.mwc-404 h1 { font-size: 64px; color: var(--mwc-gold); }

/* ---------- 响应式（≤1024：折叠面板收起，栅格单列，[M25]） ---------- */
@media (max-width: 1024px) {
  .mwc-nav .mwc-burger { display: block; }
  .mwc-nav .mwc-menu {
    display: none; position: absolute; top: var(--mwc-nav-h); left: 0; right: 0;
    flex-direction: column; background: var(--mwc-surface); border-bottom: 1px solid var(--mwc-border); padding: 10px;
  }
  .mwc-nav .mwc-menu.mwc-open { display: flex; }
  .mwc-nav .mwc-sub { position: static; display: none; box-shadow: none; border: 0; padding-left: 14px; }
  .mwc-nav .mwc-menu > li:hover .mwc-sub { display: none; }
  .mwc-nav .mwc-menu > li.mwc-exp > .mwc-sub { display: block; }

  .mwc-article-layout { grid-template-columns: 1fr; }
  .mwc-list-layout .mwc-layout-grid { grid-template-columns: 1fr; }
  .mwc-toc-aside, .mwc-cat-side { position: static; top: auto; max-height: none; }
  /* 折叠面板在手机端保留可点击入口，绝不用 display:none 隐藏（[M25]） */
  .mwc-hero h1 { font-size: 32px; }
  .mwc-stat-row { grid-template-columns: repeat(2, 1fr); }
  .mwc-footer .mwc-footer-cols { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .mwc-stat-row { grid-template-columns: 1fr; }
  .mwc-float { right: 10px; gap: 8px; }
  .mwc-float button { padding: 9px 12px; font-size: 12.5px; }
}