/* =====================================================
   餐创小厨 - 全站样式（PC + 移动端自适应）
   配色取自原站：主红 #DB4339 / 辅助蓝 #008FD7 / 橙 #FF5400
   ===================================================== */
:root {
  --red: #DB4339;
  --red-dark: #BF332A;
  --red-light: #FFF2F1;
  --blue: #008FD7;
  --blue-dark: #0077B6;
  --blue-light: #EAF6FD;
  --orange: #FF5400;
  --green: #2E9E5B;
  --text: #333333;
  --text-2: #666666;
  --text-3: #999999;
  --line: #E8E8E8;
  --line-2: #F0F0F0;
  --bg: #F2F2F2;
  --white: #FFFFFF;
  --radius: 6px;
  --shadow: 0 2px 12px rgba(0, 0, 0, .07);
  --shadow-hover: 0 6px 22px rgba(219, 67, 57, .16);
  --max: 1200px;
}

* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  font-family: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", -apple-system, "Helvetica Neue", Arial, sans-serif;
  font-size: 14px; line-height: 1.7; color: var(--text); background: var(--bg);
}
ul, ol, li { list-style: none; }
a { color: var(--text); text-decoration: none; transition: color .2s; }
a:hover { color: var(--red); }
img { border: 0; max-width: 100%; display: block; }
i, em { font-style: normal; }
h1, h2, h3, h4, h5, h6 { font-weight: 700; line-height: 1.4; }
input, textarea, select, button { font-family: inherit; font-size: 14px; outline: none; }
textarea { resize: vertical; }
::selection { background: var(--red); color: #fff; }

.wrap { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 16px; }
.clearfix::after { content: ""; display: block; clear: both; }
.hide { display: none !important; }
.text-red { color: var(--red); }
.text-blue { color: var(--blue); }
.text-orange { color: var(--orange); }
.text-gray { color: var(--text-3); }
.ellipsis { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ellipsis-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ellipsis-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* ---------- 顶部通栏 ---------- */
.topbar { background: #F7F7F7; border-bottom: 1px solid var(--line); font-size: 12px; color: var(--text-3); height: 34px; line-height: 34px; }
.topbar .wrap { display: flex; align-items: center; justify-content: space-between; }
.topbar a { color: var(--text-3); }
.topbar a:hover { color: var(--red); }
.topbar .tb-left span { margin-right: 14px; }
.topbar .tb-right { display: flex; gap: 14px; align-items: center; }

/* ---------- 头部 ---------- */
.header { background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .05); position: relative; z-index: 100; }
.header .wrap { display: flex; align-items: center; gap: 24px; height: 78px; }
.logo { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.logo-mark {
  width: 46px; height: 46px; border-radius: 10px; flex-shrink: 0;
  background: linear-gradient(135deg, var(--red), var(--orange));
  color: #fff; font-size: 22px; font-weight: 700; display: flex; align-items: center; justify-content: center;
}
.logo-txt strong { display: block; font-size: 21px; color: var(--red); letter-spacing: 1px; line-height: 1.2; }
.logo-txt span { display: block; font-size: 11px; color: var(--text-3); letter-spacing: 2px; }

.search-box { flex: 1; max-width: 480px; display: flex; border: 2px solid var(--red); border-radius: 20px; overflow: hidden; background: #fff; }
.search-box input { flex: 1; border: 0; padding: 0 16px; height: 36px; font-size: 13px; }
.search-box button { border: 0; background: var(--red); color: #fff; padding: 0 22px; cursor: pointer; font-size: 14px; }
.search-box button:hover { background: var(--red-dark); }

.header-right { display: flex; align-items: center; gap: 10px; margin-left: auto; flex-shrink: 0; }
.btn { display: inline-block; padding: 8px 18px; border-radius: 18px; border: 1px solid var(--line); background: #fff; cursor: pointer; font-size: 13px; color: var(--text); transition: all .2s; text-align: center; }
.btn:hover { border-color: var(--red); color: var(--red); }
.btn-primary { background: var(--red); border-color: var(--red); color: #fff; }
.btn-primary:hover { background: var(--red-dark); border-color: var(--red-dark); color: #fff; }
.btn-blue { background: var(--blue); border-color: var(--blue); color: #fff; }
.btn-blue:hover { background: var(--blue-dark); border-color: var(--blue-dark); color: #fff; }
.btn-sm { padding: 5px 12px; font-size: 12px; border-radius: 14px; }
.btn-lg { padding: 12px 32px; font-size: 15px; border-radius: 24px; }
.btn-block { display: block; width: 100%; }

/* ---------- 主导航 ---------- */
.nav { background: var(--red); position: relative; z-index: 99; }
.nav .wrap { display: flex; align-items: center; height: 46px; gap: 2px; }
.nav a { color: #fff; padding: 0 20px; line-height: 46px; font-size: 15px; display: block; position: relative; }
.nav a:hover, .nav a.on { background: rgba(0, 0, 0, .16); color: #fff; }
.nav .city-entry { margin-left: auto; background: rgba(255, 255, 255, .16); }

/* ---------- 城市条 ---------- */
.citybar { background: #fff; border-bottom: 1px solid var(--line); font-size: 13px; }
.citybar .wrap { display: flex; align-items: center; padding: 10px 16px; gap: 12px; flex-wrap: wrap; }
.citybar .cb-label { color: var(--text-3); flex-shrink: 0; }
.citybar a { color: var(--text-2); padding: 2px 4px; }
.citybar a.on { color: #fff; background: var(--red); border-radius: 3px; padding: 2px 8px; }
.citybar a:hover { color: var(--red); }

/* ---------- 面包屑 ---------- */
.crumb { font-size: 13px; color: var(--text-3); padding: 14px 0; }
.crumb a { color: var(--text-2); }
.crumb a:hover { color: var(--red); }
.crumb span.sep { margin: 0 6px; color: #ccc; }

/* ---------- 主容器 ---------- */
main { min-height: 60vh; }
.section { background: #fff; border-radius: var(--radius); padding: 20px; margin-bottom: 16px; }
.section-head { display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid var(--line-2); padding-bottom: 12px; margin-bottom: 18px; }
.section-head h2, .section-head h3 { font-size: 19px; position: relative; padding-left: 13px; }
.section-head h2::before, .section-head h3::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 18px; background: var(--red); border-radius: 2px;
}
.section-head .more { font-size: 13px; color: var(--text-3); }
.section-head .more:hover { color: var(--red); }
.section-head .tabs { display: flex; gap: 4px; font-size: 13px; }
.section-head .tabs a { padding: 4px 12px; border-radius: 15px; background: var(--line-2); color: var(--text-2); }
.section-head .tabs a.on { background: var(--red); color: #fff; }

/* ---------- 通用卡片网格 ---------- */
.grid { display: grid; gap: 14px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.grid-5 { grid-template-columns: repeat(5, 1fr); }

.card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; transition: all .25s; display: flex; flex-direction: column; }
.card:hover { box-shadow: var(--shadow-hover); border-color: #F5C9C5; transform: translateY(-2px); }
.card-cover { position: relative; width: 100%; aspect-ratio: 4/3; background: var(--line-2); overflow: hidden; }
.card-cover img { width: 100%; height: 100%; object-fit: cover; }
.card-cover .ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: #c9c9c9; font-size: 13px; background: linear-gradient(135deg, #FAFAFA, #F0F0F0); }
.card-body { padding: 12px; flex: 1; display: flex; flex-direction: column; }
.card-title { font-size: 15px; font-weight: 700; margin-bottom: 6px; color: var(--text); }
.card-title a:hover { color: var(--red); }
.card-desc { font-size: 12.5px; color: var(--text-3); line-height: 1.6; margin-bottom: 8px; flex: 1; }
.card-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12px; color: var(--text-3); }
.card-meta .tag { color: var(--red); }
.card-hl { display: flex; align-items: baseline; gap: 4px; font-size: 12px; color: var(--text-3); }
.card-hl b { color: var(--orange); font-size: 16px; }
.card-actions { margin-top: 10px; display: flex; gap: 8px; }

/* 角标 */
.badge { display: inline-block; font-size: 11px; padding: 1px 7px; border-radius: 3px; line-height: 18px; vertical-align: middle; }
.badge-red { background: var(--red-light); color: var(--red); }
.badge-blue { background: var(--blue-light); color: var(--blue); }
.badge-orange { background: #FFF3E8; color: var(--orange); }
.badge-green { background: #EAF7EF; color: var(--green); }
.badge-gray { background: #F2F2F2; color: var(--text-3); }
.badge-top { position: absolute; top: 8px; left: 8px; background: var(--red); color: #fff; font-size: 11px; padding: 2px 8px; border-radius: 3px; }
.badge-claimed { position: absolute; top: 8px; right: 8px; background: rgba(46,158,91,.94); color: #fff; font-size: 11px; padding: 2px 8px; border-radius: 3px; }

/* ---------- 列表项（横向） ---------- */
.list-item { display: flex; gap: 14px; padding: 14px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 12px; transition: all .25s; position: relative; }
.list-item:hover { box-shadow: var(--shadow-hover); border-color: #F5C9C5; transform: translateY(-1px); }
.list-item .li-cover { width: 175px; height: 124px; flex-shrink: 0; border-radius: 5px; overflow: hidden; background: var(--line-2); }
.list-item .li-cover img { width: 100%; height: 100%; object-fit: cover; }
.list-item .li-cover .ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #FAFAFA, #EFEFEF); color: #c9c9c9; font-size: 12px; }
.list-item .li-main { flex: 1; min-width: 0; }
.list-item .li-title { font-size: 17px; font-weight: 700; margin-bottom: 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.list-item .li-desc { font-size: 13px; color: var(--text-3); line-height: 1.65; margin-bottom: 8px; }
.list-item .li-tags { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12.5px; color: var(--text-2); }
.list-item .li-tags span b { color: var(--red); }
.list-item .li-side { width: 130px; flex-shrink: 0; text-align: center; display: flex; flex-direction: column; justify-content: center; gap: 8px; border-left: 1px dashed var(--line); padding-left: 12px; }
/* 详情页内嵌小尺寸封面（如机构详情「企业资讯」）：桌面小图，移动端随列表规则转全宽 */
.list-item .li-cover.li-cover-sm { width: 118px; height: 78px; }
.list-item .li-side .price { color: var(--orange); font-size: 18px; font-weight: 700; }
.list-item .li-side .price small { font-size: 12px; color: var(--text-3); font-weight: 400; }

/* ---------- 表格 ---------- */
.table { width: 100%; border-collapse: collapse; background: #fff; font-size: 13px; }
.table th, .table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
.table th { background: #FAFAFA; font-weight: 700; color: var(--text-2); white-space: nowrap; }
.table tbody tr:hover { background: #FFFCFC; }
.table .num { color: var(--orange); font-weight: 700; }

/* ---------- 表单 ---------- */
.form-row { margin-bottom: 16px; }
.form-row label { display: block; font-size: 13px; color: var(--text-2); margin-bottom: 6px; font-weight: 700; }
.form-row label i { color: var(--red); margin-right: 3px; }
.form-row .hint { font-size: 12px; color: var(--text-3); margin-top: 4px; }
.input, textarea.input, select.input {
  width: 100%; padding: 9px 12px; border: 1px solid #DDD; border-radius: 4px; background: #fff;
  font-size: 14px; color: var(--text); transition: border-color .2s;
}
.input:focus, textarea.input:focus, select.input:focus { border-color: var(--red); box-shadow: 0 0 0 2px rgba(219, 67, 57, .1); }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 18px; }
.form-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 18px; }
.form-full { grid-column: 1 / -1; }
.checkbox-line { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-2); }
.checkbox-line input { width: 15px; height: 15px; accent-color: var(--red); }

/* ---------- 分页 ---------- */
.pager { display: flex; justify-content: center; align-items: center; gap: 6px; padding: 22px 0; flex-wrap: wrap; }
.pager a, .pager span {
  min-width: 34px; height: 34px; line-height: 34px; padding: 0 10px; text-align: center;
  background: #fff; border: 1px solid var(--line); border-radius: 4px; font-size: 13px; color: var(--text-2);
}
.pager a:hover { border-color: var(--red); color: var(--red); }
.pager .on { background: var(--red); border-color: var(--red); color: #fff; }
.pager .disabled { color: #ccc; }
/* 上一页 / 下一页：仅显示箭头 */
.pager .pn { font-size: 16px; font-weight: 700; line-height: 32px; letter-spacing: 0; padding: 0 10px; }
.pager a.pn { color: var(--text-2); }
.pager a.pn:hover { color: var(--red); }

/* ---------- 提示条 ---------- */
.alert { padding: 11px 16px; border-radius: 5px; font-size: 13.5px; margin-bottom: 16px; }
.alert-ok { background: #EAF7EF; color: #1E7A44; border: 1px solid #C6E9D4; }
.alert-err { background: var(--red-light); color: var(--red-dark); border: 1px solid #F7CFCB; }
.alert-info { background: var(--blue-light); color: var(--blue-dark); border: 1px solid #CDE8F7; }
.alert-warn { background: #FFF8E6; color: #96690A; border: 1px solid #F5E2B3; }

/* ---------- 法律声明块 ---------- */
.legal-note {
  background: #FFFBF7; border: 1px solid #F5E0D2; border-left: 4px solid var(--orange);
  border-radius: 5px; padding: 14px 18px; font-size: 12.5px; color: #8A6A55; line-height: 1.85;
  margin: 16px 0;
}
.legal-note strong { color: var(--orange); }
.legal-note a { color: var(--orange); text-decoration: underline; }

/* ---------- 问答列表 ---------- */
.faq-list { display: flex; flex-direction: column; gap: 10px; }
.faq-item { border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: #fff; }
.faq-q {
  padding: 14px 44px 14px 16px; font-size: 15px; font-weight: 700; color: var(--text);
  cursor: pointer; position: relative; background: #FCFCFC; display: flex; align-items: flex-start; gap: 9px;
}
.faq-q::before { content: "问"; flex-shrink: 0; width: 20px; height: 20px; border-radius: 4px; background: var(--blue); color: #fff; font-size: 12px; font-weight: 400; display: flex; align-items: center; justify-content: center; margin-top: 2px; }
.faq-q::after { content: "+"; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: var(--text-3); font-size: 18px; font-weight: 400; transition: transform .2s; }
.faq-item.open .faq-q::after { content: "−"; color: var(--red); }
.faq-a { padding: 0 16px; max-height: 0; overflow: hidden; transition: max-height .3s ease, padding .3s; font-size: 14px; color: var(--text-2); line-height: 1.9; }
.faq-item.open .faq-a { padding: 14px 16px 16px; max-height: 1200px; }
.faq-a .faq-label { display: inline-flex; align-items: center; gap: 6px; color: var(--red); font-weight: 700; font-size: 13px; margin-bottom: 6px; }
.faq-a .faq-label::before { content: "答"; width: 20px; height: 20px; border-radius: 4px; background: var(--red); color: #fff; font-size: 12px; font-weight: 400; display: flex; align-items: center; justify-content: center; }
.faq-a .custom-tip { display: inline-block; font-size: 11px; color: var(--green); background: #EAF7EF; padding: 1px 7px; border-radius: 3px; margin-bottom: 8px; }

/* ---------- 排行榜 ---------- */
.rank-list { display: flex; flex-direction: column; gap: 10px; }
.rank-item { display: flex; align-items: center; gap: 14px; padding: 13px 16px; background: #fff; border: 1px solid var(--line); border-radius: 6px; transition: all .25s; }
.rank-item:hover { box-shadow: var(--shadow-hover); border-color: #F5C9C5; transform: translateX(3px); }
.rank-no { width: 32px; height: 32px; flex-shrink: 0; border-radius: 6px; background: var(--line-2); color: var(--text-3); font-weight: 700; display: flex; align-items: center; justify-content: center; font-size: 15px; }
.rank-item:nth-child(1) .rank-no { background: linear-gradient(135deg, #FFB800, #FF8A00); color: #fff; }
.rank-item:nth-child(2) .rank-no { background: linear-gradient(135deg, #B8C6D6, #96A8BC); color: #fff; }
.rank-item:nth-child(3) .rank-no { background: linear-gradient(135deg, #E39B62, #C97C3E); color: #fff; }
.rank-main { flex: 1; min-width: 0; }
.rank-name { font-size: 15.5px; font-weight: 700; margin-bottom: 3px; }
.rank-sub { font-size: 12.5px; color: var(--text-3); }
.rank-side { text-align: right; flex-shrink: 0; font-size: 12px; color: var(--text-3); }
.rank-side b { display: block; color: var(--orange); font-size: 17px; }

/* ---------- 详情页 ---------- */
.detail-layout { display: grid; grid-template-columns: 1fr 320px; gap: 16px; align-items: start; }
.detail-head { display: flex; gap: 18px; padding: 20px; background: #fff; border-radius: var(--radius); margin-bottom: 16px; }
.detail-head .dh-logo { width: 120px; height: 120px; flex-shrink: 0; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: #FAFAFA; }
.detail-head .dh-logo img { width: 100%; height: 100%; object-fit: cover; }
.detail-head .dh-logo .ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: #ccc; font-size: 12px; }
.detail-head .dh-main { flex: 1; min-width: 0; }
.detail-head h1 { font-size: 24px; margin-bottom: 8px; color: var(--text); line-height: 1.35; }
.detail-head .dh-intro { font-size: 13.5px; color: var(--text-2); line-height: 1.8; margin-bottom: 10px; }
.detail-head .dh-meta { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 13px; color: var(--text-3); }
.detail-head .dh-meta b { color: var(--red); }
.detail-head .dh-actions { display: flex; flex-direction: column; gap: 9px; width: 150px; flex-shrink: 0; }

.info-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.info-table th, .info-table td { padding: 10px 12px; border: 1px solid var(--line-2); text-align: left; }
.info-table th { background: #FAFAFA; color: var(--text-2); font-weight: 700; width: 110px; white-space: nowrap; }
.info-table td { color: var(--text); }

.article-body { font-size: 15px; line-height: 2; color: #3A3A3A; }
.article-body p { margin-bottom: 15px; }
.article-body h3 { font-size: 17px; margin: 22px 0 12px; color: var(--text); padding-left: 11px; border-left: 4px solid var(--red); }
.article-body ul, .article-body ol { margin: 0 0 15px 22px; }
.article-body li { list-style: disc; margin-bottom: 7px; }
.article-body ol li { list-style: decimal; }
.article-body img { margin: 12px 0; border-radius: 5px; }

/* 侧栏 */
.side-block { background: #fff; border-radius: var(--radius); padding: 18px; margin-bottom: 16px; }
.side-block h3 { font-size: 16px; padding-bottom: 11px; border-bottom: 2px solid var(--line-2); margin-bottom: 14px; position: relative; padding-left: 12px; }
.side-block h3::before { content: ""; position: absolute; left: 0; top: 4px; width: 4px; height: 15px; background: var(--red); border-radius: 2px; }
.side-list li { padding: 8px 0; border-bottom: 1px dashed var(--line-2); font-size: 13.5px; }
.side-list li:last-child { border-bottom: 0; }
.side-list li a { display: flex; justify-content: space-between; gap: 8px; color: var(--text-2); }
.side-list li a:hover { color: var(--red); }
.side-list li .n { color: var(--text-3); font-size: 12px; flex-shrink: 0; }

/* 留言表单（侧栏） */
.msg-form .form-row { margin-bottom: 11px; }
.msg-form .input { padding: 8px 11px; font-size: 13px; }

/* ---------- 友情链接（首页 / 城市分站首页底部） ---------- */
.friend-links {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px; margin-top: 18px;
}
.friend-links .fl-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.friend-links .fl-title { font-size: 15px; font-weight: 700; color: var(--text-1); padding-left: 9px; border-left: 3px solid var(--red); line-height: 1.2; }
.friend-links .fl-scope {
  font-size: 12px; color: var(--red); background: #FDF0EF; border: 1px solid #F7D9D6;
  border-radius: 999px; padding: 2px 10px; font-weight: 700;
}
.friend-links .fl-note { font-size: 12px; color: var(--text-3); }
.friend-links .fl-body { display: flex; flex-wrap: wrap; gap: 8px 10px; }
.friend-links .fl-item {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  font-size: 13px; color: var(--text-2); background: #F7F8FA; border: 1px solid var(--line);
  border-radius: 6px; padding: 6px 11px; transition: color .15s, border-color .15s, background .15s;
}
.friend-links .fl-item:hover { color: var(--red); border-color: #F0C9C5; background: #FDF6F5; }
.friend-links .fl-item span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 200px; }
.friend-links .fl-item img { width: 18px; height: 18px; object-fit: contain; border-radius: 3px; flex-shrink: 0; }
/* 友情链接仅电脑端展示：手机端由 server.js 按 UA 不下发数据，
   这里再加一层窄屏兜底（UA 识别异常时也不会在手机上露出）。 */
@media (max-width: 768px) {
  .friend-links { display: none; }
}

/* ---------- 页脚 ---------- */
.footer { background: #2E2E2E; color: #A5A5A5; margin-top: 34px; font-size: 13px; }
.footer a { color: #A5A5A5; }
.footer a:hover { color: #fff; }
.footer-main { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 30px; padding: 36px 0 28px; }
.footer h4 { color: #fff; font-size: 15px; margin-bottom: 14px; }
.footer li { padding: 4px 0; }
.footer .f-brand strong { color: var(--red); font-size: 19px; display: block; margin-bottom: 8px; }
.footer .f-brand p { line-height: 1.9; font-size: 12.5px; }
.footer .f-tel { color: var(--red); font-size: 21px; font-weight: 700; margin: 8px 0; }
.footer-bottom { border-top: 1px solid #3C3C3C; padding: 16px 0; text-align: center; font-size: 12.5px; line-height: 1.9; color: #888; }
.footer-bottom .fb-links { margin-bottom: 6px; }
.footer-bottom .fb-links a { margin: 0 8px; }

/* ---------- 移动端底部导航 ---------- */
.m-tabbar { display: none; position: fixed; left: 0; right: 0; bottom: 0; height: 54px; background: #fff; border-top: 1px solid var(--line); z-index: 900; }
.m-tabbar ul { display: flex; height: 100%; }
.m-tabbar li { flex: 1; }
.m-tabbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; font-size: 11px; color: var(--text-3); gap: 2px; }
.m-tabbar a.on { color: var(--red); }
.m-tabbar .ic { font-size: 19px; line-height: 1; }

/* ---------- 后台样式 ---------- */
.admin-body { background: #F0F2F5; }
.admin-layout { display: flex; min-height: 100vh; }
.admin-side { width: 216px; background: #22262E; flex-shrink: 0; color: #A9B0BA; position: fixed; top: 0; bottom: 0; overflow-y: auto; z-index: 200; }
.admin-side .as-logo { height: 60px; display: flex; align-items: center; gap: 10px; padding: 0 18px; border-bottom: 1px solid #31363F; color: #fff; font-size: 16px; font-weight: 700; }
.admin-side .as-logo .m { width: 30px; height: 30px; border-radius: 7px; background: linear-gradient(135deg, var(--red), var(--orange)); display: flex; align-items: center; justify-content: center; font-size: 15px; }
.admin-nav { padding: 10px 0; }
.admin-nav .nav-group { padding: 12px 18px 6px; font-size: 11px; color: #666D78; letter-spacing: 1px; }
.admin-nav a { display: flex; align-items: center; gap: 10px; padding: 10px 18px; color: #A9B0BA; font-size: 13.5px; border-left: 3px solid transparent; }
.admin-nav a:hover { background: #2B303A; color: #fff; }
.admin-nav a.on { background: #2B303A; color: #fff; border-left-color: var(--red); }
.admin-nav a .ic { width: 17px; text-align: center; font-size: 15px; }
.admin-nav a .nbadge { margin-left: auto; background: var(--red); color: #fff; font-size: 11px; padding: 1px 6px; border-radius: 9px; }
.admin-main { flex: 1; margin-left: 216px; min-width: 0; }
.admin-top { height: 56px; background: #fff; display: flex; align-items: center; justify-content: space-between; padding: 0 22px; box-shadow: 0 1px 4px rgba(0, 0, 0, .06); position: sticky; top: 0; z-index: 100; }
.admin-top h1 { font-size: 17px; }
.admin-top .at-right { display: flex; align-items: center; gap: 16px; font-size: 13px; color: var(--text-2); }
.admin-content { padding: 20px 22px 40px; }

.stat-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
.stat-card { background: #fff; border-radius: 8px; padding: 16px 18px; box-shadow: 0 1px 4px rgba(0, 0, 0, .05); }
.stat-card .sc-label { font-size: 12.5px; color: var(--text-3); margin-bottom: 6px; }
.stat-card .sc-value { font-size: 26px; font-weight: 700; color: var(--text); line-height: 1.2; }
.stat-card .sc-value small { font-size: 13px; color: var(--text-3); font-weight: 400; margin-left: 4px; }
.stat-card .sc-foot { font-size: 12px; color: var(--text-3); margin-top: 7px; }
.stat-card.accent { background: linear-gradient(135deg, var(--red), #E8624F); color: #fff; }
.stat-card.accent .sc-label, .stat-card.accent .sc-value, .stat-card.accent .sc-value small, .stat-card.accent .sc-foot { color: rgba(255, 255, 255, .92); }

.panel { background: #fff; border-radius: 8px; box-shadow: 0 1px 4px rgba(0, 0, 0, .05); margin-bottom: 16px; overflow: hidden; }
.panel-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--line-2); }
.panel-head h3 { font-size: 15.5px; }
.panel-head .ph-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.panel-body { padding: 18px; }
.panel-body.flush { padding: 0; }

.filter-bar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.filter-bar .input, .filter-bar select { width: auto; min-width: 130px; padding: 7px 11px; font-size: 13px; }
.filter-bar .input.grow { flex: 1; min-width: 200px; }

.table-wrap { overflow-x: auto; }
.admin-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.admin-table th, .admin-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
.admin-table th { background: #FAFAFA; font-weight: 700; color: var(--text-2); white-space: nowrap; font-size: 12.5px; }
.admin-table tbody tr:hover { background: #FBFCFF; }
.admin-table .t-title { font-weight: 700; color: var(--text); max-width: 320px; }
.admin-table .t-act { white-space: nowrap; display: flex; gap: 6px; flex-wrap: wrap; }
.admin-table td.small { font-size: 12px; color: var(--text-3); }

.btn-outline { background: #fff; border: 1px solid var(--line); color: var(--text-2); }
.btn-outline:hover { border-color: var(--red); color: var(--red); }
.btn-danger { background: #fff; border: 1px solid #F0C4C0; color: var(--red); }
.btn-danger:hover { background: var(--red); border-color: var(--red); color: #fff; }
.btn-success { background: var(--green); border-color: var(--green); color: #fff; }
.btn-success:hover { background: #257F49; border-color: #257F49; color: #fff; }

.msg-preview { max-width: 380px; font-size: 12.5px; color: var(--text-2); line-height: 1.65; }
.content-preview { max-width: 460px; font-size: 12.5px; color: var(--text-2); line-height: 1.7; white-space: pre-wrap; }

/* 后台登录 */
.admin-login-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #22262E 0%, #373D49 100%); }
.admin-login-box { width: 380px; background: #fff; border-radius: 12px; padding: 36px 34px; box-shadow: 0 20px 60px rgba(0, 0, 0, .3); }
.admin-login-box .alb-logo { text-align: center; margin-bottom: 26px; }
.admin-login-box .alb-logo .m { width: 54px; height: 54px; margin: 0 auto 12px; border-radius: 14px; background: linear-gradient(135deg, var(--red), var(--orange)); color: #fff; font-size: 26px; display: flex; align-items: center; justify-content: center; }
.admin-login-box .alb-logo h1 { font-size: 20px; color: var(--text); }
.admin-login-box .alb-logo p { font-size: 12.5px; color: var(--text-3); margin-top: 5px; }

/* 认证页（前台登录注册） */
.auth-page { max-width: 430px; margin: 40px auto; background: #fff; border-radius: 10px; padding: 34px; box-shadow: var(--shadow); }
.auth-page h1 { font-size: 22px; text-align: center; margin-bottom: 6px; }
.auth-page .auth-sub { text-align: center; font-size: 13px; color: var(--text-3); margin-bottom: 24px; }
.auth-page .auth-foot { text-align: center; font-size: 13px; color: var(--text-3); margin-top: 18px; }
.user-type-pick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 18px; }
.user-type-pick label { border: 1px solid var(--line); border-radius: 6px; padding: 12px 6px; text-align: center; cursor: pointer; font-size: 13px; transition: all .2s; }
.user-type-pick input { display: none; }
.user-type-pick input:checked + span, .user-type-pick label:has(input:checked) { }
.user-type-pick label:has(input:checked) { border-color: var(--red); background: var(--red-light); color: var(--red); font-weight: 700; }

/* 用户中心 */
.uc-layout { display: grid; grid-template-columns: 200px 1fr; gap: 16px; align-items: start; }
.uc-menu { background: #fff; border-radius: var(--radius); overflow: hidden; }
.uc-menu .um-head { padding: 18px; text-align: center; border-bottom: 1px solid var(--line-2); }
.uc-menu .um-avatar { width: 58px; height: 58px; border-radius: 50%; margin: 0 auto 9px; background: linear-gradient(135deg, var(--red), var(--orange)); color: #fff; font-size: 24px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.uc-menu .um-name { font-size: 15px; font-weight: 700; }
.uc-menu .um-type { font-size: 12px; color: var(--text-3); }
.uc-menu nav a { display: block; padding: 12px 18px; font-size: 13.5px; color: var(--text-2); border-left: 3px solid transparent; }
.uc-menu nav a:hover { background: #FAFAFA; }
.uc-menu nav a.on { border-left-color: var(--red); color: var(--red); background: var(--red-light); font-weight: 700; }

.tabs-bar { display: flex; gap: 2px; border-bottom: 2px solid var(--line-2); margin-bottom: 18px; overflow-x: auto; }
.tabs-bar a { padding: 9px 18px; font-size: 14px; color: var(--text-2); white-space: nowrap; border-bottom: 2px solid transparent; margin-bottom: -2px; }
.tabs-bar a.on { color: var(--red); border-bottom-color: var(--red); font-weight: 700; }

.empty { text-align: center; padding: 46px 20px; color: var(--text-3); font-size: 13.5px; }
.empty .ic { font-size: 40px; opacity: .28; margin-bottom: 10px; }

/* 站点亮点条 */
.feature-bar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; background: #fff; border-radius: var(--radius); padding: 18px; margin-bottom: 16px; }
.feature-bar .fb-item { display: flex; align-items: center; gap: 11px; }
.feature-bar .fb-ic { width: 42px; height: 42px; border-radius: 50%; background: var(--red-light); color: var(--red); display: flex; align-items: center; justify-content: center; font-size: 19px; flex-shrink: 0; }
.feature-bar .fb-txt strong { display: block; font-size: 14px; }
.feature-bar .fb-txt span { font-size: 12px; color: var(--text-3); }

/* 首页大图区 */
.hero { background: linear-gradient(120deg, #FFF5F4 0%, #FFF9F5 100%); border-radius: var(--radius); padding: 28px 24px; margin-bottom: 16px; display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.hero-txt h1 { font-size: 27px; color: var(--text); margin-bottom: 10px; line-height: 1.35; }
.hero-txt h1 em { color: var(--red); }
.hero-txt p { font-size: 14px; color: var(--text-2); margin-bottom: 16px; }
.hero-stats { display: flex; gap: 26px; }
.hero-stats .hs b { display: block; font-size: 25px; color: var(--red); line-height: 1.2; }
.hero-stats .hs span { font-size: 12.5px; color: var(--text-3); }

/* =====================================================
   响应式：移动端
   ===================================================== */
@media (max-width: 900px) {
  .detail-layout { grid-template-columns: 1fr; }
  .uc-layout { grid-template-columns: 1fr; }
  .footer-main { grid-template-columns: repeat(2, 1fr); gap: 22px; }
  .form-grid, .form-grid-3 { grid-template-columns: 1fr; }
  .stat-cards { grid-template-columns: repeat(2, 1fr); }
  .admin-side { transform: translateX(-100%); transition: transform .25s; }
  .admin-side.open { transform: translateX(0); }
  .admin-main { margin-left: 0; }
}

@media (max-width: 768px) {
  body { font-size: 14px; background: #F2F2F2; padding-bottom: 54px; }
  .m-tabbar { display: block; }
  .topbar, .footer-main, .footer-bottom .fb-links { display: none; }
  .header .wrap { height: 58px; gap: 10px; padding: 0 12px; }
  .logo-mark { width: 36px; height: 36px; font-size: 18px; border-radius: 8px; }
  .logo-txt strong { font-size: 17px; }
  .logo-txt span { display: none; }
  .search-box { max-width: none; border-radius: 16px; }
  .search-box input { height: 32px; padding: 0 12px; }
  .search-box button { padding: 0 14px; font-size: 13px; }
  .header-right .btn:not(.btn-primary) { display: none; }
  .header-right .btn { padding: 5px 12px; font-size: 12px; }

  .nav { overflow-x: auto; }
  .nav .wrap { height: 42px; gap: 0; padding: 0 4px; }
  .nav a { padding: 0 13px; line-height: 42px; font-size: 14px; white-space: nowrap; }
  .nav .city-entry { margin-left: 0; }

  .wrap { padding: 0 10px; }
  .section { padding: 14px; border-radius: 0; margin-bottom: 10px; }
  .section-head { padding-bottom: 10px; margin-bottom: 13px; }
  .section-head h2, .section-head h3 { font-size: 16.5px; }
  .section-head .more { font-size: 12px; }

  .grid-3, .grid-4, .grid-5 { grid-template-columns: repeat(2, 1fr); gap: 9px; }
  .grid-2 { grid-template-columns: 1fr; }

  .card-body { padding: 9px; }
  .card-title { font-size: 13.5px; }
  .card-desc { font-size: 12px; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
  .card-hl b { font-size: 14px; }

  .list-item { flex-direction: column; gap: 10px; padding: 12px; border-radius: 0; margin-bottom: 8px; }
  .list-item .li-cover { width: 100%; height: 165px; }
  .list-item .li-cover.li-cover-sm { width: 100%; height: 165px; }
  .list-item .li-title { font-size: 15.5px; }
  .list-item .li-desc { font-size: 12.5px; }
  .list-item .li-side { width: 100%; border-left: 0; border-top: 1px dashed var(--line); padding-left: 0; padding-top: 10px; flex-direction: row; justify-content: space-between; align-items: center; }

  .hero { flex-direction: column; align-items: flex-start; padding: 18px 14px; }
  .hero-txt h1 { font-size: 20px; }
  .hero-txt p { font-size: 13px; }
  .hero-stats { gap: 18px; flex-wrap: wrap; }
  .hero-stats .hs b { font-size: 20px; }
  .feature-bar { grid-template-columns: repeat(2, 1fr); gap: 10px; padding: 13px; }
  .feature-bar .fb-ic { width: 34px; height: 34px; font-size: 15px; }
  .feature-bar .fb-txt strong { font-size: 13px; }
  .feature-bar .fb-txt span { font-size: 11px; }

  .detail-head { flex-direction: column; padding: 14px; gap: 12px; }
  .detail-head .dh-logo { width: 84px; height: 84px; }
  .detail-head h1 { font-size: 18.5px; }
  .detail-head .dh-actions { width: 100%; flex-direction: row; }
  .detail-head .dh-actions .btn { flex: 1; }

  .article-body { font-size: 15px; line-height: 1.95; }
  .info-table th { width: 88px; font-size: 12.5px; padding: 8px 9px; }
  .info-table td { font-size: 12.5px; padding: 8px 9px; }

  .footer { margin-top: 18px; }
  .footer-bottom { padding: 13px 0; font-size: 11.5px; }

  .auth-page { margin: 12px; padding: 22px 18px; border-radius: 0; box-shadow: none; }
  .uc-menu { border-radius: 0; }
  .pager a, .pager span { min-width: 30px; height: 30px; line-height: 30px; font-size: 12.5px; }

  .crumb { padding: 10px 0; font-size: 12.5px; }
  .citybar .wrap { padding: 8px 10px; gap: 8px; font-size: 12.5px; overflow-x: auto; flex-wrap: nowrap; }
  .citybar a { white-space: nowrap; }
  .faq-q { font-size: 14px; padding: 12px 38px 12px 13px; }
  .faq-a { font-size: 13.5px; }
  .legal-note { font-size: 12px; padding: 12px 13px; }
  .table-wrap { overflow-x: auto; }
}

@media (max-width: 380px) {
  .grid-3, .grid-4, .grid-5 { grid-template-columns: repeat(2, 1fr); }
  .hero-txt h1 { font-size: 18px; }
}

/* =====================================================
   法律合规文档页
   ===================================================== */
.legal-doc { background: #fff; border-radius: var(--radius); padding: 24px 28px 32px; margin-bottom: 18px; }
.legal-doc .section-head { margin-bottom: 6px; }
.legal-updated { font-size: 12.5px; color: var(--text-3); padding-bottom: 16px; border-bottom: 1px dashed var(--line-2); margin-bottom: 20px; }
.legal-doc h3 { font-size: 16px; color: var(--text); margin: 26px 0 11px; padding-left: 11px; border-left: 4px solid var(--red); line-height: 1.5; }
.legal-doc h3:first-of-type { margin-top: 10px; }
.legal-doc p { font-size: 14px; line-height: 2; color: #3A3A3A; margin-bottom: 12px; }
.legal-doc ul, .legal-doc ol { margin: 0 0 14px 22px; }
.legal-doc li { font-size: 14px; line-height: 2; color: #3A3A3A; margin-bottom: 5px; list-style: disc; }
.legal-doc ol li { list-style: decimal; }
.legal-doc strong { color: var(--text); }
.legal-doc a { color: var(--blue); text-decoration: underline; }
.legal-doc a:hover { color: var(--red); }

/* 流程步骤条 */
.steps-flow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.steps-flow .step-item { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 14px; text-align: center; position: relative; transition: all .25s; }
.steps-flow .step-item:hover { border-color: var(--red); box-shadow: var(--shadow-hover); }
.steps-flow .step-item .sn { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: linear-gradient(135deg, var(--red), var(--orange)); color: #fff; font-size: 15px; font-weight: 700; margin-bottom: 10px; }
.steps-flow .step-item strong { display: block; font-size: 14px; margin-bottom: 6px; color: var(--text); }
.steps-flow .step-item p { font-size: 12.5px; color: var(--text-3); line-height: 1.7; }

/* 侧栏小卡片（兼容 side-box 命名） */
.side-bar { display: flex; flex-direction: column; gap: 16px; }
.side-box { background: #fff; border-radius: var(--radius); padding: 18px; }
.side-box h3 { font-size: 15.5px; padding-bottom: 11px; border-bottom: 2px solid var(--line-2); margin-bottom: 14px; position: relative; padding-left: 12px; }
.side-box h3::before { content: ""; position: absolute; left: 0; top: 3px; width: 4px; height: 15px; background: var(--red); border-radius: 2px; }
.side-box .btn-block { margin-top: 12px; }
.side-steps { counter-reset: ss; }
.side-steps li { position: relative; padding: 8px 0 8px 0; border-bottom: 1px dashed var(--line-2); font-size: 13px; line-height: 1.75; color: var(--text-2); }
.side-steps li:last-child { border-bottom: 0; }
.side-steps li b { color: var(--red); font-weight: 700; margin-right: 5px; }

/* 免责声明块（加粗强调） */
.legal-note b, .legal-note strong { color: var(--orange); }

@media (max-width: 900px) {
  .legal-doc { padding: 18px 15px 24px; border-radius: 0; }
  .legal-doc h3 { font-size: 15px; margin: 20px 0 9px; }
  .legal-doc p, .legal-doc li { font-size: 13.5px; line-height: 1.95; }
  .steps-flow { grid-template-columns: repeat(2, 1fr); }
  .steps-flow .step-item { padding: 14px 11px; }
}

/* =====================================================
   后台补充样式
   ===================================================== */
.trend-chart { display: flex; align-items: flex-end; gap: 8px; height: 190px; padding: 0 4px; overflow-x: auto; }
.trend-chart .tc-col { flex: 1; min-width: 34px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 4px; }
.trend-chart .tc-bar { width: 100%; max-width: 26px; background: linear-gradient(180deg, var(--red), #F0857A); border-radius: 4px 4px 0 0; transition: all .3s; }
.trend-chart .tc-col:hover .tc-bar { background: linear-gradient(180deg, var(--orange), #FFA76B); }
.trend-chart .tc-label { font-size: 11px; color: var(--text-3); white-space: nowrap; }
.trend-chart .tc-val { font-size: 11px; color: var(--red); font-weight: 700; }

.rank-mini { display: inline-flex; align-items: center; justify-content: center; width: 21px; height: 21px; border-radius: 4px; background: #F2F2F2; color: var(--text-3); font-size: 12px; font-weight: 700; }
.rank-mini.top { background: linear-gradient(135deg, var(--red), var(--orange)); color: #fff; }

.admin-table td a { color: var(--blue); }
.admin-table td a:hover { color: var(--red); }
.admin-table .row-warn { background: #FFF9F0; }
.admin-table .row-warn:hover { background: #FFF4E5; }

/* 批量操作条 */
.batch-bar { display: none; align-items: center; gap: 12px; padding: 11px 18px; background: #FFF8E6; border-bottom: 1px solid #F5E2B3; font-size: 13px; }
.batch-bar .cnt { color: var(--red); font-weight: 700; }
.batch-bar .bb-actions { display: flex; gap: 8px; margin-left: auto; }

/* 状态标签 */
.st { display: inline-block; font-size: 11.5px; padding: 2px 8px; border-radius: 3px; white-space: nowrap; }
.st-on { background: #EAF7EF; color: #1E7A44; }
.st-off { background: #F2F2F2; color: #858585; }
.st-wait { background: #FFF3E8; color: var(--orange); }
.st-ok { background: #EAF7EF; color: #1E7A44; }
.st-no { background: #FDECEB; color: var(--red); }

/* 课程来源标识（系统课程 / 机构课程） */
.src-tip { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 18px; background: #F7F9FC; border-bottom: 1px solid var(--line); }
.src-badge { font-size: 12.5px; padding: 3px 10px; border-radius: 4px; white-space: nowrap; }
.src-badge b { font-weight: 700; }
.src-badge.src-sys { background: #EAF2FD; color: #1B5FA8; }
.src-badge.src-org { background: #FFF3E8; color: var(--orange); }
.src-note { flex: 1; min-width: 240px; font-size: 12px; line-height: 1.6; color: var(--text-3); }
.src-tag { display: inline-block; font-size: 11.5px; padding: 2px 8px; border-radius: 3px; white-space: nowrap; }
.src-tag.src-sys { background: #EAF2FD; color: #1B5FA8; }
.src-tag.src-org { background: #FFF3E8; color: var(--orange); }
.src-sub { font-size: 11.5px; color: var(--text-3); margin-top: 3px; }
@media (max-width: 767px) { .src-note { display: none; } }

/* 后台分页 */
.adm-pager { display: flex; gap: 6px; align-items: center; justify-content: center; padding: 16px; flex-wrap: wrap; font-size: 13px; }
.adm-pager a, .adm-pager span { min-width: 32px; height: 32px; line-height: 32px; text-align: center; border: 1px solid var(--line); border-radius: 5px; padding: 0 9px; background: #fff; color: var(--text-2); }
.adm-pager a:hover { border-color: var(--red); color: var(--red); }
.adm-pager span.on { background: var(--red); border-color: var(--red); color: #fff; font-weight: 700; }
.adm-pager span.dis { color: #ccc; background: #FAFAFA; }

/* 后台表单区 */
.panel-body .form-grid { gap: 0 18px; }
.form-tip { font-size: 12px; color: var(--text-3); margin-top: 4px; line-height: 1.7; }
.form-tip.warn { color: var(--orange); }

/* 图片固定比例预览框：后台「培训学校编辑」与前台「机构信息设置」共用，保证两处尺寸比例一致 */
.img-ratio-box { position: relative; margin-top: 8px; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: #FAFAFA; }
.img-ratio-box > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.img-ratio-box.r-cover { width: 200px; aspect-ratio: 4 / 3; }       /* 封面图 880×660（与系统生成封面、前台卡片同规格） */
.img-ratio-box.r-logo  { width: 110px; aspect-ratio: 1 / 1; }        /* LOGO 正方形 */
@media (max-width: 640px) {
  .img-ratio-box.r-cover { width: 100%; max-width: 200px; }
  .img-ratio-box.r-logo  { width: 88px; }
}
textarea.input { resize: vertical; min-height: 90px; font-family: inherit; }

.req::after { content: " *"; color: var(--red); }

/* 采集任务卡 */
.task-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.task-card { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 15px 16px; }
.task-card h4 { font-size: 14.5px; margin-bottom: 8px; }
.task-card .tc-meta { font-size: 12.5px; color: var(--text-3); line-height: 1.85; }
.task-card .tc-acts { display: flex; gap: 7px; margin-top: 12px; flex-wrap: wrap; }

@media (max-width: 900px) {
  .admin-side { transform: translateX(-100%); transition: transform .25s; }
  .admin-side.open { transform: translateX(0); }
  .admin-main { margin-left: 0; }
  .stat-cards { grid-template-columns: repeat(2, 1fr) !important; }
  .task-grid { grid-template-columns: 1fr; }
  .admin-content { padding: 14px 12px 40px; }
  .admin-top { padding: 0 14px; }
  .admin-top h1 { font-size: 15px; }
  .admin-top .at-right span { display: none; }
  .trend-chart { height: 150px; }
  .form-grid, .form-grid-3 { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .stat-cards { grid-template-columns: 1fr !important; }
  .trend-chart .tc-label { font-size: 9px; }
}

/* =====================================================
   培训项目分类导航（大类 / 小类）—— 新版样式见文件末尾
   「培训项目页 · 分类导航」区块，此处仅保留公共规则
   ===================================================== */
.cat-nav .section-head { margin-bottom: 14px; }

/* 卡片上的分类标签可点击 */
a.badge { text-decoration: none; }
a.badge:hover { opacity: .85; }

/* =====================================================
   同城学校推荐（课程页）
   ===================================================== */
.school-mini-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.school-mini {
  display: flex; gap: 11px; align-items: center; padding: 12px 13px;
  border: 1px solid var(--line); border-radius: var(--radius); background: #fff; transition: all .22s;
}
.school-mini:hover { border-color: var(--red); box-shadow: var(--shadow-hover); transform: translateY(-1px); }
.sm-logo {
  flex: 0 0 46px; width: 46px; height: 46px; border-radius: 8px; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  background: #F5F6F8; font-size: 20px;
}
.sm-logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sm-logo-sm { flex: 0 0 32px; width: 32px; height: 32px; font-size: 15px; border-radius: 6px; }
.sm-body { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.sm-body b { font-size: 13.5px; color: var(--text); }
.sm-body em { font-style: normal; font-size: 12px; color: var(--text-3); }
.sm-meta { font-size: 12px; color: var(--text-3); }
.sm-meta .st { font-style: normal; }

.side-list.school-side li a { display: flex; align-items: center; gap: 9px; }
.side-list.school-side .ss-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.side-list.school-side .ss-body em { font-style: normal; font-size: 11.5px; color: var(--text-3); }
.side-list.school-side .n { flex: 0 0 auto; }

/* =====================================================
   后台：分类管理 / 代码输入 / 弹层
   ===================================================== */
.cat-add { margin-bottom: 4px; }
.cat-add > summary { display: inline-block; cursor: pointer; list-style: none; }
.cat-add > summary::-webkit-details-marker { display: none; }
.cat-form { margin-top: 14px; padding: 16px; border: 1px solid var(--line-2); border-radius: 8px; background: #FAFBFC; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 18px; }

.sub-chips { display: flex; flex-wrap: wrap; gap: 9px; }
.sub-chip { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 15px; background: #fff; overflow: hidden; }
.sub-chip > a { padding: 5px 6px 5px 13px; font-size: 13px; color: var(--text-2); }
.sub-chip > a:hover { color: var(--red); }
.sub-chip > a em { font-style: normal; font-size: 11px; color: var(--text-3); margin-left: 5px; background: #F2F2F2; border-radius: 8px; padding: 1px 6px; }
.sub-chip .sc-edit, .sub-chip .sc-del {
  border: 0; background: transparent; cursor: pointer; padding: 4px 9px;
  font-size: 12px; color: var(--text-3); line-height: 1;
}
.sub-chip .sc-edit:hover { color: var(--blue); background: #EEF6FD; }
.sub-chip .sc-del:hover { color: var(--red); background: #FDECEB; }

.code-area { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12.5px; line-height: 1.7; }

.modal-mask { position: fixed; inset: 0; background: rgba(0, 0, 0, .45); z-index: 3000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.modal-box { background: #fff; border-radius: 10px; width: 100%; max-width: 560px; max-height: 88vh; overflow: auto; }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--line-2); }
.modal-head b { font-size: 15px; }
.modal-head button { border: 0; background: transparent; font-size: 22px; line-height: 1; color: var(--text-3); cursor: pointer; }
.modal-head button:hover { color: var(--red); }
.modal-body { padding: 16px 18px 20px; }

/* =====================================================
   移动端兼容性修复
   ===================================================== */
html { -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; text-size-adjust: 100%; }
img, video, table { max-width: 100%; }
img { height: auto; }
.ellipsis, .card-title, .li-title, .side-list a span { overflow-wrap: anywhere; word-break: break-word; }

/* 正文中出现的宽表格可横向滚动，避免撑破屏幕 */
.article-body table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 900px) {
  .school-mini-grid { grid-template-columns: 1fr; }
  .cat-form { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  /* 关键：移动端表单控件字号 ≥16px，避免 iOS 自动放大页面 */
  input.input, select.input, textarea.input, .input, .search-box input { font-size: 16px; }
  .search-box input { font-size: 15px; }

  /* 触控热区放大 */
  .btn { min-height: 38px; display: inline-flex; align-items: center; justify-content: center; }
  .btn-sm { min-height: 32px; }
  .nav a { min-height: 42px; }

  /* 筛选表单：移动端纵向排列，按钮通栏 */
  .filter-bar { flex-direction: column; align-items: stretch; gap: 8px; }
  .filter-bar .input, .filter-bar .btn { width: 100%; }
  .filter-bar .grow { flex: none; }

  /* 详情页信息表 -> 自适应多栏表格（一行并排两组「标签+值」）
     策略：表头列「收缩到刚好放下标签且永不换行」（width:1% + nowrap），
     剩余宽度全给值列，值列内容过长时自动换行 —— 不同屏幕宽度下都不会挤压/竖排 */
  .info-table { display: table; width: 100%; border-collapse: collapse; table-layout: auto; }
  .info-table tbody { display: table-row-group; }
  .info-table tr { display: table-row; padding: 0; border-bottom: 0; }
  .info-table th {
    width: 1%; background: #FAFAFA; padding: 7px 7px;
    color: var(--text-2); font-size: 12px; font-weight: 700; border: 1px solid var(--line-2);
    white-space: nowrap; line-height: 1.45;
  }
  .info-table td {
    display: table-cell; padding: 7px 8px; border: 1px solid var(--line-2);
    font-size: 12.5px; line-height: 1.5;
    /* 注意：不能用 anywhere / break-word —— 二者会把 min-content 压成 1 字符，
       auto 布局随之把值列挤到极窄、短内容也强制断行；break-word 仅在真放不下时断 */
    overflow-wrap: break-word;
  }
  .info-table td[colspan] { padding-bottom: 7px; }

  /* 详情页侧栏在移动端置于正文之后 */
  .detail-layout { display: flex; flex-direction: column; }
  /* min-width:0 必须加：否则锚点条（anchor-tabs 一排 nowrap 标签）等
     宽 min-content 会把整列撑到 490px，右侧内容（dh-meta 投资金额等）被裁 */
  .detail-layout > div { order: 1; min-width: 0; }
  .detail-layout > aside { order: 2; min-width: 0; }

  /* 学校小卡在正文中改为整行 */
  .school-mini { padding: 11px 12px; }

  /* 分页换行居中 */
  .pager { flex-wrap: wrap; gap: 6px; justify-content: center; }

  /* 楼盘式长标题不撑破 */
  .detail-head h1 { font-size: 17.5px; line-height: 1.45; overflow-wrap: anywhere; }
  .dh-meta { gap: 6px 12px; }
  .dh-meta span { font-size: 12.5px; }

  /* 弹层全宽 */
  .modal-mask { padding: 0; align-items: flex-end; }
  .modal-box { max-width: none; border-radius: 12px 12px 0 0; max-height: 92vh; }

  /* 侧栏卡片间距收窄 */
  .side-block { padding: 14px; }
  .side-block h3 { font-size: 15px; }
  .sub-chip > a { font-size: 12.5px; }
}

@media (max-width: 480px) {
  .grid-3, .grid-4, .grid-5 { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .card-body { padding: 8px; }
  .card-title { font-size: 13px; }
  .wrap { padding: 0 9px; }
  .section { padding: 12px; }
  .hero-stats { gap: 14px; }
  .m-tabbar ul li a { font-size: 11px; }
  .footer-bottom { line-height: 1.9; }
}

/* =====================================================
   移动端兼容性修复（补充：覆盖原始 nowrap / 挤压布局）
   ===================================================== */
@media (max-width: 768px) {
  /* .info-table th 为 nowrap，表头标签不换行（配合 width:1% 收缩列宽） */
  .info-table th { white-space: nowrap !important; }

  /* 栏目头：标题与排序标签在窄屏可换行，避免相互挤压 */
  .section-head { flex-wrap: wrap; gap: 8px; }
  .section-head h2, .section-head h3 { font-size: 16px; padding-left: 11px; }
  .section-head h2::before, .section-head h3::before { height: 14px; top: 3px; }
  .section-head .tabs { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 2px; }
  .section-head .tabs a { flex: 0 0 auto; }

  /* 面包屑可换行 */
  .crumb { flex-wrap: wrap; line-height: 1.8; overflow-wrap: anywhere; }

  /* 表格容器始终可横向滚动 */
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .table { min-width: 560px; }

  /* 详情页头图按钮组换行 */
  .detail-head .dh-actions { flex-wrap: wrap; gap: 8px; }
  .detail-head .dh-actions .btn { flex: 1 1 calc(50% - 4px); min-width: 0; }

  /* 侧栏表单与列表 */
  .side-list li a { gap: 6px; }
  .side-block + .side-block { margin-top: 0; }

  /* 长英文/链接不撑破 */
  .article-body p, .article-body li, .legal-doc p, .legal-doc li { overflow-wrap: anywhere; }

  /* 图片类占位符 */
  .card-cover .ph { font-size: 12px; }
}

@media (max-width: 480px) {
  .section-head h2, .section-head h3 { font-size: 15.5px; }
  .detail-head .dh-actions .btn { flex: 1 1 100%; }
  .side-block { padding: 13px; }
  .crumb { font-size: 12px; }
}

/* 超窄屏（≤380px）安全兜底：保证头部不被挤破 */
@media (max-width: 380px) {
  .header .wrap { gap: 6px; padding: 0 9px; }
  .header-right { display: none; }
  .logo-txt strong { font-size: 15.5px; }
  .search-box { min-width: 0; }
  .grid-3, .grid-4, .grid-5 { grid-template-columns: repeat(2, 1fr); }
  .card-title { font-size: 12.5px; }
  .card-hl b { font-size: 13px; }
}


/* =====================================================
   培训项目页 · 分类导航（大类网格 + 小类面板 + 分类总览）
   设计目标：等宽对齐、两列对称、桌面/移动两端都整齐
   ===================================================== */
.sh-sub { font-size: 13px; font-weight: 400; color: var(--text-3); margin-left: 8px; }

/* emoji 图标统一字体栈，避免个别系统缺字导致「图片不显示」 */
.ci, .cc-icon, .cm-ic { font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", "Segoe UI Symbol", sans-serif; font-style: normal; }

/* ---------- 大类导航：等宽网格平铺，每行自动对齐 ---------- */
.cat-major {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
  gap: 10px; padding: 4px 0 16px;
  border-bottom: 1px dashed var(--line-2);
}
.cat-major a {
  display: flex; align-items: center; justify-content: center; gap: 7px;
  min-width: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px;
  font-size: 14px; color: var(--text-2); background: #fff; line-height: 1.3;
  transition: all .22s ease; box-shadow: 0 1px 2px rgba(0, 0, 0, .03);
}
.cat-major a .ci { font-size: 17px; line-height: 1; flex: 0 0 auto; }
.cat-major a .ct { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cat-major a .cnt {
  font-style: normal; font-size: 11px; line-height: 1; padding: 3px 7px; flex: 0 0 auto;
  border-radius: 10px; background: #F2F3F5; color: var(--text-3);
}
.cat-major a:hover { border-color: var(--red); color: var(--red); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(219, 67, 57, .12); }
.cat-major a.on {
  background: linear-gradient(135deg, var(--red), var(--orange));
  border-color: transparent; color: #fff; font-weight: 600;
  box-shadow: 0 6px 16px rgba(219, 67, 57, .26);
}
.cat-major a.on .cnt { background: rgba(255, 255, 255, .26); color: #fff; }

/* ---------- 小类面板：等宽格子填满整行，不再参差 ---------- */
.cat-minor-wrap {
  margin-top: 16px; padding: 16px 18px 18px; border-radius: var(--radius);
  background: linear-gradient(180deg, #FFF8F7, #FFFFFF);
  border: 1px solid #FBE3E1;
}
.cm-head { display: flex; align-items: center; gap: 10px; margin-bottom: 13px; flex-wrap: wrap; }
.cm-head .cm-ic { font-size: 20px; line-height: 1; }
.cm-head b { font-size: 15px; color: var(--text); }
.cm-head .cm-sub { font-size: 12.5px; color: var(--text-3); }
.cm-head .cm-all { margin-left: auto; font-size: 12.5px; color: var(--red); }
.cm-head .cm-all:hover { text-decoration: underline; }

.cat-minor {
  display: flex; flex-wrap: wrap; gap: 10px;
}
.cat-minor a {
  flex: 1 1 150px; max-width: 250px;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  min-width: 0; padding: 10px 12px; border-radius: 10px; font-size: 13.5px;
  color: var(--text-2); background: #fff; border: 1px solid var(--line-2); transition: all .2s;
}
.cat-minor a .ct { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cat-minor a .cnt {
  font-style: normal; font-size: 11px; line-height: 1; padding: 3px 7px; flex: 0 0 auto;
  color: var(--text-3); background: #F2F3F5; border-radius: 9px;
}
.cat-minor a:hover { border-color: var(--red); color: var(--red); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(219, 67, 57, .10); }
.cat-minor a.on {
  background: linear-gradient(135deg, var(--red), var(--orange));
  border-color: transparent; color: #fff; font-weight: 600;
  box-shadow: 0 4px 12px rgba(219, 67, 57, .22);
}
.cat-minor a.on .cnt { background: rgba(255, 255, 255, .26); color: #fff; }

/* ---------- 全部培训项目分类：两列卡片，卡内小类两列对齐 ---------- */
.cat-overview .cat-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px;
}
.cat-cell {
  display: flex; flex-direction: column;
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px; background: #fff; transition: all .25s ease;
}
.cat-cell:hover { border-color: var(--red); box-shadow: var(--shadow-hover); transform: translateY(-2px); }
.cat-cell.on { border-color: var(--red); background: #FFFAF9; }
.cc-top {
  display: flex; align-items: center; gap: 12px; margin-bottom: 13px;
  padding-bottom: 12px; border-bottom: 1px dashed var(--line-2);
}
.cc-icon {
  flex: 0 0 42px; width: 42px; height: 42px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center; font-size: 21px;
  background: linear-gradient(135deg, #FDECEB, #FFF4EC);
}
.cc-title { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.cc-title a { font-size: 15px; font-weight: 700; color: var(--text); }
.cc-title a:hover { color: var(--red); }
.cc-title em { font-style: normal; font-size: 12px; color: var(--text-3); }
.cc-more {
  flex: 0 0 28px; width: 28px; height: 28px; border-radius: 50%;
  border: 1px solid var(--line-2); color: var(--text-3); font-size: 15px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  transition: all .2s ease;
}
.cat-cell:hover .cc-more, .cc-more:hover { background: var(--red); border-color: var(--red); color: #fff; }

/* 卡内小类：固定两列网格，名称左、数量右，整卡对称 */
.cat-cell-subs {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 10px;
  padding-top: 2px;
}
.cat-cell-subs a {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  min-width: 0; font-size: 12.5px; padding: 7px 12px; border-radius: 8px;
  background: #F6F7F9; color: var(--text-2); transition: all .2s;
}
.cat-cell-subs a .sn { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cat-cell-subs a em { font-style: normal; font-size: 11px; color: var(--text-3); flex: 0 0 auto; }
.cat-cell-subs a:hover { background: var(--red); color: #fff; }
.cat-cell-subs a:hover em { color: rgba(255, 255, 255, .85); }

/* =====================================================
   搜索页 · 收录申请
   ===================================================== */
.collect-apply { background: linear-gradient(180deg, #F7FBFF, #FFFFFF); border: 1px solid #DCEDFB; }
.collect-apply .section-head { border-bottom: 1px dashed #DCEDFB; padding-bottom: 12px; }
.collect-apply-body { padding-top: 4px; }
.ca-tip { font-size: 13.5px; color: var(--text-2); line-height: 1.9; margin-bottom: 16px; }
.ca-tip strong { color: var(--blue); }
.ca-form { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 20px; }
.ca-form .form-row { margin-bottom: 12px; }
.ca-form .form-row label { display: block; font-size: 13px; color: var(--text-2); margin-bottom: 6px; font-weight: 600; }
.ca-form .req { color: var(--red); }
.ca-form .form-row:nth-child(4) { grid-column: 1 / -1; }
.ca-actions { grid-column: 1 / -1; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding-top: 4px; }
.ca-note { font-size: 12px; color: var(--text-3); line-height: 1.7; }
.ca-note a { color: var(--red); }

/* 表单内提示当前咨询对象 */
.msg-target {
  font-size: 12.5px; color: var(--text-3); line-height: 1.7;
  background: #FFF6F5; border: 1px dashed #F8D7D4; border-radius: 6px;
  padding: 8px 11px; margin-bottom: 12px;
}
.msg-target b { color: var(--red); font-weight: 600; }

/* 状态标签 / 计数徽标补充 */
.st.st-blue { background: #EEF6FD; color: #008FD7; }
.btn .cnt {
  display: inline-block; margin-left: 5px; padding: 0 6px; border-radius: 9px;
  background: rgba(0, 0, 0, .08); font-size: 11px; line-height: 16px;
}
.btn-primary .cnt { background: rgba(255, 255, 255, .28); }

/* 列表页卡片底部信息统一贴底对齐（3列网格高度一致更对称） */
.grid .card { display: flex; flex-direction: column; }
.grid .card .card-body { display: flex; flex-direction: column; flex: 1; }
.grid .card .card-desc { flex: none; }
.grid .card .card-meta { margin-top: auto; }

/* 移动端适配（覆盖前面较早的规则） */
@media (max-width: 900px) {
  .ca-form { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .cat-major { display: flex; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 12px; scrollbar-width: none; }
  .cat-major::-webkit-scrollbar { display: none; }
  .cat-major a { flex: 0 0 auto; font-size: 13px; padding: 8px 13px; }
  .cat-minor-wrap { padding: 12px 13px; }
  .cat-minor { display: flex; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; scrollbar-width: none; }
  .cat-minor::-webkit-scrollbar { display: none; }
  .cat-minor a, .cm-head .cm-all { flex: 0 0 auto; }
  .cm-head .cm-all { margin-left: 0; }
  .cat-cell { padding: 13px 14px; }
  .cc-icon { flex: 0 0 38px; width: 38px; height: 38px; font-size: 19px; border-radius: 10px; }
  .cat-cell-subs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 8px; }
  .ca-form { grid-template-columns: 1fr; }
  .ca-actions .btn { width: 100%; }
  .collect-apply .section-head h2 { font-size: 16px; }
}

/* =====================================================
   搜索页 · 城市分站选择与提示
   ===================================================== */
.search-form .input[name="city"] { flex: 0 0 auto; min-width: 168px; }
.city-hint {
  font-size: 12.5px; color: var(--text-3); line-height: 1.7;
  margin: -8px 0 18px 2px;
}
.city-hint-err { color: var(--red); font-weight: 600; }
select.input.input-err {
  border-color: var(--red) !important;
  box-shadow: 0 0 0 3px rgba(219, 67, 57, .12);
  animation: cityShake .32s ease;
}
@keyframes cityShake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-4px); }
  75% { transform: translateX(4px); }
}
@media (max-width: 768px) {
  .search-form .input[name="city"] { min-width: 0; width: 100%; }
}

/* =====================================================
   品牌详情页升级：页内栏目导航 / 加盟流程 / 快捷留言 / 品牌资讯
   ===================================================== */
.btn-orange { background: var(--orange); border-color: var(--orange); color: #fff; }
.btn-orange:hover { background: #E64A00; border-color: #E64A00; color: #fff; }

/* 页内栏目导航 */
.detail-nav {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 0 0 16px; padding: 10px 14px;
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  position: sticky; top: 0; z-index: 30;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .05);
}
.detail-nav a {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 16px; border-radius: 18px; font-size: 14px;
  color: var(--text-2); transition: all .2s;
}
.detail-nav a:hover { color: var(--red); background: #FFF3F2; }
.detail-nav a.on { background: linear-gradient(135deg, var(--red), var(--orange)); color: #fff; font-weight: 600; }
.detail-nav a .cnt {
  font-style: normal; font-size: 11px; line-height: 1; padding: 3px 7px;
  border-radius: 9px; background: #F2F3F5; color: var(--text-3);
}
.detail-nav a.on .cnt { background: rgba(255, 255, 255, .26); color: #fff; }
section[id] { scroll-margin-top: 64px; }

/* 加盟流程步骤 */
.proc-steps {
  list-style: none; margin: 4px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px;
  counter-reset: step;
}
.proc-steps li {
  counter-increment: step; position: relative;
  display: flex; flex-direction: column; gap: 3px;
  padding: 11px 14px 11px 46px; border-radius: 10px;
  background: #FAFBFC; border: 1px solid var(--line-2);
}
.proc-steps li::before {
  content: counter(step); position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  width: 24px; height: 24px; border-radius: 50%;
  background: linear-gradient(135deg, var(--red), var(--orange)); color: #fff;
  font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center;
}
.proc-steps li b { font-size: 14px; color: var(--text); }
.proc-steps li span { font-size: 12.5px; color: var(--text-3); line-height: 1.6; }

/* 快捷留言选择 */
.quick-msg { margin-bottom: 12px; }
.quick-msg .qm-label { font-size: 12.5px; color: var(--text-2); margin-bottom: 7px; }
.quick-msg .qm-list { display: flex; flex-wrap: wrap; gap: 6px; }
.quick-msg .qm-chip {
  font-size: 12px; padding: 5px 10px; border-radius: 13px; cursor: pointer;
  background: #F6F7F9; color: var(--text-2); border: 1px solid var(--line-2);
  transition: all .18s; line-height: 1.4; text-align: left;
}
.quick-msg .qm-chip:hover { background: #FDECEB; border-color: var(--red); color: var(--red); }
.quick-msg .qm-chip:active { background: var(--red); color: #fff; border-color: var(--red); }

/* 品牌资讯列表 */
.bn-item { padding: 13px 0; border-bottom: 1px dashed var(--line-2); }
.bn-item:last-child { border-bottom: 0; }
.bn-item h3 { font-size: 15px; margin-bottom: 6px; }
.bn-item h3 a { color: var(--text); }
.bn-item h3 a:hover { color: var(--red); }
.bn-meta { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--text-3); margin-bottom: 6px; }
.bn-summary { font-size: 13px; color: var(--text-2); line-height: 1.8; }

/* 品牌资讯详情页 */
.news-article { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px 24px; }
.news-article h1 { font-size: 21px; margin-bottom: 10px; }
.news-article .na-meta { display: flex; gap: 12px; font-size: 12.5px; color: var(--text-3); margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px dashed var(--line-2); }
.news-article .na-body { font-size: 14.5px; line-height: 2; color: var(--text); white-space: pre-wrap; }

@media (max-width: 768px) {
  .detail-nav { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .detail-nav::-webkit-scrollbar { display: none; }
  .detail-nav a { flex: 0 0 auto; }
  .proc-steps { grid-template-columns: 1fr; }
  .dh-actions .btn { flex: 1 1 auto; }
}

/* ============ 品牌详情页改版（品牌简介/优势条件/资讯卡片/评价/报名动态） ============ */
/* 品牌简介卡片 */
.intro-card { background: linear-gradient(135deg, #FFF8F6 0%, #F3FAFF 100%); border: 1px solid var(--line-2); border-radius: 10px; padding: 18px 20px; }
.intro-card p { font-size: 14.5px; line-height: 2; color: var(--text-1); margin: 0 0 12px; text-align: justify; }
.intro-card p.muted { color: var(--text-3); }
.intro-tags { display: flex; flex-wrap: wrap; gap: 8px 22px; border-top: 1px dashed var(--line-2); padding-top: 12px; font-size: 13px; color: var(--text-3); }
.intro-tags b { color: var(--red); }
/* 加盟优势 */
.adv-item { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-bottom: 1px dashed var(--line-2); }
.adv-item:last-child { border-bottom: 0; }
.adv-ic { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; background: var(--red-light); color: var(--red); font-size: 13px; display: flex; align-items: center; justify-content: center; margin-top: 2px; }
.adv-item p { margin: 0; font-size: 14px; line-height: 1.9; color: var(--text-2); }
/* 加盟条件 */
.cond-item { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-bottom: 1px dashed var(--line-2); }
.cond-item:last-child { border-bottom: 0; }
.cond-ic { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; background: #EAF7EF; color: #2E9E5B; font-size: 13px; display: flex; align-items: center; justify-content: center; margin-top: 2px; }
.cond-item p { margin: 0; font-size: 14px; line-height: 1.9; color: var(--text-2); }
/* 品牌资讯卡片 */
.bn-list { display: flex; flex-direction: column; gap: 10px; }
.bn-card { display: flex; gap: 14px; align-items: center; border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px; text-decoration: none; transition: box-shadow .15s, border-color .15s; }
.bn-card:hover { border-color: var(--red); box-shadow: 0 3px 12px rgba(219, 67, 57, .1); }
.bn-date { flex-shrink: 0; width: 58px; text-align: center; background: var(--red-light); border-radius: 6px; padding: 7px 0; color: var(--red); }
.bn-date b { display: block; font-size: 16px; line-height: 1.2; }
.bn-date span { font-size: 11px; opacity: .8; }
.bn-body { flex: 1; min-width: 0; }
.bn-body h3 { font-size: 15px; margin: 0 0 4px; color: var(--text-1); }
.bn-body .bn-summary { margin: 0 0 5px; font-size: 12.5px; color: var(--text-3); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.bn-meta { font-size: 11.5px; color: var(--text-3); display: flex; gap: 12px; }
.bn-meta span:last-child { flex-shrink: 0; white-space: nowrap; }
.bn-arrow { flex-shrink: 0; font-size: 20px; color: var(--text-3); }
/* 评价汇总与列表 */
.rv-summary { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; background: linear-gradient(120deg, #FFF5F4, #FDF3E7); border-radius: 10px; padding: 16px 20px; margin-bottom: 14px; }
.rv-score { text-align: center; }
.rv-score b { display: block; font-size: 30px; color: var(--red); line-height: 1.1; }
.rv-score span { display: block; font-size: 12.5px; color: var(--text-2); margin: 3px 0 2px; }
.rv-stars { font-style: normal; color: var(--orange); font-size: 13px; letter-spacing: 2px; }
.rv-count { font-size: 14px; color: var(--text-2); margin-left: auto; text-align: right; }
.rv-count b { color: var(--red); }
.rv-count span { font-size: 11.5px; color: var(--text-3); }
.rv-item { border-bottom: 1px dashed var(--line-2); padding: 14px 0; }
.rv-item:last-child { border-bottom: 0; }
.rv-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 7px; }
.rv-avatar { flex-shrink: 0; width: 36px; height: 36px; border-radius: 50%; background: var(--blue-light); color: var(--blue); font-weight: 700; display: flex; align-items: center; justify-content: center; }
.rv-who b { font-size: 14px; display: block; }
.rv-who span { font-size: 12px; color: var(--text-3); }
.rv-scores { margin-left: auto; font-size: 12px; color: var(--text-3); display: flex; gap: 14px; }
.rv-scores i { font-style: normal; color: var(--orange); }
.rv-content { margin: 0; font-size: 13.5px; line-height: 1.9; color: var(--text-2); }
.brand-reply { margin-top: 9px; background: #F0F9F1; border-left: 3px solid #2E9E5B; border-radius: 0 6px 6px 0; padding: 9px 12px; font-size: 13px; line-height: 1.8; color: var(--text-2); }
.brand-reply b { color: #2E9E5B; }
.brand-reply .br-time { display: block; font-size: 11.5px; color: var(--text-3); margin-top: 3px; }
/* 最近报名动态（纵向滚动） */
.join-dyn { position: relative; height: 216px; overflow: hidden; border: 1px solid var(--line-2); border-radius: 8px; background: #FFFDF9; }
.jd-track { list-style: none; margin: 0; padding: 8px 12px; animation: jd-scroll 18s linear infinite; }
.jd-track li { padding: 7px 0; border-bottom: 1px dashed var(--line-2); font-size: 12.5px; line-height: 1.65; color: var(--text-2); }
.jd-track li:last-child { border-bottom: 0; }
.jd-time { display: inline-block; color: var(--orange); font-size: 11.5px; margin-right: 6px; }
.jd-text b { color: var(--text-1); }
.jd-track li:hover { background: #FFF7F0; }
@keyframes jd-scroll { 0% { transform: translateY(0); } 100% { transform: translateY(-50%); } }
.join-dyn:hover .jd-track { animation-play-state: paused; }

/* ============ 学员最新咨询（纵向滚动） ============ */
.consult-dyn { position: relative; height: 264px; overflow: hidden; }
.consult-dyn::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 28px; background: linear-gradient(transparent, #fff); pointer-events: none; }
.cd-track { list-style: none; margin: 0; padding: 0; }
.cd-track.is-scroll { animation: jd-scroll 24s linear infinite; }
.consult-dyn:hover .cd-track.is-scroll { animation-play-state: paused; }
.cd-track li { padding: 9px 0; border-bottom: 1px dashed var(--line-2); font-size: 12.5px; line-height: 1.65; color: var(--text-2); overflow-wrap: anywhere; }
.cd-track li:last-child { border-bottom: 0; }
.cd-who { color: var(--text); font-weight: 700; }
.cd-tag { display: inline-block; margin: 0 5px; padding: 0 6px; border-radius: 3px; font-size: 11px; line-height: 17px; background: var(--blue-light); color: var(--blue); vertical-align: 1px; }
.cd-time { display: block; color: var(--text-3); font-size: 11.5px; margin-top: 3px; }
.cd-note { margin-top: 9px; font-size: 11.5px; color: var(--text-3); }

/* 移动端适配 */
@media (max-width: 768px) {
  .intro-tags { gap: 6px 14px; }
  .rv-summary { gap: 12px; padding: 13px 15px; }
  .rv-count { margin-left: 0; text-align: left; font-size: 12.5px; }
  .bn-date { width: 50px; }
  .join-dyn { height: 190px; }
  .consult-dyn { height: 216px; }
}

/* ============ 品牌方后台：咨询记录统计卡 ============ */
.msg-stats .ms-card { flex: 1; min-width: 120px; background: linear-gradient(135deg, #FFF8F6, #F3FAFF); border: 1px solid var(--line-2); border-radius: 10px; padding: 12px 16px; text-align: center; }
.msg-stats .ms-card b { display: block; font-size: 22px; color: var(--red); line-height: 1.2; }
.msg-stats .ms-card span { font-size: 12.5px; color: var(--text-2); }

/* ============ 品牌资讯配图（品牌方后台上传 / 前台展示） ============ */
.bn-imglist { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 12px; }
.bn-imgbox { position: relative; width: 118px; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: #fff; }
.bn-imgbox img { display: block; width: 100%; height: 84px; object-fit: cover; }
.bn-imgcov { position: absolute; top: 6px; left: 6px; background: var(--red); color: #fff; font-style: normal; font-size: 11px; padding: 1px 6px; border-radius: 3px; }
.bn-imgdel { display: block; text-align: center; font-size: 12px; color: var(--text-2); padding: 5px 0; border-top: 1px solid var(--line); cursor: pointer; user-select: none; }
.bn-imgdel input { vertical-align: -1px; margin-right: 3px; }
.bn-imgdel:hover { color: var(--red); background: #FFF7F6; }
.bn-thumb { width: 62px; height: 44px; object-fit: cover; border-radius: 5px; border: 1px solid var(--line-2); display: block; }
.bn-cover { flex-shrink: 0; width: 92px; height: 62px; object-fit: cover; border-radius: 6px; }
.na-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; margin: 4px 0 18px; }
.na-gallery img { width: 100%; border-radius: 8px; display: block; }

@media (max-width: 768px) {
  .bn-imgbox { width: 96px; }
  .bn-imgbox img { height: 70px; }
  .bn-cover { width: 70px; height: 52px; }
  .na-gallery { grid-template-columns: repeat(2, 1fr); }
}

/* =====================================================
   城市切换弹层（PC + 移动端通用）
   ===================================================== */
.city-picker { position: fixed; inset: 0; z-index: 1200; }
.city-picker[hidden] { display: none; }
.cp-mask { position: absolute; inset: 0; background: rgba(0, 0, 0, .45); }
.cp-panel {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(680px, calc(100vw - 24px)); max-height: 80vh;
  background: #fff; border-radius: 12px; display: flex; flex-direction: column;
  overflow: hidden; box-shadow: 0 14px 44px rgba(0, 0, 0, .28);
}
.cp-head { display: flex; align-items: center; gap: 10px; padding: 13px 16px; border-bottom: 1px solid var(--line-2); }
.cp-head strong { font-size: 16px; color: var(--text); }
.cp-head .cp-cur { margin-left: auto; font-size: 12px; color: var(--text-3); }
.cp-head .cp-cur b { color: var(--red); font-weight: 700; }
.cp-close { border: 0; background: none; font-size: 26px; line-height: 1; color: var(--text-3); cursor: pointer; padding: 0 2px; }
.cp-close:hover { color: var(--red); }
.cp-search { padding: 12px 16px 2px; }
.cp-search input {
  width: 100%; height: 38px; border: 1px solid var(--line); border-radius: 19px;
  padding: 0 15px; font-size: 14px; background: #FAFAFA;
}
.cp-search input:focus { border-color: var(--red); background: #fff; }
.cp-body { padding: 8px 16px 18px; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.cp-label { font-size: 12.5px; color: var(--text-3); margin: 12px 0 8px; }
.cp-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: 8px; }
.cp-item {
  text-align: center; padding: 9px 4px; background: #F7F7F7; border-radius: 7px;
  font-size: 13.5px; color: var(--text-2); border: 1px solid transparent; white-space: nowrap;
}
.cp-item:hover { color: var(--red); background: var(--red-light); }
.cp-item.on { background: var(--red); color: #fff; font-weight: 700; }
.cp-empty { text-align: center; color: var(--text-3); font-size: 13px; padding: 16px 0 4px; }
.cp-empty b { color: var(--red); }
.cp-tip { font-size: 11.5px; color: #BBB; margin-top: 14px; line-height: 1.7; }

/* ---------- LOGO 旁「切换城市」入口 ---------- */
.city-switch {
  display: inline-flex; align-items: center; gap: 4px; flex-shrink: 0;
  padding: 6px 13px; border: 1px solid #F1CBC8; border-radius: 17px;
  background: var(--red-light); color: var(--red);
  font-size: 13.5px; font-weight: 700; line-height: 1.2; transition: all .2s;
}
.city-switch:hover { background: var(--red); border-color: var(--red); color: #fff; }
.city-switch.has-city { background: var(--red); border-color: var(--red); color: #fff; }
.city-switch.has-city:hover { background: var(--red-dark); border-color: var(--red-dark); }
.city-switch .cs-ic { font-size: 13px; }
.city-switch .cs-name { max-width: 10em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.city-switch .cs-arrow { font-style: normal; font-size: 10px; opacity: .85; }

/* ---------- 移动端：导航内城市入口 ---------- */
.nav .city-entry .ce-arrow { font-style: normal; font-size: 11px; margin-left: 3px; opacity: .85; }

/* =====================================================
   全站防横向滚动（clip 不破坏 sticky，旧浏览器回退 hidden）
   ===================================================== */
html, body { overflow-x: clip; max-width: 100%; }
@supports not (overflow: clip) {
  html, body { overflow-x: hidden; }
}
img, video, iframe, table { max-width: 100%; }
p, li, td, dd { overflow-wrap: break-word; }

/* =====================================================
   移动端体验升级：紧凑布局 / 吸顶搜索导航 / 防挤压
   ===================================================== */
@media (max-width: 768px) {
  /* 顶栏吸顶：搜索框 + 主导航滚动全程可见，方便随时查询 */
  .header { position: sticky; top: 0; z-index: 600; box-shadow: 0 1px 4px rgba(0, 0, 0, .08); }
  .nav { position: sticky; top: 50px; z-index: 590; box-shadow: 0 2px 6px rgba(0, 0, 0, .1); }
  .header .wrap { height: 50px; gap: 8px; padding: 0 10px; }
  .logo { gap: 7px; }
  .logo-mark { width: 32px; height: 32px; font-size: 16px; border-radius: 7px; }
  .logo-txt strong { font-size: 15.5px; letter-spacing: 0; }
  .search-box { border-width: 1.5px; border-radius: 16px; }
  .search-box input { height: 32px; padding: 0 10px; font-size: 16px; }
  .search-box button { padding: 0 13px; font-size: 13.5px; }
  .header-right .btn { padding: 4px 10px; font-size: 12px; border-radius: 14px; }

  /* 主导航：更醒目（加粗、加大热区） */
  .nav .wrap { height: 40px; padding: 0 2px; }
  .nav a { padding: 0 14px; line-height: 40px; font-size: 13.5px; font-weight: 600; }
  /* 移动端城市切换统一走 LOGO 旁入口 + 底部导航，导航内条目隐藏避免重复 */
  .nav .city-entry { display: none; }

  /* LOGO 旁城市入口在窄屏收缩，避免挤压搜索框 */
  .city-switch { padding: 4px 9px; font-size: 12.5px; border-radius: 14px; gap: 3px; }
  .city-switch .cs-ic { display: none; }
  .city-switch .cs-name { max-width: 5.2em; }
  .header-right { display: none; }

  /* 城市条在移动端隐藏（城市切换统一走 LOGO 旁入口 + 底部导航“城市”） */
  .citybar { display: none; }

  /* 页面更紧凑：缩小留白与卡片占位 */
  body { font-size: 13.5px; }
  .wrap { padding: 0 9px; }
  .section { padding: 12px; margin-bottom: 8px; border-radius: 0; }
  .section-head { padding-bottom: 8px; margin-bottom: 10px; }
  .section-head h2, .section-head h3 { font-size: 15.5px; }
  .grid-3, .grid-4, .grid-5 { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .grid-2 { grid-template-columns: 1fr; gap: 8px; }
  .card-body { padding: 8px; }
  .card-title { font-size: 13px; margin-bottom: 4px; }
  .card-desc { font-size: 11.5px; }
  .card-meta { font-size: 11px; gap: 6px; }
  .list-item { padding: 10px; margin-bottom: 6px; }
  .list-item .li-cover { height: 116px; }
  .list-item .li-title { font-size: 14.5px; }
  .hero { padding: 13px 12px; margin-bottom: 8px; }
  .hero-txt h1 { font-size: 18px; }
  .hero-txt p { font-size: 12.5px; }
  .hero-stats .hs b { font-size: 18px; }
  .crumb { padding: 7px 0; font-size: 12px; }
  .faq-q { font-size: 13.5px; padding: 10px 32px 10px 12px; }
  .faq-a { font-size: 13px; }
  .legal-note { font-size: 11px; line-height: 1.7; padding: 9px 11px; }
  .footer-bottom { font-size: 11px; padding: 10px 0; line-height: 1.8; }
  .pager { margin: 10px 0; }
  .pager a, .pager span { min-width: 28px; height: 28px; line-height: 28px; font-size: 12px; padding: 0 6px; }

  /* 表单元素 16px 防 iOS 聚焦自动放大 */
  .input, .form-row input, .form-row textarea, .form-row select,
  .search-box input, .cp-search input { font-size: 16px; }

  /* 弹层在手机上贴底呈现，拇指易触达 */
  .cp-panel {
    left: 0; right: 0; bottom: 0; top: auto; transform: none;
    width: 100%; max-height: 82vh; border-radius: 14px 14px 0 0;
  }
  .cp-list { grid-template-columns: repeat(4, 1fr); gap: 7px; }
  .cp-item { padding: 9px 2px; font-size: 13px; }

  /* 底部导航适配 iPhone 安全区 */
  .m-tabbar { padding-bottom: env(safe-area-inset-bottom); }
  body { padding-bottom: calc(54px + env(safe-area-inset-bottom)); }
}

@media (max-width: 480px) {
  .cp-list { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 380px) {
  .header .wrap { height: 48px; padding: 0 8px; }
  .nav { top: 48px; }
  .nav a { padding: 0 11px; font-size: 13px; }
  .cp-list { grid-template-columns: repeat(3, 1fr); }
}

/* =====================================================
   机构后台：侧边菜单「当前管理机构」信息块
   注意：机构名可能很长（20+ 字），必须单行省略，
   否则会把 200px 侧栏撑破或被硬切掉半截字。
   ===================================================== */
.uc-menu .um-org {
  margin: 12px 12px 2px; padding: 9px 12px 10px;
  background: #FFF8F7; border: 1px solid #FBE3E0; border-radius: 8px;
  display: flex; flex-direction: column; gap: 2px; min-width: 0;
}
.uc-menu .um-org-lbl { font-size: 11.5px; color: var(--text-3); line-height: 1.5; }
.uc-menu .um-org b {
  display: block; font-size: 13px; font-weight: 700; color: var(--red);
  line-height: 1.55; max-width: 100%; min-width: 0;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  word-break: keep-all; overflow-wrap: normal;
}

/* 收藏按钮（已收藏选中态） */
.btn.on { border-color: #F7D9D5; background: #FFF1EF; color: var(--red); font-weight: 700; }

/* 账号昵称同样做单行省略，防止长昵称撑破侧栏 */
.uc-menu .um-name {
  font-size: 15px; font-weight: 700;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}

/* 机构后台各页标题里的长机构名：允许折行，右侧徽标不被挤压 */
.uc-layout .section-head h2 { overflow-wrap: anywhere; min-width: 0; }
.uc-layout .section-head .badge { flex-shrink: 0; }

@media (max-width: 768px) {
  .uc-menu .um-org { margin: 10px 10px 2px; padding: 8px 11px 9px; }
  .uc-menu nav a { padding: 11px 14px; font-size: 13px; }
}

/* 广告位（前台按位置渲染，图片自适应容器宽度） */
.ad-slot { margin: 14px 0 18px; display: flex; flex-direction: column; gap: 10px; }
.ad-slot img { display: block; width: 100%; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,.06); }
.ad-slot a { display: block; }
.ad-slot .ad-link { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: pointer; text-align: inherit; font: inherit; text-decoration: none; }
.ad-slot .ad-link:hover img { box-shadow: 0 4px 16px rgba(0,0,0,.14); }
.ad-slot .ad-consult { position: relative; }
.ad-slot .ad-consult::after {
  content: "点击立即咨询"; position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%);
  padding: 4px 12px; border-radius: 999px; background: rgba(0,0,0,.42); color: #fff;
  font-size: 12px; line-height: 1.5; white-space: nowrap; pointer-events: none; opacity: 0; transition: opacity .2s;
}
.ad-slot .ad-consult:hover::after { opacity: 1; }
.ad-slot:empty { display: none; }
@media (max-width: 768px) {
  .ad-slot { margin: 10px 0 14px; }
  .ad-slot .ad-consult::after { opacity: 1; bottom: 8px; }
}

/* ===== 机构详情：教学环境相册 / 师资力量 ===== */
.album-sub { font-size: 14px; font-weight: 700; color: var(--text-1); margin: 4px 0 12px; }
.album-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
.album-item { position: relative; display: block; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); background: var(--bg-2); }
.album-item img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .25s; }
.album-item:hover img { transform: scale(1.04); }
.album-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 6px 9px; font-size: 12px; color: #fff; background: linear-gradient(transparent, rgba(0,0,0,.62)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.teacher-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.teacher-card { border: 1px solid var(--line); border-radius: 12px; padding: 16px 12px; text-align: center; background: #fff; }
.tc-photo { width: 84px; height: 84px; margin: 0 auto 10px; border-radius: 50%; overflow: hidden; background: var(--bg-2); display: flex; align-items: center; justify-content: center; }
.tc-photo img { width: 100%; height: 100%; object-fit: cover; }
.tc-photo .ph { font-size: 32px; }
.tc-name { font-size: 15px; font-weight: 700; color: var(--text-1); }
.tc-title { font-size: 12.5px; color: var(--red); margin-top: 3px; }
.tc-intro { font-size: 12.5px; color: var(--text-3); line-height: 1.7; margin: 8px 0 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

@media (max-width: 768px) {
  .album-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .teacher-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .tc-photo { width: 68px; height: 68px; }
}

/* ===== 置顶与刷新 ===== */
.promo-target { border: 1px solid var(--line); border-left: 4px solid var(--red); border-radius: 10px; padding: 14px 16px; background: #fff; margin-bottom: 14px; }
.promo-target .pt-type { font-size: 12px; color: var(--text-3); }
.promo-target .pt-name { font-size: 17px; font-weight: 700; color: var(--text-1); margin: 3px 0; overflow-wrap: anywhere; }
.promo-target .pt-meta { font-size: 12.5px; color: var(--text-3); }
.promo-status { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.promo-status .ps-item { flex: 1; min-width: 220px; border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; background: var(--bg-2); }
.promo-status .ps-lbl { display: block; font-size: 12px; color: var(--text-3); margin-bottom: 3px; }
.promo-status .ps-on { color: #2E9E5B; font-size: 13.5px; }
.promo-status .ps-off { color: var(--text-3); font-size: 13.5px; }
.promo-block { margin-bottom: 18px; }
.promo-block .pb-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 8px; }
.promo-block .pb-head b { font-size: 15px; color: var(--text-1); }
.promo-block .pb-head span { font-size: 12.5px; color: var(--text-3); }
.promo-block button[disabled] { opacity: .55; cursor: not-allowed; }
/* 按行业类别推广：类别选择器 + 四列矩阵 */
.promo-catpick { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; border: 1px dashed var(--line); border-radius: 10px; padding: 10px 14px; background: var(--bg-2); margin: 0 0 16px; }
.promo-catpick label { font-size: 13px; font-weight: 700; color: var(--text-2); }
.promo-catpick select { max-width: 260px; }
.promo-catpick .tip { font-size: 12px; color: var(--text-3); }
.promo-table th.promo-th-cat { background: #FFF7F5; }
.promo-table .promo-form { margin: 0; }
.promo-table td { vertical-align: middle; }
/* 手机端：四列矩阵改为「每个时长一张卡」堆叠，避免横向挤压 */
@media (max-width: 768px) {
  .promo-table thead { display: none; }
  .promo-table, .promo-table tbody { display: block; }
  .promo-table tr { display: block; border: 1px solid var(--line-2); border-radius: 10px; padding: 8px 12px 10px; margin-bottom: 10px; background: #fff; }
  .promo-table td { display: block; border: 0; padding: 0; }
  .promo-table td.pt-td-unit { font-size: 13px; padding: 2px 0 8px; margin-bottom: 4px; border-bottom: 1px dashed var(--line-2); }
  .promo-table td[data-lbl] { padding: 7px 0 2px; }
  .promo-table td[data-lbl]::before { content: attr(data-lbl); display: block; font-size: 11.5px; color: var(--text-3); margin-bottom: 5px; }
  .promo-table .promo-form .btn { width: 100%; }
  .promo-catpick { align-items: stretch; }
  .promo-catpick select { max-width: none; flex: 1 1 100%; }
}
/* 后台「积分规则」分段标题 */
.pt-sec { margin: 4px 0 14px; padding: 10px 14px; border-left: 4px solid var(--blue); border-radius: 8px; background: #F5FAFE; }
.pt-sec + .form-grid { margin-bottom: 8px; }
.pt-sec h4 { font-size: 14px; color: var(--text-1); margin: 0 0 4px; }
.pt-sec p { font-size: 12.5px; color: var(--text-3); line-height: 1.8; margin: 0; }

/* =========================================================
 * 餐饮新闻板块（双层分类：一级频道 + 二级标签 / 三栏布局）
 * =======================================================*/
/* --- 频道导航条（语义频道 chips，手机端横向滑动） --- */
.news-chbar { display: flex; flex-wrap: wrap; gap: 8px; background: #fff; border-radius: var(--radius); padding: 12px 14px; margin-bottom: 16px; overflow-x: visible; }
.news-chbar .ch { flex: none; display: inline-flex; align-items: center; gap: 5px; padding: 6px 14px; border-radius: 17px; background: var(--line-2); color: var(--text-2); font-size: 13.5px; transition: all .2s; white-space: nowrap; }
.news-chbar .ch:hover { background: var(--red-light); color: var(--red); }
.news-chbar .ch.on { background: var(--red); color: #fff; }
.news-chbar .ch .ic { font-size: 14px; }
.news-chbar .ch .n { font-size: 11px; opacity: .72; }
.news-chbar .ch.on .n { opacity: .9; }
/* 频道较多时收窄内边距，尽量控制在两行以内 */
@media (min-width: 901px) {
  .news-chbar { padding: 10px 12px; gap: 7px; row-gap: 8px; }
  .news-chbar .ch { padding: 5px 11px; font-size: 13px; }
}

/* --- 三栏骨架 --- */
.news-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.news-left .side-block.nb { padding: 16px; }
.nb-tip { font-size: 12.5px; color: var(--text-2); line-height: 1.9; margin-bottom: 11px; }

/* 左栏频道清单 */
.ch-list li { border-bottom: 1px dashed var(--line-2); }
.ch-list li:last-child { border-bottom: 0; }
.ch-list a { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 9px 2px; font-size: 13.5px; color: var(--text-2); transition: all .18s; }
.ch-list a:hover { color: var(--red); }
.ch-list a.on { color: var(--red); font-weight: 700; }
.ch-list a .n { font-size: 11.5px; color: var(--text-3); background: var(--line-2); border-radius: 9px; padding: 1px 7px; }
.ch-list a.on .n { background: var(--red-light); color: var(--red); }

/* 标签筛选 */
.tag-group { margin-bottom: 12px; }
.tag-group:last-of-type { margin-bottom: 0; }
.tg-name { font-size: 12.5px; font-weight: 700; color: var(--text); margin-bottom: 7px; }
.tg-items { display: flex; flex-wrap: wrap; gap: 6px; }

/* 通用 chip */
.chip { display: inline-block; font-size: 12px; line-height: 18px; padding: 2px 9px; border-radius: 11px; background: var(--line-2); color: var(--text-2); transition: all .18s; }
.chip:hover { background: #EBEBEB; color: var(--text); }
.chip.on { background: var(--red); color: #fff; }
.chip-ch { background: var(--red-light); color: var(--red); font-weight: 700; }
.chip-ch:hover { background: #FCE4E2; color: var(--red-dark); }
.chip-origin { background: #EAF7EF; color: var(--green); }

/* --- 头条区 --- */
.news-headline { display: flex; gap: 16px; background: #fff; border-radius: var(--radius); padding: 16px; margin-bottom: 14px; border: 1px solid var(--line); transition: all .25s; }
.news-headline:hover { box-shadow: var(--shadow-hover); border-color: #F5C9C5; }
.news-headline .nh-cover { width: 320px; height: 200px; flex: none; border-radius: 5px; overflow: hidden; background: var(--line-2); }
.news-headline .nh-cover img { width: 100%; height: 100%; object-fit: cover; }
.news-headline .nh-cover .ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 46px; background: linear-gradient(135deg, #FAFAFA, #EFEFEF); }
.news-headline .nh-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.news-headline .nh-flag { align-self: flex-start; font-size: 11.5px; font-weight: 700; color: #fff; background: linear-gradient(90deg, var(--red), var(--orange)); border-radius: 3px; padding: 2px 9px; margin-bottom: 10px; }
.news-headline .nh-title { font-size: 21px; line-height: 1.42; font-weight: 700; margin-bottom: 10px; }
.news-headline .nh-title:hover { color: var(--red); }
.news-headline .nh-desc { font-size: 13.5px; color: var(--text-3); line-height: 1.75; flex: 1; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* --- 工具条 --- */
.news-toolbar { display: flex; gap: 12px; align-items: center; background: #fff; border-radius: var(--radius); padding: 12px 14px; margin-bottom: 12px; }
.news-search { display: flex; gap: 8px; flex: 1; min-width: 0; }
.news-search .input { flex: 1; min-width: 0; }
.news-sort { display: flex; gap: 4px; flex: none; }
.news-sort a { font-size: 13px; padding: 5px 13px; border-radius: 14px; background: var(--line-2); color: var(--text-2); }
.news-sort a.on { background: var(--red); color: #fff; }
.news-count { font-size: 12.5px; color: var(--text-3); padding: 0 4px 10px; }
.news-count b { color: var(--red); }

/* --- 新闻卡片 --- */
.news-card { display: flex; gap: 14px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 14px; margin-bottom: 12px; transition: all .25s; }
.news-card:hover { box-shadow: var(--shadow-hover); border-color: #F5C9C5; transform: translateY(-1px); }
.news-card .nc-cover { width: 200px; height: 126px; flex: none; border-radius: 5px; overflow: hidden; background: var(--line-2); }
.news-card .nc-cover img { width: 100%; height: 100%; object-fit: cover; }
.news-card .nc-cover .ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 34px; background: linear-gradient(135deg, #FAFAFA, #EFEFEF); }
.news-card .nc-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.news-card .nc-title { font-size: 17px; font-weight: 700; line-height: 1.45; margin-bottom: 8px; }
.news-card .nc-title a:hover { color: var(--red); }
.news-card .nc-desc { font-size: 13px; color: var(--text-3); line-height: 1.68; margin-bottom: 10px; flex: 1; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nc-meta { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; font-size: 12px; color: var(--text-3); }
.nc-src { color: var(--text-2); }
.nc-time { color: var(--text-3); }
.nc-views { color: var(--text-3); }

/* --- 右栏排行 --- */
.rank-list .rk { display: inline-block; width: 17px; height: 17px; line-height: 17px; text-align: center; border-radius: 3px; font-size: 11px; font-weight: 700; background: var(--line-2); color: var(--text-3); flex: none; }
.rank-list .rk-1 { background: var(--red); color: #fff; }
.rank-list .rk-2 { background: var(--orange); color: #fff; }
.rank-list .rk-3 { background: #F0A228; color: #fff; }
.rank-list li a { display: flex; align-items: center; gap: 8px; }

/* --- 详情页 70/30 --- */
.news-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 16px; align-items: start; }
.nd-article { padding: 24px; }
.nd-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 14px; }
.nd-title { font-size: 26px; line-height: 1.44; font-weight: 700; margin-bottom: 14px; }
.nd-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 13px; color: var(--text-3); padding-bottom: 14px; border-bottom: 1px solid var(--line-2); margin-bottom: 20px; }
.nd-link { color: var(--red); font-weight: 700; }
.nd-cover { width: 100%; border-radius: 6px; margin-bottom: 6px; }
.nd-cover-note { font-size: 12px; color: var(--text-3); text-align: right; margin-bottom: 18px; }
.nd-summary { font-size: 14px; line-height: 1.9; background: var(--red-light); border-left: 3px solid var(--red); border-radius: 4px; padding: 12px 16px; margin-bottom: 20px; color: var(--text-2); }
.news-detail-layout .article-body { font-size: 15px; line-height: 2; color: var(--text); }
.news-detail-layout .article-body p { margin-bottom: 16px; }
.news-detail-layout .article-body h3 { font-size: 17px; font-weight: 700; margin: 24px 0 12px; padding-left: 12px; border-left: 4px solid var(--red); }
.nd-tags { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 26px; padding-top: 16px; border-top: 1px solid var(--line-2); }
.nd-tags-name { font-size: 12.5px; color: var(--text-3); }
.nd-actions { display: none; }
.nd-nav { display: flex; justify-content: space-between; gap: 14px; font-size: 13.5px; flex-wrap: wrap; }

/* 相关阅读卡片 */
.rel-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.rel-card { display: block; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: #fff; transition: all .22s; }
.rel-card:hover { box-shadow: var(--shadow-hover); border-color: #F5C9C5; }
.rel-card .rc-cover { height: 104px; background: var(--line-2); }
.rel-card .rc-cover img { width: 100%; height: 100%; object-fit: cover; }
.rel-card .rc-cover .ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 28px; }
.rel-card .rc-title { font-size: 13.5px; font-weight: 700; line-height: 1.5; padding: 10px 11px 4px; }
.rel-card .rc-meta { font-size: 11.5px; color: var(--text-3); padding: 0 11px 11px; }

/* 手机端底部固定操作条 / 加载更多按钮 */
.nd-fixed-bar { display: none; }
.pager-more { display: none; }
/* 加载更多按钮（移动端）——基础态必须先于 @media(max-width:768px) 声明，
   否则同优先级下后置的 display:none 会反压移动端覆写规则导致按钮永不显示 */
.load-more { display: none; text-align: center; padding: 16px 0 4px; }
.load-more button { padding: 10px 40px; border: 1px solid var(--line); background: #fff; border-radius: 20px; font-size: 13.5px; color: var(--text-2); cursor: pointer; }
.load-more button:hover { border-color: var(--red); color: var(--red); }
.load-more button:disabled { color: #bbb; cursor: default; }
.load-more button:disabled:hover { border-color: var(--line); color: #bbb; }

/* 首页新闻模块条目 */
.hn-item { display: flex; gap: 12px; padding: 11px 0; border-bottom: 1px dashed var(--line-2); }
.hn-meta { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; font-size: 12px; color: var(--text-3); }

/* 机构 / 品牌详情页「相关报道」 */
.report-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; }
.report-list a { display: flex; gap: 8px; align-items: baseline; font-size: 13.5px; color: var(--text-2); padding: 5px 0; }
.report-list a:hover { color: var(--red); }
.report-list .rp-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--red); flex: none; margin-top: 5px; }
@media (max-width: 768px) { .report-list { grid-template-columns: minmax(0, 1fr); } }

@media (max-width: 1024px) {
  .news-layout { grid-template-columns: minmax(0, 1fr) 300px; }
  .news-left { display: none; }
  .news-detail-layout { grid-template-columns: minmax(0, 1fr); }
  .news-detail-side { display: block; }
}
@media (max-width: 900px) {
  .news-layout { grid-template-columns: minmax(0, 1fr); }
  .news-main { order: 1; }
  .news-left { order: 2; display: block; }
  .news-right { order: 3; }
  .news-left .side-block.nb { margin-bottom: 12px; }
  .ch-list { display: flex; flex-wrap: wrap; gap: 6px; }
  .ch-list li { flex: none; border-bottom: 0; }
  .ch-list a { border-radius: 15px; background: var(--line-2); padding: 5px 12px; font-size: 13px; }
  .ch-list a.on { background: var(--red-light); }
  .ch-list a .n { background: transparent; padding: 0; }
  .news-headline { flex-direction: column; gap: 12px; }
  .news-headline .nh-cover { width: 100%; height: 190px; }
  .news-headline .nh-title { font-size: 18px; }
  .news-headline .nh-desc { -webkit-line-clamp: 2; }
}
@media (max-width: 768px) {
  /* 移动端宽度有限，频道条改为横向滑动（隐藏滚动条）而不是折行占高 */
  .news-chbar { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 10px 12px; margin-bottom: 12px; }
  .news-chbar::-webkit-scrollbar { display: none; }
  .news-toolbar { flex-direction: column; align-items: stretch; gap: 10px; }
  .news-sort { justify-content: flex-start; }
  .news-card { flex-direction: column; gap: 10px; padding: 12px; }
  .news-card .nc-cover { width: 100%; height: 180px; }
  .news-card .nc-title { font-size: 16px; }
  .news-card .nc-desc { -webkit-line-clamp: 3; }
  .pager { display: none; }
  .pager-more { display: block; padding: 8px 0 20px; }
  .rel-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .nd-article { padding: 16px; }
  .nd-title { font-size: 20px; }
  .news-detail-layout .article-body { font-size: 15.5px; line-height: 1.95; }
  .nd-actions { display: flex; gap: 10px; margin-top: 20px; }
  .md-act { flex: 1; text-align: center; font-size: 14px; padding: 9px 0; border-radius: 20px; border: 1px solid var(--line); background: #fff; color: var(--text); cursor: pointer; }
  .md-act:first-child { background: var(--red); border-color: var(--red); color: #fff; }
  .nd-fixed-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: flex; background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -2px 10px rgba(0,0,0,.05); padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); gap: 10px; }
  .nd-fixed-bar button, .nd-fixed-bar a { flex: 1; text-align: center; font-size: 14.5px; padding: 10px 0; border-radius: 22px; border: 1px solid var(--line); background: #fff; color: var(--text); cursor: pointer; }
  .nd-fixed-bar a { background: var(--red); border-color: var(--red); color: #fff; font-weight: 700; }
  .news-detail-layout { padding-bottom: 64px; }
}
@media (max-width: 480px) {
  .rel-grid { grid-template-columns: minmax(0, 1fr); }
  .news-headline .nh-cover { height: 168px; }
  .news-card .nc-cover { height: 158px; }
}


/* =====================================================
   v2.0 组件库：门户首页 / 三栏列表 / 卡片网格 / 筛选 / 弹层 / 对比
   断点：手机 <768px ｜ 平板 768–1024px ｜ 电脑 >1024px
   ===================================================== */

/* ---------- 吸顶导航 ---------- */
.nav { position: sticky; top: 0; z-index: 120; }
.topbar { position: relative; z-index: 121; }

/* ---------- 首页 Hero：门户化 ---------- */
.hero-portal {
  background: linear-gradient(125deg, #FFF3F1 0%, #FFF9F3 55%, #FFF6F0 100%);
  border-radius: var(--radius); padding: 34px 28px 26px; margin-bottom: 16px; position: relative; overflow: hidden;
}
.hero-portal::after {
  content: ""; position: absolute; right: -70px; top: -70px; width: 260px; height: 260px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 84, 0, .10), transparent 68%); pointer-events: none;
}
.hero-portal h1 { font-size: 30px; line-height: 1.35; margin-bottom: 10px; color: var(--text); }
.hero-portal h1 em { color: var(--red); }
.hero-portal .hp-sub { font-size: 14.5px; color: var(--text-2); margin-bottom: 20px; }
.hero-search { display: flex; max-width: 660px; background: #fff; border: 2px solid var(--red); border-radius: 26px; overflow: hidden; box-shadow: 0 4px 18px rgba(219, 67, 57, .12); }
.hero-search input { flex: 1; border: 0; height: 46px; padding: 0 20px; font-size: 14.5px; }
.hero-search button { border: 0; background: var(--red); color: #fff; padding: 0 34px; font-size: 15px; font-weight: 700; cursor: pointer; transition: background .2s; }
.hero-search button:hover { background: var(--red-dark); }
.quick-tags { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; font-size: 13px; color: var(--text-3); }
.quick-tags a { padding: 4px 13px; background: rgba(255, 255, 255, .85); border: 1px solid #F3DCD8; border-radius: 15px; color: var(--text-2); }
.quick-tags a:hover { background: var(--red); border-color: var(--red); color: #fff; }

/* 核心入口卡片 */
.entry-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 16px; }
.entry-card { display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 20px; transition: all .25s; }
.entry-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: #F5C9C5; }
.entry-card .ec-ic { width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center; font-size: 25px; flex-shrink: 0; background: var(--red-light); }
.entry-card .ec-ic.blue { background: var(--blue-light); }
.entry-card .ec-ic.orange { background: #FFF3E8; }
.entry-card .ec-txt strong { display: block; font-size: 16.5px; margin-bottom: 3px; }
.entry-card .ec-txt span { font-size: 12.5px; color: var(--text-3); line-height: 1.6; }
.entry-card .ec-arrow { margin-left: auto; color: #ccc; font-size: 18px; }

/* 热门城市网格 */
.city-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 8px; }
.city-grid a { text-align: center; padding: 9px 4px; border: 1px solid var(--line); border-radius: 5px; font-size: 13px; color: var(--text-2); background: #FCFCFC; transition: all .2s; }
.city-grid a:hover, .city-grid a.on { background: var(--red); border-color: var(--red); color: #fff; }

/* 品类标签云 */
.cat-cloud { display: flex; flex-wrap: wrap; gap: 8px; }
.cat-cloud a { padding: 6px 14px; border-radius: 16px; background: var(--line-2); font-size: 13px; color: var(--text-2); transition: all .2s; }
.cat-cloud a:hover { background: var(--red); color: #fff; }
.cat-cloud a em { font-style: normal; color: var(--text-3); font-size: 11.5px; margin-left: 4px; }
.cat-cloud a:hover em { color: rgba(255, 255, 255, .8); }

/* 数据统计面板 */
.stats-panel { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; background: #fff; border-radius: var(--radius); padding: 20px; margin-bottom: 16px; }
.stats-panel .sp-item { text-align: center; position: relative; }
.stats-panel .sp-item + .sp-item::before { content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 1px; background: var(--line-2); }
.stats-panel .sp-item b { display: block; font-size: 26px; color: var(--red); line-height: 1.25; }
.stats-panel .sp-item span { font-size: 12.5px; color: var(--text-3); }

/* ---------- 三栏布局：左筛选 ｜ 中内容 ｜ 右推荐 ---------- */
.lay3 { display: grid; grid-template-columns: 232px minmax(0, 1fr) 288px; gap: 16px; align-items: start; }
.lay3 > * { min-width: 0; }
.lay-aside { position: sticky; top: 60px; }

/* 左侧筛选栏 */
.side-filter { background: #fff; border-radius: var(--radius); padding: 16px; margin-bottom: 16px; }
.side-filter .sf-title { font-size: 15px; font-weight: 700; padding-bottom: 10px; border-bottom: 2px solid var(--line-2); margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; }
.side-filter .sf-title a { font-size: 12px; color: var(--text-3); font-weight: 400; }
.side-filter .sf-title a:hover { color: var(--red); }
.sf-group { padding: 11px 0; border-bottom: 1px dashed var(--line-2); }
.sf-group:last-child { border-bottom: 0; padding-bottom: 0; }
.sf-group > b { display: block; font-size: 13px; color: var(--text-2); margin-bottom: 8px; }
.sf-opts { display: flex; flex-wrap: wrap; gap: 6px; }
.sf-opts a { padding: 4px 11px; border-radius: 14px; background: #F6F6F6; font-size: 12.5px; color: var(--text-2); transition: all .2s; white-space: nowrap; }
.sf-opts a:hover { background: #EFEFEF; color: var(--red); }
.sf-opts a.on { background: var(--red); color: #fff; }
.sf-opts a em { font-style: normal; font-size: 11px; opacity: .62; margin-left: 3px; }
.sf-more { font-size: 12.5px; color: var(--blue); }
.sf-sub { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--line-2); }

/* ---------- 列表工具条 ---------- */
.toolbar {
  display: flex; align-items: center; gap: 12px; background: #fff; border-radius: var(--radius);
  padding: 11px 16px; margin-bottom: 14px; flex-wrap: wrap;
  position: sticky; top: 46px; z-index: 60; box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
}
.toolbar .tb-count { font-size: 13px; color: var(--text-3); }
.toolbar .tb-count b { color: var(--red); font-size: 15px; }
.toolbar .tb-sorts { display: flex; gap: 4px; margin-left: auto; }
.toolbar .tb-sorts a { padding: 5px 13px; border-radius: 15px; font-size: 13px; color: var(--text-2); background: #F5F5F5; }
.toolbar .tb-sorts a:hover { color: var(--red); }
.toolbar .tb-sorts a.on { background: var(--red); color: #fff; }
.vt { display: flex; border: 1px solid var(--line); border-radius: 5px; overflow: hidden; }
.vt button { width: 32px; height: 30px; border: 0; background: #fff; cursor: pointer; color: var(--text-3); font-size: 15px; line-height: 1; }
.vt button + button { border-left: 1px solid var(--line); }
.vt button.on { background: var(--red); color: #fff; }
.tb-filter-btn { display: none; align-items: center; gap: 5px; padding: 6px 14px; border: 1px solid var(--red); color: var(--red); background: #fff; border-radius: 16px; font-size: 13px; cursor: pointer; }
.tb-filter-btn .n { background: var(--red); color: #fff; border-radius: 9px; padding: 0 6px; font-size: 11px; line-height: 16px; }

/* 已选条件 */
.chips-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; font-size: 12.5px; color: var(--text-3); }
.chips-bar .chip-x { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; background: var(--red-light); color: var(--red); border-radius: 14px; }
.chips-bar .chip-x i { font-style: normal; font-size: 14px; line-height: 1; }
.chips-bar .chip-x:hover { background: var(--red); color: #fff; }

/* ---------- 卡片网格 ---------- */
.cardgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; }
.cardgrid.grid-2col { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* 列表视图：卡片退化为横向整行（左侧封面 + 中间信息 + 右侧操作栏） */
.cardgrid.list-mode { grid-template-columns: 1fr; gap: 12px; }
.cardgrid.list-mode .card { flex-direction: row; align-items: flex-start; }
.cardgrid.list-mode .card-cover { width: 190px; aspect-ratio: 4/3; flex-shrink: 0; align-self: flex-start; }
/* 信息区改为两列网格：内容贴合封面高度，底部不再留空 */
.cardgrid.list-mode .card-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "title side" "tagline side" "desc side" "facts side" "meta side";
  align-content: center;
  column-gap: 18px;
  padding: 12px 14px;
}
.cardgrid.list-mode .card-title { grid-area: title; }
.cardgrid.list-mode .card-tagline { grid-area: tagline; }
.cardgrid.list-mode .card-desc { grid-area: desc; -webkit-line-clamp: 2; }
.cardgrid.list-mode .card-facts { grid-area: facts; margin-bottom: 0; }
.cardgrid.list-mode .card-meta { grid-area: meta; }
/* 右侧操作栏：竖排按钮 + 虚线分隔 */
.cardgrid.list-mode .card-actions {
  grid-area: side; margin-top: 0; align-self: center;
  flex-direction: column; align-items: stretch; gap: 8px;
  padding-left: 16px; border-left: 1px dashed var(--line);
}
.cardgrid.list-mode .card-actions .btn { white-space: nowrap; text-align: center; }

/* 卡片上的收藏 / 对比勾选 */
.card { position: relative; }
.card-tools { position: absolute; right: 8px; top: 8px; display: flex; gap: 6px; z-index: 3; }
.card-tools button {
  width: 30px; height: 30px; border: 0; border-radius: 50%; cursor: pointer; font-size: 14px; line-height: 1;
  background: rgba(255, 255, 255, .92); color: var(--text-3); box-shadow: 0 1px 5px rgba(0, 0, 0, .13);
  display: flex; align-items: center; justify-content: center; transition: all .2s;
}
.card-tools button:hover { color: var(--red); transform: scale(1.08); }
.card-tools button.on { background: var(--red); color: #fff; }
.card-cmp { position: absolute; left: 8px; top: 8px; z-index: 3; }
.card-cmp label { display: flex; align-items: center; gap: 5px; font-size: 12px; background: rgba(255, 255, 255, .92); padding: 4px 9px; border-radius: 13px; cursor: pointer; color: var(--text-2); box-shadow: 0 1px 5px rgba(0, 0, 0, .13); }
.card-cmp input { accent-color: var(--red); width: 14px; height: 14px; }
.card-badges { position: absolute; left: 8px; bottom: 8px; display: flex; gap: 5px; z-index: 2; }
.card-tagline { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 7px; }
.card-tagline .tg { font-size: 11.5px; padding: 2px 8px; border-radius: 10px; background: var(--line-2); color: var(--text-2); }
.card-tagline .tg.hot { background: var(--red-light); color: var(--red); }
.card-facts { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: var(--text-3); margin-bottom: 8px; }
.card-facts b { color: var(--red); }
.card-facts .hl b { color: var(--orange); font-size: 14px; }

/* ---------- 右侧推荐栏 ---------- */
.rail-block { background: #fff; border-radius: var(--radius); padding: 16px; margin-bottom: 16px; }
.rail-block > h3 { font-size: 15px; padding-bottom: 10px; border-bottom: 2px solid var(--line-2); margin-bottom: 12px; position: relative; padding-left: 11px; }
.rail-block > h3::before { content: ""; position: absolute; left: 0; top: 3px; width: 4px; height: 14px; background: var(--red); border-radius: 2px; }
.rail-block > h3 .more { float: right; font-size: 12px; color: var(--text-3); font-weight: 400; }
.rail-rank li { display: flex; align-items: center; gap: 9px; padding: 8px 0; border-bottom: 1px dashed var(--line-2); font-size: 13px; }
.rail-rank li:last-child { border-bottom: 0; }
.rail-rank .no { width: 18px; height: 18px; line-height: 18px; text-align: center; border-radius: 4px; background: #F0F0F0; color: var(--text-3); font-size: 11.5px; flex-shrink: 0; }
.rail-rank li:nth-child(1) .no { background: var(--red); color: #fff; }
.rail-rank li:nth-child(2) .no { background: #FF8A5B; color: #fff; }
.rail-rank li:nth-child(3) .no { background: #FFB27A; color: #fff; }
.rail-rank .nm { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.rail-rank .vv { font-size: 11.5px; color: var(--text-3); flex-shrink: 0; }
.rail-cta { background: linear-gradient(140deg, #FFF6F4, #FFF9F2); }
.rail-cta p { font-size: 12.5px; color: var(--text-2); line-height: 1.8; margin-bottom: 12px; }

/* ---------- 详情页 ---------- */
.detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.detail-aside { position: sticky; top: 60px; }
/* 锚点定位时给吸顶导航 + 锚点条留出空间 */
main section[id] { scroll-margin-top: 108px; }
.anchor-tabs {
  display: flex; gap: 2px; background: #fff; border-radius: var(--radius); padding: 0 6px;
  margin-bottom: 14px; overflow-x: auto; position: sticky; top: 46px; z-index: 58;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
}
.anchor-tabs a { padding: 13px 16px; font-size: 14px; color: var(--text-2); white-space: nowrap; border-bottom: 2px solid transparent; }
.anchor-tabs a:hover { color: var(--red); }
.anchor-tabs a.on { color: var(--red); border-bottom-color: var(--red); font-weight: 700; }
.contact-card .cc-row { display: flex; align-items: baseline; gap: 8px; font-size: 13px; padding: 7px 0; border-bottom: 1px dashed var(--line-2); color: var(--text-2); }
.contact-card .cc-row:last-child { border-bottom: 0; }
.contact-card .cc-row b { color: var(--text); }
.contact-card .cc-tel { font-size: 21px; color: var(--red); font-weight: 700; letter-spacing: .5px; }
.contact-card .cc-btns { display: flex; gap: 8px; margin-top: 12px; }
.contact-card .cc-btns .btn { flex: 1; }
.contact-card .cc-ops { display: flex; gap: 8px; margin-top: 9px; }
.contact-card .cc-ops button { flex: 1; padding: 7px 0; border: 1px solid var(--line); background: #fff; border-radius: 5px; font-size: 12.5px; color: var(--text-2); cursor: pointer; transition: all .2s; }
.contact-card .cc-ops button:hover { border-color: var(--red); color: var(--red); }
.contact-card .cc-ops button.on { background: var(--red-light); border-color: var(--red); color: var(--red); }

/* 折叠内容 */
.fold-body { max-height: 260px; overflow: hidden; position: relative; transition: max-height .3s; }
.fold-body::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 60px; background: linear-gradient(transparent, #fff); pointer-events: none; transition: opacity .3s; }
.fold.open .fold-body { max-height: none; }
.fold.open .fold-body::after { opacity: 0; }
.fold-btn { text-align: center; padding-top: 8px; }
.fold-btn button { border: 0; background: none; color: var(--red); font-size: 13px; cursor: pointer; }

/* 相关推荐网格 */
.reco-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 14px; }

/* 详情页底部固定操作栏（移动端） */
.detail-actionbar {
  display: none; position: fixed; left: 0; right: 0; bottom: 54px; height: 52px; background: #fff;
  border-top: 1px solid var(--line); z-index: 880; padding: 0 10px; align-items: center; gap: 8px;
}
.detail-actionbar .da-ic { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 50px; font-size: 10.5px; color: var(--text-3); gap: 1px; }
.detail-actionbar .da-ic i { font-style: normal; font-size: 17px; line-height: 1; }
.detail-actionbar .da-ic.on { color: var(--red); }
.detail-actionbar .btn { flex: 1; padding: 10px 0; font-size: 14px; }

/* ---------- 底部弹层 / 模态 ---------- */
.sheet-mask { position: fixed; inset: 0; background: rgba(0, 0, 0, .45); z-index: 1000; opacity: 0; transition: opacity .25s; }
.sheet-mask.show { opacity: 1; }
.sheet {
  position: fixed; left: 0; right: 0; bottom: 0; background: #fff; z-index: 1001;
  border-radius: 14px 14px 0 0; max-height: 86vh; display: flex; flex-direction: column;
  transform: translateY(100%); transition: transform .28s cubic-bezier(.33, .9, .4, 1);
}
.sheet.show { transform: translateY(0); }
.sheet-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--line-2); flex-shrink: 0; }
.sheet-head b { font-size: 16px; }
.sheet-head button { border: 0; background: none; font-size: 20px; color: var(--text-3); cursor: pointer; line-height: 1; }
.sheet-body { padding: 16px; overflow-y: auto; flex: 1; }
.sheet-foot { padding: 12px 16px; border-top: 1px solid var(--line-2); display: flex; gap: 10px; flex-shrink: 0; padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
.sheet-foot .btn { flex: 1; }

/* PC 端模态框 */
.modal-mask { position: fixed; inset: 0; background: rgba(0, 0, 0, .45); z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px; opacity: 0; transition: opacity .22s; }
.modal-mask.show { opacity: 1; }
.modal { background: #fff; border-radius: 10px; width: 100%; max-width: 460px; max-height: 88vh; display: flex; flex-direction: column; transform: translateY(14px); transition: transform .22s; }
.modal-mask.show .modal { transform: translateY(0); }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 18px; border-bottom: 1px solid var(--line-2); }
.modal-head b { font-size: 16px; }
.modal-head button { border: 0; background: none; font-size: 21px; color: var(--text-3); cursor: pointer; line-height: 1; }
.modal-body { padding: 18px; overflow-y: auto; }
.modal-foot { padding: 0 18px 18px; }
.modal-foot .btn { width: 100%; }

/* 筛选组（弹层内） */
.fgroup { margin-bottom: 18px; }
.fgroup > b { display: block; font-size: 13.5px; margin-bottom: 9px; }
.fgroup .fopts { display: flex; flex-wrap: wrap; gap: 8px; }
.fopts label { display: inline-flex; align-items: center; gap: 5px; padding: 7px 14px; border: 1px solid var(--line); border-radius: 17px; font-size: 13px; color: var(--text-2); cursor: pointer; }
.fopts label input { accent-color: var(--red); }
.fopts label.on { border-color: var(--red); background: var(--red-light); color: var(--red); }

/* ---------- Toast ---------- */
.toast {
  position: fixed; left: 50%; top: 42%; transform: translate(-50%, -50%) scale(.94); z-index: 1200;
  background: rgba(0, 0, 0, .82); color: #fff; padding: 12px 22px; border-radius: 8px; font-size: 14px;
  opacity: 0; transition: opacity .22s, transform .22s; pointer-events: none; max-width: 78vw; text-align: center; line-height: 1.6;
}
.toast.show { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.toast.ok { background: rgba(46, 158, 91, .94); }

/* ---------- 对比栏（底部悬浮） ---------- */
.compare-bar {
  position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%) translateY(140%);
  background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 8px 30px rgba(0, 0, 0, .16);
  z-index: 950; display: flex; align-items: center; gap: 14px; padding: 10px 16px; transition: transform .3s;
  max-width: calc(100vw - 24px);
}
.compare-bar.show { transform: translateX(-50%) translateY(0); }
.compare-bar .cb-items { display: flex; gap: 8px; align-items: center; overflow-x: auto; }
.compare-bar .cb-item { display: flex; align-items: center; gap: 6px; font-size: 12.5px; background: var(--line-2); padding: 5px 10px; border-radius: 14px; white-space: nowrap; color: var(--text-2); }
.compare-bar .cb-item button { border: 0; background: none; color: var(--text-3); cursor: pointer; font-size: 14px; line-height: 1; }
.compare-bar .cb-item button:hover { color: var(--red); }
.compare-bar .cb-tip { font-size: 12.5px; color: var(--text-3); }
.compare-bar .cb-act { display: flex; gap: 8px; }

/* ---------- 对比页表格 ---------- */
.cmp-wrap { overflow-x: auto; background: #fff; border-radius: var(--radius); }
.cmp-table { border-collapse: collapse; width: 100%; min-width: 620px; font-size: 13.5px; }
.cmp-table th, .cmp-table td { border: 1px solid var(--line-2); padding: 12px 14px; text-align: left; vertical-align: top; }
.cmp-table thead th { background: #FAFAFA; font-size: 14px; }
.cmp-table tbody th { background: #FCFCFC; width: 118px; color: var(--text-2); font-weight: 700; white-space: nowrap; }
.cmp-table .ct-head { display: flex; flex-direction: column; gap: 6px; }
.cmp-table .ct-head .nm { font-size: 15px; }
.cmp-table .ct-head .btn { align-self: flex-start; }
.cmp-col-del { border: 0; background: none; color: var(--text-3); cursor: pointer; font-size: 13px; }
.cmp-col-del:hover { color: var(--red); }
.cmp-best { color: var(--red); font-weight: 700; }

/* ---------- 个人中心：菜单列表（移动端） ---------- */
.mc-list { background: #fff; border-radius: var(--radius); overflow: hidden; }
.mc-list a { display: flex; align-items: center; gap: 11px; padding: 14px 16px; border-bottom: 1px solid var(--line-2); font-size: 14.5px; color: var(--text); }
.mc-list a:last-child { border-bottom: 0; }
.mc-list a .mi { font-size: 18px; }
.mc-list a .mn { flex: 1; }
.mc-list a .mb { font-size: 12.5px; color: var(--text-3); }
.mc-list a .ar { color: #ccc; }

/* ---------- 响应式：平板与移动 ---------- */
@media (max-width: 1024px) {
  .lay3 { grid-template-columns: 208px minmax(0, 1fr); }
  .lay3 > .lay-right { display: none; }
  .cardgrid { grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)); }
}

@media (max-width: 900px) {
  .detail-layout { grid-template-columns: 1fr; }
  .detail-aside, .lay-aside { position: static; }
  .entry-cards { grid-template-columns: 1fr; }
  .lay3 { grid-template-columns: 1fr; }
  .lay3 > .lay-left { display: none; }
  .tb-filter-btn { display: inline-flex; }
  .anchor-tabs { position: static; }
  .stats-panel { grid-template-columns: repeat(2, 1fr); }
  .stats-panel .sp-item:nth-child(3)::before { display: none; }
}

@media (max-width: 768px) {
  .nav { position: relative; }
  .hero-portal { padding: 20px 14px 16px; border-radius: 0; margin-bottom: 10px; }
  .hero-portal h1 { font-size: 21px; }
  .hero-portal .hp-sub { font-size: 13px; margin-bottom: 14px; }
  .hero-search { border-radius: 20px; }
  .hero-search input { height: 40px; padding: 0 14px; font-size: 14px; }
  .hero-search button { padding: 0 20px; font-size: 14px; }
  .quick-tags { font-size: 12px; gap: 6px; }
  .quick-tags a { padding: 3px 11px; }
  .entry-cards { gap: 10px; margin-bottom: 10px; }
  .entry-card { padding: 13px 14px; gap: 11px; }
  .entry-card .ec-ic { width: 42px; height: 42px; font-size: 20px; border-radius: 11px; }
  .entry-card .ec-txt strong { font-size: 15px; }
  .entry-card .ec-txt span { font-size: 12px; }
  .city-grid { grid-template-columns: repeat(4, 1fr); gap: 6px; }
  .city-grid a { font-size: 12.5px; padding: 7px 2px; }
  .stats-panel { gap: 10px; padding: 14px; }
  .stats-panel .sp-item b { font-size: 20px; }

  .toolbar { top: 42px; padding: 9px 12px; margin-bottom: 10px; border-radius: 0; }
  .toolbar .tb-count { font-size: 12.5px; }
  .toolbar .tb-sorts { display: none; }
  .vt { display: none; }
  .cardgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .cardgrid.list-mode .card { flex-direction: row; align-items: flex-start; }
  .cardgrid.list-mode .card-cover { width: 118px; aspect-ratio: 4/3; }
  /* 窄屏回落为单列信息 + 底部横排按钮 */
  .cardgrid.list-mode .card-body { display: block; padding: 10px 11px; }
  .cardgrid.list-mode .card-facts { margin-bottom: 6px; }
  .cardgrid.list-mode .card-actions {
    flex-direction: row; margin-top: 8px; padding-left: 0; border-left: 0; align-self: auto;
  }
  .cardgrid.list-mode .card-actions .btn { flex: 1; }
  .card-tools button { width: 27px; height: 27px; font-size: 12.5px; }
  .reco-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }

  .sheet-body .fopts label { padding: 8px 14px; }
  .modal { max-width: none; }

  .compare-bar { bottom: 62px; left: 10px; right: 10px; transform: translateY(200%); max-width: none; border-radius: 10px; padding: 9px 12px; gap: 9px; }
  .compare-bar.show { transform: translateY(0); }
  .compare-bar .cb-tip { display: none; }
  .detail-actionbar { display: flex; }
  body.has-actionbar { padding-bottom: 106px; }
  .pager { display: none; }
  .load-more { display: block; }
}

@media (max-width: 480px) {
  .cardgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stats-panel { grid-template-columns: repeat(2, 1fr); }
}

/* =====================================================
   v2.2 首页右栏补充组件 + 弹层初始态修复
   ===================================================== */

/* 弹层修复：PC 端 .modal 在挂载到遮罩之前不参与文档流。
   （否则初始会作为一个普通 flex 块裸露在页面底部，看起来像"页面最下面的在线咨询"）
   交互脚本会把它移入 .modal-mask，此时该选择器不再命中。 */
main > .modal, body > .modal { display: none; }

/* 右栏：美食菜谱图文小列表 */
.rail-recipes li { display: flex; gap: 10px; padding: 9px 0; border-bottom: 1px dashed var(--line-2); }
.rail-recipes li:last-child { border-bottom: 0; padding-bottom: 0; }
.rail-recipes .rr-cover {
  width: 66px; height: 50px; border-radius: 6px; overflow: hidden; flex-shrink: 0;
  background: var(--line-2); display: flex; align-items: center; justify-content: center; font-size: 18px;
}
.rail-recipes .rr-cover img { width: 100%; height: 100%; object-fit: cover; }
.rail-recipes .rr-body { flex: 1; min-width: 0; }
.rail-recipes .rr-body a { display: block; font-size: 13px; line-height: 1.5; margin-bottom: 4px; }
.rail-recipes .rr-meta { font-size: 11.5px; color: var(--text-3); display: flex; gap: 8px; }

/* 右栏：常见问题解答（窄栏紧凑折叠，复用 .faq-item 交互） */
.rail-block .faq-list { gap: 0; }
.rail-block .faq-list .faq-item { border: 0; border-bottom: 1px dashed var(--line-2); border-radius: 0; }
.rail-block .faq-list .faq-item:last-child { border-bottom: 0; }
.rail-block .faq-list .faq-q { font-size: 13px; padding: 10px 28px 10px 26px; line-height: 1.65; }
.rail-block .faq-list .faq-q::before { width: 17px; height: 17px; font-size: 11px; border-radius: 3px; margin-top: 1px; }
.rail-block .faq-list .faq-q::after { right: 8px; font-size: 16px; }
.rail-block .faq-list .faq-a { font-size: 12.5px; line-height: 1.85; }
.rail-block .faq-list .faq-item.open .faq-a { padding: 0 10px 12px 26px; }
.rail-block .faq-list .faq-a .faq-label { font-size: 12px; margin-bottom: 4px; }

/* 左栏：培训课程分类（横向胶囊 + 数量） */
.cat-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 10px; }
.cat-cards a {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 11px 14px; border: 1px solid var(--line); border-radius: 8px; background: #FCFCFC;
  font-size: 13.5px; color: var(--text-2); transition: all .2s;
}
.cat-cards a:hover { border-color: var(--red); color: var(--red); background: var(--red-light); }
.cat-cards a em { font-style: normal; font-size: 11.5px; color: var(--text-3); }
.cat-cards a:hover em { color: var(--red); }

/* =====================================================
   v2.1 首页两栏（门户）与右栏补充组件
   ===================================================== */

/* 首页主体两栏：左内容 ｜ 右推荐（与三栏列表页共用视觉语言） */
.home-cols { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.home-cols > * { min-width: 0; }
.hc-main > .section:last-child { margin-bottom: 0; }
.hc-side > *:last-child { margin-bottom: 0; }
/* 右栏中的广告位：加白底卡片，与其它 rail-block 视觉统一 */
.hc-side .ad-slot { background: #fff; border-radius: var(--radius); padding: 12px; margin: 0 0 16px; }
.hc-side .ad-slot img { box-shadow: none; border-radius: 8px; }

/* 右栏胶囊标签（热门城市 / 热门品类） */
.rail-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.rail-tags a { padding: 5px 11px; border-radius: 14px; background: #F6F6F6; font-size: 12.5px; color: var(--text-2); transition: all .2s; }
.rail-tags a:hover { background: var(--red); color: #fff; }
.rail-tags a.on { background: var(--red); color: #fff; }
/* rail-block 内的次级标题（同块内分两小节） */
.rail-block > h3.rail-sub { margin-top: 16px; }

/* FAQ 全宽两列（首页尾部，宽屏阅读更舒适） */
.faq-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; }

@media (max-width: 1100px) {
  .home-cols { grid-template-columns: minmax(0, 1fr) 288px; }
}
@media (max-width: 900px) {
  .home-cols { grid-template-columns: 1fr; }
  .faq-grid { grid-template-columns: 1fr; }
  .hc-side .ad-slot { padding: 10px; }
}

/* =====================================================
   v2.3 右栏课程分类（紧凑网格）+ 卡片收藏角标微调
   ===================================================== */
.rail-block .cat-cards-sm { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.rail-block .cat-cards-sm a { padding: 9px 11px; font-size: 12.5px; }
.rail-block .cat-cards-sm a em { font-size: 11px; }

/* 后台「列表显示数量」成对编辑表 */
.disp-table { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.disp-head, .disp-row {
  display: grid; grid-template-columns: minmax(200px, 1fr) 130px 130px 104px;
  gap: 12px; align-items: center; padding: 10px 14px;
}
.disp-head { background: #F7F7F7; font-size: 12.5px; font-weight: 700; color: var(--text-2); }
.disp-row { border-top: 1px solid var(--line); }
.disp-row:nth-child(odd) { background: #FCFCFC; }
.disp-row:hover { background: var(--red-light); }
.disp-name { font-size: 13.5px; color: var(--text); line-height: 1.5; }
.disp-name code { display: block; font-size: 11px; color: var(--text-3); }
.disp-inp .input { width: 100%; max-width: 130px; }
.disp-act { text-align: right; }
.disp-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.disp-foot .tip { font-size: 12px; color: var(--text-3); }
@media (max-width: 720px) {
  .disp-head { display: none; }
  .disp-row { grid-template-columns: 1fr 1fr; gap: 8px; padding: 12px; }
  .disp-name { grid-column: 1 / -1; }
  .disp-inp .input { max-width: none; }
  .disp-act { grid-column: 1 / -1; text-align: left; }
}

/* =====================================================
   v2.4 详情页「联系方式」卡片 + 移动端详情页排版精简
   ===================================================== */
.contact-info .ci-badge {
  font-size: 12px; line-height: 1.7; color: var(--text-3);
  background: #F7F7F7; border-radius: 6px; padding: 7px 10px; margin-bottom: 10px;
}
.contact-info .ci-badge.ci-ok { background: #EAF7EF; color: #2E9E5B; }
.contact-info .contact-rows { margin-bottom: 4px; }
.contact-info .cc-row { align-items: flex-start; }
.contact-info .cc-row > span { flex: 0 0 44px; color: var(--text-3); font-size: 12.5px; padding-top: 2px; }
.contact-info .cc-row > b { word-break: break-all; font-weight: 600; }
.contact-info .cc-tel a { color: var(--red); text-decoration: none; }
.contact-info .cc-addr { font-weight: 400; color: var(--text-2); line-height: 1.7; }
.contact-info .ci-claim {
  display: block; margin-top: 10px; font-size: 12px; color: var(--text-3);
  line-height: 1.7; text-decoration: none;
}
.contact-info .ci-claim:hover { color: var(--red); }

@media (max-width: 900px) {
  /* 详情页正文更紧凑，减少手机端「长而散」的观感 */
  .detail-layout .section { padding: 14px 13px; }
  .detail-layout .section > .section-head { margin: -2px 0 10px; }
  .detail-layout .section > .section-head h2 { font-size: 15.5px; }
  .article-body { font-size: 14px; line-height: 1.85; }
  .article-body p { margin-bottom: 10px; }
  .article-body h3 { font-size: 14.5px; margin: 14px 0 8px; }
  .detail-head .dh-intro { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-bottom: 8px; }
  .detail-head .dh-meta { font-size: 12px; gap: 6px 14px; }
  .anchor-tabs { top: 44px; }
  .anchor-tabs a { padding: 11px 13px; font-size: 13px; }
  /* 移动端侧栏各块之间留白收窄 */
  .detail-aside .side-block { margin-bottom: 12px; }
  .detail-aside .side-block > h3 { margin-bottom: 8px; }
  /* 首个侧栏块（联系方式）紧随正文，移动端顶部对齐更清爽 */
  .contact-info .cc-tel { font-size: 19px; }
}

/* =====================================================
   v2.5 邀请好友卡片 + 后台导航折叠 + 管理员账号页
   ===================================================== */
/* ---------- 用户中心 · 邀请好友 ---------- */
.invite-card .invite-tip { font-size: 13px; color: var(--text-2); line-height: 1.9; margin-bottom: 14px; }
.invite-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 12px; }
.invite-field > label { display: block; font-size: 12.5px; color: var(--text-3); margin-bottom: 6px; }
.invite-input { display: flex; gap: 8px; }
.invite-input .input { flex: 1 1 auto; min-width: 0; }
.invite-input .btn { flex: 0 0 auto; white-space: nowrap; }
.invite-input #inviteCode { letter-spacing: 2px; font-weight: 700; color: var(--red); }
.invite-share { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; font-size: 12.5px; color: var(--text-3); }
@media (max-width: 720px) {
  .invite-fields { grid-template-columns: 1fr; }
  .invite-input { flex-wrap: wrap; }
  .invite-input .input { flex: 1 1 100%; }
}

/* ---------- 积分页 · 邀请条 ---------- */
.invite-strip {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin-top: 12px; padding: 12px 14px; border-radius: 10px;
  background: linear-gradient(90deg, #FFF6F4, #FFF9F2); border: 1px solid #FBE3E0;
}
.invite-strip .is-l { display: flex; align-items: center; gap: 10px; }
.invite-strip .is-lbl { font-size: 12.5px; color: var(--text-3); }
.invite-strip .is-code { font-size: 16px; letter-spacing: 2px; color: var(--red); }
.invite-strip .is-r { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 720px) { .invite-strip .is-r { margin-left: 0; } }

/* ---------- 后台侧边栏 · 可折叠导航分组 ---------- */
.admin-nav details.nav-fold { border: 0; margin: 0; }
.admin-nav details.nav-fold > summary {
  list-style: none; cursor: pointer; user-select: none;
  display: flex; align-items: center; gap: 6px;
  padding: 11px 18px 7px; font-size: 11px; color: #666D78; letter-spacing: 1px;
}
.admin-nav details.nav-fold > summary::-webkit-details-marker { display: none; }
.admin-nav details.nav-fold > summary:hover { color: #C6CDD6; }
.admin-nav details.nav-fold > summary::after {
  content: '\25BE'; margin-left: auto; font-size: 10px; transition: transform .18s;
}
.admin-nav details.nav-fold:not([open]) > summary::after { transform: rotate(-90deg); }
.admin-nav details.nav-fold > summary .ng-count {
  margin-left: 4px; font-size: 10px; color: #565C66; letter-spacing: 0;
}
.admin-nav .nav-fold-body { padding-bottom: 4px; }
.admin-nav .nav-fold-body a { padding-left: 22px; }
.admin-nav .as-tools { padding: 6px 18px 10px; border-top: 1px solid #31363F; }
.admin-nav .as-tools button { background: none; border: 0; color: #666D78; font-size: 11.5px; cursor: pointer; padding: 0; }
.admin-nav .as-tools button:hover { color: #fff; }
.admin-side .as-me {
  padding: 11px 18px; border-top: 1px solid #31363F; border-bottom: 1px solid #31363F;
  font-size: 12px; color: #8A919C; line-height: 1.7;
}
.admin-side .as-me b { color: #fff; font-weight: 600; }
.admin-side .as-me .as-role {
  display: inline-block; margin-top: 5px; padding: 1px 8px; border-radius: 9px;
  font-size: 11px; background: #3A4049; color: #C6CDD6;
}
.admin-side .as-me .as-role.r-admin { background: #4A2B2A; color: #F0A9A4; }
.admin-side .as-me .as-role.r-city_admin { background: #2C3E4A; color: #9DCBE8; }
.admin-side .as-me .as-role.r-editor { background: #3C3A28; color: #E3D79B; }

/* ---------- 后台 · 权限勾选矩阵 ---------- */
.perm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(258px, 1fr)); gap: 12px; }
.perm-group { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: #fff; }
.perm-group-head {
  background: #F7F7F7; padding: 9px 12px; font-size: 13px; font-weight: 700;
  border-bottom: 1px solid var(--line); display: flex; align-items: center; gap: 8px;
}
.perm-group-head label { display: flex; align-items: center; gap: 7px; cursor: pointer; }
.perm-group-head .pg-n { margin-left: auto; font-weight: 400; font-size: 11.5px; color: var(--text-3); }
.perm-items { padding: 9px 12px; display: flex; flex-direction: column; gap: 7px; }
.perm-items label { display: flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; color: var(--text-2); }
.perm-items label:hover { color: var(--red); }
.perm-items input { flex: 0 0 auto; }
.preset-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.preset-row .tip { font-size: 12px; color: var(--text-3); }
@media (max-width: 720px) { .perm-grid { grid-template-columns: 1fr; } }

/* =====================================================
   v2.6 移动端头部重构（两行式 + 汉堡抽屉）+ IP 定位提示条
   + 按钮防换行 / 文字显示完整
   ===================================================== */

/* ---------- IP 定位提示条（PC + 移动端通用） ---------- */
.ip-suggest {
  display: flex; align-items: center; gap: 8px;
  background: #FFF8EE; border-bottom: 1px solid #F5E3C8;
  padding: 8px 14px; font-size: 13px; color: #8A6320; line-height: 1.5;
}
.ip-suggest .ips-ic { flex: 0 0 auto; }
.ip-suggest .ips-txt { flex: 1 1 auto; min-width: 0; }
.ip-suggest .ips-txt b { color: #C2560A; }
.ip-suggest .ips-act { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.ip-suggest .ips-go {
  background: var(--orange); color: #fff; text-decoration: none;
  font-size: 12.5px; padding: 4px 12px; border-radius: 13px; white-space: nowrap;
}
.ip-suggest .ips-go:hover { background: #E64A00; }
.ip-suggest .ips-x {
  border: 0; background: none; color: #B49A6E; font-size: 18px; line-height: 1;
  cursor: pointer; padding: 2px 4px;
}
.ip-suggest .ips-x:hover { color: #8A6320; }

/* ---------- 汉堡按钮 + 抽屉（PC 端整体隐藏） ---------- */
.m-burger { display: none; }
.m-drawer, .m-drawer-mask { display: none; }

/* ---------- 按钮防换行（手机窄屏「查看详情 / 立即咨询」不再折行） ---------- */
.btn { white-space: nowrap; }
.card-actions { flex-wrap: nowrap; }
.card-actions .btn { flex: 1 1 0; min-width: 0; padding-left: 6px; padding-right: 6px; }
.dh-actions .btn { white-space: nowrap; }

/* ---------- 移动端：两行式头部 + 抽屉导航 ---------- */
@media (max-width: 768px) {
  /* 顶栏两行：第 1 行 LOGO + 城市 + 汉堡；第 2 行搜索框独占整行 */
  .header .wrap {
    display: grid;
    grid-template-columns: auto auto 1fr auto;
    grid-template-areas:
      "logo city . burger"
      "search search search search";
    grid-template-rows: 44px auto;
    align-items: center; column-gap: 8px;
    height: auto; padding: 0 10px;
  }
  .logo { grid-area: logo; }
  .city-switch { grid-area: city; }
  .m-burger { grid-area: burger; }
  .search-box { grid-area: search; margin: 2px 0 9px; }
  /* 搜索框完整显示：输入区可收缩，「搜索」按钮永不溢出 */
  .search-box input { min-width: 0; width: 100%; }
  .search-box button { flex: 0 0 auto; }

  /* 汉堡按钮：三条红线用外边距分隔（不依赖 flex gap，兼容老内核浏览器） */
  .m-burger {
    display: flex; flex-direction: column; justify-content: center;
    width: 34px; min-width: 34px; height: 34px; padding: 0 7px;
    border: 0; background: none; cursor: pointer; border-radius: 8px;
    line-height: 0; font-size: 0;
  }
  .m-burger i { display: block; height: 2px; border-radius: 2px; background: var(--red); }
  .m-burger i + i { margin-top: 4px; }
  .m-burger:active { background: #FFF1EF; }

  /* 主导航横条收进抽屉：不再左右滚动 */
  .nav { display: none; }

  /* 抽屉 */
  .m-drawer-mask {
    display: block; position: fixed; inset: 0; z-index: 1200;
    background: rgba(0, 0, 0, .45); opacity: 0; visibility: hidden;
    transition: opacity .2s ease, visibility .2s ease;
  }
  .m-drawer-mask.open { opacity: 1; visibility: visible; }
  .m-drawer {
    display: flex; flex-direction: column;
    position: fixed; top: 0; right: 0; bottom: 0; z-index: 1201;
    width: 80%; max-width: 320px; background: #fff;
    box-shadow: -4px 0 18px rgba(0, 0, 0, .18);
    transform: translateX(105%); visibility: hidden;
    transition: transform .24s ease, visibility .24s ease;
  }
  .m-drawer.open { transform: none; visibility: visible; }
  body.drawer-open { overflow: hidden; }

  .m-drawer .md-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 14px; background: var(--red); color: #fff;
    padding-top: calc(12px + env(safe-area-inset-top));
  }
  .m-drawer .md-title { font-size: 15px; font-weight: 700; letter-spacing: 1px; }
  .m-drawer .md-close {
    border: 0; background: none; color: #fff; font-size: 24px; line-height: 1;
    cursor: pointer; padding: 0 4px;
  }
  .m-drawer .md-nav { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 4px 0; }
  .m-drawer .md-nav a {
    display: flex; align-items: center; justify-content: space-between;
    padding: 13px 16px; font-size: 14.5px; color: var(--text-2);
    border-bottom: 1px solid #F6F6F6; text-decoration: none;
  }
  .m-drawer .md-nav a:active { background: #FAFAFA; }
  .m-drawer .md-nav a.on { color: var(--red); font-weight: 700; background: #FFF8F7; }
  .m-drawer .md-nav .md-arrow { font-style: normal; color: #C9C9C9; font-size: 16px; }
  .m-drawer .md-city { padding: 10px 14px; border-top: 1px solid var(--line); }
  .m-drawer .md-city a {
    display: block; text-align: center; padding: 10px 8px;
    border: 1px dashed #E8B2AC; color: var(--red); border-radius: 8px;
    font-size: 13.5px; text-decoration: none;
  }
  .m-drawer .md-tools {
    display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
    padding: 10px 14px calc(12px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
  }
  .m-drawer .md-btn {
    display: block; text-align: center; padding: 9px 4px;
    border: 1px solid var(--line); border-radius: 8px;
    font-size: 13px; color: var(--text-2); text-decoration: none; white-space: nowrap;
  }
  .m-drawer .md-btn:active { background: #FAFAFA; }
  .m-drawer .md-btn-primary { background: var(--red); border-color: var(--red); color: #fff; }

  /* 吸顶高度随两行头部变化：锚点标签下移，避免被头部遮住 */
  .anchor-tabs { top: 92px; }

  /* 按钮在窄屏不再折行：字号微缩 + 单行省略 */
  .btn { font-size: 12.5px; }
  .card-actions .btn { font-size: 12px; padding: 5px 8px; }
  .dh-actions .btn { font-size: 12.5px; padding: 7px 10px; }
  .hero-stats { gap: 12px; }

  /* 文本完整显示：换行保护（不截断丢字）
     注意 .info-table td 不可用 anywhere（会压窄表格列宽），已单独用 break-word */
  .card-title a, .li-title { overflow-wrap: anywhere; }
  .list-item .li-side { gap: 8px; }
  .list-item .li-side .btn { flex: 0 0 auto; }
}

@media (max-width: 380px) {
  .header .wrap { grid-template-rows: 42px auto; padding: 0 8px; }
  .ip-suggest { font-size: 12px; padding: 7px 10px; flex-wrap: wrap; }
  .ip-suggest .ips-act { margin-left: 22px; }
}

/* 底部导航扩展为 6 项（首页/学校/课程/加盟/城市/我的）：等分且文字不换行 */
@media (max-width: 768px) {
  .m-tabbar li { flex: 1 1 0; min-width: 0; }
  .m-tabbar a { font-size: 10.5px; gap: 1px; padding: 0 1px; white-space: nowrap; }
  .m-tabbar .ic { font-size: 18px; }
}
@media (max-width: 380px) {
  .m-tabbar a { font-size: 10px; }
  .m-tabbar .ic { font-size: 17px; }
}

/* =====================================================
   v2.9 列表页左侧 · 全部分类手风琴（加盟 / 培训项目）
   ===================================================== */
.cat-nav { background: #fff; border-radius: var(--radius); padding: 16px; margin-bottom: 16px; }
.cat-nav .cn-head {
  font-size: 15px; font-weight: 700; line-height: 1.4;
  padding-bottom: 10px; border-bottom: 2px solid var(--line-2); margin-bottom: 2px;
  display: flex; flex-direction: column; gap: 2px;
}
.cat-nav .cn-head .cn-sub { font-size: 12px; font-weight: 400; color: var(--text-3); }
.cn-item { border-bottom: 1px dashed var(--line-2); }
.cn-item:last-child { border-bottom: 0; }
.cn-item summary {
  display: flex; align-items: center; gap: 8px; padding: 10px 2px;
  cursor: pointer; list-style: none; user-select: none;
}
.cn-item summary::-webkit-details-marker { display: none; }
.cn-item .cn-ic { flex: 0 0 auto; font-size: 15px; line-height: 1; }
.cn-item .cn-name { flex: 1 1 auto; min-width: 0; font-size: 13px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: color .2s; }
.cn-item summary:hover .cn-name { color: var(--red); }
.cn-item .cn-cnt { flex: 0 0 auto; font-style: normal; font-size: 11px; color: var(--text-3); }
.cn-item .cn-arrow {
  flex: 0 0 auto; width: 6px; height: 6px; margin-right: 3px;
  border-right: 1.5px solid var(--text-3); border-bottom: 1.5px solid var(--text-3);
  transform: rotate(-45deg); transition: transform .2s;
}
.cn-item[open] .cn-arrow { transform: rotate(45deg); }
.cn-item.on summary .cn-name { color: var(--red); font-weight: 700; }
.cn-item.on summary .cn-cnt { color: var(--red); }
.cn-subs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 8px; padding: 2px 2px 12px; }
.cn-subs a {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  min-width: 0; font-size: 12px; padding: 6px 9px; border-radius: 7px;
  background: #F6F7F9; color: var(--text-2); transition: all .2s;
}
.cn-subs a .sn { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cn-subs a em { font-style: normal; font-size: 10.5px; color: var(--text-3); flex: 0 0 auto; }
.cn-subs a:hover { background: var(--red); color: #fff; }
.cn-subs a:hover em { color: rgba(255, 255, 255, .85); }
.cn-subs a.on { background: var(--red); color: #fff; }
.cn-subs a.on em { color: rgba(255, 255, 255, .85); }

/* 移动端：左侧栏只保留全部分类，排到列表下方（与原底部版块位置一致） */
@media (max-width: 768px) {
  .lay3 > .lay-left { display: block; order: 2; }
  .lay3 > .lay-center { order: 1; }
  .lay3 > .lay-left > .side-filter { display: none; }
}

/* =====================================================
   v3.0 移动端优化：列表「加载更多」 / 学校详情按钮两行 /
        机构基本信息紧凑表 / 学员评价（四维评分）
   ===================================================== */

/* ---------- 1) 详情页操作按钮：行容器（桌面端透明，按钮沿用纵栏） ---------- */
.dh-actions .dh-row { display: contents; }

@media (max-width: 768px) {
  /* 手机端：第一行 2 个（咨询），第二行 3 个（收藏/认领/纠错） */
  .detail-head .dh-actions { flex-direction: column; gap: 8px; width: 100%; }
  .dh-actions .dh-row { display: flex; gap: 8px; width: 100%; }
  .dh-actions .dh-row .btn {
    flex: 1 1 0; min-width: 0; padding: 0 6px; font-size: 13px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .dh-actions .dh-row-3 .btn { font-size: 12.5px; }

  /* ---------- 2) 机构基本信息紧凑表：规则统一放在上方 768px 主块（原堆叠布局处） ---------- */
}

@media (max-width: 380px) {
  /* 小屏手机（iPhone SE / 320~380）：整体缩号，值列仍可换行 */
  .info-table th { width: 1%; padding: 6px 5px; font-size: 11.5px; }
  .info-table td { padding: 6px 6px; font-size: 12px; }
}

@media (max-width: 366px) {
  /* ≤366px（320/360 等小屏）：4 列并排物理放不下（值列被压到 40px、
     「1~3个月」「招生老师」都断行）→ 改为每行一组「标签+值」网格，
     值列独占整行宽度，长内容自然分行显示 */
  .info-table { display: block; border: 1px solid var(--line-2); }
  .info-table tbody { display: block; }
  .info-table tr {
    display: grid; grid-template-columns: 64px 1fr;
    padding: 0; border-bottom: 0;
  }
  .info-table th {
    display: flex; align-items: center;
    width: auto; padding: 8px 6px;
    border: 0; border-right: 1px solid var(--line-2);
    border-bottom: 1px solid var(--line-2);
    white-space: nowrap;
  }
  .info-table td {
    display: block; padding: 8px 9px;
    border: 0; border-bottom: 1px solid var(--line-2);
  }
  /* 组内第二行的标签/值底边即行分隔线；最后一行由最后的底边收口 */
}

@media (max-width: 340px) {
  /* 极窄屏：进一步压缩表头与值列内边距，避免任何横向溢出 */
  .info-table th { padding: 6px 4px; font-size: 11px; }
  .info-table td { padding: 6px 6px; font-size: 11.5px; line-height: 1.45; }
}

/* ---------- 3) 学员评价：汇总评分 + 评价卡 ---------- */
.rv-sum {
  display: flex; gap: 18px; align-items: center; flex-wrap: wrap;
  background: linear-gradient(90deg, #FFF7F6, #fff);
  border: 1px solid #F6DCD9; border-radius: 10px; padding: 14px 16px; margin-bottom: 16px;
}
.rv-sum .rv-score { display: flex; flex-direction: column; align-items: center; min-width: 92px; }
.rv-sum .rv-score b { font-size: 30px; color: var(--red); line-height: 1.1; font-weight: 800; }
.rv-sum .rv-score .rv-stars { color: #FFB400; font-size: 12px; letter-spacing: 1px; margin: 2px 0; }
.rv-sum .rv-score em { font-style: normal; font-size: 11.5px; color: var(--text-3); }
.rv-dims { flex: 1 1 240px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 18px; }
.rv-dim { display: flex; align-items: center; gap: 8px; font-size: 12.5px; }
.rv-dim .k { color: var(--text-2); flex: 0 0 auto; }
.rv-dim .bar { flex: 1 1 auto; height: 6px; background: #F1E7E5; border-radius: 4px; overflow: hidden; }
.rv-dim .bar i { display: block; height: 100%; background: linear-gradient(90deg, #FFB400, var(--red)); border-radius: 4px; }
.rv-dim .v { color: var(--red); font-weight: 700; flex: 0 0 auto; min-width: 26px; text-align: right; }

.rv-item { padding: 14px 0; border-bottom: 1px dashed var(--line-2); }
.rv-item:last-child { border-bottom: 0; }
.rv-head { display: flex; align-items: center; gap: 9px; margin-bottom: 7px; }
.rv-avatar {
  flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%;
  background: linear-gradient(135deg, #FF7A6E, var(--red)); color: #fff;
  display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 700;
}
.rv-who { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.rv-who b { font-size: 13.5px; }
.rv-who em { font-style: normal; font-size: 11.5px; color: var(--text-3); }
.rv-total { margin-left: auto; color: var(--red); font-weight: 800; font-size: 15px; white-space: nowrap; }
.rv-total::after { content: '分'; font-size: 11px; font-weight: 400; color: var(--text-3); margin-left: 1px; }
.rv-title { font-size: 14.5px; font-weight: 700; margin-bottom: 5px; }
.rv-text { font-size: 13.5px; color: var(--text-2); line-height: 1.9; }
.rv-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.rv-tag {
  display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; color: var(--text-2);
  background: #FBF3F2; border: 1px solid #F3DEDA; border-radius: 4px; padding: 2px 7px;
}
.rv-tag b { color: var(--red); }
.rv-foot { font-size: 12px; color: var(--text-3); margin-top: 8px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

@media (max-width: 768px) {
  .rv-sum { gap: 10px; padding: 12px; }
  .rv-sum .rv-score b { font-size: 26px; }
  .rv-dims { grid-template-columns: minmax(0, 1fr); gap: 6px; flex: 1 1 100%; }
  .rv-item { padding: 12px 0; }
  .rv-title { font-size: 14px; }
  .rv-text { font-size: 13px; line-height: 1.85; }
  .rv-tag { font-size: 11px; padding: 2px 6px; }
}