/* ============================================================
   robotics.css —— 机器人模块共用样式
   覆盖：pages/robotics/ 下所有子页
   依赖：astudy-industry.css（基础卡片/表格/时间轴/高亮框等）
   ============================================================ */

:root {
  --rb-deep:    #0b1220;
  --rb-navy:    #1a2744;
  --rb-purple:  #2a1a5e;
  --rb-cyan:    #00d4ff;
  --rb-cyan-d:  #0095c8;
  --rb-gold:    #ffe9a8;
  --rb-gold-d:  #b7791f;
  --rb-text:    #e8ecff;
  --rb-text-d:  #cfd6ee;
  --rb-muted:   #8892b5;
  --rb-line:    rgba(255,255,255,.08);
  --rb-card-bg: rgba(255,255,255,.04);
}

/* ===== 顶部导航 ===== */
.rb-topnav {
  position: sticky; top: 0; z-index: 50;
  background: linear-gradient(180deg, rgba(11,18,32,.95) 0%, rgba(11,18,32,.85) 100%);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--rb-line);
  padding: 10px 18px;
}
.rb-topnav-inner {
  max-width: 1280px; margin: 0 auto;
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
}
.rb-brand {
  font-size: 16px; font-weight: 800; color: var(--rb-gold);
  text-decoration: none; letter-spacing: 1px;
  display: flex; align-items: center; gap: 8px;
}
.rb-brand .rb-bot { font-size: 22px }
.rb-back {
  font-size: 12px; color: var(--rb-text-d); text-decoration: none;
  padding: 4px 10px; border: 1px solid var(--rb-line); border-radius: 4px;
  transition: .2s;
}
.rb-back:hover { background: rgba(255,255,255,.06); color: var(--rb-cyan) }
.rb-tabs {
  margin-left: auto;
  display: flex; gap: 4px; flex-wrap: wrap;
}
.rb-tab {
  font-size: 12.5px; color: var(--rb-text-d); text-decoration: none;
  padding: 5px 11px; border-radius: 4px;
  transition: .2s;
}
.rb-tab:hover { background: rgba(0,212,255,.08); color: var(--rb-cyan) }
.rb-tab.active { background: rgba(0,212,255,.12); color: var(--rb-cyan); font-weight: 700 }

/* ===== 页面整体背景（机器人模块用深色科技风） ===== */
body.rb-page {
  font-family: "SF Pro SC","PingFang SC","Microsoft YaHei",sans-serif;
  background: radial-gradient(ellipse at top, #1a2744 0%, var(--rb-deep) 60%, #050810 100%);
  background-attachment: fixed;
  color: var(--rb-text);
  min-height: 100vh;
  overflow-x: hidden;
}
body.rb-page::before {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(0,212,255,.05) 0%, transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(255,233,168,.04) 0%, transparent 40%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40'><g fill='none' stroke='%2300d4ff' stroke-width='.4' opacity='.06'><circle cx='20' cy='20' r='2'/><line x1='0' y1='20' x2='40' y2='20'/><line x1='20' y1='0' x2='20' y2='40'/></g></svg>");
  background-repeat: no-repeat, no-repeat, repeat;
}
.rb-wrap {
  position: relative; z-index: 1;
  max-width: 1180px; margin: 0 auto;
  padding: 24px 24px 60px;
}

/* ===== 面包屑 ===== */
.rb-crumb {
  font-size: 12.5px; color: var(--rb-muted);
  margin-bottom: 14px; letter-spacing: .5px;
}
.rb-crumb a { color: var(--rb-text-d); text-decoration: none }
.rb-crumb a:hover { color: var(--rb-cyan) }
.rb-crumb .sep { margin: 0 6px; opacity: .5 }

/* ===== 页面标题 ===== */
.rb-h1 {
  font-size: clamp(28px, 4.5vw, 42px);
  font-weight: 900; letter-spacing: 3px;
  color: var(--rb-gold); margin-bottom: 8px; line-height: 1.2;
  text-shadow: 0 0 30px rgba(255,233,168,.25);
}
.rb-sub {
  font-size: 14px; color: var(--rb-text-d); line-height: 1.85;
  margin-bottom: 20px; letter-spacing: .5px;
}
.rb-sub em { color: var(--rb-cyan); font-style: normal; font-weight: 600 }
.rb-sub strong { color: var(--rb-gold); font-weight: 700 }

/* ===== 段落区块 ===== */
.rb-sec {
  background: var(--rb-card-bg);
  border: 1px solid var(--rb-line);
  border-radius: 12px;
  padding: 22px 24px;
  margin-bottom: 18px;
  position: relative;
}
.rb-sec h2 {
  font-size: 20px; font-weight: 800; color: var(--rb-gold);
  margin: 0 0 14px; padding-bottom: 10px;
  border-bottom: 1px dashed var(--rb-line); letter-spacing: 1px;
}
.rb-sec h3 {
  font-size: 16px; font-weight: 700; color: var(--rb-cyan);
  margin: 16px 0 10px; letter-spacing: .5px;
}
.rb-sec p {
  font-size: 14px; line-height: 1.85; color: var(--rb-text-d);
  margin: 8px 0;
}
.rb-sec p strong { color: var(--rb-gold) }
.rb-sec p em { color: var(--rb-cyan); font-style: normal; font-weight: 600 }
.rb-sec ul, .rb-sec ol {
  padding-left: 22px; line-height: 1.95; font-size: 14px; color: var(--rb-text-d);
}
.rb-sec ul li, .rb-sec ol li { margin: 4px 0 }
.rb-sec ul li strong, .rb-sec ol li strong { color: var(--rb-gold) }
.rb-sec ul li em, .rb-sec ol li em { color: var(--rb-cyan); font-style: normal; font-weight: 600 }

/* ===== 数据卡片栅格（snap） ===== */
.rb-snap {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px; margin: 14px 0;
}
.rb-snap-card {
  background: linear-gradient(135deg, rgba(0,212,255,.08), rgba(42,26,94,.15));
  border: 1px solid rgba(0,212,255,.2);
  border-radius: 10px;
  padding: 14px 16px;
}
.rb-snap-k { font-size: 12px; color: var(--rb-muted); margin-bottom: 6px }
.rb-snap-v { font-size: 22px; font-weight: 800; color: var(--rb-gold); line-height: 1.1 }
.rb-snap-n { font-size: 11.5px; color: var(--rb-muted); margin-top: 4px }

/* ===== 产业链节点卡片 ===== */
.rb-chain {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px; margin-top: 12px;
}
.rb-chain-node {
  background: linear-gradient(180deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,.02) 100%);
  border: 1px solid var(--rb-line);
  border-left: 3px solid var(--rb-cyan);
  border-radius: 10px;
  padding: 14px 16px;
  transition: .25s;
  text-decoration: none; color: inherit; display: block;
}
.rb-chain-node:hover {
  border-color: var(--rb-cyan);
  box-shadow: 0 4px 18px rgba(0,212,255,.18);
  transform: translateY(-2px);
}
.rb-chain-node .cn-tier {
  font-size: 11px; letter-spacing: 2px; color: var(--rb-cyan);
  text-transform: uppercase; font-weight: 700;
}
.rb-chain-node .cn-name {
  font-size: 16px; color: var(--rb-gold); font-weight: 800;
  margin: 4px 0 6px;
}
.rb-chain-node .cn-desc {
  font-size: 12.5px; color: var(--rb-text-d); line-height: 1.65;
}
.rb-chain-node .cn-tags {
  margin-top: 8px; display: flex; flex-wrap: wrap; gap: 4px;
}
.rb-chain-node .cn-tag {
  font-size: 10.5px; padding: 2px 7px;
  background: rgba(255,233,168,.1); color: var(--rb-gold);
  border-radius: 3px; letter-spacing: .5px;
}

/* ===== 模块导航卡（首页用） ===== */
.rb-nav-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px; margin-top: 12px;
}
.rb-nav-card {
  background: var(--rb-card-bg);
  border: 1px solid var(--rb-line);
  border-radius: 12px;
  padding: 16px 18px;
  text-decoration: none; color: inherit;
  transition: .25s;
  display: block; position: relative;
}
.rb-nav-card:hover {
  border-color: var(--rb-cyan);
  background: rgba(0,212,255,.05);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,.3);
}
.rb-nav-card.wip {
  opacity: .55; cursor: not-allowed;
}
.rb-nav-card.wip:hover { transform: none; border-color: var(--rb-line); background: var(--rb-card-bg) }
.rb-nav-card .nv-icon { font-size: 28px; line-height: 1; margin-bottom: 8px }
.rb-nav-card .nv-name {
  font-size: 16px; font-weight: 700; color: var(--rb-gold);
  margin-bottom: 4px;
}
.rb-nav-card .nv-desc {
  font-size: 12.5px; color: var(--rb-text-d); line-height: 1.6;
}
.rb-nav-card .nv-stage {
  position: absolute; top: 10px; right: 10px;
  font-size: 10px; padding: 2px 7px; border-radius: 3px;
  letter-spacing: 1px; font-weight: 700;
}
.rb-nav-card .nv-stage.live { background: rgba(0,212,255,.15); color: var(--rb-cyan) }
.rb-nav-card .nv-stage.wip { background: rgba(255,233,168,.12); color: var(--rb-gold) }

/* ===== 表格 ===== */
.rb-tbl-wrap { overflow-x: auto; margin: 10px 0 }
.rb-tbl {
  width: 100%; border-collapse: collapse; font-size: 13px;
  background: rgba(255,255,255,.02);
}
.rb-tbl thead {
  background: linear-gradient(180deg, rgba(0,212,255,.12) 0%, rgba(0,212,255,.06) 100%);
}
.rb-tbl th {
  padding: 10px 12px; text-align: left; font-weight: 700;
  color: var(--rb-gold); font-size: 12.5px; letter-spacing: .5px;
  border-bottom: 1px solid var(--rb-line);
}
.rb-tbl th.num { text-align: right }
.rb-tbl td {
  padding: 9px 12px; border-bottom: 1px solid var(--rb-line);
  color: var(--rb-text-d); line-height: 1.6;
}
.rb-tbl td.num { text-align: right; font-variant-numeric: tabular-nums }
.rb-tbl td.code {
  font-family: "SF Mono","Menlo",monospace; font-size: 12.5px;
  color: var(--rb-cyan);
}
.rb-tbl tbody tr:hover { background: rgba(255,255,255,.03) }
.rb-tbl .yes { color: #4ade80; font-weight: 700 }
.rb-tbl .no  { color: #f87171; font-weight: 700 }
.rb-tbl .mid { color: var(--rb-gold); font-weight: 700 }

/* ===== 高亮框 ===== */
.rb-tip {
  background: linear-gradient(180deg, rgba(0,212,255,.08) 0%, rgba(0,212,255,.03) 100%);
  border-left: 3px solid var(--rb-cyan);
  padding: 14px 16px;
  border-radius: 6px;
  margin: 14px 0;
}
.rb-tip h4 { color: var(--rb-cyan); margin: 0 0 6px; font-size: 14.5px; font-weight: 700 }
.rb-tip p, .rb-tip li { font-size: 13.5px; color: var(--rb-text-d); line-height: 1.8 }

.rb-warn {
  background: linear-gradient(180deg, rgba(255,100,100,.08) 0%, rgba(255,100,100,.03) 100%);
  border-left: 3px solid #f87171;
  padding: 14px 16px;
  border-radius: 6px;
  margin: 14px 0;
}
.rb-warn h4 { color: #fca5a5; margin: 0 0 6px; font-size: 14.5px; font-weight: 700 }
.rb-warn p, .rb-warn li { font-size: 13.5px; color: var(--rb-text-d); line-height: 1.8 }

.rb-good {
  background: linear-gradient(180deg, rgba(74,222,128,.08) 0%, rgba(74,222,128,.03) 100%);
  border-left: 3px solid #4ade80;
  padding: 14px 16px;
  border-radius: 6px;
  margin: 14px 0;
}
.rb-good h4 { color: #86efac; margin: 0 0 6px; font-size: 14.5px; font-weight: 700 }
.rb-good p, .rb-good li { font-size: 13.5px; color: var(--rb-text-d); line-height: 1.8 }

/* ===== 时间轴 ===== */
.rb-timeline {
  position: relative;
  padding-left: 22px;
  margin: 14px 0;
  border-left: 2px solid var(--rb-line);
}
.rb-timeline::before {
  content: ""; position: absolute; left: -2px; top: 0;
  width: 2px; height: 30%;
  background: linear-gradient(180deg, var(--rb-cyan), transparent);
}
.rb-tl-item { position: relative; margin-bottom: 18px }
.rb-tl-item::before {
  content: ""; position: absolute; left: -29px; top: 4px;
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--rb-cyan);
  box-shadow: 0 0 0 4px rgba(0,212,255,.2);
}
.rb-tl-year {
  font-size: 12px; color: var(--rb-cyan); font-weight: 700; letter-spacing: 1px;
}
.rb-tl-title {
  font-size: 15px; font-weight: 700; color: var(--rb-gold);
  margin: 4px 0;
}
.rb-tl-desc { font-size: 13px; color: var(--rb-text-d); line-height: 1.75 }

/* ===== 公司卡 ===== */
.rb-co-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px; margin: 12px 0;
}
.rb-co-card {
  background: linear-gradient(135deg, rgba(11,18,32,.6), rgba(42,26,94,.3));
  border: 1px solid var(--rb-line);
  border-radius: 10px;
  padding: 14px 16px;
  transition: .2s;
}
.rb-co-card:hover { border-color: var(--rb-cyan); transform: translateY(-2px) }
.rb-co-name { font-size: 16px; font-weight: 800; color: var(--rb-gold); margin-bottom: 4px }
.rb-co-tag { font-size: 11px; color: var(--rb-cyan); letter-spacing: 1px; margin-bottom: 6px }
.rb-co-desc { font-size: 12.5px; color: var(--rb-text-d); line-height: 1.65 }
.rb-co-meta {
  display: flex; gap: 10px; flex-wrap: wrap;
  margin-top: 8px; padding-top: 8px;
  border-top: 1px dashed var(--rb-line);
  font-size: 11.5px; color: var(--rb-muted);
}
.rb-co-meta span strong { color: var(--rb-gold) }

/* ===== 投资逻辑结论卡 ===== */
.rb-verdict {
  background: linear-gradient(135deg, var(--rb-navy), var(--rb-purple));
  border-radius: 12px;
  padding: 20px 22px;
  margin: 16px 0;
  border: 1px solid rgba(255,233,168,.2);
}
.rb-verdict h3 {
  color: var(--rb-gold); font-size: 17px;
  margin: 0 0 10px; letter-spacing: 1px;
}
.rb-verdict ol { padding-left: 22px; line-height: 2; color: var(--rb-text-d); font-size: 14px }
.rb-verdict ol li em { color: var(--rb-cyan); font-style: normal; font-weight: 600 }
.rb-verdict ol li strong { color: var(--rb-gold) }

/* ===== 免责声明 ===== */
.rb-disclaimer {
  font-size: 11.5px; color: var(--rb-muted);
  text-align: center; margin-top: 28px;
  padding: 14px; border-top: 1px dashed var(--rb-line);
  letter-spacing: .5px;
}

/* ===== 响应式 ===== */
@media (max-width: 720px) {
  .rb-wrap { padding: 16px 14px 40px }
  .rb-h1 { letter-spacing: 1px }
  .rb-sec { padding: 16px }
  .rb-tabs { width: 100%; margin-left: 0; margin-top: 8px }
}