/* ============================================================
   游轮家官网 · 内页排版系统 v3  (2026-10-30)
   ------------------------------------------------------------
   在 v2 基础上补齐「内页」所需的全部构件，让所有页面共享同一套
   视觉语言，避免每个页面各写各的。

   原则：
   1. 层级靠字号 / 留白 / 栅格对齐，不靠颜色堆叠。
   2. 单主色（深蓝 #0B1D3A）+ 鎏金强调（#C9A962）+ 中性灰阶。
   3. 图片框一律直角（.hx-rect）。
   4. 按钮一律直角（.yx-btn）。
   5. 容器统一 .hx-wrap（1200px），不用 max-w-7xl。
   6. 平板 / 手机必须平铺可见，禁止 tab / 折叠藏内容。

   用法：内页模板只写 HTML 结构 + 本文件里的类，不再自定义色值。
   ============================================================ */

:root{
  /* —— 墨色系（继承 v2，勿改） —— */
  --hx-ink:#0B1D3A;
  --hx-ink2:#1B2C46;
  --hx-body:#5A6472;
  --hx-mute:#98A0AC;
  --hx-line:#E7E2D8;
  --hx-gold:#C9A962;
  --hx-gold-d:#A8873F;
  --hx-gold-l:#EFE3C8;
  --hx-paper:#FBFAF7;
  --hx-cream:#F5F1E8;

  /* —— v3 新增 —— */
  --hx-bg:#FFFFFF;
  --hx-bg-soft:#F7F5F1;      /* 米底分区 */
  --hx-line-soft:#EEF2F7;    /* 浅分隔线 */
  --hx-line-cool:#E9EEF4;    /* 冷调分隔线 */
  --hx-shade:#6B7480;        /* 次级说明 */
  --hx-shadow:0 12px 36px rgba(11,29,58,.09);
  --hx-shadow-sm:0 6px 20px rgba(11,29,58,.06);
}

/* ============================================================
   1. 内页 Hero（统一所有内页顶部）
   ============================================================ */
.hx-phero{
  position:relative; overflow:hidden;
  background:var(--hx-bg-soft);
  border-bottom:1px solid var(--hx-line);
  padding:132px 0 64px;
}
.hx-phero--deep{
  background:var(--hx-ink);
  border-bottom:0;
  padding:150px 0 72px;
}
.hx-phero--deep::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(900px 380px at 84% 12%, rgba(201,169,98,.20), transparent 62%),
    radial-gradient(700px 320px at 8% 92%, rgba(201,169,98,.12), transparent 60%);
}
.hx-phero-inner{ position:relative; z-index:2; max-width:1200px; margin:0 auto; padding:0 20px; }
.hx-phero--deep .hx-phero-inner{ padding:0 20px; }

.hx-phero-kicker{
  display:inline-flex; align-items:center; gap:10px;
  font-size:11.5px; font-weight:400; letter-spacing:.28em;
  color:var(--hx-gold-d); text-transform:uppercase; margin:0 0 20px;
}
.hx-phero--deep .hx-phero-kicker{ color:var(--hx-gold); }
.hx-phero-kicker::before{
  content:''; width:26px; height:1px; background:currentColor; opacity:.6;
}
.hx-phero-title{
  margin:0; max-width:19em;
  font-family:"Noto Serif SC",serif;
  font-size:clamp(30px,3.6vw,46px);
  font-weight:700; line-height:1.2; letter-spacing:.06em;
  color:var(--hx-ink);
}
.hx-phero--deep .hx-phero-title{ color:#fff; }
.hx-phero-lede{
  margin:22px 0 0; max-width:640px;
  font-size:15.5px; font-weight:400; line-height:1.85; letter-spacing:.03em;
  color:var(--hx-body);
}
.hx-phero--deep .hx-phero-lede{ color:rgba(255,255,255,.74); }

/* Hero 右侧数据条 */
.hx-phero-stats{
  margin-top:44px; padding-top:26px; border-top:1px solid var(--hx-line);
  display:flex; gap:56px; flex-wrap:wrap;
}
.hx-phero--deep .hx-phero-stats{ border-top-color:rgba(255,255,255,.16); }
.hx-phero-stat b{
  display:block; font-size:32px; font-weight:700; line-height:1;
  color:var(--hx-ink); letter-spacing:-.01em;
}
.hx-phero--deep .hx-phero-stat b{ color:#fff; }
.hx-phero-stat span{
  display:block; margin-top:9px; font-size:12px; font-weight:400;
  letter-spacing:.14em; color:var(--hx-mute);
}
.hx-phero--deep .hx-phero-stat span{ color:rgba(255,255,255,.5); }

@media (max-width:767px){
  .hx-phero{ padding:104px 0 44px; }
  .hx-phero--deep{ padding:116px 0 52px; }
  .hx-phero-lede{ font-size:14px; margin-top:16px; }
  .hx-phero-stats{ gap:32px; margin-top:30px; padding-top:20px; }
  .hx-phero-stat b{ font-size:26px; }
}

/* ============================================================
   2. 面包屑
   ============================================================ */
.hx-crumb{
  display:flex; align-items:center; flex-wrap:wrap; gap:8px;
  font-size:12.5px; font-weight:400; letter-spacing:.04em;
  color:var(--hx-mute); margin-bottom:22px;
}
.hx-crumb a{ color:var(--hx-mute); text-decoration:none; transition:color .18s ease; }
.hx-crumb a:hover{ color:var(--hx-gold-d); }
.hx-crumb .sep{ color:#C7CDD6; font-size:10px; }
.hx-crumb .cur{ color:var(--hx-ink); font-weight:500; }
.hx-phero--deep .hx-crumb,
.hx-phero--deep .hx-crumb a{ color:rgba(255,255,255,.5); }
.hx-phero--deep .hx-crumb .cur{ color:rgba(255,255,255,.9); }
.hx-phero--deep .hx-crumb .sep{ color:rgba(255,255,255,.28); }

/* ============================================================
   3. 区块容器与间距
   ============================================================ */
.hx-sect{ padding:76px 0; }
.hx-sect--tight{ padding:52px 0; }
.hx-sect--loose{ padding:96px 0; }
.hx-sect--soft{ background:var(--hx-bg-soft); }
.hx-sect--cream{ background:var(--hx-cream); }
.hx-sect--paper{ background:var(--hx-paper); }
.hx-sect--line{ border-top:1px solid var(--hx-line); }
.hx-sect--line-soft{ border-top:1px solid var(--hx-line-soft); }
.hx-sect--dark{ background:var(--hx-ink); color:#fff; }
.hx-sect--dark .hx-h2,.hx-sect--dark .hx-h3{ color:#fff; }
.hx-sect--dark .hx-body,.hx-sect--dark .hx-note{ color:rgba(255,255,255,.66); }

.hx-sec-head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:28px; padding-bottom:22px; border-bottom:1px solid var(--hx-line);
  margin-bottom:44px;
}
.hx-sect--dark .hx-sec-head{ border-bottom-color:rgba(255,255,255,.16); }
.hx-sec-head-l{ min-width:0; }
.hx-sec-kicker{
  display:block; margin-bottom:14px;
  font-size:11.5px; font-weight:400; letter-spacing:.28em;
  text-transform:uppercase; color:var(--hx-gold-d);
}
.hx-sect--dark .hx-sec-kicker{ color:var(--hx-gold); }
.hx-sec-sub{
  margin:16px 0 0; max-width:680px;
  font-size:14px; line-height:1.85; color:var(--hx-body);
}
.hx-more{
  font-size:13.5px; font-weight:400; color:var(--hx-ink2);
  letter-spacing:.06em; text-decoration:none; white-space:nowrap;
  display:inline-flex; align-items:center; gap:8px; padding-bottom:4px;
  border-bottom:1px solid var(--hx-gold); padding-bottom:6px;
  transition:color .18s ease;
}
.hx-more i{ color:var(--hx-gold); font-style:normal; }
.hx-more:hover{ color:var(--hx-gold-d); }
@media (max-width:767px){
  .hx-sect{ padding:52px 0; }
  .hx-sect--loose{ padding:64px 0; }
  .hx-sec-head{ flex-direction:column; align-items:flex-start; gap:16px; margin-bottom:32px; }
}

/* ============================================================
   4. 栅格
   ============================================================ */
.hx-grid{ display:grid; gap:26px; }
.hx-grid--2{ grid-template-columns:repeat(2,1fr); }
.hx-grid--3{ grid-template-columns:repeat(3,1fr); }
.hx-grid--4{ grid-template-columns:repeat(4,1fr); }
.hx-grid--auto{ grid-template-columns:repeat(auto-fill,minmax(258px,1fr)); }
.hx-grid--auto-lg{ grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); }
.hx-grid--wide{ gap:36px; }
@media (max-width:1023px){
  .hx-grid--3,.hx-grid--4{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:767px){
  .hx-grid{ gap:16px; }
  .hx-grid--2,.hx-grid--3,.hx-grid--4{ grid-template-columns:1fr; }
}

/* 左右分栏（图文） */
.hx-split{
  display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;
}
.hx-split--wide-left{ grid-template-columns:1.15fr .85fr; }
.hx-split--wide-right{ grid-template-columns:.85fr 1.15fr; }
.hx-split--top{ align-items:start; }
.hx-split-media{
  position:relative; overflow:hidden; background:var(--hx-bg-soft);
  aspect-ratio:4/3; border-radius:0;
}
.hx-split-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.hx-split-body{ min-width:0; }
@media (max-width:1023px){
  .hx-split{ grid-template-columns:1fr; gap:34px; }
}

/* ============================================================
   5. 卡片（内页）
   ============================================================ */
.hx-pcard{
  display:flex; flex-direction:column; background:#fff;
  border:1px solid var(--hx-line-cool); border-radius:0; overflow:hidden;
  text-decoration:none; transition:box-shadow .28s ease, border-color .28s ease, transform .28s ease;
}
.hx-pcard:hover{
  box-shadow:var(--hx-shadow); border-color:#D8C79A; transform:translateY(-3px);
}
/* 整卡可点（客服咨询 / 添加客服 / 电话联系） */
.hx-pcard--link{ cursor:pointer; }
.hx-pcard--link:focus-visible{ outline:2px solid var(--hx-gold); outline-offset:3px; }
.hx-pcard--link:hover{ border-color:var(--hx-gold); box-shadow:0 12px 32px rgba(11,29,58,.10); }
.hx-pcard--link .hx-pcard-desc{ color:var(--hx-body); }
.hx-pcard-media{
  position:relative; width:100%; aspect-ratio:16/10; overflow:hidden;
  background:var(--hx-bg-soft);
}
.hx-pcard-media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s ease; }
.hx-pcard:hover .hx-pcard-media img{ transform:scale(1.05); }
.hx-pcard-body{ display:flex; flex-direction:column; flex:1; padding:22px 22px 24px; }
.hx-pcard-title{
  margin:0; font-family:"Noto Serif SC",serif;
  font-size:18px; font-weight:700; color:var(--hx-ink);
  line-height:1.45; letter-spacing:.03em;
}
.hx-pcard-desc{
  margin:10px 0 0; font-size:13px; font-weight:400; line-height:1.8;
  color:var(--hx-shade); letter-spacing:.02em;
}
.hx-pcard-meta{
  margin-top:16px; padding-top:14px; border-top:1px solid var(--hx-line-soft);
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
}
.hx-pcard-foot{ margin-top:auto; padding-top:16px; }

/* 标签 */
.hx-tag{
  display:inline-flex; align-items:center; gap:5px;
  padding:3px 10px; border-radius:0;
  font-size:11.5px; font-weight:400; letter-spacing:.08em; line-height:1.7;
  background:var(--hx-paper); color:var(--hx-shade); border:1px solid var(--hx-line);
}
.hx-tag--gold{ background:#FBF7EE; color:var(--hx-gold-d); border-color:#E3D3A8; }
.hx-tag--navy{ background:#EEF2F8; color:#2A4874; border-color:#DCE4F0; }
.hx-tag-row{ display:flex; flex-wrap:wrap; gap:8px; }

/* 数字索引（图标位用序号代替 emoji） */
.hx-idx{
  width:38px; height:38px; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center;
  font-family:"Noto Serif SC",serif; font-size:15px; font-weight:700;
  color:var(--hx-gold-d); background:#FBF7EE; border:1px solid #E3D3A8;
  letter-spacing:.02em;
}
.hx-idx--plain{ color:var(--hx-ink); background:var(--hx-bg-soft); border-color:var(--hx-line); }
.hx-idx--solid{ color:#fff; background:var(--hx-ink); border-color:var(--hx-ink); }
.hx-idx--lg{ width:52px; height:52px; font-size:20px; }

/* ============================================================
   6. 列表 / 定义表
   ============================================================ */
.hx-list{ list-style:none; margin:0; padding:0; }
.hx-list li{
  position:relative; padding:0 0 0 22px; margin-bottom:12px;
  font-size:14px; line-height:1.85; color:var(--hx-body);
}
.hx-list li::before{
  content:''; position:absolute; left:2px; top:13px;
  width:5px; height:5px; background:var(--hx-gold);
}
.hx-list--check li::before{
  content:'\2713'; left:0; top:0; width:auto; height:auto;
  background:none; color:var(--hx-gold-d); font-size:13px; font-weight:700;
}
.hx-list--num{ counter-reset:hxli; }
.hx-list--num li{ counter-increment:hxli; padding-left:34px; }
.hx-list--num li::before{
  content:counter(hxli,decimal-leading-zero);
  left:0; top:2px; width:auto; height:auto; background:none;
  font-size:12px; font-weight:700; color:var(--hx-gold-d);
  font-family:"Noto Serif SC",serif; letter-spacing:.04em;
}

/* 定义表（参数 / 规格） */
.hx-deflist{ border-top:1px solid var(--hx-line); }
.hx-deflist div{
  display:flex; align-items:baseline; gap:24px;
  padding:15px 2px; border-bottom:1px solid var(--hx-line);
}
.hx-deflist dt{
  flex:0 0 128px; font-size:13px; font-weight:400;
  color:var(--hx-mute); letter-spacing:.06em;
}
.hx-deflist dd{
  margin:0; flex:1; min-width:0;
  font-size:14px; font-weight:500; color:var(--hx-ink);
  line-height:1.75; letter-spacing:.02em;
}
@media (max-width:767px){
  .hx-deflist div{ flex-direction:column; gap:5px; }
  .hx-deflist dt{ flex:none; }
}

/* 数据表 */
.hx-tablewrap{ overflow-x:auto; border:1px solid var(--hx-line); background:#fff; }
.hx-table{ width:100%; border-collapse:collapse; min-width:520px; }
.hx-table th{
  padding:14px 18px; text-align:left; white-space:nowrap;
  background:var(--hx-paper); border-bottom:1px solid var(--hx-line);
  font-size:12px; font-weight:600; letter-spacing:.12em; color:var(--hx-ink);
}
.hx-table td{
  padding:15px 18px; border-bottom:1px solid var(--hx-line-soft);
  font-size:13.5px; font-weight:400; color:var(--hx-body); line-height:1.7;
}
.hx-table tr:last-child td{ border-bottom:0; }
.hx-table tbody tr:hover td{ background:#FCFBF8; }

/* ============================================================
   7. 步骤条 / 流程
   ============================================================ */
.hx-steps{ display:grid; gap:0; grid-auto-flow:column; grid-auto-columns:1fr; }
.hx-step{ position:relative; padding:0 26px 0 0; }
.hx-step-num{
  display:flex; align-items:center; justify-content:center;
  width:34px; height:34px; margin-bottom:18px;
  font-family:"Noto Serif SC",serif; font-size:14px; font-weight:700;
  color:#fff; background:var(--hx-ink);
}
.hx-step:not(:last-child)::after{
  content:''; position:absolute; left:44px; right:10px; top:17px;
  height:1px; background:var(--hx-line);
}
.hx-step-title{
  margin:0 0 8px; font-size:15px; font-weight:700; color:var(--hx-ink);
  letter-spacing:.03em; line-height:1.5;
}
.hx-step-desc{ margin:0; font-size:13px; line-height:1.8; color:var(--hx-shade); }
@media (max-width:1023px){
  .hx-steps{ grid-auto-flow:row; grid-auto-columns:auto; gap:30px; }
  .hx-step{ padding:0; }
  .hx-step:not(:last-child)::after{ left:17px; right:auto; top:42px; width:1px; height:auto; bottom:-30px; }
}

/* 时间轴（行程日） */
.hx-timeline{ position:relative; padding-left:34px; }
.hx-timeline::before{
  content:''; position:absolute; left:8px; top:8px; bottom:8px; width:1px;
  background:var(--hx-line);
}
.hx-tl-item{ position:relative; padding-bottom:38px; }
.hx-tl-item:last-child{ padding-bottom:0; }
.hx-tl-dot{
  position:absolute; left:-34px; top:4px;
  width:17px; height:17px; border-radius:0;
  background:#fff; border:1px solid var(--hx-gold);
  display:flex; align-items:center; justify-content:center;
}
.hx-tl-dot::after{ content:''; width:7px; height:7px; background:var(--hx-gold); }
.hx-tl-day{
  display:inline-block; margin-bottom:10px; padding:3px 11px;
  font-size:11.5px; font-weight:700; letter-spacing:.12em;
  color:#fff; background:var(--hx-ink);
}
.hx-tl-title{
  margin:0 0 9px; font-family:"Noto Serif SC",serif;
  font-size:18px; font-weight:700; color:var(--hx-ink); letter-spacing:.04em;
}
.hx-tl-body{ margin:0; font-size:13.5px; line-height:1.9; color:var(--hx-body); }

/* ============================================================
   8. 按钮（直角）
   ============================================================ */
.yx-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:15px 34px; border-radius:0; border:1px solid transparent;
  font-family:inherit; font-size:14.5px; font-weight:500; letter-spacing:.12em;
  text-decoration:none; cursor:pointer; transition:all .22s ease; line-height:1.2;
}
.yx-btn--navy{ background:var(--hx-ink); color:#fff; border-color:var(--hx-ink); }
.yx-btn--navy:hover{ background:#14294A; border-color:#14294A; }
.yx-btn--gold{ background:var(--hx-gold); color:#fff; border-color:var(--hx-gold); }
.yx-btn--gold:hover{ background:var(--hx-gold-d); border-color:var(--hx-gold-d); }
.yx-btn--line{ background:transparent; color:var(--hx-ink); border-color:var(--hx-line); }
.yx-btn--line:hover{ border-color:var(--hx-ink); background:var(--hx-paper); }
.yx-btn--line-light{ background:transparent; color:#fff; border-color:rgba(255,255,255,.42); }
.yx-btn--line-light:hover{ border-color:#fff; background:rgba(255,255,255,.08); }
.yx-btn--sm{ padding:10px 22px; font-size:13px; letter-spacing:.08em; }
.yx-btn--lg{ padding:17px 44px; font-size:15.5px; }
.yx-btn--block{ display:flex; width:100%; }
.yx-btn:disabled{ opacity:.45; cursor:not-allowed; }

/* 文字链 */
.hx-link{
  display:inline-flex; align-items:center; gap:7px;
  font-size:13.5px; font-weight:500; letter-spacing:.06em;
  color:var(--hx-ink); text-decoration:none;
  border-bottom:1px solid var(--hx-gold); padding-bottom:3px;
  transition:color .18s ease;
}
.hx-link i{ color:var(--hx-gold); font-style:normal; font-size:11px; }
.hx-link:hover{ color:var(--hx-gold-d); }

/* ============================================================
   9. 表单
   ============================================================ */
.hx-form{ display:grid; gap:18px; }
.hx-field{ display:flex; flex-direction:column; gap:8px; }
.hx-label{
  font-size:12.5px; font-weight:500; letter-spacing:.1em; color:var(--hx-ink);
}
.hx-label .req{ color:#C0392B; margin-left:3px; }
.hx-input,.hx-select,.hx-textarea{
  width:100%; padding:12px 14px; border-radius:0;
  border:1px solid var(--hx-line-cool); background:#fff;
  font-family:inherit; font-size:14px; color:var(--hx-ink);
  letter-spacing:.02em; outline:none; transition:border-color .18s ease;
}
.hx-input:focus,.hx-select:focus,.hx-textarea:focus{ border-color:var(--hx-gold); }
.hx-input::placeholder,.hx-textarea::placeholder{ color:#B4BCC6; }
.hx-textarea{ min-height:130px; resize:vertical; line-height:1.8; }
.hx-help{ font-size:12px; color:var(--hx-mute); letter-spacing:.02em; line-height:1.7; }

/* ============================================================
   10. 空态 / 提示条
   ============================================================ */
.hx-empty{
  padding:72px 24px; text-align:center;
  border:1px dashed var(--hx-line); background:var(--hx-paper);
}
.hx-empty-ico{
  width:54px; height:54px; margin:0 auto 20px;
  display:flex; align-items:center; justify-content:center;
  font-size:21px; color:var(--hx-gold-d);
  background:#FBF7EE; border:1px solid #E3D3A8;
}
.hx-empty-title{ margin:0 0 8px; font-size:16px; font-weight:700; color:var(--hx-ink); }
.hx-empty-desc{ margin:0; font-size:13px; color:var(--hx-mute); line-height:1.8; }

.hx-note-bar{
  display:flex; gap:12px; align-items:flex-start;
  padding:15px 18px; font-size:13px; line-height:1.8;
  background:#FBF7EE; border-left:2px solid var(--hx-gold); color:#6B5A28;
}
.hx-note-bar--navy{ background:#EEF2F8; border-left-color:var(--hx-ink); color:#2A4874; }

/* ============================================================
   11. FAQ（全部平铺展示，禁止折叠）
   ============================================================ */
.hx-faq{ border-top:1px solid var(--hx-line); }
.hx-faq-item{ padding:26px 0; border-bottom:1px solid var(--hx-line); }
.hx-faq-q{
  display:flex; gap:14px; align-items:flex-start;
  margin:0 0 12px; font-size:16px; font-weight:700; color:var(--hx-ink);
  letter-spacing:.03em; line-height:1.6;
}
.hx-faq-q .n{
  flex:0 0 auto; font-family:"Noto Serif SC",serif; font-size:13px; font-weight:700;
  color:var(--hx-gold-d); letter-spacing:.04em; padding-top:3px;
}
.hx-faq-a{ margin:0; padding-left:32px; font-size:13.5px; line-height:1.9; color:var(--hx-body); }
.hx-faq-a strong{ color:var(--hx-ink); font-weight:600; }

/* ============================================================
   12. 侧栏 + 内容（两栏页）
   ============================================================ */
.hx-aside-layout{ display:grid; grid-template-columns:250px 1fr; gap:56px; align-items:start; }
.hx-aside{
  position:sticky; top:96px;
  border:1px solid var(--hx-line); background:#fff;
}
.hx-aside-h{
  padding:16px 20px; font-size:12.5px; font-weight:700; letter-spacing:.16em;
  color:#fff; background:var(--hx-ink);
}
.hx-aside-list{ list-style:none; margin:0; padding:0; }
.hx-aside-list li{ border-bottom:1px solid var(--hx-line-soft); }
.hx-aside-list li:last-child{ border-bottom:0; }
.hx-aside-list a{
  display:block; padding:13px 20px;
  font-size:13.5px; font-weight:400; letter-spacing:.03em; color:var(--hx-body);
  text-decoration:none; transition:all .18s ease;
}
.hx-aside-list a:hover{ color:var(--hx-ink); background:var(--hx-paper); }
.hx-aside-list a.is-on{ color:var(--hx-ink); font-weight:600; background:var(--hx-paper); box-shadow:inset 2px 0 0 var(--hx-gold); }
@media (max-width:1023px){
  .hx-aside-layout{ grid-template-columns:1fr; gap:28px; }
  .hx-aside{ position:static; }
}

/* ============================================================
   13. 引文 / 高亮块
   ============================================================ */
.hx-quote{
  margin:0; padding:26px 30px;
  background:var(--hx-paper); border-left:2px solid var(--hx-gold);
  font-size:15px; line-height:1.95; color:var(--hx-ink2); letter-spacing:.03em;
}
.hx-quote cite{
  display:block; margin-top:12px; font-style:normal;
  font-size:12.5px; color:var(--hx-mute); letter-spacing:.1em;
}

/* ============================================================
   14. 数据带（内页）
   ============================================================ */
.hx-dband{ background:var(--hx-ink); color:#fff; padding:56px 0; }
.hx-dband-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:36px; }
.hx-dband-item{ position:relative; padding-left:20px; }
.hx-dband-item::before{
  content:''; position:absolute; left:0; top:4px; bottom:4px; width:1px;
  background:rgba(201,169,98,.5);
}
.hx-dband-item b{
  display:block; font-size:38px; font-weight:700; line-height:1; color:#fff;
  letter-spacing:-.015em;
}
.hx-dband-item b span{ font-size:17px; font-weight:500; margin-left:3px; color:var(--hx-gold); }
.hx-dband-item span{
  display:block; margin-top:11px; font-size:12.5px; letter-spacing:.1em;
  color:rgba(255,255,255,.5);
}
@media (max-width:1023px){ .hx-dband-grid{ grid-template-columns:repeat(2,1fr); gap:28px; } }
@media (max-width:767px){
  .hx-dband{ padding:40px 0; }
  .hx-dband-grid{ grid-template-columns:1fr 1fr; gap:24px; }
  .hx-dband-item b{ font-size:30px; }
}

/* ============================================================
   15. CTA 收口条
   ============================================================ */
.hx-cta{
  position:relative; overflow:hidden;
  background:var(--hx-ink); color:#fff; padding:64px 0;
}
.hx-cta::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(720px 300px at 88% 20%, rgba(201,169,98,.22), transparent 62%);
}
.hx-cta-inner{
  position:relative; z-index:2;
  display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap;
}
.hx-cta-title{
  margin:0; font-family:"Noto Serif SC",serif;
  font-size:clamp(22px,2.4vw,30px); font-weight:700; letter-spacing:.06em; color:#fff;
}
.hx-cta-sub{ margin:12px 0 0; font-size:13.5px; line-height:1.8; color:rgba(255,255,255,.6); }
.hx-cta-actions{ display:flex; gap:14px; flex-wrap:wrap; }
@media (max-width:767px){
  .hx-cta{ padding:44px 0; }
  .hx-cta-actions{ width:100%; }
  .hx-cta-actions .yx-btn{ flex:1 1 100%; }
}

/* ============================================================
   16. 全站工具类
   ============================================================ */
.hx-text-center{ text-align:center; }
.hx-text-right{ text-align:right; }
.hx-mt-0{ margin-top:0 !important; }
.hx-mt-1{ margin-top:10px; }
.hx-mt-2{ margin-top:20px; }
.hx-mt-3{ margin-top:30px; }
.hx-mt-4{ margin-top:40px; }
.hx-mt-5{ margin-top:56px; }
.hx-mb-0{ margin-bottom:0 !important; }
.hx-mb-2{ margin-bottom:20px; }
.hx-mb-3{ margin-bottom:30px; }
.hx-mb-4{ margin-bottom:40px; }
.hx-gap-1{ gap:10px; }
.hx-gap-2{ gap:20px; }
.hx-gap-3{ gap:30px; }
.hx-flex{ display:flex; }
.hx-flex-mid{ align-items:center; }
.hx-flex-between{ justify-content:space-between; }
.hx-flex-wrap{ flex-wrap:wrap; }
.hx-relative{ position:relative; }
.hx-z1{ z-index:1; }
.hx-full{ width:100%; }
.hx-hide{ display:none !important; }

/* 正文长文排版 */
.hx-prose{ font-size:14.5px; line-height:1.95; color:var(--hx-body); letter-spacing:.02em; }
.hx-prose p{ margin:0 0 16px; }
.hx-prose p:last-child{ margin-bottom:0; }
.hx-prose strong{ color:var(--hx-ink); font-weight:600; }
.hx-prose a{ color:var(--hx-gold-d); }

/* ========== Markdown 正文（旅游资讯文章） ========== */
.md-body{ font-size:15.5px; line-height:2.05; color:var(--hx-body); letter-spacing:.015em; }
.md-body p{ margin:0 0 18px; }
.md-body p:last-child{ margin-bottom:0; }
.md-body strong{ color:var(--hx-ink); font-weight:600; }
.md-body em{ color:var(--hx-ink); font-style:italic; }
.md-body a{ color:var(--hx-gold-d); text-decoration:underline; text-underline-offset:3px; }
.md-body a:hover{ color:var(--hx-gold); }
.md-h{ font-family:'Noto Serif SC',serif; color:var(--hx-ink); font-weight:700; letter-spacing:.01em; margin:0 0 16px; }
.md-h2{ font-size:26px; line-height:1.5; padding-left:14px; border-left:4px solid var(--hx-gold); }
.md-h3{ font-size:20px; line-height:1.6; margin-top:34px; }
.md-h4{ font-size:17px; line-height:1.7; margin-top:28px; color:var(--hx-ink); }
.md-h4,.md-h5,.md-h6{ font-family:'Noto Sans SC',sans-serif; font-weight:600; }
.md-list{ margin:0 0 20px; padding-left:26px; list-style-type:disc; }
.md-list li{ margin-bottom:8px; line-height:1.95; display:list-item; list-style-type:disc; }
.md-list li::marker{ color:var(--hx-gold-d); }
.md-list--num{ list-style-type:decimal; }
.md-list--num li{ list-style-type:decimal; }
.md-list--num li::marker{ color:var(--hx-gold-d); font-weight:600; }
.md-list li > ul, .md-list li > ol{ margin-top:8px; margin-bottom:4px; }
.md-quote{ margin:0 0 20px; padding:14px 18px; background:var(--hx-paper); border-left:4px solid var(--hx-gold-l); color:var(--hx-shade); font-size:14.5px; }
.md-hr{ border:0; border-top:1px solid var(--hx-line); margin:30px 0; }
.md-code{ background:#0B1D3A; color:#E8EDF4; padding:16px 18px; overflow:auto; margin:0 0 20px; font-size:13px; line-height:1.75; }
.md-inline-code{ background:var(--hx-cream); border:1px solid var(--hx-line); padding:1px 6px; font-size:13px; color:var(--hx-ink); }
.md-tr{ margin:0 0 20px; padding:10px 14px; background:var(--hx-paper); border:1px solid var(--hx-line); font-size:14px; display:flex; flex-wrap:wrap; gap:16px; }
.md-td{ color:var(--hx-shade); }
.md-td:first-child{ color:var(--hx-ink); font-weight:600; }

/* ============================================================
   会员中心 / 个人资料（mc-*）
   布局：左侧深色身份卡 + 右侧浅色内容区，内容全部平铺
   ============================================================ */
.mc-layout{ display:grid; grid-template-columns:280px minmax(0,1fr); gap:28px; align-items:start; }

.mc-side{ position:sticky; top:88px; display:flex; flex-direction:column; gap:16px; }

.mc-card{
  background:var(--hx-ink); color:#fff; padding:30px 24px 26px; text-align:center;
  border-radius:2px; position:relative; overflow:hidden;
}
.mc-card::after{
  content:''; position:absolute; right:-46px; top:-46px; width:150px; height:150px;
  border:1px solid rgba(201,169,98,.22); border-radius:50%;
}
.mc-avatar{
  width:76px; height:76px; margin:0 auto 16px; border-radius:50%;
  background:linear-gradient(140deg,#C9A962,#A8873F);
  display:flex; align-items:center; justify-content:center;
  font-size:30px; color:#fff; overflow:hidden; position:relative; z-index:1;
}
.mc-avatar img{ width:100%; height:100%; object-fit:cover; }
.mc-name{ font-size:19px; font-weight:700; letter-spacing:.02em; position:relative; z-index:1; }
.mc-phone{ font-size:12.5px; color:rgba(255,255,255,.6); margin-top:5px; letter-spacing:.06em; position:relative; z-index:1; }
.mc-level{
  margin-top:16px; padding-top:15px; border-top:1px solid rgba(255,255,255,.14);
  display:flex; flex-direction:column; gap:7px; align-items:center; position:relative; z-index:1;
}
.mc-level-badge{
  background:var(--hx-gold); color:var(--hx-ink); font-size:12px; font-weight:700;
  padding:4px 14px; letter-spacing:.06em;
}
.mc-level-no{ font-size:11.5px; color:rgba(255,255,255,.5); letter-spacing:.05em; }

.mc-nav{ background:#fff; border:1px solid var(--hx-line); }
.mc-nav-item{
  display:flex; align-items:center; gap:11px; padding:14px 18px;
  font-size:14px; color:var(--hx-shade); border-bottom:1px solid var(--hx-line);
  transition:background .18s, color .18s;
}
.mc-nav-item:last-child{ border-bottom:0; }
.mc-nav-item i{ width:16px; text-align:center; color:var(--hx-weak); font-size:14px; transition:color .18s; }
.mc-nav-item:hover{ background:var(--hx-paper); color:var(--hx-ink); }
.mc-nav-item:hover i{ color:var(--hx-gold-d); }
.mc-nav-item.is-active{ background:var(--hx-paper); color:var(--hx-ink); font-weight:600; }
.mc-nav-item.is-active i{ color:var(--hx-gold-d); }
.mc-nav-item.is-active{ box-shadow:inset 3px 0 0 var(--hx-gold); }

.mc-logout{
  display:flex; align-items:center; justify-content:center; gap:8px;
  padding:12px; font-size:13.5px; color:var(--hx-shade);
  background:#fff; border:1px solid var(--hx-line); transition:all .18s;
}
.mc-logout:hover{ border-color:#C0392B; color:#C0392B; }

.mc-main{ display:flex; flex-direction:column; gap:22px; min-width:0; }

.mc-panel{ background:#fff; border:1px solid var(--hx-line); padding:30px 32px 32px; scroll-margin-top:88px; }
.mc-panel-head{ padding-bottom:18px; margin-bottom:24px; border-bottom:1px solid var(--hx-line); }
.mc-panel-title{ font-family:'Noto Serif SC',serif; font-size:23px; font-weight:700; color:var(--hx-ink); margin:0; }
.mc-panel-sub{ font-size:13.5px; color:var(--hx-weak); margin:8px 0 0; line-height:1.7; }
.mc-panel-sub b{ color:var(--hx-gold-d); font-weight:600; }

.mc-form-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 26px; }
.mc-form-foot{
  margin-top:26px; padding-top:20px; border-top:1px solid var(--hx-line);
  display:flex; align-items:center; justify-content:flex-end; gap:16px;
}
.mc-save-msg{ font-size:13px; color:var(--hx-shade); margin-right:auto; }
.mc-save-msg:empty{ display:none; }

.hx-input.is-locked{ background:var(--hx-paper); color:var(--hx-weak); cursor:not-allowed; }

.mc-tablewrap{ margin-top:0; }
.mc-th-num{ text-align:right; }
.mc-td-mono{ font-family:Menlo,Consolas,monospace; font-size:12.5px; color:var(--hx-shade); }

.mc-rights{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.mc-right{
  border:1px solid var(--hx-line); padding:22px 18px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:9px; background:var(--hx-paper);
}
.mc-right i{ font-size:22px; color:var(--hx-gold-d); }
.mc-right b{ font-size:15px; color:var(--hx-ink); font-weight:600; }
.mc-right span{ font-size:12.5px; color:var(--hx-weak); line-height:1.65; }

.mc-note{
  margin-top:18px; padding:13px 16px; background:var(--hx-cream);
  border-left:3px solid var(--hx-gold); font-size:13px; color:var(--hx-shade); line-height:1.7;
}

.mc-security{ display:flex; flex-direction:column; gap:16px; }
.mc-sec-row{ display:flex; align-items:flex-start; gap:20px; flex-wrap:wrap; }
.mc-sec-l{ min-width:180px; display:flex; flex-direction:column; gap:5px; }
.mc-sec-l b{ font-size:15px; color:var(--hx-ink); font-weight:600; }
.mc-sec-l span{ font-size:13px; color:var(--hx-weak); }
.mc-sec-r{ flex:1; display:flex; gap:10px; flex-wrap:wrap; align-items:center; min-width:280px; }
.mc-sec-r .hx-input{ flex:1; min-width:180px; }

.mc-agreements{ display:flex; flex-direction:column; gap:12px; }
.mc-agree-item{
  display:flex; align-items:center; gap:13px; padding:16px 20px;
  border:1px solid var(--hx-line); background:var(--hx-paper); color:var(--hx-ink);
  transition:border-color .18s, background .18s;
}
.mc-agree-item:hover{ border-color:var(--hx-gold); background:#fff; }
.mc-agree-item > i:first-child{ color:var(--hx-gold-d); font-size:16px; }
.mc-agree-t{ flex:1; font-size:14.5px; font-weight:500; }
.mc-agree-arrow{ color:var(--hx-weak); font-size:12px; }

.mc-card-empty{
  background:#fff; border:1px solid var(--hx-line); padding:56px 32px;
  text-align:center; display:flex; flex-direction:column; align-items:center; gap:12px;
}
.mc-card-empty > i{ font-size:42px; color:var(--hx-gold); }
.mc-empty-title{ font-family:'Noto Serif SC',serif; font-size:20px; color:var(--hx-ink); font-weight:700; margin:0; }
.mc-empty-desc{ font-size:13.5px; color:var(--hx-weak); margin:0 0 8px; line-height:1.7; }

.mc-empty{
  border:1px dashed var(--hx-line); background:var(--hx-paper);
  padding:44px 28px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:10px;
}
.mc-empty > i{ font-size:34px; color:var(--hx-gold); }
.mc-empty .mc-empty-title{ font-size:16px; }
.mc-empty .mc-empty-desc{ margin:0 0 6px; }

/* 登录弹窗：协议勾选 */
.mc-agree-check{
  display:flex; align-items:flex-start; gap:9px; cursor:pointer;
  font-size:12.5px; color:var(--hx-weak); line-height:1.7; user-select:none;
}
.mc-agree-check input{
  width:15px; height:15px; margin:2px 0 0; flex:none; cursor:pointer;
  accent-color:var(--hx-gold);
}
.mc-agree-check a{ color:var(--hx-gold-d); text-decoration:underline; text-underline-offset:2px; }
.mc-agree-check a:hover{ color:var(--hx-ink); }
.mc-agree-check.is-err input{ outline:1px solid #C0392B; }

@media (max-width:1024px){
  .mc-layout{ grid-template-columns:1fr; }
  .mc-side{ position:static; }
  .mc-rights{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px){
  .mc-panel{ padding:24px 18px; }
  .mc-form-grid{ grid-template-columns:1fr; }
  .mc-rights{ grid-template-columns:1fr; }
  .mc-sec-r{ flex-direction:column; align-items:stretch; }
  .mc-sec-r .yx-btn{ width:100%; }
}

/* 会员中心 · 订单卡片列表 */
.mc-orderlist{ display:flex; flex-direction:column; gap:12px; }
.mc-order{
  display:flex; align-items:flex-start; justify-content:space-between; gap:22px;
  border:1px solid var(--hx-line); border-left:3px solid var(--hx-gold);
  padding:18px 22px; background:#fff; transition:border-color .18s, box-shadow .18s;
}
.mc-order:hover{ border-color:var(--hx-gold-l); box-shadow:0 2px 14px rgba(11,29,58,.06); }
.mc-order-l{ display:flex; flex-direction:column; gap:9px; min-width:0; }
.mc-order-ship{ display:flex; align-items:center; gap:11px; flex-wrap:wrap; }
.mc-order-name{ font-size:16.5px; font-weight:700; color:var(--hx-ink); font-family:'Noto Serif SC',serif; }
.mc-order-meta{ display:flex; gap:20px; flex-wrap:wrap; }
.mc-order-meta > span{ display:flex; align-items:center; gap:7px; font-size:13px; color:var(--hx-shade); }
.mc-order-meta i{ color:var(--hx-gold-d); font-size:12.5px; width:13px; text-align:center; }
.mc-order-no{ font-family:Menlo,Consolas,monospace; font-size:11.5px; color:var(--hx-weak); letter-spacing:.02em; }
.mc-order-r{ text-align:right; flex:none; display:flex; flex-direction:column; gap:4px; }
.mc-order-r b{ font-size:19px; color:var(--hx-ink); font-weight:700; letter-spacing:.01em; }
.mc-order-r span{ font-size:11.5px; color:var(--hx-weak); }
@media (max-width:640px){
  .mc-order{ flex-direction:column; gap:12px; }
  .mc-order-r{ text-align:left; }
}

/* 侧边悬浮会员徽章（单字等级）
   ★不用 Tailwind 任意值 text-[9px]：Tailwind Play CDN 的任意值语法在实测中不生效
     （回落 12px），叠加默认 white-space:normal 会让「普通会员」换行撑破 48px 圆形。 */
.mc-lv-badge{
  position:absolute; top:-3px; right:-3px;
  min-width:18px; height:18px; padding:0 4px;
  display:flex; align-items:center; justify-content:center;
  background:var(--hx-gold); color:var(--hx-ink);
  font-size:11px; font-weight:700; line-height:1;
  white-space:nowrap; border-radius:9px;
  border:1.5px solid #fff; box-shadow:0 1px 4px rgba(11,29,58,.22);
  pointer-events:none;
  transition:background .3s, color .3s;
}
/* 按钮 hover 变金色底时，徽章转为深蓝，避免同色消失 */
.group:hover .mc-lv-badge{ background:var(--hx-ink); color:var(--hx-gold); }