/* ==================== CMS 内容块（Block）基础样式 ====================
   由后台「内容管理 → 内容块」配置，前台任意页面插槽输出。
   每个块统一结构：.cms-block > (.cms-block-title) + 内容
   布局：插槽容器 .cms-blocks 为 12 栅格；块默认整行（span 12，维持多块纵向堆叠），
   当后台把「主区顶部 / 主区底部」的块占位设为 1/2、1/3、2/3、1/4 时，
   服务端在 wrapper 输出 cms-block-col-*，多个小于整行的块将按栅格自动并排换行。
*/

.cms-blocks{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 18px;
  margin-bottom: 20px;
}
.cms-blocks:last-child{
  margin-bottom: 0;
}

.cms-block{
  grid-column: span 12;      /* 默认整行 */
  min-width: 0;
  background: #fff;
  border-radius: 10px;
  padding: 18px 20px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .05);
}

/* 栅格占位（仅主区顶部/底部插槽输出对应 class；顶栏/侧栏/页脚恒为整行） */
.cms-block-col-half{grid-column: span 6;}
.cms-block-col-third{grid-column: span 4;}
.cms-block-col-two-third{grid-column: span 8;}
.cms-block-col-quarter{grid-column: span 3;}

/* 窄屏回退单列 */
@media (max-width: 768px){
  .cms-block-col-half,
  .cms-block-col-third,
  .cms-block-col-two-third,
  .cms-block-col-quarter{
    grid-column: span 12;
  }
}

.cms-block-title{
  font-size: 17px;
  font-weight: 700;
  margin: 0 0 14px;
  padding-left: 12px;
  border-left: 4px solid #2f6fed;
  line-height: 1.2;
}

/* 图片块 */
.cms-block-images{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.cms-block-images img{
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
}
.cms-block-img{
  display: inline-block;
  max-width: 100%;
}
/* 广告位块固定高度模式：宽度铺满整个块，object-fit 裁切 */
.cms-block-ads.cms-block-ads-fixed{
  flex-direction: column;
  align-items: stretch;
}
.cms-block-ads.cms-block-ads-fixed .cms-block-img{
  display: block;
  width: 100%;
}
.cms-block-ads.cms-block-ads-fixed img{
  width: 100%;
  height: var(--cms-ad-height, auto);
  object-fit: cover;
}

/* 文章列表 / 栏目导航 */
.cms-block-list{
  list-style: none;
  margin: 0;
  padding: 0;
}
.cms-block-list li{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px dashed #ececec;
}
.cms-block-list li:last-child{
  border-bottom: none;
}
.cms-block-thumb{
  flex-shrink: 0;
  width: 72px;
  height: 48px;
  overflow: hidden;
  border-radius: 4px;
}
.cms-block-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.cms-block-link{
  flex: 1;
  min-width: 0;
  color: #333;
  text-decoration: none;
  font-size: 14px;
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cms-block-link:hover{
  color: #2f6fed;
}
.cms-block-time{
  flex-shrink: 0;
  color: #999;
  font-size: 12px;
}

/* 侧栏内块：紧凑化（间距由容器 grid gap 控制，保持原 16px） */
.sidebar .cms-blocks,
.sg-sidebar .cms-blocks{
  row-gap: 16px;
}
.sidebar .cms-block,
.sg-sidebar .cms-block{
  padding: 14px 16px;
}
.sidebar .cms-block-title,
.sg-sidebar .cms-block-title{
  font-size: 15px;
  margin-bottom: 10px;
}

/* 顶部通栏 / 页脚：去卡片化 */
.cms-blocks-header .cms-block,
.cms-blocks-footer .cms-block{
  box-shadow: none;
  border-radius: 0;
}

/* 友情链接块：标签式排列 */
.cms-block-links{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.cms-block-links li{
  display: block;
  padding: 0;
  border-bottom: none;
}
.cms-block-links .cms-block-link{
  display: inline-block;
  padding: 5px 14px;
  background: #f4f6f9;
  border: 1px solid #eceef1;
  border-radius: 999px;
  font-size: 13px;
  color: #555;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 220px;
  transition: all .2s;
}
.cms-block-links .cms-block-link:hover{
  color: #2f6fed;
  border-color: #2f6fed;
  background: rgba(47, 111, 237, .06);
}

/* 视频块 */
.cms-block-videos{
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.cms-video-item video{
  width: 100%;
  max-height: 380px;
  background: #000;
  border-radius: 8px;
  display: block;
}
.cms-video-title{
  margin: 8px 0 0;
  font-size: 14px;
  color: #333;
}

/* 排行榜 */
.cms-block-rank .rank-no{
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  font-size: 12px;
  color: #888;
  background: #f2f3f5;
  border-radius: 4px;
}
.cms-block-rank .rank-no-top{
  color: #fff;
  background: #f56c6c;
}

/* 公告条（单行向上滚动） */
.cms-block-notice{
  display: flex;
  align-items: center;
  gap: 10px;
  height: 38px;
  overflow: hidden;
}
.cms-block-notice .notice-badge{
  flex-shrink: 0;
  padding: 2px 8px;
  font-size: 12px;
  color: #fff;
  background: #f56c6c;
  border-radius: 4px;
}
.cms-notice-scroll{
  flex: 1;
  min-width: 0;
  height: 100%;
  overflow: hidden;
}
.cms-notice-scroll ul{
  list-style: none;
  margin: 0;
  padding: 0;
}
.cms-notice-scroll ul li{
  height: 38px;
  line-height: 38px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px;
  color: #555;
}
.cms-notice-scroll ul li a{
  color: #555;
  text-decoration: none;
}
.cms-notice-scroll ul li a:hover{
  color: #2f6fed;
}
.cms-notice-scroll ul li .notice-date{
  color: #a2abbb;
  font-size: 12px;
  margin-right: 10px;
}

/* Tab 文章 */
.cms-block-tabs .tabs-head{
  display: flex;
  border-bottom: 2px solid #f0f2f5;
  margin-bottom: 4px;
  flex-wrap: wrap;
}
.cms-block-tabs .tabs-btn{
  appearance: none;
  border: none;
  background: none;
  cursor: pointer;
  padding: 8px 16px;
  font-size: 14px;
  color: #666;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition: color .2s, border-color .2s;
}
.cms-block-tabs .tabs-btn:hover{
  color: #2f6fed;
}
.cms-block-tabs .tabs-btn.active{
  color: #2f6fed;
  font-weight: 600;
  border-bottom-color: #2f6fed;
}
.cms-block-tabs .tabs-pane{
  display: none;
}
.cms-block-tabs .tabs-pane.active{
  display: block;
}

/* 二维码 */
.cms-block-qrcode{
  text-align: center;
  padding: 4px 0;
}
.cms-block-qrcode img{
  width: 132px;
  height: 132px;
  object-fit: contain;
  border-radius: 8px;
  border: 1px solid #eee;
}
.cms-block-qrcode .qrcode-text{
  margin: 10px 0 0;
  font-size: 14px;
  color: #333;
}
.cms-block-qrcode .qrcode-link{
  display: inline-block;
  margin-top: 4px;
  font-size: 12px;
  color: #999;
  word-break: break-all;
}

/* 站点统计 */
.cms-block-stats{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.cms-block-stats .stats-item{
  flex: 1;
  min-width: 96px;
  text-align: center;
  background: #f7f9fc;
  border-radius: 8px;
  padding: 14px 8px;
}
.cms-block-stats .stats-num{
  display: block;
  font-size: 24px;
  font-weight: 700;
  color: #2f6fed;
  line-height: 1.2;
}
.cms-block-stats .stats-label{
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: #999;
}

/* 分组链接 */
.cms-block-linkgroup{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.cms-block-linkgroup .linkgroup-item{
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.cms-block-linkgroup .linkgroup-name{
  flex-shrink: 0;
  margin-top: 6px;
  padding: 2px 8px;
  font-size: 12px;
  color: #2f6fed;
  background: rgba(47, 111, 237, .08);
  border-radius: 4px;
  white-space: nowrap;
}
.cms-block-linkgroup .linkgroup-links{
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  flex: 1;
  min-width: 0;
}
.cms-block-linkgroup .linkgroup-links .cms-block-link{
  flex: 0 1 auto;
  font-size: 13px;
}

/* 自定义表单 */
.cms-block-form .form-item{
  margin-bottom: 14px;
}
.cms-block-form .form-item label{
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
  color: #333;
}
.cms-block-form .form-item label em{
  color: #f56c6c;
  font-style: normal;
  margin-left: 2px;
}
.cms-block-form .form-item input[type="text"],
.cms-block-form .form-item input[type="number"],
.cms-block-form .form-item textarea,
.cms-block-form .form-item select{
  width: 100%;
  box-sizing: border-box;
  padding: 8px 12px;
  border: 1px solid #dcdfe6;
  border-radius: 6px;
  font-size: 14px;
  font-family: inherit;
  color: #333;
  outline: none;
  transition: border-color .2s;
}
.cms-block-form .form-item input:focus,
.cms-block-form .form-item textarea:focus,
.cms-block-form .form-item select:focus{
  border-color: #2f6fed;
}
.cms-block-form .form-item textarea{
  min-height: 90px;
  resize: vertical;
}
.cms-block-form .form-item .tips{
  margin-top: 4px;
  font-size: 12px;
  color: #999;
}
.cms-block-form .form-item .form-opt{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-right: 14px;
  font-size: 14px;
  color: #555;
}
.cms-block-form .form-footer{
  margin-top: 16px;
}
.cms-block-form .cms-block-form-btn{
  padding: 9px 32px;
  font-size: 14px;
  color: #fff;
  background: #2f6fed;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: opacity .2s;
}
.cms-block-form .cms-block-form-btn:hover{
  opacity: .88;
}
.cms-block-form .cms-block-form-btn:disabled{
  opacity: .6;
  cursor: not-allowed;
}
.cms-block-form .cms-block-form-msg{
  margin-top: 10px;
  font-size: 13px;
}
.cms-block-form .cms-block-form-msg.ok{
  color: #67c23a;
}
.cms-block-form .cms-block-form-msg.err{
  color: #f56c6c;
}

/* ============================================================
   Hero 横幅块（.cms-hero）：首页首屏，6 套纯 CSS 动画风格预设
   结构：bgimg 层(可选) / decor 装饰层 / inner 文案层
   ============================================================ */
.cms-hero{
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  min-height: 380px;
  margin: 24px 0 34px;
  padding: 56px;
  display: flex;
  align-items: center;
  border-radius: 18px;
  color: #eaf1ff;
  background:
    radial-gradient(760px 320px at 88% -12%, rgba(96,165,250,.35), transparent 60%),
    linear-gradient(132deg, #0a1733 0%, #0d2a66 58%, #0d3c90 100%);
  box-shadow: 0 26px 64px rgba(13,35,70,.24);
}
.cms-hero-bgimg{position:absolute;inset:0;background-repeat:no-repeat;background-size:cover;background-position:center;opacity:.45}
.cms-hero-decor{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.cms-hero-decor .cms-hx{position:absolute;display:block}
.cms-hero-inner{position:relative;z-index:2;width:100%}
.cms-hero-center .cms-hero-inner{display:flex;flex-direction:column;align-items:center;text-align:center}

/* ---- 徽标 / 标题 / 描述 ---- */
.cms-hero-badge{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:18px;
  padding:6px 14px;border-radius:999px;font-size:13px;font-weight:600;
  color:#cfe4ff;background:rgba(148,190,255,.12);border:1px solid rgba(150,190,255,.25);
}
.cms-hero-badge i{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 4px rgba(74,222,128,.18);animation:cmsHeroPulse 2.2s ease-in-out infinite}
.cms-hero-title{
  margin:0;font-size:clamp(30px,4.2vw,46px);line-height:1.2;letter-spacing:.5px;font-weight:800;
  color:#fff;
  background:linear-gradient(96deg,#fff 0%,#dbeafe 55%,#7ecbff 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  text-shadow:0 12px 42px rgba(8,20,50,.35);
}
.cms-hero-desc{margin:14px 0 0;max-width:640px;font-size:16px;line-height:1.8;color:#aebfe4}
.cms-hero-center .cms-hero-desc{max-width:680px}

/* ---- 按钮 ---- */
.cms-hero-actions{margin-top:30px;display:flex;flex-wrap:wrap;gap:14px}
.cms-hero-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 30px;border-radius:999px;line-height:1;
  font-size:15px;font-weight:600;text-decoration:none;cursor:pointer;border:1px solid transparent;
  -webkit-user-select:none;user-select:none;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease,
             color .2s ease, border-color .2s ease;
}
.cms-hero-btn:hover{transform:translateY(-2px)}
.cms-hero-btn:active{transform:translateY(0)}
/* 键盘/辅助聚焦：外圈高对比描边，避免焦点落在深底背景上不可辨 */
.cms-hero-btn:focus-visible{outline:3px solid rgba(255,255,255,.9);outline-offset:3px}
/* 主按钮（实心渐变）：文字纯白 + 深蓝→天蓝，保证白字对比清晰；聚焦/悬停时整体加深，轮廓更分明 */
.cms-hero-btn-primary{
  color:#fff;
  background:linear-gradient(120deg,#1e40af 0%,#2563eb 52%,#0284c7 100%);
  box-shadow:0 12px 28px rgba(37,99,235,.38);
}
.cms-hero-btn-primary:hover,
.cms-hero-btn-primary:focus-visible{
  color:#fff;
  background:linear-gradient(120deg,#172554 0%,#1e40af 52%,#075985 100%);
  box-shadow:0 16px 36px rgba(37,99,235,.5);
}
/* 次按钮（描边）：悬停/聚焦反转为白底深字，背景与文字对比拉满 */
.cms-hero-btn-ghost{
  color:#eaf2ff;background:rgba(255,255,255,.08);
  border-color:rgba(190,220,255,.55);backdrop-filter:blur(4px);
}
.cms-hero-btn-ghost:hover,
.cms-hero-btn-ghost:focus-visible{
  color:#0b1b3f;background:#fff;border-color:#fff;
  box-shadow:0 12px 26px rgba(3,14,42,.28);
}

/* ---- 文案入场动画（页面加载时错峰上浮） ---- */
.cms-hero-inner > *{opacity:0;animation:cmsHeroIn .85s cubic-bezier(.2,.7,.25,1) forwards}
.cms-hero-inner .cms-hero-badge{animation-delay:.05s}
.cms-hero-inner .cms-hero-title{animation-delay:.15s}
.cms-hero-inner .cms-hero-desc{animation-delay:.28s}
.cms-hero-inner .cms-hero-actions{animation-delay:.42s}
@keyframes cmsHeroIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes cmsHeroPulse{0%,100%{box-shadow:0 0 0 3px rgba(74,222,128,.2)}50%{box-shadow:0 0 0 8px rgba(74,222,128,0)}}

/* ============ 预设 1：极光网格（默认） ============ */
.cms-hero-aurora .cms-hx-grid{
  inset:0;
  background-image:linear-gradient(rgba(122,178,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(122,178,255,.08) 1px,transparent 1px);
  background-size:54px 54px;
  -webkit-mask-image:radial-gradient(130% 110% at 18% 0,#000 26%,transparent 80%);
  mask-image:radial-gradient(130% 110% at 18% 0,#000 26%,transparent 80%);
}
.cms-hero-aurora .cms-hx-orb{
  left:var(--x,86%);top:var(--y,-6%);width:var(--s,340px);height:var(--s,340px);
  margin-left:calc(var(--s,340px) / -2);margin-top:calc(var(--s,340px) / -2);
  border-radius:50%;filter:blur(2px);
  background:radial-gradient(circle,rgba(64,132,255,.38) 0,transparent 62%);
  animation:cmsHeroDrift 17s ease-in-out infinite alternate;
}
.cms-hero-aurora .cms-hx-orb:nth-child(2){
  background:radial-gradient(circle,rgba(56,189,248,.4) 0,transparent 60%);
  animation-duration:14s;animation-delay:var(--d,0s);
}

/* ============ 预设 2：粒子星空（光点上浮） ============ */
.cms-hero-particles .cms-hx-star{
  top:100%;left:var(--x,10%);width:var(--s,3px);height:var(--s,3px);border-radius:50%;
  background:var(--c,#7dd3fc);box-shadow:0 0 8px var(--c,#7dd3fc);
  animation:cmsHeroRise linear infinite;
  animation-duration:var(--t,12s);animation-delay:var(--d,0s);
}
@keyframes cmsHeroRise{
  0%{transform:translateY(0);opacity:0}
  10%{opacity:.95}
  60%{opacity:.4}
  100%{transform:translateY(-880px);opacity:0}
}

/* ============ 预设 3：波光流动（底部水波漂移） ============ */
.cms-hero-waves .cms-hx-wave{
  left:-25%;right:-25%;bottom:-46px;height:110px;border-radius:46% 54% 50% 50% / 78% 62% 80% 60%;
  filter:blur(16px);opacity:.45;
  background:linear-gradient(120deg,rgba(56,189,248,.55),rgba(129,140,248,.5));
  animation:cmsHeroWave 15s ease-in-out infinite alternate;
  animation-delay:var(--d,0s);
}
.cms-hero-waves .cms-hx-wave:nth-child(2){height:190px;opacity:.2;filter:blur(24px);background:linear-gradient(120deg,rgba(34,211,238,.6),rgba(99,102,241,.45));animation-duration:19s}
.cms-hero-waves .cms-hx-wave:nth-child(3){height:70px;opacity:.5;animation-duration:11s;background:linear-gradient(120deg,rgba(125,211,252,.5),rgba(167,139,250,.5))}
@keyframes cmsHeroWave{
  0%{transform:translate3d(40px,0,0) rotate(0deg)}
  100%{transform:translate3d(-40px,-20px,0) rotate(3deg)}
}

/* ============ 预设 4：流光圆环（虚线圆环旋转） ============ */
.cms-hero-rings .cms-hx-ring{
  top:46%;right:-170px;width:var(--s,560px);height:var(--s,560px);
  margin-top:calc(var(--s,560px) / -2);
  border:1px dashed rgba(148,197,255,.4);border-radius:50%;
  animation:cmsHeroSpin 34s linear infinite;
}
.cms-hero-rings .cms-hx-ring:nth-child(2){left:-140px;right:auto;top:74%;border-color:rgba(125,232,255,.35);animation-duration:22s;animation-direction:reverse}
.cms-hero-rings .cms-hx-orb{
  left:50%;top:50%;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;
  filter:blur(6px);background:radial-gradient(circle,rgba(99,102,241,.3),transparent 64%);
  animation:cmsHeroDrift 20s ease-in-out infinite alternate;
}
@keyframes cmsHeroSpin{to{transform:rotate(360deg)}}

/* ============ 预设 5：上升气泡 ============ */
.cms-hero-bubbles .cms-hx-bubble{
  top:105%;left:var(--x,10%);width:var(--s,30px);height:var(--s,30px);border-radius:50%;
  background:radial-gradient(circle at 32% 30%,rgba(255,255,255,.9),rgba(96,165,250,.55) 45%,rgba(59,130,246,.25) 60%,transparent 72%);
  box-shadow:0 0 18px rgba(125,211,252,.25);
  animation:cmsHeroBubble linear infinite;
  animation-duration:var(--t,15s);animation-delay:var(--d,0s);
}
@keyframes cmsHeroBubble{
  0%{transform:translate3d(0,0,0);opacity:0}
  8%{opacity:.9}
  70%{opacity:.5}
  100%{transform:translate3d(-46px,-940px,0);opacity:0}
}

/* ============ 预设 6：明亮流光（浅色 + 扫光带） ============ */
.cms-hero-gradient{
  color:#14213f;
  background:linear-gradient(118deg,#eef4ff 0%,#f8f0ff 45%,#e6fbff 100%);
  box-shadow:0 26px 64px rgba(90,110,170,.16);
}
.cms-hero-gradient .cms-hx-glow-g{
  left:var(--x,86%);top:var(--y,-6%);width:var(--s,380px);height:var(--s,380px);
  margin-left:calc(var(--s,380px) / -2);margin-top:calc(var(--s,380px) / -2);
  border-radius:50%;filter:blur(4px);opacity:.55;
  background:radial-gradient(circle,rgba(64,122,255,.32),transparent 64%);
  animation:cmsHeroDrift 18s ease-in-out infinite alternate;
}
.cms-hero-gradient .cms-hx-glow-g:nth-child(2){background:radial-gradient(circle,rgba(34,211,238,.4),transparent 60%);animation-duration:13s}
.cms-hero-gradient .cms-hx-sheen{
  top:-30%;width:46%;height:160%;transform:skewX(-18deg);filter:blur(6px);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent);
  animation:cmsHeroSheen 7.5s ease-in-out infinite;
}
@keyframes cmsHeroSheen{0%,18%{left:-60%}78%,100%{left:140%}}
.cms-hero-gradient .cms-hero-badge{color:#1d4ed8;background:rgba(29,78,216,.1);border-color:rgba(29,78,216,.22)}
.cms-hero-gradient .cms-hero-badge i{background:#2563eb;box-shadow:0 0 0 4px rgba(37,99,235,.18);animation-name:cmsHeroPulseG}
@keyframes cmsHeroPulseG{0%,100%{box-shadow:0 0 0 3px rgba(37,99,235,.2)}50%{box-shadow:0 0 0 8px rgba(37,99,235,0)}}
.cms-hero-gradient .cms-hero-title{color:#0b2447;background:none;-webkit-text-fill-color:currentColor;text-shadow:none}
.cms-hero-gradient .cms-hero-desc{color:#4a5a78}
.cms-hero-gradient .cms-hero-btn:focus-visible{outline-color:rgba(29,78,216,.85)}
.cms-hero-gradient .cms-hero-btn-ghost{color:#1d4ed8;border-color:rgba(29,78,216,.45);background:rgba(255,255,255,.72);box-shadow:0 8px 18px rgba(29,78,216,.1)}
.cms-hero-gradient .cms-hero-btn-ghost:hover,
.cms-hero-gradient .cms-hero-btn-ghost:focus-visible{color:#fff;background:#1d4ed8;border-color:#1d4ed8;box-shadow:0 12px 26px rgba(29,78,216,.32)}

@keyframes cmsHeroDrift{to{transform:translate3d(-46px,36px,0) scale(1.1)}}

/* ---- 响应式 ---- */
@media (max-width: 900px){
  .cms-hero{padding:44px 32px;min-height:300px;border-radius:14px;margin:18px 0 24px}
  .cms-hero-actions{margin-top:22px}
}
@media (max-width: 560px){
  .cms-hero{padding:38px 20px}
  .cms-hero-title{font-size:clamp(24px,7vw,32px)}
  .cms-hero-desc{font-size:14px}
  .cms-hero-actions{flex-direction:column;align-items:stretch}
  .cms-hero-btn{justify-content:center}
}
@media (prefers-reduced-motion: reduce){
  .cms-hero-decor{display:none}
  .cms-hero-inner > *,.cms-hero .cms-hx,.cms-hero-badge i{animation:none!important;opacity:1}
}

/* ============================================================
   Hero 轮播（.cms-hero-carousel）：同一 hero 插槽配置多条内容块时自动轮播
   结构：carousel > slide×N(每屏一段完整 .cms-hero) + dots
   布局用 grid 单格叠放：行高=最高一屏，切换不跳动；矮屏背景由内部
   flex 填满整格，保证多屏视觉等高。
   ============================================================ */
.cms-hero-carousel{
  position: relative;
  display: grid;
  margin: 24px 0 34px;
  border-radius: 18px;
}
.cms-hero-carousel .cms-hero-slide{
  grid-area: 1 / 1;              /* 全部叠在同一格 */
  display: flex;                 /* 内部 .cms-hero 纵向填满整格 */
  min-width: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity .8s ease, transform .8s ease;
  pointer-events: none;
  z-index: 1;
}
.cms-hero-carousel .cms-hero-slide.is-active{
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: auto;
  z-index: 2;
}
/* JS 尚未接管前默认显示第一屏，避免多屏首帧堆叠闪烁 */
.cms-hero-carousel:not(.js-ready) .cms-hero-slide:first-child{
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: auto;
  z-index: 2;
}
/* 轮播内 hero 去自身外边距、由容器统一提供；背景随屏等高 */
.cms-hero-carousel .cms-hero{
  flex: 1;
  margin: 0;
}
/* 非当前屏：暂停其内置装饰动画，避免多屏叠加空耗 */
.cms-hero-carousel .cms-hero-slide:not(.is-active) .cms-hero-decor,
.cms-hero-carousel .cms-hero-slide:not(.is-active) .cms-hero-badge i{
  animation-play-state: paused;
}
/* 圆点指示器（mix-blend-mode 自动适配深/浅底） */
.cms-hero-carousel-dots{
  position: absolute;
  left: 0; right: 0; bottom: 16px;
  z-index: 6;
  display: flex;
  justify-content: center;
  gap: 8px;
  pointer-events: none;
}
.cms-hero-carousel-dots button{
  pointer-events: auto;
  width: 9px; height: 9px;
  padding: 0; border: none; border-radius: 999px;
  background: #fff;
  box-shadow: 0 0 0 1px rgba(0,0,0,.18);
  cursor: pointer;
  opacity: .55;
  mix-blend-mode: difference;
  transition: width .3s ease, opacity .3s ease;
}
.cms-hero-carousel-dots button:hover{opacity: 1}
.cms-hero-carousel-dots button.is-active{width: 24px; opacity: 1}
@media (prefers-reduced-motion: reduce){
  .cms-hero-carousel .cms-hero-slide{transition: none}
}

/* ============================================================
   右侧悬浮条（.cms-fixbar）：块类型「右侧悬浮条」专属样式。
   设计参照 layui fixbar：右下角磨砂悬浮面板，条目为「图标+文字」
   圆角卡片，悬停左侧弹出说明、滚动超阈值显示回到顶部按钮。
   图标 sprite：/static/img/fixbar-icons.svg（stroke currentColor）。
   注：该块建议位置选「页脚 footer」、显示规则选「全部页面」。
   ============================================================ */
.cms-fixbar{
  position: fixed;
  right: 16px;
  bottom: calc(36px + env(safe-area-inset-bottom));
  z-index: 990;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  padding: 8px 7px;
  border: 1px solid rgba(47,111,237,.12);
  border-radius: 20px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 12px 34px rgba(15,35,80,.12);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.cms-fixbar-item{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  box-sizing: border-box;
  width: 52px;
  min-height: 56px;
  padding: 8px 3px 7px;
  border: 1px solid rgba(47,111,237,.18);
  border-radius: 16px;
  background: linear-gradient(180deg, #fff 0%, #f2f7ff 100%);
  color: #2f6fed;
  box-shadow: 0 8px 18px rgba(47,111,237,.10), inset 0 1px 0 rgba(255,255,255,.95);
  text-decoration: none;
  cursor: pointer;
  transition: transform .3s cubic-bezier(.34,1.56,.64,1), background .25s ease,
              color .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.cms-fixbar-item:visited{
  /* :visited 受浏览器隐私限制只能改颜色类属性；不能写 inherit——
     inherit 会取外层页面正文颜色（近黑色），导致图标/文字变黑。
     显式写品牌蓝，并置于 :hover/:focus-visible 之前保证悬停白字规则仍生效 */
  color: #2f6fed;
  text-decoration: none;
}
.cms-fixbar-item:hover,
.cms-fixbar-item:focus-visible{
  color: #fff;
  border-color: transparent;
  background: linear-gradient(165deg, #5a96ff 0%, #2f6fed 55%, #2357e8 100%);
  box-shadow: 0 16px 28px rgba(47,111,237,.42);
  transform: translateY(-3px);
}
.cms-fixbar-item:focus-visible{
  outline: none;
  box-shadow: 0 16px 28px rgba(47,111,237,.42), 0 0 0 3px rgba(47,111,237,.32);
}
.cms-fixbar-item:active{transform: translateY(-1px) scale(.96)}
.cms-fixbar-static{cursor: default}
.cms-fixbar-ico{display: block; width: 24px; height: 24px; flex: none}
.cms-fixbar-txt{
  display: block;
  max-width: 52px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .3px;
  word-break: break-all;
}
/* 悬停说明：方块左侧黑底白字气泡 */
.cms-fixbar-item[data-tip]:hover::after{
  content: attr(data-tip);
  position: absolute;
  right: calc(100% + 12px);
  top: 50%;
  transform: translateY(-50%);
  max-width: 240px;
  padding: 8px 14px;
  border-radius: 10px;
  background: rgba(10,24,56,.94);
  color: #fff;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
  box-shadow: 0 10px 22px rgba(10,24,56,.26);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 5;
}
/* 悬停图片说明：条目配置了「说明图片」时鼠标经过弹出白底图片卡片（可选文字图注） */
.cms-fixbar-item .cms-fixbar-tip-img{
  position: absolute;
  right: calc(100% + 12px);
  top: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  box-sizing: border-box;
  padding: 8px;
  border: 1px solid rgba(47,111,237,.16);
  border-radius: 10px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 10px 22px rgba(10,24,56,.18);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-50%) scale(.9);
  pointer-events: none;
  line-height: 0;
  z-index: 6;
  transition: opacity .18s ease, visibility .18s ease, transform .18s ease;
}
.cms-fixbar-item:hover .cms-fixbar-tip-img,
.cms-fixbar-item:focus-visible .cms-fixbar-tip-img{
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) scale(1);
}
.cms-fixbar-item .cms-fixbar-tip-img img{
  display: block;
  max-width: 320px;
  max-height: 240px;
  width: auto;
  height: auto;
  border-radius: 6px;
  object-fit: contain;
}
.cms-fixbar-item .cms-fixbar-tip-txt{
  display: block;
  max-width: 320px;
  padding: 0 2px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  color: #2f3b52;
  text-align: center;
  word-break: break-all;
}
@media (max-width: 640px){
  .cms-fixbar-item .cms-fixbar-tip-img img{max-width: 200px; max-height: 160px}
  .cms-fixbar-item .cms-fixbar-tip-txt{max-width: 200px}
}
/* 回到顶部（圆形钮）：默认 display:none 完全不占位，滚动超阈值后由
   front.js 切换 .is-top-visible 以动画形式出现 */
.cms-fixbar-top{
  gap: 0;
  display: none;
  margin-top: 2px;
  width: 44px;
  min-height: 44px;
  padding: 10px;
  border-radius: 50%;
  font-family: inherit;
  transition: background .25s ease, color .25s ease, box-shadow .25s ease,
              transform .3s cubic-bezier(.34,1.56,.64,1);
}
.cms-fixbar-top .cms-fixbar-ico{width: 20px; height: 20px}
.cms-fixbar.is-top-visible .cms-fixbar-top{
  display: flex;
  animation: cms-fixbar-top-in .35s cubic-bezier(.34,1.56,.64,1) both;
}
.cms-fixbar.is-top-visible .cms-fixbar-top:hover{transform: translateY(-3px)}
@keyframes cms-fixbar-top-in{
  from{opacity: 0; transform: translateY(10px) scale(.85)}
  to{opacity: 1; transform: translateY(0) scale(1)}
}
@media (max-width: 640px){
  .cms-fixbar{right: 10px; bottom: calc(64px + env(safe-area-inset-bottom)); gap: 8px; padding: 7px 6px; border-radius: 17px}
  .cms-fixbar-item{width: 44px; min-height: 48px; padding: 7px 2px 6px; gap: 2px; border-radius: 13px}
  .cms-fixbar-ico{width: 20px; height: 20px}
  .cms-fixbar-txt{max-width: 44px; font-size: 10px}
  .cms-fixbar-top{width: 38px; min-height: 38px; padding: 9px}
  .cms-fixbar-top .cms-fixbar-ico{width: 18px; height: 18px}
}
@media (prefers-reduced-motion: reduce){
  .cms-fixbar-item, .cms-fixbar-top{transition: none; animation: none}
}