/* 武当山站专属配色覆盖（2026-10-31）
   另两站用森林绿系，武当山站改用赭红 #8E3A2F + 古金，
   取"红墙金瓦、道教朱砂"的意象，三站视觉上互相可辨。 */

:root{
  --brand:#8E3A2F;
  --brand-d:#5C2018;
  --brand-l:#FAEDE9;
  --accent:#B08D57;
  --accent-l:#FBF3E6;
  --ink:#241311;
  --body:#4A3B38;
  --muted:#8A7B78;
  --line:#EDE2DE;
  --soft:#FBF6F4;
}

/* 首屏渐变跟随主色 */
.hero{background:linear-gradient(135deg,#5C2018 0%,#8E3A2F 55%,#A9482F 100%)}

/* 强调色 hover 同步 */
.header-tel:hover{background:#96703F}
.hero-search button{background:var(--accent)}
.hero-search button:hover{background:#96703F}

/* 顶部条文字对比度（深绿底） */
.topbar{color:#F3DED7}
.hero p.lead{color:#F3DED7}
.hero-hot{color:#EED5CC}

/* 目的地卡片标题描边在浅色图片上更清晰 */
.dcard-cap b{text-shadow:0 1px 6px rgba(0,0,0,.35)}

/* 表格（门票等数据页用）——黄石站模板未内置，补齐 */
.article-body table{width:100%;border-collapse:collapse;margin:18px 0;font-size:14px}
.article-body th,.article-body td{border:1px solid var(--line);padding:9px 12px;text-align:left}
.article-body th{background:var(--brand-l);color:var(--brand-d);font-weight:600}
.article-body tr:nth-child(even) td{background:#FDF9F7}

/* 提示框 */
.article-body .note{background:var(--accent-l);border-left:3px solid var(--accent);padding:12px 16px;margin:16px 0;border-radius:0 var(--r-s) var(--r-s) 0;font-size:14px}

/* ===== 无图状态兜底（2026-10-30）
   图片尚未铺装时，避免出现"大片纯色空块"这种明显的缺图观感。 */

/* 幻灯片为空 → 隐藏 480px 的首屏大图区，让文字区直接成为首屏
   注意：用 :not(:has(*)) 而不是 :empty —— 模板里的空白换行也是文本节点，
   :empty 会永远不匹配（已踩） */
.hero:has(.hero-slider:not(:has(*))){display:none}

/* 幻灯片有内容但只有一张时，隐藏圆点条 */
.hero-dots:has(> button:only-child){display:none}

/* 卡片占位：加一层柔光，看起来像设计过的色块而不是缺图 */
.card-img .ph,
.card-h .card-img-h .ph{
  background:
    radial-gradient(circle at 18% 26%, rgba(255,255,255,.13) 0, transparent 46%),
    radial-gradient(circle at 82% 74%, rgba(255,255,255,.09) 0, transparent 42%);
  letter-spacing:3px;
  text-shadow:0 1px 10px rgba(0,0,0,.22);
}

/* 目的地卡片占位：叠一层山形，视觉上更像风景位 */
.dcard-bg::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:46%;
  background:
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.28) 100%),
    radial-gradient(120% 100% at 20% 100%, rgba(255,255,255,.10) 0, transparent 60%);
}

/* 栏目头图缺失时，用主色渐变兜底（列表页顶部区域不至于全白） */
.page-hero:not(:has(.ph-bg)){
  background:linear-gradient(135deg,var(--brand-d) 0%,var(--brand) 62%,#A9482F 100%);
  padding:38px 0;
}
.page-hero:not(:has(.ph-bg)) h1,
.page-hero:not(:has(.ph-bg)) p{color:#fff}

/* ===== 目的地卡片：统一到赭红体系 =====
   原模板用绿/蓝/棕三色轮换，在无图状态下会显得配色杂乱（已踩）。
   这里统一为同色系深浅变化，有真实图片时又会被图片覆盖，不影响。 */
.dcard .dcard-bg{background:linear-gradient(150deg,#6B2419,#9C4433)}
.dcard:nth-child(2n) .dcard-bg{background:linear-gradient(150deg,#5E2016,#8B3A2A)}
.dcard:nth-child(3n) .dcard-bg{background:linear-gradient(150deg,#7A2B1E,#A94E38)}
.dcard:nth-child(4n) .dcard-bg{background:linear-gradient(150deg,#662315,#8E4030)}
.dcard:nth-child(5n) .dcard-bg{background:linear-gradient(150deg,#712718,#96402F)}

/* ===== 玩法卡片：无图标时补一层淡色底，避免看起来像空框 ===== */
.type-card{
  background:
    radial-gradient(circle at 88% 12%, rgba(142,58,47,.07) 0, transparent 52%),
    #fff;
  border:1px solid var(--line);
}
.type-card b{color:var(--brand-d)}
.type-card:hover{border-color:var(--brand);box-shadow:0 4px 18px rgba(142,58,47,.10)}

/* ===== 2026-10-31 轮播遮罩修正（武当山站） =====
   问题：基础模板的 .hero-veil（左侧 .74）和这里的 .sld:after（左侧 .84）
        是两层独立 div/伪元素，叠加后左侧综合不透明度 ≈ 96%，
        实景被压成一片黑。武当山素材多为明亮天空照片，看得很明显。
   处理：把 .hero-veil 降到极轻，压暗统一交给 .sld:after 一层承担；
        同时把 .sld:after 稍微回调，让云海和天空透出来。
   ⚠️ 黄石 / 神农架两站存在同样的双层叠加，样式同源，尚未改（已记入待办）。 */
.hero-veil{
  background:linear-gradient(90deg,rgba(24,8,5,.20) 0%,rgba(24,8,5,.06) 55%,rgba(24,8,5,0) 100%);
}
.sld:after{
  background:
    linear-gradient(90deg,rgba(38,12,8,.62) 0%,rgba(38,12,8,.28) 52%,rgba(38,12,8,0) 100%),
    linear-gradient(0deg,rgba(38,12,8,.58) 0%,rgba(38,12,8,0) 54%);
}

/* 2) 玩法卡：改为「左文字 + 右图片」，不再整块蒙白 */
.type-card{
  min-height:150px;
  padding:24px 46% 24px 24px;
  display:flex;flex-direction:column;justify-content:center;
  background:#fff;
}
.type-ico{
  inset:0 0 0 auto;
  width:44%;
  opacity:1;
  background-size:cover;
  background-position:center;
}
.type-card:before{
  background:linear-gradient(90deg,#fff 0%,#fff 50%,rgba(255,255,255,0) 63%);
}
@media (max-width:760px){
  .type-card{min-height:0;padding:20px 40% 20px 20px}
  .type-ico{width:38%}
}
