﻿/* =========================
   香港云（价格级别 + 价格卡片 + 场景模块 + FAQ/按钮图标）
   仅调整：文字大小/行高/字重的协调性（不改颜色）
   ========================= */

/* ====== 产品网格 ====== */
.products .jiage-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
@media (max-width:980px){
  .products .jiage-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:620px){
  .products .jiage-grid{grid-template-columns:1fr;}
}

/* ====== 价格级别：右侧控件 ====== */
.jiage-dengji{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;                 /* 原 6px，略松一点更像“大站” */
  font-size:13px;          /* 原 12px：整体提升一点 */
  min-width:500px;
  flex:0 1 520px;          /* 原 500px：和右侧容器更一致 */
}
.jiage-dengji-biaoqian{
  color:#6B7280;
  margin-bottom:2px;
  white-space:nowrap;
  font-size:12px;          /* 标签更小一点，层级更清晰 */
  line-height:1.2;
}
.dengji-anniuqu{
  display:flex;
  flex-wrap:wrap;
  gap:8px;                 /* 原 6px：按钮间距更舒服 */
  justify-content:flex-end;
}
.dengji-anniuqu button{
  border-radius:999px;
  border:1px solid #CBD5E1;
  padding:6px 12px;        /* 原 4px 10px：点击区域更舒适 */
  font-size:12px;          /* 保持 12，更协调 */
  line-height:1.2;
  font-weight:600;         /* 让按钮更“控件感” */
  background:#F9FAFB;
  color:#1F2933;
  cursor:pointer;
  white-space:nowrap;
  transition:.15s;
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.dengji-anniuqu button:hover{border-color:#2563EB;}
.dengji-anniuqu button.active{
  background:#2563EB;
  color:#fff;
  border-color:#2563EB;
}

/* 说明文字：更易读、和按钮层级区分 */
.dengji-beizhu{
  max-width:420px;         /* 原 400px：略放宽 */
  text-align:right;
  color:#64748B;
  font-size:12px;          /* 原 11px：更好读 */
  line-height:1.55;        /* 原 1.5：略加 */
}
.dengji-beizhu strong{
  color:#111827;
  font-weight:700;         /* 强调更明确 */
}

/* ====== 价格卡片（jiageka） ====== */
.jiageka{
  position:relative;
  margin:0 10px 12px;
  padding:12px 14px;       /* 原 10px 14px：稍增，容纳更清晰的字阶 */
  border-radius:10px;
  background:linear-gradient(135deg,#e3edff 0%,#f5f8ff 45%,#e0ecff 100%);
  overflow:hidden;
}
.jiageka::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg,rgba(59,130,246,.18) 0%,rgba(59,130,246,0) 35%,rgba(59,130,246,.22) 65%,rgba(59,130,246,0) 100%);
  opacity:.95;
  pointer-events:none;
  mix-blend-mode:soft-light;
}
.jiageka .jiageka-main{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;                /* 原 20px：稍收紧 */
}
.jiageka .jiageka-col{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:3px;                 /* 原 2px：略松一点更好读 */
}
.jiageka .jiageka-label{
  font-size:12px;          /* 原 11px：更清晰 */
  font-weight:700;         /* 原 600：标题更稳 */
  letter-spacing:.02em;
  text-transform:uppercase;
  line-height:1.15;
}
.jiageka .jiageka-label-yue{color:#1D4ED8;}
.jiageka .jiageka-label-nian{color:#C2410C;min-width:150px;}

.jiageka .jiageka-val{
  font-size:22px;          /* 原 20px：价格数字更“主视觉” */
  font-weight:800;         /* 原 700：更有力度 */
  line-height:1.15;
  white-space:nowrap;
}
.jiageka .jiageka-val-yue{color:#2563EB;}
.jiageka .jiageka-val-nian{color:#EA580C;}

.jiageka .jiageka-sub{
  font-size:12px;          /* 原 11px：副文更易读 */
  color:#4B5563;
  white-space:nowrap;
  line-height:1.25;
}
.jiageka .jiageka-old-yue,
.jiageka .jiageka-old-nian{
  text-decoration:line-through;
  color:#9CA3AF;
  margin-right:4px;
  font-weight:500;
}
.jiageka .jiageka-sheng{color:#16A34A;font-weight:600;}
.jiageka .jiageka-sheng-nian{font-weight:800;}

.jiageka .nianfu-tag{
  align-self:flex-start;
  margin-top:4px;
  font-size:11px;          /* 原 10px：标签更清晰 */
  font-weight:700;
  padding:3px 10px;        /* 原 2px 8px：更像“标签” */
  border-radius:999px;
  background:rgba(248,250,252,.9);
  color:#C2410C;
  line-height:1.2;
  border:1px solid rgba(248,171,88,.7);
}
.jiageka .jiageka-fenge{
  width:1px;
  align-self:stretch;
  background:linear-gradient(to bottom,rgba(148,163,184,0),rgba(148,163,184,.9),rgba(148,163,184,0));
  opacity:.8;
}
@media (max-width:520px){
  .jiageka .jiageka-main{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;              /* 原 8px：移动端更舒服 */
  }
  .jiageka .jiageka-fenge{
    width:100%;
    height:1px;
    background:linear-gradient(to right,rgba(148,163,184,0),rgba(148,163,184,.9),rgba(148,163,184,0));
  }
  .jiageka .nianfu-tag{align-self:flex-end;}
}

/* 优惠提示条：字更稳、更可读 */
.jiageka-tip{
  display:none;
  margin:0 10px 10px;
  padding:6px 10px;        /* 原 4px 8px */
  border-radius:6px;
  background:#FEF3C7;
  color:#B91C1C;
  font-size:12px;          /* 保持 */
  line-height:1.35;
  font-weight:600;
  border:1px solid #FBBF24;
}

/* ======（旧命名保留）优惠弹窗 mask/dialog：只调字号 ====== */
.youhui-mask{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.72);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
}
.youhui-mask.show{display:flex;}
.youhui-dialog{
  background:#fff;
  border-radius:14px;
  max-width:420px;
  width:90%;
  padding:18px 20px 16px;
  box-shadow:0 20px 60px rgba(15,23,42,.55);
  font-size:14px;
  color:#111827;
  line-height:1.65;        /* 原 1.6：略增 */
}
.youhui-dialog h3{margin:0 0 8px;font-size:16px;line-height:1.25;}
.youhui-dialog p{margin:0 0 14px;font-size:14px;}
.youhui-dialog p .hi{color:#2563EB;font-weight:700;}
.youhui-dialog button{
  display:inline-block;
  border:none;
  border-radius:999px;
  padding:7px 18px;        /* 原 6px 18px：更舒适 */
  font-size:13px;
  font-weight:700;
  background:#2563EB;
  color:#fff;
  cursor:pointer;
}
.youhui-dialog button:hover{background:#1D4ED8;}

/* ====== 场景模块（changjing）：只调字号层级 ====== */
.section.changjing{
  position:relative;
  padding:50px 0 58px;
  background:#020617;
  overflow:hidden;
}
.section.changjing::before{
  content:"";
  position:absolute;
  left:-15%;
  top:20%;
  width:130%;
  height:260px;
  background:linear-gradient(120deg,#1E40AF 0%,#1D4ED8 45%,#0B1120 100%);
  opacity:.96;
  transform:skewY(-5deg);
  box-shadow:0 40px 100px rgba(15,23,42,.65);
  pointer-events:none;
}
.section.changjing::after{
  content:"";
  position:absolute;
  left:-20%;
  top:8%;
  width:130%;
  height:130px;
  background:linear-gradient(120deg,rgba(59,130,246,.8),rgba(37,99,235,.15));
  opacity:.55;
  transform:skewY(-7deg);
  filter:blur(1px);
  pointer-events:none;
}
.section.changjing .container{
  position:relative;
  max-width:1120px;
  margin:0 auto;
  z-index:1;
}

.cj-shell{
  position:relative;
  border-radius:22px;
  background:linear-gradient(135deg,rgba(15,23,42,.96),rgba(15,23,42,.90));
  border:1px solid rgba(148,163,184,.45);
  box-shadow:0 24px 80px rgba(0,0,0,.65);
  padding:18px 20px 20px;
  overflow:hidden;
}
.cj-shell::before{
  content:"";
  position:absolute;
  right:-60px;
  top:-80px;
  width:220px;
  height:220px;
  background:radial-gradient(circle at 30% 30%,rgba(129,140,248,.85),transparent 60%);
  opacity:.8;
  pointer-events:none;
}
.cj-shell::after{
  content:"";
  position:absolute;
  left:-90px;
  bottom:-90px;
  width:240px;
  height:240px;
  background:radial-gradient(circle at 60% 60%,rgba(37,99,235,.45),transparent 70%);
  opacity:.7;
  pointer-events:none;
}

.cj-buju{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:16px;
  z-index:1;
}
.cj-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.cj-head{max-width:620px;color:#E5E7EB;}
.cj-head .kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(15,23,42,.7);
  border:1px solid rgba(191,219,254,.6);
  font-size:12px;          /* 原 11px：更清晰 */
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:6px;
  color:#BFDBFE;
  backdrop-filter:blur(6px);
}
.cj-head h2{
  margin:0 0 4px;
  font-size:22px;          /* 原 20px：标题更像主标题 */
  line-height:1.25;
  color:#F9FAFB;
  font-weight:800;
}
.cj-head p{
  margin:2px 0 0;
  font-size:14px;          /* 原 13px：更好读 */
  line-height:1.75;        /* 原 1.7 */
  color:#E5E7EB;
  opacity:.96;
}

.cj-aside{
  min-width:220px;
  max-width:260px;
  color:#E5E7EB;
  font-size:13px;          /* 原 12px：更易读 */
  line-height:1.65;
  padding:10px 12px 10px;  /* 原 8/11/9：略增 */
  border-radius:14px;
  background:linear-gradient(135deg,rgba(15,23,42,.2),rgba(15,23,42,.65));
  border:1px solid rgba(148,163,184,.5);
  box-shadow:0 12px 32px rgba(15,23,42,.7);
}
.cj-aside-title{
  font-size:13px;          /* 原 12px */
  font-weight:800;
  color:#E5E7EB;
  margin-bottom:6px;
  display:flex;
  align-items:center;
  gap:6px;
  line-height:1.2;
}
.cj-aside-title::before{
  content:"";
  width:10px;
  height:10px;
  border-radius:999px;
  background:radial-gradient(circle at 30% 30%,#F97316,#FACC15);
  box-shadow:0 0 0 4px rgba(251,191,36,.25);
}
.cj-aside ul{margin:0;padding-left:16px;line-height:1.75;}
.cj-aside li{margin:0;}
.cj-aside strong{color:#FACC15;font-weight:800;}

/* tabs */
.cj-tabs{
  margin-top:4px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.cj-tabs button{
  flex:1;
  min-width:0;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.6);
  background:rgba(15,23,42,.7);
  padding:10px 14px;       /* 原 8px 14px：更舒服 */
  text-align:left;
  font-size:13px;          /* 原 12px */
  line-height:1.25;
  color:#E5E7EB;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  gap:3px;                 /* 原 2px */
  transition:.18s;
  box-shadow:0 4px 18px rgba(0,0,0,.65);
  backdrop-filter:blur(6px);
}
.cj-tabs button:hover{
  border-color:#BFDBFE;
  box-shadow:0 7px 24px rgba(15,23,42,.9);
  transform:translateY(-1px);
}
.cj-tabs button.active{
  border-color:#FACC15;
  background:linear-gradient(135deg,#F97316,#FACC15);
  color:#111827;
  box-shadow:0 10px 30px rgba(251,191,36,.6);
}
.cj-tabs button.active .cj-tab-title{color:#111827;}
.cj-tab-title{
  font-size:14px;          /* 原 13px：标题更突出 */
  font-weight:800;
  color:#F9FAFB;
  line-height:1.25;
}
.cj-tab-note{
  font-size:12px;          /* 原 11px */
  color:#E5E7EB;
  white-space:normal;
  opacity:.85;
  line-height:1.45;
}

/* panel */
.cj-panel-wrap{
  margin-top:8px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.4);
  background:radial-gradient(circle at 0 0,rgba(129,140,248,.25),rgba(15,23,42,.9));
  box-shadow:inset 0 0 0 1px rgba(15,23,42,.8);
  padding:14px 16px 16px;
}
.cj-panel{
  display:none;
  gap:16px;
  align-items:flex-start;
  flex-wrap:wrap;
  color:#E5E7EB;
}
.cj-panel.active{display:flex;}
.cj-main{flex:2;min-width:0;}
.cj-side{
  flex:1.15;
  min-width:240px;
  border-left:1px solid rgba(55,65,81,.7);
  padding-left:16px;
}
@media (max-width:780px){
  .cj-panel{flex-direction:column;}
  .cj-side{
    border-left:none;
    border-top:1px solid rgba(55,65,81,.7);
    padding-left:0;
    padding-top:10px;
  }
}
.cj-main h3{
  margin:0 0 6px;          /* 原 4px：更像段落标题 */
  font-size:16px;          /* 原 15px */
  line-height:1.35;
  font-weight:800;
  color:#F9FAFB;
}
.cj-main p{
  margin:0 0 6px;
  font-size:13px;          /* 原 12px */
  line-height:1.75;
  color:#E5E7EB;
  opacity:.96;
}
.cj-main ul{
  margin:4px 0 0;
  padding-left:18px;
  font-size:13px;          /* 原 12px */
  line-height:1.7;
  color:#E5E7EB;
}
.cj-main li{margin:2px 0;}

.cj-tag-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.cj-tag{
  padding:4px 10px;        /* 原 3px 9px */
  border-radius:999px;
  border:1px solid rgba(148,163,184,.7);
  background:rgba(15,23,42,.8);
  font-size:12px;          /* 原 11px */
  line-height:1.2;
  color:#E5E7EB;
}
.cj-side-title{
  font-size:13px;          /* 原 12px */
  font-weight:800;
  line-height:1.2;
  color:#F9FAFB;
  margin-bottom:6px;
}
.cj-side-block{
  font-size:13px;          /* 原 12px */
  line-height:1.7;
  color:#E5E7EB;
  margin-bottom:10px;      /* 原 8px */
}
.cj-side-block:last-child{margin-bottom:0;}
.cj-price{font-size:18px;font-weight:800;color:#FACC15;margin:0 3px;line-height:1.1;}
.cj-side-note{
  font-size:12px;          /* 原 11px */
  line-height:1.45;
  color:#9CA3AF;
  margin-top:2px;
}

/* ====== 兼容：wenti / FAQ / 图标 ====== */
.section.wenti .wenti-grid{display:block;}
.section.wenti .wenti-grid>div{max-width:100%;}

.wenti-title-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  border-radius:999px;
  background:#EFF6FF;
  color:#2563EB;
  margin-right:6px;
  flex-shrink:0;
}
.wenti-title-ico svg{width:14px;height:14px;}

.shoufengqin .sfq-q h4{display:flex;align-items:center;gap:6px;}
.sfq-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  border-radius:999px;
  background:#EEF2FF;
  color:#4F46E5;
  flex-shrink:0;
}
.sfq-ico svg{width:12px;height:12px;}

/* 按钮与按钮图标 */
a.btn,button.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  vertical-align:middle;
}
.btn .btn-ico{
  width:16px;
  height:16px;
  stroke:currentColor;
  fill:none;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  flex:0 0 auto;
}
.btn.btn-sm .btn-ico{width:14px;height:14px;}
.btn.btn-lg .btn-ico{width:18px;height:18px;}

/* promo-mask / promo-dialog（你当前页面在用这个命名） */
.promo-mask{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.72);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
}
.promo-mask.show{display:flex;}
.promo-dialog{
  background:#fff;
  border-radius:14px;
  max-width:440px;
  width:90%;
  padding:18px 20px 16px;
  box-shadow:0 20px 60px rgba(15,23,42,.55);
  font-size:14px;
  color:#111827;
  line-height:1.65;        /* 原 1.6 */
}
.promo-dialog h3{margin:0 0 8px;font-size:16px;line-height:1.25;}
.promo-dialog p{margin:0 0 14px;font-size:14px;}
.promo-dialog p .hi{color:#2563EB;font-weight:700;}
.promo-dialog button{
  display:inline-block;
  border:none;
  border-radius:999px;
  padding:7px 18px;
  font-size:13px;
  font-weight:700;
  background:#2563EB;
  color:#fff;
  cursor:pointer;
}
.promo-dialog button:hover{background:#1D4ED8;}

/* FAQ（你现在的 faq-news/accordion） */
.section.faq-news .faq-grid{display:block;}
.section.faq-news .faq-grid>div{max-width:100%;}

.faq-title-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  border-radius:999px;
  background:#EFF6FF;
  color:#2563EB;
  margin-right:6px;
  flex-shrink:0;
}
.faq-title-icon svg{width:14px;height:14px;}

.accordion .q h4{
  display:flex;
  align-items:center;
  gap:8px;                 /* 原 6px：更舒适 */
  font-size:14px;          /* 让问题标题更清晰 */
  line-height:1.35;
  font-weight:800;
}
.q-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  border-radius:999px;
  background:#EEF2FF;
  color:#4F46E5;
  flex-shrink:0;
}
.q-ico svg{width:12px;height:12px;}

/* ====== products-head 结构（保持布局不动，微调字号） ====== */
.products-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}
.products-head-zuo{flex:1;min-width:0;}
.products-head-you{
  flex:0 0 520px;
  max-width:520px;
  display:flex;
  justify-content:flex-end;
}
.products-head-you .jiage-dengji{
  width:100%;
  min-width:0;
  align-items:flex-end;
}

/* 响应式：保持你原规则，只改文字更协调 */
@media (max-width:980px){
  .products-head{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
    margin-bottom:14px;
  }
  .products-head-you{
    flex:1 1 auto;
    max-width:100%;
    justify-content:flex-end;
  }
  .products-head-you .jiage-dengji{
    width:100%;
    align-items:flex-end;
    font-size:13px;
  }
  .products-head-you #tierNote.dengji-beizhu{
    max-width:100%;
    margin-top:6px;
    font-size:13px;        /* 原 12px：移动端说明更好读 */
    line-height:1.55;
  }
}
@media (max-width:620px){
  .products-head-you .dengji-anniuqu{
    justify-content:flex-end;
    gap:8px;               /* 原 6px */
  }
  .products-head-you .dengji-anniuqu button{
    padding:6px 12px;      /* 原 4px 10px */
    font-size:12px;        /* 保持 */
  }
}
