/* ============================================================
   昌吉分站专属样式补丁
   主站已有样式（section/card/btn/grid/hero 等）全部复用
   这里只写分站独有的组件，且只用主站已有色变量
   ============================================================ */

/* ---- 顶部城市切换条 ---- */
.city-switch {
  background: var(--brand-deep, #082b5f);
  color: #cfe0f5;
  font-size: 12.5px;
}
.city-switch-inner {
  max-width: var(--max, 1180px);
  margin: 0 auto;
  padding: 6px var(--gutter, 24px);
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.city-switch .label { color: #9db8da; }
.city-switch .current {
  color: #fff;
  font-weight: 600;
  background: rgba(255,255,255,0.12);
  padding: 2px 10px;
  border-radius: 999px;
}
.city-switch a {
  color: #cfe0f5;
  text-decoration: none;
  padding: 2px 8px;
  border-radius: 4px;
}
.city-switch a:hover { background: rgba(255,255,255,0.12); color: #fff; }
.city-switch .sep { color: #3d5a86; }

/* ---- Hero 区金棕标签（压在主视觉图角上） ---- */
.region-hero { position: relative; }
.region-badge {
  position: absolute;
  top: 14px;
  right: 14px;
  background: var(--accent, #c7862d);
  color: #fff;
  font-size: 12.5px;
  padding: 6px 12px;
  border-radius: 6px;
  font-weight: 600;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  z-index: 2;
}
@media (max-width: 700px) {
  .region-badge { position: static; display: inline-block; margin-bottom: 8px; }
}

/* ---- 两条参训路径分岔 ---- */
.path-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 16px;
}
@media (max-width: 760px) { .path-split { grid-template-columns: 1fr; } }

.path-card {
  border-radius: 10px;
  padding: 18px;
  border: 1px solid var(--line, #d7e1ec);
}
.path-card h3 {
  font-size: 16px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.path-card .who {
  display: inline-block;
  font-size: 11.5px;
  padding: 2px 10px;
  border-radius: 999px;
  margin-bottom: 10px;
}
.path-card ul { list-style: none; }
.path-card li {
  padding: 5px 0 5px 18px;
  position: relative;
  font-size: 13.5px;
  color: var(--ink, #142033);
  line-height: 1.55;
}
.path-card li::before {
  content: "✓";
  position: absolute;
  left: 0;
  font-weight: 700;
}
.path-card .flow {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 6px;
  font-size: 12.5px;
  line-height: 1.6;
}

/* 路径A：个人通勤——主站品牌蓝 */
.path-a { background: var(--soft, #e7f1fb); border-color: #bfd9f2; }
.path-a h3 { color: var(--brand-dark, #063f82); }
.path-a .who { background: var(--brand, #075db7); color: #fff; }
.path-a li::before { color: var(--brand, #075db7); }
.path-a .flow { background: #fff; color: var(--muted, #5e6f86);}

/* 路径B：成团上门——主站金棕 */
.path-b { background: #fdf6ec; border-color: #edd3a5; }
.path-b h3 { color: #8a5a1a; }
.path-b .who { background: var(--accent, #c7862d); color: #fff; }
.path-b li::before { color: var(--accent, #c7862d); }
.path-b .flow { background: #fff; color: var(--muted, #5e6f86);  }

.path-b .note-line {
  margin-top: 10px;
  font-size: 12px;
  color: #8a5a1a;
  background: var(--warning, #fff3df);
  padding: 8px 10px;
  border-radius: 6px;
  line-height: 1.55;
}

/* ---- 昌吉到乌市交通方案表 ---- */
.commute {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 14px;
}
@media (max-width: 760px) { .commute { grid-template-columns: 1fr; } }
.commute .mode {
  background: #fff;
  border: 1px solid var(--line, #d7e1ec);
  border-radius: 8px;
  padding: 14px;
}
.commute .mode h4 {
  font-size: 14.5px;
  color: var(--brand-dark, #063f82);
  margin-bottom: 6px;
}
.commute .mode .time {
  font-size: 22px;
  font-weight: 700;
  color: var(--brand, #075db7);
  margin-bottom: 4px;
}
.commute .mode p { font-size: 12.5px; color: var(--muted, #5e6f86); line-height: 1.6; }

/* ---- 本地案例卡 ---- */
.case-strip {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-top: 14px;
}
@media (max-width: 760px) { .case-strip { grid-template-columns: 1fr; } }
.case-item {
  background: #fff;
  border: 1px solid var(--line, #d7e1ec);
  border-radius: 8px;
  padding: 14px;
}
.case-item .title { font-size: 13px; font-weight: 600; color: var(--ink, #142033); margin-bottom: 4px; }
.case-item .meta { font-size: 12px; color: var(--accent, #c7862d); margin-bottom: 6px; }
.case-item .desc { font-size: 12.5px; color: var(--muted, #5e6f86); line-height: 1.6; }
.case-item.group {
  background: #fdf6ec;
  border-color: #edd3a5;
}

/* ---- 本地FAQ 手风琴样式（用 details/summary，无JS依赖） ---- */
.region-faq details {
  background: #fff;
  border: 1px solid var(--line, #d7e1ec);
  border-radius: 8px;
  margin-bottom: 10px;
  overflow: hidden;
}
.region-faq summary {
  padding: 13px 16px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink, #142033);
  cursor: pointer;
  list-style: none;
  position: relative;
  padding-right: 36px;
}
.region-faq summary::-webkit-details-marker { display: none; }
.region-faq summary::after {
  content: "+";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 20px;
  color: var(--brand, #075db7);
  font-weight: 400;
}
.region-faq details[open] summary::after { content: "–"; }
.region-faq .faq-body {
  padding: 0 16px 14px;
  font-size: 13.5px;
  color: var(--muted, #5e6f86);
  line-height: 1.75;
}

/* ---- 事实声明条 ---- */
.region-declare {
  background: var(--warning, #fff3df);
  border-left: 4px solid var(--accent, #c7862d);
  padding: 12px 16px;
  border-radius: 6px;
  font-size: 12.5px;
  color: #7a5a20;
  line-height: 1.7;
  margin-top: 18px;
}

/* ---- 本地化培训节奏（卡片网格） ---- */
.local-timeline {
  margin-top: 16px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  counter-reset: step;
}
@media (max-width: 760px) { .local-timeline { grid-template-columns: 1fr; } }
.local-timeline .step {
  position: relative;
  background: #fff;
  border: 1px solid var(--line, #d7e1ec);
  border-radius: 8px;
  padding: 14px 14px 14px 56px;
  counter-increment: step;
}
.local-timeline .step::before {
  content: counter(step);
  position: absolute;
  left: 14px;
  top: 14px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--brand, #075db7);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.local-timeline .step.drive {
  background: #fdf6ec;
  border-color: #edd3a5;
}
.local-timeline .step.drive::before {
  background: var(--accent, #c7862d);
}
.local-timeline .step h4 {
  font-size: 14.5px;
  color: var(--ink, #142033);
  margin-bottom: 3px;
  padding-right: 4px;
}
.local-timeline .step h4 .days {
  font-size: 11.5px;
  color: var(--brand, #075db7);
  font-weight: 600;
  margin-left: 6px;
  display: inline-block;
}
.local-timeline .step.drive h4 .days { color: var(--accent, #c7862d); }
.local-timeline .step p { font-size: 12.5px; color: var(--muted, #5e6f86); line-height: 1.65; }

/* ---- 本地课程推荐表 ---- */
.local-course-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 14px;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  font-size: 13px;
}
.local-course-table th,
.local-course-table td {
  padding: 11px 12px;
  text-align: left;
  border-bottom: 1px solid var(--line, #d7e1ec);
  vertical-align: top;
}
.local-course-table th {
  background: var(--soft, #e7f1fb);
  color: var(--brand-dark, #063f82);
  font-weight: 600;
  white-space: nowrap;
}
.local-course-table td.price {
  color: var(--accent, #c7862d);
  font-weight: 700;
  white-space: nowrap;
}
.local-course-table tr:last-child td { border-bottom: none; }
.local-course-table .fit { color: var(--muted, #5e6f86); font-size: 12.5px; }
@media (max-width: 700px) {
  .local-course-table { display: block; overflow-x: auto; }
}

/* ---- 本地应用/就业场景 ---- */
.local-jobs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 14px;
}
@media (max-width: 760px) { .local-jobs { grid-template-columns: 1fr; } }
.local-jobs .job {
  background: #fff;
  border: 1px solid var(--line, #d7e1ec);
  border-radius: 8px;
  padding: 14px;
}
.local-jobs .job h4 {
  font-size: 14px;
  color: var(--brand-dark, #063f82);
  margin-bottom: 6px;
}
.local-jobs .job p {
  font-size: 12.5px;
  color: var(--muted, #5e6f86);
  line-height: 1.65;
}

/* ---- 本地新闻摘要 ---- */
.news-strip {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-top: 14px;
}
@media (max-width: 760px) { .news-strip { grid-template-columns: 1fr; } }
.news-item {
  background: #fff;
  border: 1px solid var(--line, #d7e1ec);
  border-radius: 8px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  transition: border-color .15s, box-shadow .15s;
}
.news-item:hover { border-color: var(--brand, #075db7); box-shadow: 0 2px 10px rgba(7,93,183,0.08); }
.news-item .date {
  font-size: 12px;
  color: var(--accent, #c7862d);
  margin-bottom: 6px;
  font-weight: 600;
}
.news-item h3 {
  font-size: 14.5px;
  color: var(--ink, #142033);
  margin-bottom: 6px;
  line-height: 1.45;
}
.news-item p {
  font-size: 12.5px;
  color: var(--muted, #5e6f86);
  line-height: 1.65;
  flex: 1;
}
