/* ============================================================
 * 七彩云南 · 云南省劳务品牌数字地图
 * 美学方向：七彩夜幕 —— 苍山靛夜为底，鎏金为主，七彩仅作点缀
 * 纪律：背景/文字/按钮以靛夜+鎏金为主；红橙黄绿青蓝紫七色
 *       只出现在环境极光、花粉、州市色、层级印章四个受控表面
 * ============================================================ */

:root {
  /* 基底：靛蓝夜幕（整体提亮版） */
  --night: #11203a;
  --ink: #16273f;
  --pine: #1c3a4e;
  --jade-0: #1a3247;
  --jade: #2b6288;
  --jade-2: #4398c9;
  --teal: #48b3ad;
  /* 主色：鎏金（全站交互与文字强调的统一锚点） */
  --gold: #e3bd68;
  --gold-2: #f3d996;
  --gold-deep: #b98a3c;
  --cream: #f8f1e2;
  --cloud: #fdf8ec;
  --cinnabar: #e06a60;
  --mist: rgba(248, 241, 226, .82);
  --line: rgba(227, 189, 104, .42);
  /* 面板/遮罩透明度（提亮用，页面统一引用） */
  --panel-bg: rgba(31, 54, 84, .5);
  --panel-bg-strong: rgba(28, 49, 78, .62);

  /* 七彩云南调色板（点缀色，勿用于大面积极色） */
  --yun-red: #d7574e;      /* 红土地 · 朱砂 */
  --yun-orange: #e8883e;   /* 夕阳 · 火把 */
  --yun-yellow: #e6c24c;   /* 油菜花 · 银杏 */
  --yun-green: #3fa46e;    /* 雨林 · 茶山 */
  --yun-teal: #2fa6a0;     /* 洱海水色 */
  --yun-indigo: #5b83d6;   /* 扎染靛蓝 */
  --yun-violet: #9a74d6;   /* 薰衣草 · 香格里拉晚霞 */

  --f-brush: 'Ma Shan Zheng', 'STXingkai', 'STKaiti', 'KaiTi', cursive;
  --f-display: 'ZCOOL XiaoWei', 'STKaiti', 'KaiTi', serif;
  --f-serif: 'Noto Serif SC', 'STSong', serif;
  --f-body: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;

  /* 正文排版规范（成段正文统一字号/行高） */
  --fs-p: clamp(14px, 1.5vmin, 16px);
  --fs-p-mobile: 13px;
  --lh-p: 2;

  --ease-out: cubic-bezier(.19, 1, .22, 1);
  --ease-soft: cubic-bezier(.4, 0, .2, 1);
  --z-dock: 90;
  --z-chat: 95;
  --z-overlay: 60;
  --z-splash: 100;
}

* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

html, body {
  height: 100%;
  overflow: hidden;
  background: var(--night);
  color: var(--cream);
  font-family: var(--f-body);
  font-weight: 300;
  letter-spacing: .04em;
}
body {
  /* 七彩极光：靛蓝（上）、洱青（左下）、晚霞紫（右下）、鎏金（中），均压得很暗 */
  background:
    /* 七彩极光：靛蓝（上）、洱青（左下）、晚霞紫（右下）、鎏金（中） */
    radial-gradient(1100px 760px at 82% -12%, rgba(107, 150, 232, .30), transparent 60%),
    radial-gradient(1000px 820px at 4% 106%, rgba(66, 184, 178, .26), transparent 62%),
    radial-gradient(820px 620px at 96% 96%, rgba(168, 130, 228, .18), transparent 64%),
    radial-gradient(720px 520px at 28% 34%, rgba(227, 189, 104, .12), transparent 70%),
    linear-gradient(165deg, #1b3355 0%, #13223f 55%, #101a33 100%);
}
button { font-family: inherit; color: inherit; background: none; border: none; cursor: pointer; }
img { display: block; width: 100%; height: 100%; object-fit: cover; }
::selection { background: rgba(217, 176, 95, .35); }

/* 细滚动条（滚动时才显色） */
.scroll-thin::-webkit-scrollbar { width: 4px; height: 4px; }
.scroll-thin::-webkit-scrollbar-thumb { background: transparent; border-radius: 4px; }
.scroll-thin.is-scrolling::-webkit-scrollbar-thumb { background: rgba(217, 176, 95, .4); }

/* ---------- 全局氛围 ---------- */
#fx { position: fixed; inset: 0; z-index: 1; pointer-events: none; }
.grain {
  position: fixed; inset: -50%; z-index: 80; pointer-events: none; opacity: .05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation: grain 7s steps(8) infinite;
}
@keyframes grain {
  0%,100% { transform: translate(0,0); } 25% { transform: translate(-2%,3%); }
  50% { transform: translate(3%,-2%); } 75% { transform: translate(-3%,-3%); }
}

/* ============================================================
 * 开屏
 * ============================================================ */
.splash {
  position: fixed; inset: 0; z-index: var(--z-splash);
  display: flex; align-items: center; justify-content: center;
  background:
    radial-gradient(900px 700px at 50% 42%, rgba(107, 150, 232, .34), transparent 64%),
    radial-gradient(700px 560px at 82% 12%, rgba(168, 130, 228, .16), transparent 70%),
    linear-gradient(180deg, #1c3659 0%, #13223f 100%);
  transition: opacity .9s var(--ease-out), visibility .9s;
}
.splash.leaving { opacity: 0; visibility: hidden; }
.splash.leaving .splash-svg { transform: scale(1.35) translateY(-8%); opacity: 0; }
.splash.leaving .splash-text { transform: translateY(-40px); opacity: 0; }

.splash-orbits span {
  position: absolute; border: 1px solid var(--line); border-radius: 50%;
  left: 50%; top: 50%; transform: translate(-50%, -50%);
  animation: orbitSpin 26s linear infinite;
}
.splash-orbits span:nth-child(1) { width: 56vmin; height: 56vmin; border-style: dashed; border-color: rgba(220, 180, 94, .45); opacity: .5; }
.splash-orbits span:nth-child(2) { width: 74vmin; height: 74vmin; border-color: rgba(91, 131, 214, .35); opacity: .3; animation-duration: 40s; animation-direction: reverse; }
.splash-orbits span:nth-child(3) { width: 92vmin; height: 92vmin; border-color: rgba(154, 116, 214, .28); opacity: .18; animation-duration: 60s; }
@keyframes orbitSpin { to { transform: translate(-50%,-50%) rotate(360deg); } }

.splash-svg {
  position: absolute; width: min(74vmin, 620px); height: auto;
  transition: transform 1.1s var(--ease-out), opacity 1.1s var(--ease-out);
}
.splash-outline {
  fill: rgba(47, 134, 184, .16);
  stroke: var(--gold-2);
  stroke-width: 2.2;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 10px rgba(233, 196, 106, .55));
}
.splash-dot { fill: var(--gold-2); opacity: 0; }
.splash-dot.pop { animation: dotPop .5s var(--ease-out) forwards; }
@keyframes dotPop {
  0% { opacity: 0; transform: scale(0); }
  70% { opacity: 1; transform: scale(1.8); }
  100% { opacity: .9; transform: scale(1); }
}
.splash-text {
  position: relative; z-index: 2; text-align: center;
  margin-top: 46vmin;
  transition: transform .9s var(--ease-out), opacity .9s;
}
.splash-eyebrow {
  font-size: 13px; letter-spacing: .9em; color: var(--gold); opacity: 0;
  text-indent: .9em;
}
.splash-eyebrow span { display: inline-block; width: 34px; height: 1px; background: var(--line); vertical-align: middle; margin: 0 14px; }
.splash-title {
  font-family: var(--f-brush);
  font-size: clamp(52px, 9vmin, 104px);
  font-weight: 400;
  color: var(--cream);
  margin: 14px 0 6px;
  text-shadow: 0 0 40px rgba(233, 196, 106, .35);
  opacity: 0; letter-spacing: .12em;
}
.splash-sub { font-size: clamp(13px, 1.8vmin, 17px); letter-spacing: .55em; text-indent: .55em; color: var(--mist); opacity: 0; }
.splash.phase-text .splash-eyebrow { animation: riseIn .9s var(--ease-out) .1s forwards; }
.splash.phase-text .splash-title { animation: riseIn 1s var(--ease-out) .28s forwards; }
.splash.phase-text .splash-sub { animation: riseIn .9s var(--ease-out) .5s forwards; }
@keyframes riseIn { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }

.splash-enter {
  margin-top: 34px; display: inline-flex; align-items: center; gap: 10px;
  padding: 13px 30px; border: 1px solid var(--gold); border-radius: 999px;
  color: var(--gold-2); letter-spacing: .35em; text-indent: .35em; font-size: 15px;
  opacity: 0; transform: translateY(16px);
  background: rgba(217, 176, 95, .08);
  transition: background .3s, box-shadow .3s;
}
.splash.phase-text .splash-enter { animation: riseIn .8s var(--ease-out) .72s forwards; }
.splash-enter:hover { background: rgba(217, 176, 95, .2); box-shadow: 0 0 30px rgba(217, 176, 95, .25); }
.splash-enter svg { animation: arrowSlide 1.6s var(--ease-soft) infinite; }
@keyframes arrowSlide { 0%,100% { transform: translateX(-3px); } 50% { transform: translateX(4px); } }

.splash-skip {
  position: absolute; right: 26px; bottom: 22px; z-index: 3;
  font-size: 13px; color: var(--mist); letter-spacing: .2em; opacity: .6;
  transition: opacity .3s;
}
.splash-skip:hover { opacity: 1; color: var(--gold); }

/* ============================================================
 * 主轨道
 * ============================================================ */
.track {
  position: fixed; inset: 0; z-index: 2;
  display: flex; flex-direction: row;
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.track::-webkit-scrollbar { display: none; }
.page {
  position: relative;
  flex: 0 0 100vw; width: 100vw; height: 100dvh;
  scroll-snap-align: start; overflow: hidden;
}

/* ---------- 揭示动画（按页激活） ---------- */
.reveal, .it-line, .stat, .city-list, .map-frame, .map-head {
  opacity: 0; transform: translateY(28px);
}
.page.is-active .reveal,
.page.is-active .map-head,
.page.is-active .map-frame,
.page.is-active .city-list { animation: riseIn .95s var(--ease-out) var(--d, 0s) forwards; }
.page.is-active .it-line { animation: riseIn 1s var(--ease-out) var(--d, 0s) forwards; }
.page.is-active .stat { animation: riseIn .9s var(--ease-out) var(--d, 0s) forwards; }

/* ============================================================
 * 第一页 · 序章
 * ============================================================ */
.page-intro { padding: clamp(24px, 4vmin, 48px); display: flex; flex-direction: column; }

.sky-layer { position: absolute; inset: 0; pointer-events: none; }
.sky-1 {
  background: radial-gradient(420px 420px at 72% 26%, rgba(233, 196, 106, .14), transparent 70%);
  animation: breathe 9s ease-in-out infinite;
}
.sky-2 {
  background: radial-gradient(520px 360px at 18% 70%, rgba(47, 134, 184, .18), transparent 72%);
  animation: breathe 12s ease-in-out infinite reverse;
}
@keyframes breathe { 0%,100% { opacity: .7; } 50% { opacity: 1; } }

.intro-top {
  position: relative; z-index: 2;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.brand-mark { display: flex; align-items: center; gap: 12px; color: var(--gold-2); }
.brand-logo {
  width: auto; height: 40px; object-fit: contain; flex: none;
  filter: drop-shadow(0 2px 8px rgba(227, 189, 104, .28));
  transition: filter .3s, transform .4s var(--ease-out);
}
.brand-mark:hover .brand-logo { transform: scale(1.05); filter: drop-shadow(0 3px 12px rgba(243, 217, 150, .45)); }
.brand-mark span { font-family: var(--f-display); font-size: 18px; letter-spacing: .16em; display: flex; flex-direction: column; white-space: nowrap; }
.brand-mark small { font-family: var(--f-body); font-size: 9px; letter-spacing: .3em; color: var(--mist); margin-top: 2px; }
.intro-top-note { font-size: 11px; letter-spacing: .5em; color: var(--mist); }
@media (min-width: 769px) { .intro-top-note { margin-right: 58px; } }

/* 背景音乐控制按钮（右上角） */
.music-btn {
  position: fixed; top: 42px; right: 22px; z-index: 80;
  width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(20, 40, 70, .5);
  border: 1px solid var(--line);
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 18px rgba(4, 10, 26, .35);
  transition: background .3s, border-color .3s, transform .3s var(--ease-out), opacity .4s;
  opacity: .85;
}
.music-btn:hover { background: rgba(40, 66, 100, .62); border-color: rgba(243, 217, 150, .6); transform: scale(1.08); opacity: 1; }
.music-btn img {
  width: 22px; height: 22px; object-fit: contain;
  filter: drop-shadow(0 0 5px rgba(243, 217, 150, .35));
  animation: musicSpin 6s linear infinite;
  animation-play-state: paused;
}
.music-btn.playing { opacity: 1; border-color: rgba(243, 217, 150, .7); }
.music-btn.playing img { animation-play-state: running; }
.music-ring {
  position: absolute; inset: -5px; border-radius: 50%;
  border: 1px dashed rgba(243, 217, 150, 0);
  transition: border-color .3s;
  pointer-events: none;
}
.music-btn.playing .music-ring {
  border-color: rgba(243, 217, 150, .45);
  animation: musicSpin 14s linear infinite reverse;
}
@keyframes musicSpin { to { transform: rotate(360deg); } }

/* ---- 分享海报按钮 ---- */
.share-btn {
  position: fixed; top: 96px; right: 22px; z-index: 80;
  width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(20, 40, 70, .5);
  border: 1px solid var(--line);
  backdrop-filter: blur(8px);
  color: #f3d996;
  box-shadow: 0 4px 18px rgba(4, 10, 26, .35);
  transition: background .3s, border-color .3s, transform .3s var(--ease-out), opacity .4s;
  opacity: .85; cursor: pointer;
}
.share-btn:hover { background: rgba(40, 66, 100, .62); border-color: rgba(243, 217, 150, .6); transform: scale(1.08); opacity: 1; }
.share-btn svg { filter: drop-shadow(0 0 5px rgba(243, 217, 150, .35)); }
.share-btn[hidden] { display: none; }

/* ---- 分享海报弹窗 ---- */
.share-modal {
  position: fixed; inset: 0; z-index: 999;
  display: none;
  align-items: center; justify-content: center;
}
.share-modal.is-open { display: flex; }
.share-modal-mask {
  position: absolute; inset: 0;
  background: rgba(0, 0, 0, .72);
  backdrop-filter: blur(4px);
}
.share-modal-body {
  position: relative; z-index: 1;
  width: min(86vw, 380px); max-height: 92vh;
  display: flex; flex-direction: column;
}
.share-modal-inner {
  background: linear-gradient(160deg, #1a1a2e, #2d1f3d);
  border: 1px solid rgba(212, 168, 75, .4);
  border-radius: 14px;
  padding: 18px 18px 16px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
  text-align: center;
}
.share-poster-img {
  display: block; width: 100%; height: auto;
  border-radius: 8px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, .4);
  -webkit-touch-callout: default;
}
.share-tip {
  margin: 14px 0 0;
  font-size: 14px; line-height: 1.6;
  color: rgba(255, 255, 255, .8);
}
.share-close {
  margin-top: 14px;
  padding: 9px 28px;
  font-size: 15px; color: #1a1a2e;
  background: linear-gradient(135deg, #f3d996, #d4a84b);
  border: none; border-radius: 22px;
  font-weight: 600; cursor: pointer;
  box-shadow: 0 4px 12px rgba(212, 168, 75, .3);
  transition: transform .2s, box-shadow .2s;
}
.share-close:active { transform: scale(.96); }

.intro-body {
  position: relative; z-index: 2;
  flex: 1; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  align-items: center; gap: clamp(20px, 4vmin, 60px);
  max-width: 1440px; width: 100%; margin: 0 auto;
}
.intro-kicker { font-size: clamp(12px, 1.5vmin, 15px); color: var(--gold); letter-spacing: .3em; margin-bottom: 22px; }
.intro-title {
  font-family: var(--f-display);
  font-size: clamp(38px, 6.2vmin, 78px);
  line-height: 1.24; font-weight: 400;
  color: var(--cream);
}
.it-line { display: block; white-space: nowrap; }
.it-brush { font-family: var(--f-brush); font-size: 1.22em; color: #fff8e8; text-shadow: 0 0 36px rgba(233, 196, 106, .3); }
.it-gold { color: var(--gold-2); position: relative; }
.it-gold::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: .06em; height: .14em;
  background: linear-gradient(90deg, var(--gold), transparent);
  opacity: .55; border-radius: 2px;
}
.intro-desc {
  margin-top: 28px; max-width: 34em;
  font-size: clamp(14px, 1.6vmin, 17px); line-height: 2.1; color: rgba(243, 231, 207, .82);
}
.intro-desc strong { color: var(--gold-2); font-weight: 500; }
.intro-stats { display: flex; gap: clamp(20px, 4vmin, 56px); margin-top: 42px; }
.stat { display: flex; flex-direction: column; }
.stat b {
  font-family: var(--f-serif); font-weight: 900;
  font-size: clamp(30px, 4.4vmin, 52px); color: var(--gold-2);
  line-height: 1;
}
.stat i { font-style: normal; font-size: 12px; letter-spacing: .3em; color: var(--mist); margin-top: 10px; }

/* 右侧孔雀艺术装置 */
.intro-art { position: relative; height: min(58vh, 520px); }
.art-sun {
  position: absolute; left: 50%; top: 42%; width: 46vmin; height: 46vmin; max-width: 380px; max-height: 380px;
  transform: translate(-50%, -50%); border-radius: 50%;
  background: radial-gradient(circle, rgba(233, 196, 106, .22) 0%, rgba(233, 196, 106, .06) 55%, transparent 72%);
  animation: breathe 8s ease-in-out infinite;
}
.art-clouds { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.cloud { animation: cloudDrift 14s ease-in-out infinite; }
.cloud-b { animation-duration: 18s; animation-delay: -6s; }
.cloud-c { animation-duration: 22s; animation-delay: -3s; }
@keyframes cloudDrift { 0%,100% { transform: translateX(-14px); } 50% { transform: translateX(18px); } }
.art-ring {
  position: absolute; left: 50%; top: 42%; border-radius: 50%;
  border: 1px dashed rgba(220, 180, 94, .32);
  transform: translate(-50%, -50%);
  animation: orbitSpin 30s linear infinite;
}
.art-ring span { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--gold-2); opacity: .6; animation: spark 3.2s ease-in-out infinite; }
.art-ring-1 { width: 54vmin; height: 54vmin; max-width: 440px; max-height: 440px; }
.art-ring-2 {
  width: 66vmin; height: 66vmin; max-width: 540px; max-height: 540px;
  border-color: rgba(91, 131, 214, .42); opacity: .65;
  animation-duration: 48s; animation-direction: reverse;
}
.art-ring-2 span { background: var(--yun-indigo); }
.art-ring-3 {
  width: 78vmin; height: 78vmin; max-width: 640px; max-height: 640px;
  border-color: rgba(47, 166, 160, .3); opacity: .45;
  animation-duration: 64s;
}
.art-ring-3 span { background: var(--yun-teal); }
.art-peacock {
  position: absolute; left: 50%; bottom: 0; width: 22vmin; max-width: 190px; transform: translateX(-50%);
  filter: drop-shadow(0 12px 30px rgba(0, 0, 0, .5));
  animation: peacockBob 5s ease-in-out infinite;
}
@keyframes peacockBob { 0%,100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(-12px); } }

/* 山影 */
.intro-mountains {
  position: absolute; left: 0; right: 0; bottom: -2px; z-index: 1;
  pointer-events: none; line-height: 0;
}
.intro-mountains svg { width: 100%; height: clamp(160px, 26vh, 300px); }

/* 滚动提示 */
.scroll-hint {
  position: absolute; z-index: 3; right: clamp(30px, 5vmin, 70px); bottom: clamp(140px, 17vh, 176px);
  display: flex; flex-direction: column; align-items: center; gap: 12px;
}
.sh-text { font-size: 11px; letter-spacing: .35em; color: var(--mist); writing-mode: vertical-rl; text-indent: 0; }
.sh-v { display: none; }
.sh-track { width: 1px; height: 64px; background: rgba(243, 231, 207, .18); position: relative; overflow: hidden; }
.sh-dot {
  position: absolute; left: 0; top: -8px; width: 1px; height: 22px;
  background: linear-gradient(var(--gold-2), transparent);
  animation: hintRun 2.2s var(--ease-soft) infinite;
}
@keyframes hintRun { 0% { top: -30%; } 100% { top: 110%; } }

/* ============================================================
 * 第二页 · 地图
 * ============================================================ */
.page-map {
  padding: clamp(20px, 3.6vmin, 42px) clamp(24px, 4vmin, 56px);
  display: flex; flex-direction: column;
}
.map-head {
  position: relative; z-index: 2;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap;
}
.map-kicker { font-size: 11px; letter-spacing: .35em; color: var(--gold); margin-bottom: 8px; line-height: 1.9; }
.map-kicker i { font-style: normal; margin-left: 14px; }
.map-kicker i::before { content: '·'; margin-right: 14px; }
.page-promo, .page-events, .page-policy { overflow-y: auto; }
.promo-head .map-kicker i::before { content: none; }
.promo-head .map-kicker i { margin-left: 0; }

/* 第二页 · 宣传片（单视频占位） */
.promo-story {
  position: relative; z-index: 2;
  max-width: 1000px; margin: 2px auto 0;
}
.promo-stage { margin-top: 22px; }
.story-scroll {
  position: relative;
  padding: 14px 22px;
  border-radius: 14px;
  background: linear-gradient(100deg, rgba(47, 134, 184, .14), rgba(217, 176, 95, .08) 55%, rgba(20, 40, 64, .25));
  border: 1px solid rgba(217, 176, 95, .2);
  backdrop-filter: blur(4px);
  box-shadow: inset 0 2px 10px rgba(8, 22, 40, .28);
}
.story-text {
  margin: 0;
  font-size: clamp(13px, 1.5vmin, 16px);
  line-height: 2.15; color: rgba(243, 231, 207, .88);
  text-align: justify; text-indent: 2em;
}
.story-text b { color: var(--gold-2); font-weight: 700; }
.story-coda {
  margin: 22px auto 0; text-align: center;
  font-family: var(--f-display); font-size: clamp(12px, 1.5vmin, 15px);
  letter-spacing: .28em; color: var(--gold);
  opacity: .9;
  text-shadow: 0 0 16px rgba(233, 196, 106, .3);
  animation: codaGlow 3.6s ease-in-out infinite;
}
@keyframes codaGlow {
  0%, 100% { opacity: .62; letter-spacing: .28em; }
  50% { opacity: 1; letter-spacing: .32em; }
}

/* 第二页 · 云上花开下方「劳务品牌宣传片」占位框 */
.promo-stage.promo-films {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  margin-top: 14px;
  /* 内边距 = 视频框两侧留白，使标题与视频框严格对齐 */
  padding-left: max(0px, calc((100% - 960px) / 2));
  padding-right: max(0px, calc((100% - 960px) / 2));
  padding-bottom: 24px;
}

/* 两视频之间的金色装饰分割线 */
.promo-divider {
  flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  margin: 24px 0 4px;
  /* 与视频框两侧留白一致 */
  padding-left: max(0px, calc((100% - 960px) / 2));
  padding-right: max(0px, calc((100% - 960px) / 2));
}
.pd-line {
  flex: 1 1 auto; height: 1px; max-width: 320px;
  background: linear-gradient(90deg, transparent, rgba(217, 176, 95, .55), transparent);
}
.pd-gem {
  flex: 0 0 auto;
  width: 10px; height: 10px; margin: 0 16px;
  transform: rotate(45deg);
  background: linear-gradient(135deg, #ffe9b0, #c9963f);
  box-shadow: 0 0 10px rgba(217, 176, 95, .55);
}
/* ============================================================
 * 全站统一的板块级 h3 小标题
 * （宣页：音乐片 / 宣传片；会页：第二、三届大会；策页：政策文件）
 * 只统一文字样式；间距与装饰（金线、徽章、水印）由各类自行保留
 * ============================================================ */
.promo-stage-title, .ev-city, .pl-head-title {
  font-family: var(--f-display);
  font-weight: 400;
  font-size: clamp(20px, 2.8vmin, 30px);
  letter-spacing: .2em;
  line-height: 1.4;
  color: var(--gold);
  text-shadow: none;
}
/* 宣页视频板块标题的间距 */
.promo-stage-title { margin: 0 0 10px; }
/* 页头内层 div 拉伸至整行，使 h3 的偏移以页面内容区宽度为基准（与 .promo-films 相同） */
.promo-head > div { width: 100%; }
/* 页面头部内的 h3：与页标题拉开间距，并与下方 960px 视频框（及「劳务品牌宣传片」标题）左对齐 */
.promo-head .promo-stage-title {
  margin: 10px 0 0;
  padding-left: max(0px, calc((100% - 960px) / 2));
}
.promo-films-ph {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 14px;
  text-align: center; padding: 24px;
  color: var(--gold-2);
}
.promo-films-icon {
  width: clamp(52px, 8vmin, 80px); height: auto;
  opacity: .8;
}
.promo-films-wait {
  margin: 0;
  font-size: clamp(15px, 2vmin, 19px);
  letter-spacing: .28em; text-indent: .28em;
  color: rgba(252, 246, 232, .82);
}

/* 关键词鎏金/主题高亮（保留给其他页用） */
.kw { font-style: normal; font-weight: 600; white-space: nowrap; padding: 0 2px; }
.kw-gold {
  color: #ffe6ad;
  text-shadow: 0 0 12px rgba(233, 196, 106, .55), 0 1px 2px rgba(0, 0, 0, .5);
  background: linear-gradient(180deg, transparent 62%, rgba(217, 176, 95, .28) 0);
}
.kw-tea { color: #bfe6d8; border-bottom: 1px dashed rgba(47, 166, 160, .6); }
.kw-ink { color: #d7e2f5; border-bottom: 1px solid rgba(91, 131, 214, .45); }

.map-title {
  font-family: var(--f-display); font-weight: 400;
  font-size: clamp(28px, 4vmin, 46px); letter-spacing: .12em; color: var(--cream);
  display: flex; align-items: center; gap: 16px;
  margin-bottom: clamp(12px, 2vmin, 22px);
}
.map-title-logo {
  display: inline-flex; align-items: center; justify-content: center;
  margin-left: .14em;
}
.map-title-logo img {
  display: block; height: .82em; width: auto;
  filter: drop-shadow(0 2px 8px rgba(227, 189, 104, .35));
}
.map-hint { font-size: clamp(12px, 1.4vmin, 14px); color: var(--mist); display: flex; align-items: center; gap: 8px; margin-right: 56px; }
.map-hint::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--gold-2); box-shadow: 0 0 10px var(--gold-2); animation: blink 2s infinite; }
@keyframes blink { 0%,100% { opacity: .4; } 50% { opacity: 1; } }

.map-stage { position: relative; z-index: 2; flex: 1; min-height: 0; display: flex; gap: clamp(18px, 3vmin, 42px); align-items: stretch; }

/* 地图框：淡金描边 + 四角金饰 */
.map-frame {
  position: relative; flex: 1.35 1 0; min-width: 0;
  display: flex; align-items: center; justify-content: center;
  border-radius: 22px;
  border: 1px solid rgba(217, 176, 95, .26);
  box-shadow: inset 0 0 0 1px rgba(255, 244, 214, .05),
              inset 0 0 42px rgba(217, 176, 95, .07);
  background: transparent;
  overflow: hidden;
}
.frame-corner { position: absolute; width: 20px; height: 20px; border: 2px solid rgba(217, 176, 95, .5); z-index: 3; pointer-events: none; }
.fc-tl { left: 14px; top: 14px; border-right: none; border-bottom: none; border-radius: 6px 0 0 0; }
.fc-tr { right: 14px; top: 14px; border-left: none; border-bottom: none; border-radius: 0 6px 0 0; }
.fc-bl { left: 14px; bottom: 14px; border-right: none; border-top: none; border-radius: 0 0 0 6px; }
.fc-br { right: 14px; bottom: 14px; border-left: none; border-top: none; border-radius: 0 0 6px 0; }

/* 等比例画布：尺寸由 JS 按 contain 写入，热点百分比坐标与底图严格对齐 */
.map-canvas {
  position: relative; margin: auto;
  filter: drop-shadow(0 30px 22px rgba(3, 12, 15, .78))
          drop-shadow(0 46px 60px rgba(3, 12, 15, .66));
}

/* ---- 16 分区拼图层（块间贴合，无投影无漂浮） ---- */
.map-regions { position: absolute; inset: 0; z-index: 0; }
.map-region-wrap {
  position: absolute; padding: 0; border: 0; background: none;
  opacity: 0;
  transition: filter .3s var(--ease-out);
  will-change: transform;
}
.map-region-wrap.is-entering { animation: regionIn .85s var(--ease-out) both; animation-delay: var(--d); }
@keyframes regionIn {
  from { opacity: 0; transform: translateY(10px) scale(.9); }
  60%  { opacity: 1; }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.map-region {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  transition: transform .3s var(--ease-out), filter .3s var(--ease-out);
  will-change: transform;
}
.map-region-wrap.hover {
  z-index: 3;
  filter: drop-shadow(0 0 10px rgba(233, 196, 106, .55));
}
.map-region-wrap.hover .map-region {
  filter: brightness(1.1) saturate(1.14);
}
/* 入场流光扫过分区层 */
.map-regions::after {
  content: ''; position: absolute; top: -12%; bottom: -12%; width: 40%; left: -50%;
  background: linear-gradient(105deg, transparent 0%, rgba(255, 250, 230, .34) 50%, transparent 100%);
  transform: skewX(-14deg); pointer-events: none; opacity: 0;
}
.map-regions.is-entering::after { animation: mapSheen 1.7s ease-out .55s both; }
@keyframes mapSheen {
  0% { left: -50%; opacity: 0; }
  15% { opacity: 1; }
  100% { left: 115%; opacity: 0; }
}

/* 州界线层（古金芯+暗青发丝+柔光晕，见生成脚本） */
.map-borders3 {
  position: absolute; inset: 0; z-index: 1;
  width: 100%; height: 100%; object-fit: fill;
  pointer-events: none; opacity: 0;
}
.map-borders3.is-entering { animation: bordersIn 1s ease-out .65s both; }
@keyframes bordersIn { from { opacity: 0; } to { opacity: .95; } }

/* 景点图层（拼接完成后浮入前景） */
.map-scenic {
  position: absolute; inset: 0; z-index: 2;
  width: 100%; height: 100%; object-fit: fill;
  pointer-events: none; opacity: 0;
}
.map-scenic.is-entering { animation: scenicIn 1.3s ease-out .35s both; }
@keyframes scenicIn {
  from { opacity: 0; transform: translateY(14px) scale(1.015); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* 隐形分片按钮层：按真实边界 clip，负责悬停/点击 */
.map-pieces { position: absolute; inset: 0; z-index: 3; }
.map-piece {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  padding: 0; border: 0; border-radius: 0;
  background: transparent; cursor: pointer;
}

/* 热点层（百分比坐标对齐底图橙点）：容器穿透，仅圆点可点，不遮挡州市分片 */
.map-hots { position: absolute; inset: 0; z-index: 4; pointer-events: none; }
.map-hot {
  position: absolute; padding: 0; border: 0; background: none;
  transform: translate(-50%, -50%);
  display: flex; flex-direction: column; align-items: center;
  cursor: pointer; pointer-events: auto;
  opacity: 0;
}
.map-hot.is-entering { animation: hotIn .7s var(--ease-out) both; animation-delay: var(--d); }
@keyframes hotIn { from { opacity: 0; transform: translate(-50%, -42%); } to { opacity: 1; transform: translate(-50%, -50%); } }
.map-hot .hot-dot {
  position: relative; width: 11px; height: 11px; border-radius: 50%;
  background: #ef7d3a; border: 2px solid #fff2df;
  box-shadow: 0 2px 7px rgba(150, 70, 20, .5);
  transition: transform .25s var(--ease-out);
}
.map-hot .hot-dot::after {
  content: ''; position: absolute; inset: -7px; border-radius: 50%;
  border: 1.5px solid rgba(239, 125, 58, .65);
  animation: hotPulse 2.6s ease-out infinite;
}
@keyframes hotPulse { 0% { transform: scale(.5); opacity: .9; } 70%,100% { transform: scale(1.5); opacity: 0; } }
.map-hot:hover .hot-dot, .map-hot.hover .hot-dot, .map-hot.lit .hot-dot { transform: scale(1.25); }
.map-hot.lit .hot-dot { background: #d9552c; }
.map-hot.ripple .hot-dot::before {
  content: ''; position: absolute; left: 50%; top: 50%; width: 11px; height: 11px; border-radius: 50%;
  border: 2px solid #ef7d3a; transform: translate(-50%, -50%);
  animation: hotRipple .9s var(--ease-out) forwards;
}
@keyframes hotRipple { from { width: 11px; height: 11px; opacity: .9; } to { width: 46px; height: 46px; opacity: 0; } }
/* 云朵地名牌（map_title.png）+ 漂浮动效；外层负责位移动画，内层负责云朵皮肤与 hover 缩放 */
.map-hot .hot-name {
  position: relative; white-space: nowrap;
  width: 82px; height: 44px;
  animation: cloudBob 4.2s ease-in-out infinite;
  animation-delay: var(--float-delay, 0s);
  transform-origin: center bottom;
  will-change: transform;
}
.map-hot .hot-name-in {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: url('../img/map_title.png?v=20261006') center / 100% 100% no-repeat;
  font-family: var(--f-display); font-size: 16px; font-weight: 700;
  letter-spacing: .08em; color: #4a2c12;
  text-shadow: 0 1px 0 rgba(255, 240, 210, .55), 0 2px 3px rgba(120, 62, 18, .55);
  filter: drop-shadow(0 5px 5px rgba(90, 50, 18, .42));
  transform-origin: center bottom;
  transition: transform .25s var(--ease-out), filter .25s;
}
.map-hot .hot-name.len3 { width: 100px; }
.map-hot .hot-name.len4 { width: 124px; }
.map-hot .hot-name.len4 .hot-name-in { font-size: 15px; }
@keyframes cloudBob {
  0%, 100% { transform: translateY(0) rotate(-1.2deg); }
  50% { transform: translateY(-3px) rotate(1.2deg); }
}
.map-hot:hover .hot-name-in, .map-hot.hover .hot-name-in {
  transform: translateY(-5px) scale(1.1);
  filter: drop-shadow(0 10px 9px rgba(90, 50, 18, .5));
}
/* 标签位于点位上方（绝对定位，不参与布局，保证圆点与锚点重合） */
.map-hot.name-up .hot-name {
  position: absolute; left: 50%; bottom: 12px; margin: 0;
  animation: cloudBobUp 4.2s ease-in-out infinite;
  animation-delay: var(--float-delay, 0s);
}
@keyframes cloudBobUp {
  0%, 100% { transform: translateX(-50%) translateY(0) rotate(-1.2deg); }
  50% { transform: translateX(-50%) translateY(-3px) rotate(1.2deg); }
}
/* 标签位于点位右侧（垂直居中） */
.map-hot.name-r .hot-name,
.map-hot.name-l .hot-name {
  position: absolute; top: 50%; margin: 0;
  animation: cloudBobSide 4.2s ease-in-out infinite;
  animation-delay: var(--float-delay, 0s);
}
.map-hot.name-r .hot-name { left: 12px; }
.map-hot.name-l .hot-name { right: 12px; }
@keyframes cloudBobSide {
  0%, 100% { transform: translateY(-50%) rotate(-1.2deg); }
  50% { transform: translateY(calc(-50% - 3px)) rotate(1.2deg); }
}
/* 标签位于点位右下方 */
.map-hot.name-rd .hot-name { position: absolute; left: 12px; top: 10px; margin: 0; }
/* 标签位于点位左下方 */
.map-hot.name-ld .hot-name { position: absolute; right: 12px; top: 10px; margin: 0; }

/* 右侧州市目录 */
.map-side {
  flex: 0 0 clamp(240px, 24vw, 330px);
  display: flex; flex-direction: column; min-height: 0;
  border: 1px solid rgba(217, 176, 95, .18); border-radius: 18px;
  background: rgba(40, 66, 100, .42);
  backdrop-filter: blur(6px);
  padding: 20px 16px 16px;
}
.side-title { font-size: 12px; letter-spacing: .5em; color: var(--gold); text-align: center; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.city-list { flex: 1; overflow-y: auto; padding: 8px 4px 8px 0; display: flex; flex-direction: column; gap: 4px; scrollbar-width: thin; scrollbar-color: transparent transparent; }
.city-list::-webkit-scrollbar { width: 3px; }
.city-list::-webkit-scrollbar-thumb { background: transparent; }
.city-item {
  display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
  padding: 11px 12px; border-radius: 12px;
  border: 1px solid transparent;
  transition: background .3s, border-color .3s, transform .3s var(--ease-out);
}
.city-item:hover, .city-item.hover { background: rgba(217, 176, 95, .1); border-color: rgba(217, 176, 95, .28); transform: translateX(4px); }
.city-idx {
  font-family: var(--f-serif); font-size: 11px; color: var(--gold); opacity: .75;
  width: 22px; flex: none;
}
.city-name { font-family: var(--f-display); font-size: 17px; letter-spacing: .12em; color: var(--cream); flex: 1; }
.city-motto { font-size: 11px; color: var(--mist); letter-spacing: .15em; }
.city-item .ci-arrow { opacity: 0; transform: translateX(-6px); color: var(--gold-2); transition: .3s; }
.city-item:hover .ci-arrow, .city-item.hover .ci-arrow { opacity: 1; transform: none; }
.city-item.lit .city-idx { color: var(--cinnabar); }
.side-foot {
  padding-top: 14px; border-top: 1px solid var(--line);
  font-size: 12px; color: var(--mist); letter-spacing: .12em; text-align: center;
}
.side-foot b { color: var(--gold-2); font-weight: 500; }
.dot-active { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--gold-2); box-shadow: 0 0 8px var(--gold-2); margin-right: 6px; }

/* ============================================================
 * 第二页 · 劳务品牌宣传片
 * ============================================================ */
.page-promo, .page-events, .page-policy {
  padding: clamp(20px, 3.6vmin, 42px) clamp(24px, 4vmin, 56px);
  display: flex; flex-direction: column;
}
/* 底部为悬浮 AI 入口（右侧）与分页导航（居中）预留空间，内容不被遮挡 */
.page-intro, .page-map, .page-promo, .page-events, .page-policy {
  padding-bottom: clamp(138px, 17vh, 178px);
}
/* “图/会/策/宣”页：收起后圆标与分页器同排，内容只需避让一行，留白收紧、向下加长 */
.page-map, .page-events, .page-policy, .page-promo { padding-bottom: 96px; }
.promo-stage { flex: 0 0 auto; display: flex; align-items: flex-start; justify-content: center; }
.promo-frame {
  position: relative; width: min(960px, 100%); aspect-ratio: 16 / 9;
  border-radius: 18px; overflow: hidden;
  border: 1px solid rgba(217, 176, 95, .28);
  background:
    radial-gradient(80% 90% at 50% 0%, rgba(47, 134, 184, .2), transparent 70%),
    linear-gradient(160deg, #122c45, #0a1c2e);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .5), inset 0 0 90px rgba(10, 39, 60, .7);
  display: flex; align-items: center; justify-content: center;
}
.promo-video { width: 100%; height: 100%; background: #000; object-fit: contain; }

/* ============================================================
 * 统一纵向滚动条：平时隐藏（全透明、保留宽度防布局抖动），
 * 滚动时由 JS 加 .is-scrolling 显示金色滑块，停止约 800ms 后自动隐藏
 * ============================================================ */
.page-promo, .page-events, .page-policy, .events-scroll,
.policy-scroll, #policyListContent, .city-list, .city-scroll, .brand-scroll, .chat-msgs {
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
}
.page-promo.is-scrolling, .page-events.is-scrolling, .page-policy.is-scrolling,
.events-scroll.is-scrolling, .policy-scroll.is-scrolling,
#policyListContent.is-scrolling, .city-list.is-scrolling,
.city-scroll.is-scrolling, .brand-scroll.is-scrolling, .chat-msgs.is-scrolling {
  scrollbar-color: rgba(217, 176, 95, .55) transparent;
}
.events-scroll::-webkit-scrollbar { width: 8px; }
.events-scroll::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 8px;
}
.page-promo::-webkit-scrollbar,
.page-events::-webkit-scrollbar, .page-policy::-webkit-scrollbar,
.policy-scroll::-webkit-scrollbar, #policyListContent::-webkit-scrollbar,
.city-list::-webkit-scrollbar,
.city-scroll::-webkit-scrollbar, .brand-scroll::-webkit-scrollbar,
.chat-msgs::-webkit-scrollbar {
  width: 8px;
}
.page-promo::-webkit-scrollbar-track,
.page-events::-webkit-scrollbar-track, .page-policy::-webkit-scrollbar-track,
.policy-scroll::-webkit-scrollbar-track, #policyListContent::-webkit-scrollbar-track,
.city-list::-webkit-scrollbar-track,
.city-scroll::-webkit-scrollbar-track, .brand-scroll::-webkit-scrollbar-track,
.chat-msgs::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 8px;
}
.events-scroll::-webkit-scrollbar-thumb,
.page-promo::-webkit-scrollbar-thumb,
.page-events::-webkit-scrollbar-thumb, .page-policy::-webkit-scrollbar-thumb,
.policy-scroll::-webkit-scrollbar-thumb, #policyListContent::-webkit-scrollbar-thumb,
.city-list::-webkit-scrollbar-thumb,
.city-scroll::-webkit-scrollbar-thumb, .brand-scroll::-webkit-scrollbar-thumb,
.chat-msgs::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 8px;
}
.events-scroll.is-scrolling::-webkit-scrollbar-thumb,
.page-promo.is-scrolling::-webkit-scrollbar-thumb,
.page-events.is-scrolling::-webkit-scrollbar-thumb, .page-policy.is-scrolling::-webkit-scrollbar-thumb,
.policy-scroll.is-scrolling::-webkit-scrollbar-thumb, #policyListContent.is-scrolling::-webkit-scrollbar-thumb,
.city-list.is-scrolling::-webkit-scrollbar-thumb,
.city-scroll.is-scrolling::-webkit-scrollbar-thumb, .brand-scroll.is-scrolling::-webkit-scrollbar-thumb,
.chat-msgs.is-scrolling::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #f3d996, #b98a3c);
  box-shadow: 0 0 4px rgba(217, 176, 95, .4);
}
.events-scroll.is-scrolling::-webkit-scrollbar-thumb:hover,
.page-promo.is-scrolling::-webkit-scrollbar-thumb:hover,
.page-events.is-scrolling::-webkit-scrollbar-thumb:hover, .page-policy.is-scrolling::-webkit-scrollbar-thumb:hover,
.policy-scroll.is-scrolling::-webkit-scrollbar-thumb:hover, #policyListContent.is-scrolling::-webkit-scrollbar-thumb:hover,
.city-list.is-scrolling::-webkit-scrollbar-thumb:hover,
.city-scroll.is-scrolling::-webkit-scrollbar-thumb:hover, .brand-scroll.is-scrolling::-webkit-scrollbar-thumb:hover,
.chat-msgs.is-scrolling::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #ffe9b0, #d9a84e);
}
.events-scroll::-webkit-scrollbar-button,
.page-promo::-webkit-scrollbar-button,
.page-events::-webkit-scrollbar-button, .page-policy::-webkit-scrollbar-button,
.policy-scroll::-webkit-scrollbar-button, #policyListContent::-webkit-scrollbar-button,
.city-list::-webkit-scrollbar-button,
.city-scroll::-webkit-scrollbar-button, .brand-scroll::-webkit-scrollbar-button,
.chat-msgs::-webkit-scrollbar-button {
  display: none;
}
/* ============================================================
 * 第四页 · 大会风采（长沙 / 南宁）
 * ============================================================ */
.events-scroll-inner { max-width: 1180px; margin: 0 auto; padding: 4px 4px 30px; }

/* 章节 + 金色时间轴 */
.ev-chapter {
  position: relative;
  padding: 8px 0 30px 34px;
  margin-left: 12px;
  border-left: 1px solid rgba(217, 176, 95, .3);
}
.ev-chapter:last-child { padding-bottom: 10px; }
.ev-ch-head {
  position: relative;
  display: flex; align-items: center; gap: 18px;
  margin: 14px 0 20px;
}
.ev-ch-head::before {
  content: ''; position: absolute; left: -39px; top: 50%;
  width: 11px; height: 11px; border-radius: 50%;
  background: var(--gold-2);
  box-shadow: 0 0 0 4px rgba(217, 176, 95, .18), 0 0 16px rgba(233, 196, 106, .7);
  transform: translateY(-50%);
}
.ev-badge {
  flex: none;
  width: 64px; height: 64px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  text-align: center; font-size: 13px; line-height: 1.35;
  color: #2a1a06; letter-spacing: .08em;
  background: radial-gradient(circle at 50% 38%, var(--gold-2), var(--gold-deep));
  border: 1px solid rgba(255, 244, 214, .65);
  box-shadow: 0 8px 22px rgba(120, 80, 20, .4);
}
.ev-ch-titles { position: relative; z-index: 1; }
.ev-city { display: block; }
.ev-date { margin-top: 4px; font-size: 12px; color: var(--mist); letter-spacing: .3em; }
.ev-watermark {
  position: absolute; right: -8px; top: -26px; z-index: 0;
  font-family: var(--f-brush);
  font-size: clamp(90px, 15vmin, 170px);
  color: rgba(233, 196, 106, .06);
  pointer-events: none; user-select: none;
  letter-spacing: .1em;
}

/* 小节标题 */
.ev-g-head {
  display: flex; align-items: baseline; gap: 12px;
  margin: 22px 0 12px;
}
.ev-g-name {
  font-family: var(--f-display); font-size: clamp(17px, 2.2vmin, 22px);
  color: var(--gold-2); letter-spacing: .22em;
  padding-left: 14px; position: relative;
}
.ev-g-name::before {
  content: ''; position: absolute; left: 0; top: 50%;
  width: 4px; height: 16px; transform: translateY(-50%);
  background: linear-gradient(180deg, var(--gold-2), var(--gold-deep));
  border-radius: 2px;
}
.ev-g-en { font-size: 10px; letter-spacing: .35em; color: rgba(243, 231, 207, .32); }

/* ---------- 视频舞台 ---------- */
.ev-videos { margin: 6px 0 30px; }
.ev-vstage {
  position: relative;
  display: flex; gap: 14px;
  align-items: stretch;
}
/* 主播放器 */
.ev-vmain {
  position: relative;
  flex: 1 1 auto;
  aspect-ratio: 16 / 9;
  min-width: 0;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(217, 176, 95, .3);
  background: #0e2434;
  box-shadow: 0 16px 40px rgba(4, 14, 22, .4);
}
.ev-vmain::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 3px; z-index: 4;
  background: linear-gradient(90deg, transparent, var(--ev-accent, var(--gold-2)), transparent);
  opacity: .85;
}
.ev-vmain .frame-corner { z-index: 3; }
.ev-vmain img { width: 100%; height: 100%; object-fit: contain; background: #000; }
.ev-vmain video { width: 100%; height: 100%; object-fit: contain; background: #000; }
.ev-vmain .ev-play { width: 72px; height: 72px; animation: evPulse 2.4s ease-in-out infinite; }
.ev-vmain .ev-play svg { width: 100%; height: 100%; }
.ev-vmain .ev-cap {
  padding: 28px 18px 12px;
  font-size: 13.5px; letter-spacing: .07em;
}
/* 主播放器占位 */
.ev-ph-main {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; color: var(--gold-2);
}
.ev-ph-main em {
  font-style: normal; font-size: 13px; letter-spacing: .3em;
  color: rgba(243, 231, 207, .55);
}
.ev-ph-main b {
  font-weight: 400; font-size: 15px; letter-spacing: .1em;
  color: rgba(248, 241, 226, .7); margin-top: 2px;
}

/* 右侧小列表（PC） */
.ev-vlist {
  flex: 0 0 230px;
  display: flex; flex-direction: column;
  gap: 10px;
}
.ev-vitem {
  display: flex; gap: 10px; align-items: center;
  padding: 8px;
  border-radius: 10px;
  border: 1px solid rgba(217, 176, 95, .18);
  background: rgba(20, 40, 64, .35);
  cursor: pointer;
  text-align: left;
  transition: all .25s var(--ease-out);
}
.ev-vitem:hover {
  border-color: rgba(233, 196, 106, .5);
  background: rgba(28, 54, 84, .55);
  transform: translateX(-3px);
}
.ev-vitem.is-active {
  border-color: var(--ev-accent, var(--gold-2));
  background: rgba(28, 54, 84, .7);
  box-shadow: 0 0 0 1px var(--ev-accent, var(--gold-2)), 0 8px 22px rgba(4, 14, 22, .4);
}
.ev-vitem-thumb {
  flex: 0 0 64px;
  width: 64px; height: 44px;
  border-radius: 6px;
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  color: var(--gold-2);
}
.ev-vitem-thumb img { width: 100%; height: 100%; object-fit: cover; }
.ev-vitem-thumb svg { width: 22px; height: 22px; opacity: .7; }
.ev-vitem-cap {
  flex: 1; min-width: 0;
  font-size: 12.5px; line-height: 1.5; letter-spacing: .04em;
  color: var(--cream);
  overflow: hidden; text-overflow: ellipsis;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}

/* 左右切换按钮（平板/手机） */
.ev-vnav {
  position: absolute; top: 50%; z-index: 5;
  transform: translateY(-50%);
  width: 42px; height: 42px; border-radius: 50%;
  display: none; align-items: center; justify-content: center;
  color: var(--gold-2);
  background: rgba(8, 26, 30, .55);
  border: 1px solid rgba(243, 217, 150, .4);
  backdrop-filter: blur(6px);
  transition: all .25s;
}
.ev-vnav:hover:not(:disabled) { background: rgba(8, 26, 30, .8); transform: translateY(-50%) scale(1.08); }
.ev-vnav:disabled { opacity: .3; cursor: default; }
.ev-vprev { left: 10px; }
.ev-vnext { right: 10px; }
.ev-vind {
  position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%);
  z-index: 5;
  padding: 3px 12px; border-radius: 20px;
  font-size: 11px; letter-spacing: .15em;
  color: var(--gold-2);
  background: rgba(8, 26, 30, .6);
  border: 1px solid rgba(243, 217, 150, .3);
  display: none;
}

/* ---------- 图片横向滚动 ---------- */
.ev-images { margin: 6px 0 30px; }
.ev-istage { position: relative; }
.ev-istrip {
  display: flex; gap: 14px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: 4px 2px 14px;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.ev-inav {
  position: absolute; top: 50%; transform: translateY(-50%);
  z-index: 4; width: 42px; height: 42px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--gold-2);
  background: rgba(12, 30, 42, .72);
  border: 1px solid rgba(217, 176, 95, .4);
  backdrop-filter: blur(6px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .4);
  transition: background .3s, transform .3s, border-color .3s;
}
.ev-inav:hover {
  background: rgba(217, 176, 95, .2);
  border-color: rgba(233, 196, 106, .75);
  transform: translateY(-50%) scale(1.08);
}
.ev-inav svg { width: 22px; height: 22px; display: block; }
.ev-iprev { left: 8px; }
.ev-inext { right: 8px; }
.ev-istrip::-webkit-scrollbar { display: none; }

.ev-icard {
  position: relative;
  flex: 0 0 auto;
  width: 280px;
  aspect-ratio: 4 / 3;
  border-radius: 14px;
  overflow: hidden;
  scroll-snap-align: start;
  border: 1px solid rgba(217, 176, 95, .26);
  background: #0e2434;
  box-shadow: 0 12px 30px rgba(4, 14, 22, .35);
  padding: 0;
}
.ev-icard .frame-corner { z-index: 3; }
.ev-icard img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s var(--ease-out), filter .6s;
}
.ev-icard.ev-img { cursor: pointer; text-align: left; }
.ev-icard.ev-img:hover img { transform: scale(1.05); filter: saturate(1.08) brightness(1.05); }
.ev-icard.ev-img:hover { border-color: rgba(233, 196, 106, .65); box-shadow: 0 14px 36px rgba(4, 14, 22, .5), 0 0 22px rgba(233, 196, 106, .2); }

.ev-cap {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  padding: 22px 14px 10px;
  font-size: 12.5px; letter-spacing: .06em; line-height: 1.6;
  color: rgba(252, 246, 232, .92);
  background: linear-gradient(180deg, transparent, rgba(6, 18, 24, .82));
  pointer-events: none;
}
.ev-play {
  position: absolute; left: 50%; top: 50%; z-index: 2;
  transform: translate(-50%, -50%);
  width: 64px; height: 64px; border-radius: 50%; padding: 0;
  display: flex; align-items: center; justify-content: center;
  transition: transform .3s, filter .3s;
  filter: drop-shadow(0 6px 18px rgba(0, 0, 0, .5));
}
.ev-play:hover { transform: translate(-50%, -50%) scale(1.12); }
.ev-vbg { position: absolute; inset: 0; }

/* 占位卡 */
.ev-icard.is-placeholder {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; color: var(--gold-2);
  animation: evBreathe 5s ease-in-out infinite;
}
.ev-ph-icon { display: flex; opacity: .6; }
.ev-ph-tag {
  font-size: 12px; letter-spacing: .25em;
  color: rgba(243, 231, 207, .5);
}
.ev-icard.is-placeholder .ev-cap {
  background: linear-gradient(180deg, transparent, rgba(6, 18, 24, .7));
}
.ev-miss-mark {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  text-align: center;
  font-size: 13px; line-height: 1.9; letter-spacing: .15em;
  color: rgba(243, 231, 207, .45);
}

/* ---------- 品牌详情：品牌影像画廊 ---------- */
.bs-gallery { margin-top: 28px; margin-bottom: 22px; }
.ev-icard.ev-vcard { background: #000; }
.ev-icard.ev-vcard video {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  background: #000;
}
.ev-icard.ev-vcard::after {
  content: '品牌视频';
  position: absolute; left: 10px; top: 10px; z-index: 2;
  padding: 3px 11px 2px;
  border-radius: 999px;
  font-size: 10px; letter-spacing: .22em;
  color: var(--gold-2);
  background: rgba(8, 20, 30, .62);
  border: 1px solid rgba(217, 176, 95, .4);
  pointer-events: none;
}

/* ---------- 届次区分色（徽章内圈 + 播放器光带） ---------- */
.ev-chapter.ed-2 { --ev-accent: var(--yun-teal); }
.ev-chapter.ed-3 { --ev-accent: var(--yun-violet); }
.ev-chapter.ed-2 .ev-badge { box-shadow: 0 8px 22px rgba(120, 80, 20, .4), 0 0 0 2px rgba(72, 179, 173, .35) inset; }
.ev-chapter.ed-3 .ev-badge { box-shadow: 0 8px 22px rgba(120, 80, 20, .4), 0 0 0 2px rgba(154, 116, 214, .35) inset; }

/* ---------- 入场动画 ---------- */
@keyframes evReveal {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes evPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(243, 217, 150, .45); }
  50%      { box-shadow: 0 0 0 14px rgba(243, 217, 150, 0); }
}
@keyframes evBreathe {
  0%, 100% { opacity: .78; }
  50%      { opacity: 1; }
}
.reveal-stagger {
  opacity: 0;
  animation: evReveal .6s var(--ease-out) forwards;
  animation-delay: var(--d, 0ms);
}

/* 空小节占位 */
.ev-empty {
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; min-height: 240px; padding: 34px 20px;
  border-radius: 16px; text-align: center;
  border: 1px dashed rgba(217, 176, 95, .35);
  background:
    radial-gradient(80% 90% at 50% 0%, rgba(47, 134, 184, .12), transparent 70%),
    rgba(20, 40, 64, .25);
}
.ev-empty img {
  width: clamp(110px, 16vw, 150px); height: auto; opacity: .7;
  animation: breathe 6s ease-in-out infinite;
}
.ev-empty p {
  margin: 0; font-family: var(--f-body);
  font-size: clamp(14px, 1.8vmin, 17px); color: var(--cream);
  letter-spacing: .14em; line-height: 1.9;
}
.ev-empty span { font-size: 11px; color: var(--mist); letter-spacing: .25em; }

/* 灯箱 */
.mv-stage {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 14px; padding: 80px 90px 50px; margin: 0;
}
.mv-stage img {
  max-width: 100%; max-height: 82%;
  object-fit: contain; border-radius: 10px;
  border: 1px solid rgba(217, 176, 95, .3);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .6);
}
.mv-stage figcaption {
  max-width: min(760px, 90%);
  font-size: 14px; line-height: 1.8; letter-spacing: .08em;
  color: var(--mist); text-align: center;
}
.mv-ph {
  display: none;
  width: min(520px, 86%); aspect-ratio: 4 / 3;
  border-radius: 14px;
  border: 1px solid rgba(217, 176, 95, .3);
  flex-direction: column; align-items: center; justify-content: center;
  gap: 14px; color: var(--gold-2);
}
.overlay.is-ph .mv-ph { display: flex; }
.mv-nav {
  position: fixed; top: 50%; transform: translateY(-50%); z-index: 5;
  width: 52px; height: 52px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--gold-2);
  background: rgba(40, 66, 100, .5); border: 1px solid rgba(217, 176, 95, .35);
  backdrop-filter: blur(8px);
  transition: background .3s, transform .3s;
}
.mv-nav:hover { background: rgba(217, 176, 95, .25); }
.mv-prev { left: 24px; }
.mv-next { right: 24px; }
.mv-nav:hover { transform: translateY(-50%) scale(1.08); }

/* ============================================================
 * 第五页 · 劳务品牌重大政策（文件卡片 / 下载）
 * ============================================================ */
.policy-scroll {
  flex: 1; min-height: 0; overflow-y: auto;
  scrollbar-width: thin;
}
.policy-inner { max-width: 960px; width: 100%; margin: 0 auto; padding: 2px 4px 30px; }

/* 板块头 */
.pl-head { margin-bottom: 18px; }
.pl-head-title {
  margin: 0 0 8px;
  display: flex; align-items: center; gap: 14px;
}
.pl-head-title::after {
  content: ''; flex: 1; height: 1px;
  background: linear-gradient(90deg, rgba(217, 176, 95, .55), transparent);
}

/* 政策列表（主板块与覆盖层共用） */
.pl-list {
  border: 1px solid rgba(217, 176, 95, .22);
  border-radius: 16px;
  background:
    linear-gradient(160deg, rgba(47, 134, 184, .1), rgba(217, 176, 95, .05) 55%, rgba(20, 40, 64, .25)),
    rgba(14, 34, 52, .4);
  box-shadow: 0 12px 32px rgba(4, 14, 22, .32);
  overflow: hidden;
}
.pl-row {
  position: relative;
  display: flex; align-items: center; gap: clamp(12px, 2vmin, 20px);
  padding: clamp(14px, 2.2vmin, 20px) clamp(16px, 2.4vmin, 26px);
  text-decoration: none; color: inherit;
  transition: background .3s, transform .3s;
}
.pl-row + .pl-row { border-top: 1px solid rgba(217, 176, 95, .16); }
a.pl-row:hover { background: rgba(233, 196, 106, .08); transform: translateX(4px); }
a.pl-row:hover .pl-title { color: var(--gold-2); }
a.pl-row:hover .pl-go { color: var(--gold-2); gap: 10px; }
.pl-idx {
  flex: none; width: 38px;
  font-size: clamp(16px, 2.1vmin, 20px); font-weight: 500;
  color: rgba(217, 176, 95, .72); letter-spacing: .05em;
}
.pl-kind {
  flex: none; width: 58px;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  color: var(--gold-2);
}
.pl-kind svg { width: 22px; height: 22px; }
.pl-kind em {
  font-style: normal; font-size: 10.5px; letter-spacing: .12em;
  color: rgba(243, 231, 207, .5);
}
.pl-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.pl-title {
  font-size: clamp(14.5px, 1.9vmin, 17px); font-weight: 500;
  line-height: 1.6; color: var(--cream); letter-spacing: .02em;
  transition: color .3s;
}
.pl-go {
  flex: none; display: inline-flex; align-items: center; gap: 7px;
  font-size: 12.5px; letter-spacing: .12em; white-space: nowrap;
  color: rgba(243, 231, 207, .62);
  transition: color .3s, gap .3s;
}
.pl-go svg { width: 16px; height: 16px; }

/* 「点击了解更多政策」按钮 */
.pl-more-btn {
  display: flex; align-items: center; gap: 10px;
  margin: 24px auto 0;
  padding: 12px 32px; border-radius: 999px;
  font-size: 15px; letter-spacing: .18em;
  color: var(--gold-2);
  background: rgba(217, 176, 95, .1);
  border: 1px solid rgba(217, 176, 95, .5);
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(4, 14, 22, .35);
  transition: background .3s, box-shadow .3s, transform .3s, color .3s;
}
.pl-more-btn:hover {
  color: #2a1a06;
  background: linear-gradient(135deg, var(--gold-2), var(--gold-deep));
  box-shadow: 0 10px 28px rgba(233, 196, 106, .4);
  transform: translateY(-2px);
}
.pl-more-btn svg { width: 17px; height: 17px; transition: transform .3s; }
.pl-more-btn:hover svg { transform: translateX(3px); }

/* 政策列表覆盖层 */
.pl-overlay-inner {
  display: flex; align-items: center; justify-content: center;
  padding: clamp(16px, 4vmin, 48px);
}
.pl-panel {
  position: relative;
  width: min(760px, 100%);
  max-height: 84vh;
  display: flex; flex-direction: column;
  padding: clamp(26px, 4vmin, 42px) clamp(20px, 3.6vmin, 42px) clamp(26px, 4vmin, 40px);
  border-radius: 20px;
  border: 1px solid rgba(217, 176, 95, .35);
  background:
    radial-gradient(90% 70% at 50% 0%, rgba(47, 134, 184, .18), transparent 70%),
    linear-gradient(165deg, #102739, #0a1a2a 70%);
  box-shadow: 0 30px 90px rgba(0, 0, 0, .6), inset 0 0 80px rgba(10, 39, 60, .5);
  backdrop-filter: blur(10px);
  animation: plPop .4s var(--ease-out);
}
@keyframes plPop {
  from { opacity: 0; transform: translateY(18px) scale(.98); }
  to { opacity: 1; transform: none; }
}
.pl-panel .map-kicker { margin: 0 0 6px; font-size: 11px; }
.pl-panel-title {
  margin: 0 0 20px;
  font-family: var(--f-display); font-weight: 400;
  font-size: clamp(22px, 3vmin, 30px);
  letter-spacing: .16em; color: var(--gold-2);
  display: flex; align-items: center; gap: 14px;
}
.pl-panel-title::after {
  content: ''; flex: 1; height: 1px;
  background: linear-gradient(90deg, rgba(217, 176, 95, .55), transparent);
}
.pl-panel .pl-list { flex: 1; min-height: 0; overflow-y: auto; padding-right: 4px; scrollbar-width: thin; }

/* ---------- 政策文件内嵌查看器（仅 PC） ---------- */
.pdf-viewer {
  display: flex; flex-direction: column;
  background: rgba(6, 18, 24, .98);
}
.pv-bar {
  flex: 0 0 auto;
  display: flex; align-items: center; gap: 16px;
  padding: 14px 22px;
  border-bottom: 1px solid rgba(243, 231, 207, .12);
  background: rgba(10, 26, 34, .9);
}
.pdf-viewer .ov-close {
  position: static;
  padding: 8px 16px 8px 12px;
  font-size: 13px; letter-spacing: .2em;
}
.pv-title {
  flex: 1; min-width: 0;
  color: var(--cream); font-size: 15px; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pv-open-new {
  flex: 0 0 auto;
  color: var(--gold); font-size: 13px; letter-spacing: .05em;
  text-decoration: none; white-space: nowrap;
  padding: 7px 14px; border-radius: 999px;
  border: 1px solid rgba(217, 176, 95, .35);
  transition: background .3s, border-color .3s;
}
.pv-open-new:hover { background: rgba(217, 176, 95, .15); border-color: var(--gold); }
.pv-frame {
  flex: 1; min-height: 0; width: 100%; border: 0; background: #fff;
}

/* ============================================================
 * 分页器
 * ============================================================ */
.pager {
  position: fixed; z-index: 20; left: 50%; bottom: 22px; transform: translateX(-50%);
  display: flex; align-items: center; gap: 14px;
  padding: 8px 14px; border-radius: 999px;
  background: rgba(40, 66, 100, .46); border: 1px solid rgba(217, 176, 95, .2);
  backdrop-filter: blur(8px);
  opacity: 0; transition: opacity .6s .4s;
}
body.started .pager { opacity: 1; }
.pg-btn { color: var(--mist); display: flex; padding: 4px; transition: color .3s, transform .3s; }
.pg-btn:hover { color: var(--gold-2); transform: scale(1.15); }
.pg-dots { display: flex; gap: 10px; }
.pg-dot { width: 26px; height: 26px; border-radius: 50%; position: relative; color: var(--mist); font-size: 12px; }
.pg-dot i { font-style: normal; font-family: var(--f-display); }
.pg-dot::before {
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  border: 1px solid var(--line); transition: .35s;
}
.pg-dot.is-current { color: #241503; }
.pg-dot.is-current::before { background: var(--gold-2); border-color: var(--gold-2); box-shadow: 0 0 14px rgba(233, 196, 106, .6); transform: scale(1.08); }

/* ============================================================
 * 覆盖层（州市 / 品牌详情）
 * ============================================================ */
.overlay {
  position: fixed; inset: 0; z-index: var(--z-overlay);
  visibility: hidden; opacity: 0;
  transition: opacity .5s var(--ease-out), visibility .5s, transform .5s var(--ease-out);
  transform: scale(1.04);
  background:
    radial-gradient(1200px 700px at 80% -10%, rgba(47, 134, 184, .2), transparent 60%),
    radial-gradient(900px 700px at 0% 100%, rgba(22, 69, 106, .22), transparent 60%),
    rgba(6, 18, 24, .96);
  backdrop-filter: blur(10px);
}
.overlay.open { visibility: visible; opacity: 1; transform: scale(1); }
.overlay-inner { position: absolute; inset: 0; }
.city-scroll, .brand-scroll { height: 100%; overflow-y: auto; scrollbar-width: thin; scrollbar-color: transparent transparent; }
.city-scroll::-webkit-scrollbar, .brand-scroll::-webkit-scrollbar { width: 4px; }
.city-scroll::-webkit-scrollbar-thumb, .brand-scroll::-webkit-scrollbar-thumb { background: transparent; }

.ov-close {
  position: fixed; top: 22px; left: 22px; z-index: 5;
  display: flex; align-items: center; gap: 8px;
  padding: 10px 18px 10px 14px; border-radius: 999px;
  border: 1px solid rgba(243, 231, 207, .35); color: var(--cream);
  background: rgba(40, 66, 100, .46); backdrop-filter: blur(8px);
  font-size: 13px; letter-spacing: .2em;
  transition: background .3s, border-color .3s, transform .3s;
}
.ov-close:hover { background: rgba(194, 85, 61, .35); border-color: var(--cinnabar); transform: translateX(-4px); }

/* ---------- 州市详情 ---------- */
.city-hero {
  position: relative; min-height: 46vh;
  display: flex; align-items: flex-end;
  padding: clamp(70px, 10vh, 110px) clamp(24px, 6vw, 80px) clamp(30px, 5vh, 56px);
  overflow: hidden;
}
.city-hero-img { position: absolute; inset: 0; z-index: 0; transform: scale(1.12); }
.overlay.open .city-hero-img { animation: heroZoom 1.6s var(--ease-out) forwards; }
@keyframes heroZoom { to { transform: scale(1); } }
.city-hero-img::after {
  content: ''; position: absolute; inset: 0;
  /* 顶部轻压保证标题可读，中段全透，底部只做很轻的过渡，头图整体明亮 */
  background: linear-gradient(180deg,
    rgba(19, 40, 72, .28) 0%,
    rgba(19, 40, 72, 0) 34%,
    rgba(19, 40, 72, .12) 68%,
    rgba(19, 40, 72, .42) 100%);
}
.city-hero-img img { opacity: 0; transition: opacity 1s .2s; }
.city-hero-img img.loaded { opacity: 1; }
.city-hero-inner { position: relative; z-index: 1; max-width: 1200px; width: 100%; margin: 0 auto; }
.city-seal { display: inline-flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.city-seal img {
  display: block; height: 52px; width: auto;
  filter: drop-shadow(0 3px 12px rgba(227, 189, 104, .4));
}
.city-hero h3 {
  font-family: var(--f-brush); font-weight: 400;
  font-size: clamp(48px, 8vmin, 96px); line-height: 1.15;
  color: #fffdf2; text-shadow: 0 2px 10px rgba(8, 18, 40, .55), 0 8px 34px rgba(8, 18, 40, .75);
  display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap;
}
.city-hero h3 .ch-name { display: inline; }
.city-hero h3 small {
  font-family: var(--f-display); font-size: .32em; letter-spacing: .4em;
  color: var(--gold-2); margin-left: 22px; vertical-align: middle;
}
.city-lvbar {
  display: inline-flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end;
  padding-bottom: .22em;
}
.city-lvbar .lv-pill { font-size: 12px; padding: 5px 12px; letter-spacing: .12em; }
.city-intro {
  max-width: 620px; margin-top: 18px;
  font-size: clamp(14px, 1.7vmin, 16px); line-height: 2.1; color: rgba(243, 231, 207, .9);
}
.city-brands {
  width: 100%;
  padding: clamp(34px, 6vh, 64px) clamp(24px, 4vw, 40px) clamp(120px, 16vh, 170px);
  background: linear-gradient(180deg, rgba(26, 48, 80, .62) 0%, rgba(24, 44, 76, .9) 12%, rgba(24, 44, 76, .94) 100%);
}
.city-brands > * { max-width: 1200px; margin-left: auto; margin-right: auto; }
.cb-label {
  display: flex; align-items: center; gap: 16px;
  margin: 40px 0;
  font-size: 13px; letter-spacing: .4em; color: var(--gold);
}
.cb-label:first-child { margin-top: 6px; }
.cb-label::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--line), transparent); }
.brand-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap: clamp(18px, 2.4vmin, 30px); }

.brand-card {
  position: relative; border-radius: 16px; overflow: hidden; text-align: left;
  background: linear-gradient(180deg, rgba(76, 112, 150, .5), rgba(40, 68, 104, .74));
  border: 1px solid rgba(227, 189, 104, .28);
  opacity: 0; transform: translateY(46px);
  transition: transform .45s var(--ease-out), border-color .35s, box-shadow .35s;
}
.brand-grid.in .brand-card { animation: cardRise .8s var(--ease-out) forwards; animation-delay: calc(var(--i) * .09s); }
@keyframes cardRise { to { opacity: 1; transform: none; } }
.brand-card:hover {
  transform: translateY(-8px);
  border-color: rgba(217, 176, 95, .6);
  box-shadow: 0 22px 50px rgba(0, 0, 0, .5), 0 0 30px rgba(217, 176, 95, .14);
}
.bc-img { position: relative; height: 210px; overflow: hidden; }
.bc-img img { opacity: 0; transform: scale(1.08); transition: opacity .9s, transform .9s var(--ease-out); }
.bc-img img.loaded { opacity: 1; transform: scale(1); }
.brand-card:hover .bc-img img.loaded { transform: scale(1.08); }
.bc-img::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, transparent 45%, rgba(24, 48, 78, .72));
}
.bc-body { padding: 20px 22px 24px; position: relative; }
.bc-name {
  /* 用思源宋体900：站酷小薇的“豆”等字顶横过短过细，小字号下近乎缺失 */
  font-family: var(--f-serif); font-weight: 900;
  font-size: 23px; letter-spacing: .06em; color: var(--cream);
  display: flex; align-items: center; gap: 10px;
}
.bc-name-text { flex: 1 1 auto; min-width: 0; line-height: 1.4; word-break: break-word; }
.bc-level { flex: none; align-self: flex-start; padding: 3px 9px; font-size: 11px; letter-spacing: 0; margin-top: 2px; }
.bc-name svg { color: var(--gold); flex: none; align-self: center; transition: transform .35s; }
.brand-card:hover .bc-name svg { transform: translateX(6px); }
.bc-tag { margin-top: 10px; font-size: 13px; line-height: 1.8; color: var(--mist); }
.bc-line { margin-top: 16px; height: 2px; width: 40px; background: linear-gradient(90deg, var(--cinnabar), transparent); border-radius: 2px; transition: width .4s var(--ease-out); }
.brand-card:hover .bc-line { width: 100%; }

/* ---------- 品牌详情（杂志式） ---------- */
.brand-hero {
  position: relative; min-height: 62vh;
  display: flex; align-items: flex-end;
  padding: clamp(80px, 12vh, 130px) clamp(24px, 6vw, 90px) clamp(36px, 6vh, 60px);
  overflow: hidden;
}
.brand-hero-img { position: absolute; inset: 0; z-index: 0; }
.brand-hero-img::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg,
    rgba(19, 40, 72, .22) 0%,
    rgba(19, 40, 72, 0) 34%,
    rgba(19, 40, 72, .1) 68%,
    rgba(19, 40, 72, .4) 100%);
}
.brand-hero-img img { opacity: 0; transform: scale(1.1); transition: opacity 1.1s .15s, transform 1.6s var(--ease-out); }
.brand-hero-img img.loaded { opacity: 1; transform: scale(1); }
.brand-hero-inner { position: relative; z-index: 1; max-width: 1100px; margin: 0 auto; width: 100%; pointer-events: none; }
.brand-hero h3 {
  font-family: var(--f-brush); font-weight: 400;
  font-size: clamp(44px, 8.4vmin, 100px); line-height: 1.18;
  color: #fffdf2; text-shadow: 0 2px 10px rgba(8, 18, 40, .55), 0 10px 38px rgba(8, 18, 40, .75);
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap;
}
.bh-badges { display: inline-flex; align-items: center; gap: 12px; padding-bottom: .18em; }
.bh-badges em { font-style: normal; color: var(--gold-2); font-family: var(--f-display); font-size: .28em; letter-spacing: .35em; text-shadow: 0 2px 8px rgba(8, 18, 40, .7); }
.bh-badges .lv-pill { font-size: 12px; padding: 6px 14px; letter-spacing: .14em; }
.bh-tag {
  margin-top: 16px; font-family: var(--f-display);
  font-size: clamp(16px, 2.2vmin, 22px); color: var(--gold-2); letter-spacing: .08em;
}

.brand-stats {
  display: flex; flex-wrap: wrap; gap: 0;
  max-width: 1100px; margin: -34px auto 0; position: relative; z-index: 3;
  border: 1px solid rgba(217, 176, 95, .3); border-radius: 16px; overflow: hidden;
  background: rgba(30, 54, 84, .72); backdrop-filter: blur(10px);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .45);
}
.bstat { flex: 1 1 30%; min-width: 150px; padding: 24px 28px; text-align: center; border-right: 1px solid rgba(217, 176, 95, .16); }
.bstat:last-child { border-right: none; }
.bstat b { display: block; font-family: var(--f-serif); font-size: clamp(22px, 3vmin, 34px); color: var(--gold-2); font-weight: 900; }
.bstat i { font-style: normal; display: block; margin-top: 8px; font-size: 12px; letter-spacing: .25em; color: var(--mist); }

.brand-story {
  width: 100%;
  padding: clamp(50px, 8vh, 90px) clamp(24px, 5vw, 60px) clamp(120px, 16vh, 170px);
  background: linear-gradient(180deg, rgba(26, 48, 80, .5) 0%, rgba(24, 44, 76, .9) 10%, rgba(24, 44, 76, .95) 100%);
}
.brand-story > * { max-width: 1100px; margin-left: auto; margin-right: auto; }
.bs-section { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: clamp(28px, 5vw, 70px); align-items: center; margin-bottom: clamp(60px, 9vh, 100px); }
.bs-section.reverse .bs-text { order: 2; }
.bs-text .bs-kicker { font-size: 11px; letter-spacing: .45em; color: var(--gold); margin-bottom: 18px; }
.bs-text p {
  font-size: clamp(15px, 1.8vmin, 17.5px); line-height: 2.25; color: rgba(243, 231, 207, .86);
  margin-bottom: 18px;
}
.bs-text .bs-kicker + p::first-letter {
  font-family: var(--f-brush); font-size: 3.1em; float: left;
  color: var(--cinnabar); line-height: .95; padding: 6px 12px 0 0;
}
.bs-figure {
  position: relative; border-radius: 18px; overflow: hidden;
  aspect-ratio: 4 / 3.6;
  border: 1px solid rgba(217, 176, 95, .25);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
}
.bs-figure img { opacity: 0; transform: scale(1.06); transition: opacity 1s, transform 1.4s var(--ease-out); }
.bs-figure img.loaded { opacity: 1; transform: scale(1); }
.bs-figure::before {
  content: ''; position: absolute; inset: 12px; z-index: 2;
  border: 1px solid rgba(243, 231, 207, .4); border-radius: 10px; pointer-events: none;
}
.bs-figure figcaption {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
  padding: 30px 22px 16px; font-size: 12px; letter-spacing: .2em; color: var(--cloud);
  background: linear-gradient(transparent, rgba(6, 18, 24, .85));
}
.bs-highlight {
  display: grid; gap: 16px; margin: 6px 0 0;
}
.bs-highlight li {
  list-style: none; display: flex; gap: 14px; align-items: flex-start;
  padding: 18px 22px; border-radius: 14px;
  background: rgba(217, 176, 95, .07); border: 1px solid rgba(217, 176, 95, .2);
  font-size: 15px; line-height: 1.8; color: var(--cream);
}
.bs-highlight li::before {
  content: ''; flex: none; width: 14px; height: 14px; margin-top: 5px; border-radius: 50%;
  background: radial-gradient(circle at 50% 45%, var(--gold-2) 0 22%, #0e7c7b 23% 55%, #0b2128 56% 100%);
  box-shadow: 0 0 10px rgba(233, 196, 106, .4);
}
.bs-quote {
  margin: 10px 0 0; padding: 44px 36px; text-align: center;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
  position: relative;
}
.bs-quote::before { content: '「'; position: absolute; top: 8px; left: 14px; font-family: var(--f-serif); font-size: 52px; color: rgba(217, 176, 95, .3); }
.bs-quote::after { content: '」'; position: absolute; bottom: -18px; right: 14px; font-family: var(--f-serif); font-size: 52px; color: rgba(217, 176, 95, .3); }
.bs-quote p { font-family: var(--f-brush); font-size: clamp(22px, 3.4vmin, 36px); color: var(--gold-2); line-height: 1.7; margin: 0; text-align: center; }

/* 滚动进入 */
.srv { opacity: 0; transform: translateY(40px); transition: opacity .9s var(--ease-out), transform .9s var(--ease-out); }
.srv.in { opacity: 1; transform: none; }

.brand-more {
  text-align: center; padding-top: 20px;
}
.brand-more button {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 34px; border-radius: 999px;
  border: 1px solid var(--gold); color: var(--gold-2);
  letter-spacing: .3em; text-indent: .3em; font-size: 14px;
  background: rgba(217, 176, 95, .08);
  transition: background .3s, box-shadow .3s, transform .3s;
}
.brand-more button:hover { background: rgba(217, 176, 95, .2); box-shadow: 0 0 26px rgba(217, 176, 95, .25); transform: translateY(-2px); }

/* ============================================================
 * AI 对话条（每页底部常驻） & 聊天窗
 * ============================================================ */
.chat-dock {
  position: fixed;
  right: clamp(18px, 3vmin, 30px);
  bottom: 78px;
  z-index: var(--z-dock);
  display: flex; align-items: center; gap: 12px;
  min-width: 250px; max-width: 330px;
  padding: 8px 16px 8px 9px;
  border-radius: 999px; cursor: pointer;
  background: linear-gradient(100deg, rgba(20, 46, 64, .72), rgba(12, 32, 44, .66));
  border: 1px solid rgba(217, 176, 95, .38);
  backdrop-filter: blur(10px) saturate(1.1);
  -webkit-backdrop-filter: blur(10px) saturate(1.1);
  box-shadow: 0 14px 36px rgba(4, 14, 22, .5), 0 0 22px rgba(14, 124, 123, .14);
  opacity: 0; visibility: hidden;
  transform: translateY(14px);
  transition: opacity .5s var(--ease-out) .5s, transform .5s var(--ease-out) .5s,
             width .35s var(--ease-out), height .35s var(--ease-out),
             visibility .5s, box-shadow .3s, border-color .3s;
}
body.started .chat-dock { opacity: 1; visibility: visible; transform: none; }
.chat-dock:hover {
  border-color: var(--gold);
  box-shadow: 0 18px 42px rgba(4, 14, 22, .55), 0 0 30px rgba(233, 196, 106, .25);
  transform: translateY(-2px);
}
.dock-avatar {
  flex: none; width: 40px; height: 40px; border-radius: 50%;
  object-fit: cover; border: 1px solid rgba(233, 196, 106, .55);
  background: radial-gradient(circle at 50% 35%, #1d5c63, #0a3538);
  box-shadow: 0 0 12px rgba(14, 124, 123, .45);
}
.dock-text {
  flex: 1; min-width: 0;
  font-size: 13px; letter-spacing: .05em; color: var(--mist);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.dock-text.swap { animation: dockTextIn .5s var(--ease-out); }
@keyframes dockTextIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
/* 收起按钮（收成圆形图标） */
.dock-fold {
  flex: none; width: 24px; height: 24px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--mist); background: transparent;
  border: 1px solid rgba(217, 176, 95, .3);
  transition: color .3s, border-color .3s, background .3s;
}
.dock-fold:hover { color: var(--gold-2); border-color: var(--gold); background: rgba(217, 176, 95, .14); }

/* 收起态：云小匠圆形图标悬浮模式（轻漂浮 + 金色脉冲光环）；
   与底部居中分页器同一行、居右，不额外占用纵向空间 */
.chat-dock.collapsed {
  width: 60px; height: 60px; min-width: 0;
  bottom: 20px;
  padding: 0; border-radius: 50%;
  animation: dockFloat 3.6s ease-in-out infinite;
}
@keyframes dockFloat {
  0%, 100% { transform: translateY(0) rotate(-3deg); }
  50%      { transform: translateY(-7px) rotate(3deg); }
}
.chat-dock.collapsed::before {
  content: ''; position: absolute; inset: -5px; border-radius: 50%;
  border: 2px solid rgba(233, 196, 106, .7);
  animation: dockHalo 2.8s ease-out infinite;
  pointer-events: none;
}
@keyframes dockHalo {
  0%   { transform: scale(.84); opacity: .85; }
  70%, 100% { transform: scale(1.24); opacity: 0; }
}
.chat-dock.collapsed .dock-text,
.chat-dock.collapsed .dock-fold { display: none; }
.chat-dock.collapsed .dock-avatar {
  width: 100%; height: 100%;
  border-radius: 50%; border: none;
  box-shadow: inset 0 0 0 1px rgba(233, 196, 106, .55), 0 0 14px rgba(14, 124, 123, .4);
}
.chat-dock.collapsed:hover { box-shadow: 0 16px 38px rgba(4, 14, 22, .55), 0 0 26px rgba(233, 196, 106, .4); }

/* 聊天窗展开时，收起底部入口 */
body.chat-open .chat-dock { opacity: 0; visibility: hidden; transform: translateY(14px); pointer-events: none; }
body.chat-open .chat-dock.collapsed { transform: translateY(14px) scale(.9); animation: none; }

.chat-avatar { flex: none; width: 46px; align-self: flex-end; animation: avatarBob 4s ease-in-out infinite; }
.chat-avatar-img {
  display: block; width: auto; height: 52px; object-fit: contain;
  filter: drop-shadow(0 4px 10px rgba(6, 30, 40, .5));
}

/* 聊天窗 */
.chat {
  position: fixed; z-index: var(--z-chat);
  right: clamp(18px, 3vmin, 30px);
  bottom: calc(clamp(86px, 11vmin, 108px) + env(safe-area-inset-bottom));
  width: min(390px, calc(100vw - 36px));
  height: min(580px, calc(100dvh - 140px));
  display: flex; flex-direction: column;
  border-radius: 22px; overflow: hidden;
  background: linear-gradient(180deg, rgba(12, 38, 43, .34), rgba(8, 26, 30, .3));
  backdrop-filter: blur(5px) saturate(1.1);
  -webkit-backdrop-filter: blur(5px) saturate(1.1);
  border: 1px solid rgba(217, 176, 95, .3);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .55), 0 0 40px rgba(14, 124, 123, .15);
  transform-origin: right bottom;
  transform: translateY(26px) scale(.92); opacity: 0; visibility: hidden;
  transition: transform .45s var(--ease-out), opacity .45s, visibility .45s;
}
.chat.open { transform: none; opacity: 1; visibility: visible; }
.chat-head {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 16px 14px;
  border-bottom: 1px solid rgba(217, 176, 95, .2);
  background:
    linear-gradient(90deg, rgba(47, 134, 184, .16), transparent),
    rgba(40, 66, 100, .28);
}
@keyframes avatarBob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
.chat-title { flex: 1; }
.chat-title b { font-family: var(--f-display); font-weight: 400; font-size: 18px; letter-spacing: .12em; display: block; color: var(--cream); }
.chat-title small { font-family: var(--f-body); font-size: 10px; background: var(--cinnabar); color: #fff4e2; padding: 2px 8px; border-radius: 8px; margin-left: 8px; letter-spacing: .15em; }
.chat-status { display: flex; align-items: center; gap: 7px; font-size: 11px; color: var(--mist); margin-top: 3px; }
.chat-status i { width: 7px; height: 7px; border-radius: 50%; background: #5fd6a4; box-shadow: 0 0 8px #5fd6a4; }
.chat-close { color: var(--mist); padding: 6px; border-radius: 50%; transition: color .3s, background .3s; }
.chat-close:hover { color: var(--cinnabar); background: rgba(194, 85, 61, .12); }

.chat-msgs { flex: 1; overflow-y: auto; padding: 20px 16px; display: flex; flex-direction: column; gap: 16px; scrollbar-width: thin; scrollbar-color: transparent transparent; }
.chat-msgs::-webkit-scrollbar { width: 3px; }
.chat-msgs::-webkit-scrollbar-thumb { background: transparent; }
.msg { display: flex; gap: 10px; max-width: 88%; animation: msgIn .4s var(--ease-out); }
@keyframes msgIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.msg-avatar {
  flex: none; width: 30px; height: 30px; border-radius: 50%;
  background: radial-gradient(circle at 50% 40%, #2bb6a8, #0a4f52);
  border: 1px solid rgba(233, 196, 106, .5);
  display: flex; align-items: center; justify-content: center;
  font-size: 14px;
}
.msg-bubble {
  padding: 12px 16px; border-radius: 4px 16px 16px 16px;
  background: rgba(217, 176, 95, .09); border: 1px solid rgba(217, 176, 95, .18);
  font-size: 14px; line-height: 1.85; color: rgba(243, 231, 207, .92);
}
.msg-bubble b { color: var(--gold-2); font-weight: 500; }
.msg-bubble .msg-brand {
  display: block; margin-top: 8px; padding: 8px 12px; border-radius: 10px;
  background: rgba(47, 134, 184, .18); border: 1px solid rgba(47, 134, 184, .35);
  color: var(--cream); text-align: left; width: 100%;
  font-size: 13px; letter-spacing: .05em;
  transition: background .3s, border-color .3s;
}
.msg-bubble .msg-brand:hover { background: rgba(47, 134, 184, .38); border-color: var(--gold); }
.msg.user { align-self: flex-end; }
.msg.user .msg-bubble {
  background: linear-gradient(135deg, rgba(217, 176, 95, .9), rgba(185, 138, 61, .9));
  color: #2a1a06; border: none; border-radius: 16px 4px 16px 16px;
  font-weight: 400;
}
.typing { display: inline-flex; gap: 5px; padding: 4px 2px; }
.typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--gold-2); opacity: .5; animation: typing 1.2s infinite; }
.typing span:nth-child(2) { animation-delay: .2s; } .typing span:nth-child(3) { animation-delay: .4s; }
@keyframes typing { 0%,60%,100% { transform: translateY(0); opacity: .4; } 30% { transform: translateY(-5px); opacity: 1; } }

.msg-quotes {
  margin-top: 10px; padding-top: 8px;
  border-top: 1px dashed rgba(217, 176, 95, .25);
  font-size: 12.5px; color: rgba(243, 231, 207, .72);
}
.msg-quotes .mq-title {
  display: inline-block; padding: 1px 8px; border-radius: 8px;
  background: rgba(217, 176, 95, .14); border: 1px solid rgba(217, 176, 95, .3);
  color: var(--gold-2); font-size: 11.5px; letter-spacing: .08em; margin-bottom: 6px;
}
.msg-quotes .mq-list { display: flex; flex-direction: column; gap: 4px; }
.msg-quotes .mq-item { display: flex; align-items: baseline; gap: 8px; line-height: 1.55; }
.msg-quotes .mq-idx {
  flex: none; width: 18px; height: 18px; border-radius: 50%;
  background: rgba(217, 176, 95, .18); color: var(--gold-2);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px;
}
.msg-quotes .mq-body { flex: 1; min-width: 0; }
.msg-quotes .mq-body a { color: rgba(180, 220, 230, .92); text-decoration: none; word-break: break-word; }
.msg-quotes .mq-body a:hover { color: var(--gold); text-decoration: underline; }

.chat-chips { display: flex; gap: 8px; padding: 0 16px 10px; flex-wrap: wrap; }
.chip {
  padding: 7px 14px; border-radius: 999px; font-size: 12px;
  border: 1px solid rgba(217, 176, 95, .35); color: var(--gold-2);
  background: rgba(217, 176, 95, .06);
  transition: background .3s, transform .2s;
}
.chip:hover { background: rgba(217, 176, 95, .2); transform: translateY(-2px); }
.chat-form { display: flex; gap: 10px; padding: 12px 14px 14px; border-top: 1px solid rgba(217, 176, 95, .16); }
.chat-input {
  flex: 1; background: rgba(40, 66, 100, .38); border: 1px solid rgba(217, 176, 95, .25);
  border-radius: 999px; padding: 11px 18px; color: var(--cream);
  font-family: inherit; font-size: 14px; outline: none;
  transition: border-color .3s, box-shadow .3s;
}
.chat-input::placeholder { color: rgba(243, 231, 207, .35); }
.chat-input:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(217, 176, 95, .12); }
.chat-send {
  flex: none; width: 42px; height: 42px; border-radius: 50%;
  background: linear-gradient(135deg, var(--gold-2), var(--gold-deep)); color: #2a1a06;
  display: flex; align-items: center; justify-content: center;
  transition: transform .3s, box-shadow .3s;
}
.chat-send:hover { transform: scale(1.08); box-shadow: 0 0 18px rgba(233, 196, 106, .5); }

/* 语音输入话筒 */
.chat-mic {
  position: relative;
  flex: none; width: 42px; height: 42px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--gold-2);
  background: rgba(40, 66, 100, .5);
  border: 1px solid rgba(217, 176, 95, .3);
  transition: background .3s, border-color .3s, transform .2s, box-shadow .3s;
}
.chat-mic[hidden] { display: none; }
.chat-mic:hover { border-color: var(--gold); transform: scale(1.06); }
.chat-mic:disabled { opacity: .4; pointer-events: none; }
.chat-mic .ic-mic-off { display: none; }
.chat-mic.listening {
  background: linear-gradient(135deg, #e06a60, #a83f38);
  border-color: rgba(255, 214, 200, .8);
  color: #fff4e2;
  animation: micPulse 1.2s ease-out infinite;
}
.chat-mic.listening .ic-mic-on { display: none; }
.chat-mic.listening .ic-mic-off { display: block; }
@keyframes micPulse {
  0% { box-shadow: 0 0 0 0 rgba(224, 106, 96, .55); }
  70% { box-shadow: 0 0 0 12px rgba(224, 106, 96, 0); }
  100% { box-shadow: 0 0 0 0 rgba(224, 106, 96, 0); }
}
.chat-mic-tip {
  position: absolute; left: 14px; right: 14px; bottom: 76px;
  padding: 8px 14px; border-radius: 10px;
  background: rgba(194, 85, 61, .92); color: #fff4e2;
  font-size: 12px; letter-spacing: .05em; text-align: center;
  opacity: 0; transform: translateY(6px); pointer-events: none;
  transition: opacity .3s, transform .3s;
}
.chat-mic-tip.show { opacity: 1; transform: none; }

/* ============================================================
 * 真实数据：层级 / 视频 / 占位 / 杂志正文
 * ============================================================ */
.lv-pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 15px; border-radius: 999px;
  font-size: 12px; font-style: normal; letter-spacing: .18em;
  background: rgba(40, 66, 100, .46); border: 1px solid var(--line);
  color: var(--cream); backdrop-filter: blur(6px);
}
.lv-pill b { color: var(--gold-2); font-weight: 600; }
.lv-pill.lv-national { border-color: rgba(215, 87, 78, .8); color: #ffe6df; background: rgba(215, 87, 78, .28); }
.lv-pill.lv-national b { color: #ffd9a8; }
.lv-pill.lv-provincial { border-color: rgba(220, 180, 94, .8); }
.lv-pill.lv-city { border-color: rgba(91, 131, 214, .7); color: #e3ecff; background: rgba(91, 131, 214, .22); }

/* 分组标题 */
.cb-label { position: relative; }
.cb-label span { margin-left: auto; color: var(--mist); font-size: 12px; letter-spacing: .2em; }
.cb-seal {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 7px; margin-right: 12px;
  font-style: normal; font-family: var(--f-brush); font-size: 18px;
  background: rgba(217, 176, 95, .16); border: 1px solid var(--gold);
  color: var(--gold-2); transform: rotate(-4deg);
}
.cb-seal.lv-national { background: rgba(215, 87, 78, .9); border-color: var(--yun-red); color: #fff3e8; }
.cb-seal.lv-provincial { background: rgba(220, 180, 94, .9); color: #241708; }
.cb-seal.lv-city { background: rgba(91, 131, 214, .82); color: #f0f5ff; }
.cb-label { display: flex; align-items: center; gap: 6px; }

/* 卡片层级描边 */
.brand-card.lv-national { border-color: rgba(217, 116, 84, .5); }
.brand-card.lv-national .bc-line { background: linear-gradient(90deg, var(--cinnabar), var(--gold), transparent); }

/* 视频缩略 */
.bc-img video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.bc-img.is-video, .bc-img video { background: #000; }
/* 视频控制：播放键仅暂停时显示，全屏键常驻右下角 */
.v-chrome { position: absolute; z-index: 3; }
.v-play {
  left: 50%; top: 50%;
  width: 52px; height: 52px; transform: translate(-50%, -50%);
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: rgba(20, 34, 52, .5); border: 1.4px solid rgba(243, 231, 207, .85);
  backdrop-filter: blur(4px); cursor: pointer;
  transition: opacity .3s, transform .35s var(--ease-out), background .3s;
}
.v-play svg { width: 22px; height: 22px; fill: var(--cream); margin-left: 3px; }
.v-play:hover { background: rgba(194, 85, 61, .75); }
.v-play.is-hidden { opacity: 0; pointer-events: none; transform: translate(-50%, -50%) scale(.8); }
.v-fs {
  right: 10px; bottom: 10px;
  width: 34px; height: 34px; border-radius: 10px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  background: rgba(20, 34, 52, .5); border: 1px solid rgba(243, 231, 207, .5);
  backdrop-filter: blur(4px);
  transition: background .25s, transform .25s;
}
.v-fs svg { width: 16px; height: 16px; stroke: var(--cream); fill: none; stroke-width: 2; }
.v-fs:hover { background: rgba(194, 85, 61, .75); transform: scale(1.08); }

/* 无图占位 */
.bc-img.bc-noimg {
  background:
    radial-gradient(90% 80% at 110% -10%, color-mix(in srgb, var(--a, #4398c9) 55%, transparent), transparent 70%),
    linear-gradient(155deg, #2c5a8c 0%, #1e4268 78%);
  overflow: hidden;
}
.bc-ph-wm {
  position: absolute; z-index: 0; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--f-brush); font-size: 64px; line-height: 1.4; color: rgba(243, 231, 207, .07);
  white-space: nowrap; transform: rotate(-14deg); padding: 0.14em 14px 0; text-align: center;
}
.bc-ph-char {
  position: absolute; z-index: 1; left: 16px; bottom: 8px;
  font-family: var(--f-brush); font-size: 96px; line-height: 1.2;
  color: rgba(233, 196, 106, .28); text-shadow: 0 6px 24px rgba(0, 0, 0, .4);
  transition: transform .45s var(--ease-out), color .35s;
}
.brand-card:hover .bc-ph-char { transform: translateY(-6px) scale(1.06); color: rgba(233, 196, 106, .5); }

/* 品牌详情头图视频 */
.brand-hero-img.is-video::after { z-index: 2; }
.brand-hero-img.is-video video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; background: #000; }
/* 杂志正文（单栏排版） */
.bs-prose {
  max-width: 780px; margin: 0 auto;
  padding: 8px 4px 10px;
}
.bs-prose .bs-kicker {
  text-align: center; font-size: 11px; letter-spacing: .6em;
  color: var(--gold); margin-bottom: 30px; position: relative;
}
.bs-prose .bs-kicker::before, .bs-prose .bs-kicker::after {
  content: ''; display: inline-block; vertical-align: middle;
  width: 46px; height: 1px; background: var(--line); margin: 0 18px;
}
.bs-prose p {
  font-family: var(--f-serif);
  font-size: clamp(15.5px, 1.85vmin, 18px);
  line-height: 2.3; color: rgba(243, 231, 207, .9);
  margin-bottom: 26px; text-align: justify;
}
.bs-prose .bs-kicker + p::first-letter {
  font-family: var(--f-brush); font-size: 3.1em; float: left;
  color: var(--cinnabar); line-height: .92; padding: 6px 14px 0 0;
}
.bs-empty {
  text-align: center; padding: 70px 20px; color: var(--gold);
  border: 1px dashed var(--line); border-radius: 16px;
}
.bs-empty svg { margin-bottom: 18px; opacity: .7; }
.bs-empty p { font-size: 15px; line-height: 2.1; color: var(--mist); margin: 0; text-align: center; }

.bs-figure-wide { max-width: 920px; margin: 20px auto 0; aspect-ratio: 16 / 8.4; }

/* ============================================================
 * 正文排版规范：成段正文统一黑体、字号、行高
 * 首行缩进两格、左右两端对齐（标题/标签/按钮不受影响）
 * ============================================================ */
.intro-desc, .story-text, .city-intro {
  font-family: var(--f-body);
  font-size: var(--fs-p);
  line-height: var(--lh-p);
  text-indent: 2em;
  text-align: justify;
}

/* ============================================================
 * 竖屏（手机竖屏 / 平板竖屏）
 * ============================================================ */
@media (orientation: portrait) {
  .track { flex-direction: column; overflow-x: hidden; overflow-y: auto; scroll-snap-type: y mandatory; }
  .page { flex: 0 0 auto; }

  .intro-body { grid-template-columns: 1fr; gap: 8px; align-content: center; }
  .intro-art { display: none; }
  .intro-title { white-space: normal; }
  .it-line { white-space: normal; }
  .intro-top-note { display: none; }
  .brand-logo { height: 28px; }
  .brand-mark span { font-size: 14px; letter-spacing: .1em; }
  .intro-stats { margin-top: 30px; }
  .sh-h { display: none; }
  .sh-v { display: inline; }
  .scroll-hint { right: auto; left: 50%; bottom: 60px; transform: translateX(-50%); }
  .sh-text { writing-mode: horizontal-tb; letter-spacing: .3em; }
  .sh-track { width: 64px; height: 1px; }
  .sh-dot { width: 22px; height: 1px; animation: hintRunV 2.2s var(--ease-soft) infinite; }
  @keyframes hintRunV { 0% { left: -30%; top: 0; } 100% { left: 110%; top: 0; } }

  .page-promo { padding: 14px 10px 158px; }
  /* “图/会/策”页：圆标与分页点同排，底部留白收紧，内容区加长 */
  .page-map, .page-events, .page-policy { padding: 8px 10px 70px; }

  /* 成段正文：手机端统一字号/行高，保持缩进与两端对齐 */
  .intro-desc, .story-text, .city-intro {
    font-size: var(--fs-p-mobile);
    line-height: 1.9;
  }

  /* 政策列表手机端紧凑排布 */
  .pl-head { margin-bottom: 14px; }
  .pl-row { gap: 10px; padding: 14px 14px; }
  .pl-idx { width: 28px; }
  .pl-kind { width: 44px; }
  .pl-kind svg { width: 19px; }
  .pl-go span { display: none; }
  .pl-more-btn { width: 100%; justify-content: center; }
  .pl-overlay-inner { padding: 12px; }
  .pl-panel { max-height: 88vh; }
  /* 序章为单屏页：仅避开底部悬浮条，不过度压缩内容 */
  .page-intro { padding-bottom: 104px; }
  .map-head { gap: 8px; }
  .map-hint { font-size: 11px; margin-right: 0; }
  /* 英文/中文眉标手机端分两行 */
  .map-kicker i { display: block; margin-left: 0; }
  .map-kicker i::before { content: none; }
  .map-stage { flex-direction: column; gap: 6px; }
  /* 手机端地图尽量铺满：允许外投影溢出框体（页面层仍会裁切） */
  .map-frame { flex: 1 1 auto; min-height: 280px; overflow: visible; }
  /* 地图热点与云朵名牌在小屏上收紧，保持清晰可读 */
  .map-hot .hot-dot { width: 9px; height: 9px; }
  .map-hot .hot-name { width: 40px; height: 23px; }
  .map-hot .hot-name-in {
    font-size: 8.5px; letter-spacing: .04em;
    text-shadow: 0 1px 0 rgba(255, 240, 210, .5), 0 1px 2px rgba(120, 62, 18, .55);
    filter: drop-shadow(0 3px 3px rgba(90, 50, 18, .42));
  }
  .map-hot .hot-name.len3 { width: 50px; }
  .map-hot .hot-name.len4 { width: 62px; }
  .map-hot .hot-name.len4 .hot-name-in { font-size: 8px; }
  .map-hot.name-up .hot-name { bottom: 8px; }
  .map-hot.name-r .hot-name { left: 8px; }
  .map-hot.name-rd .hot-name { left: 8px; top: 7px; }
  .map-hot.name-ld .hot-name { right: 8px; top: 7px; }
  /* ---- 竖屏专属方位重排（桌面横屏布局不受影响），解决小画布云朵相挤 ---- */
  /* 怒江：小号云朵置于点上方居中（丽江同期改到点右侧，互不干扰） */
  .map-hot[data-id="533300"] .hot-name {
    width: 36px; height: 21px;
    left: 50%; right: auto; top: auto; bottom: 8px;
    animation-name: cloudBobUp;
  }
  .map-hot[data-id="533300"] .hot-name-in { font-size: 8px; }
  /* 丽江：改到点右侧，让出纳江上方空间 */
  .map-hot[data-id="530700"] .hot-name {
    left: 8px; right: auto; top: 50%; bottom: auto;
    animation-name: cloudBobSide;
  }
  /* 保山：移到点上方 */
  .map-hot[data-id="530500"] .hot-name {
    left: 50%; right: auto; top: auto; bottom: 9px;
    animation-name: cloudBobUp;
  }
  /* 普洱：移到点左侧 */
  .map-hot[data-id="530800"] .hot-name {
    right: 8px; left: auto; top: 50%; bottom: auto;
    animation-name: cloudBobSide;
  }
  /* 玉溪：移到点左侧，避开上移后的红河云 */
  .map-hot[data-id="530400"] .hot-name {
    right: 11px; left: auto; top: 50%; bottom: auto;
    animation-name: cloudBobSide;
  }
  /* 红河：移到点上方 */
  .map-hot[data-id="532500"] .hot-name {
    left: 50%; right: auto; top: auto; bottom: 9px;
    animation-name: cloudBobUp;
  }
  .map-side { flex: 0 0 16%; min-height: 185px; padding: 12px 12px 10px; }
  .side-title { padding-bottom: 9px; font-size: 11px; }
  .city-list { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; align-content: start; }
  .city-item { padding: 5px 10px; gap: 8px; }
  .city-name { font-size: 13px; }
  .city-motto { display: none; }
  .side-foot { padding-top: 9px; font-size: 11px; }

  /* 分页器贴底居中，AI 入口在其上方 */
  .pager { bottom: 14px; }
  .pg-btn { display: none; }
  .pg-dot { width: 24px; height: 24px; font-size: 11px; }

  /* 宣传片竖屏：概述+视频可纵向滚动 */
  .promo-frame { width: 100%; }
  .promo-stage-title, .ev-city, .pl-head-title { font-size: 16px; letter-spacing: .1em; }
  .promo-head .promo-stage-title { margin-top: 8px; }
  .promo-story { margin: 6px 0 0; }
  .promo-stage { margin-top: 14px; }
  .promo-divider { margin: 16px 0 2px; }
  .pd-gem { width: 8px; height: 8px; margin: 0 12px; }
  .story-scroll { padding: 11px 14px; }
  .story-text { font-size: 13px; line-height: 1.9; text-align: justify; text-indent: 2em; }
  .story-coda { margin: 14px auto 0; font-size: 10.5px; letter-spacing: .12em; animation: none; opacity: .85; }
  .promo-head .map-hint { display: none; }

  /* 聊天窗落在底部对话条上方 */
  .chat {
    right: 14px; bottom: calc(80px + env(safe-area-inset-bottom));
    width: calc(100vw - 28px);
    height: min(560px, calc(100dvh - 160px));
  }

  /* AI 对话条：分页器上方、左右占满；收起时为靠右圆形图标 */
  .chat-dock {
    left: 10px; right: 10px; bottom: calc(64px + env(safe-area-inset-bottom));
    min-width: 0; max-width: none;
    gap: 10px; padding: 7px 14px 7px 7px;
  }
  .dock-avatar { width: 36px; height: 36px; }
  .chat-dock.collapsed { left: auto; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); width: 52px; height: 52px; }
  .dock-text { font-size: 12.5px; }

  /* 大会风采：章节收紧，视频区隐藏侧列表、显示左右按钮 */
  .events-scroll::-webkit-scrollbar,
  .page-promo::-webkit-scrollbar,
  .page-events::-webkit-scrollbar, .page-policy::-webkit-scrollbar,
  .policy-scroll::-webkit-scrollbar, .city-list::-webkit-scrollbar,
  .chat-msgs::-webkit-scrollbar { width: 4px; }
  .events-scroll-inner { padding: 0 0 20px; }
  .ev-chapter { padding: 4px 0 22px 22px; margin-left: 6px; }
  .ev-ch-head { gap: 12px; margin: 10px 0 14px; }
  .ev-ch-head::before { left: -27px; }
  .ev-badge { width: 52px; height: 52px; font-size: 11px; }
  .ev-watermark { font-size: 84px; top: -18px; right: 0; }
  .ev-g-head { margin: 16px 0 10px; }
  .ev-videos { margin: 4px 0 22px; }
  .ev-vmain { aspect-ratio: 16 / 9; border-radius: 12px; }
  .ev-vmain .ev-play { width: 60px; height: 60px; }
  .ev-vmain .ev-cap { font-size: 12.5px; padding: 24px 14px 10px; }
  /* 隐藏右侧列表，显示左右切换按钮 + 指示器 */
  .ev-vlist { display: none; }
  .ev-vnav { display: flex; }
  .ev-vind { display: block; }
  .ev-icard { width: 240px; }

  /* 灯箱贴边、切换钮缩小 */
  .mv-stage { padding: 70px 14px 40px; gap: 10px; }
  .mv-stage img { max-height: 74%; }
  .mv-stage figcaption { font-size: 12.5px; }
  .mv-nav { width: 40px; height: 40px; }
  .mv-prev { left: 8px; }
  .mv-next { right: 8px; }

  .brand-grid { grid-template-columns: 1fr; }
  .bs-section, .bs-section.reverse { grid-template-columns: 1fr; gap: 24px; }
  .bs-section.reverse .bs-text { order: 0; }
  .bs-figure { aspect-ratio: 16 / 10; }
  .bstat { min-width: 33.33%; padding: 18px 12px; }
  .brand-stats { margin: -26px 16px 0; }
  .ov-close { top: 14px; left: 14px; padding: 9px 15px 9px 12px; }
}

/* ============================================================
 * 平板（768–1023px）：视频区隐藏侧列表，改用左右按钮切换
 * ============================================================ */
@media (min-width: 768px) and (max-width: 1023px) {
  .events-scroll-inner { max-width: 920px; }
  .ev-vmain { aspect-ratio: 16 / 9; }
  .ev-vlist { display: none; }
  .ev-vnav { display: flex; }
  .ev-vind { display: block; }
  .ev-icard { width: 260px; }
}

/* 手机横屏（<768px landscape）：视频区左右按钮切换，图片横滚 */
@media (max-width: 767px) and (orientation: landscape) {
  .ev-vmain { aspect-ratio: 21 / 9; max-height: 52vh; }
  .ev-vlist { display: none; }
  .ev-vnav { display: flex; }
  .ev-vind { display: block; }
  .ev-icard { width: 220px; }
}

/* 超小屏 */
@media (max-width: 380px) {
  .intro-title { font-size: 34px; }
  .city-list { grid-template-columns: 1fr 1fr; }
}

/* 亮点栅格 */
.hl-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
@media (orientation: portrait) { .hl-grid { grid-template-columns: 1fr; } }

/* 图片容器兜底纹理（加载中 / 失败时） */
.img-fallback {
  background:
    radial-gradient(80% 70% at 50% 30%, rgba(47, 134, 184, .35), transparent 72%),
    radial-gradient(50% 50% at 80% 90%, rgba(217, 176, 95, .14), transparent 70%),
    linear-gradient(160deg, #25507e, #18335a);
}
.img-fallback img.failed { display: none; }

/* 开屏未结束时锁定主轨道 */
body:not(.started) .track { overflow: hidden !important; }

/* 减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .15s !important; }
}