/* ============================================================
   敦煌五色沙疗 · 内页样式 inner.css
   作用域 body.dh-inner —— 与首页 home.css 隔离
   ============================================================ */

/* ---------- 内页导航占位（导航是 fixed） ---------- */
body.dh-inner .nav-holder { height:0; }

/* ---------- 内页顶部海报：380px（移动端 230px） ---------- */
.dh-banner {
  position:relative; height:380px; overflow:hidden;
  background:var(--ink); margin-top:0;
}
.dh-banner-bg {
  position:absolute; inset:0; background-size:cover; background-position:center;
  transform:scale(1.0); animation:bannerZoom 14s ease-in-out infinite alternate;
}
@keyframes bannerZoom { from { transform:scale(1); } to { transform:scale(1.08); } }
.dh-banner-mask {
  position:absolute; inset:0;
  background:linear-gradient(to bottom, rgba(24,16,8,.55) 0%, rgba(24,16,8,.30) 45%, rgba(24,16,8,.68) 100%);
}
.dh-banner-inner {
  position:absolute; left:0; right:0; top:50%; transform:translateY(-52%);
  text-align:center; z-index:2; padding:0 20px;
}
.dh-banner-inner .b-en {
  font-size:13px; letter-spacing:6px; color:#EBD7B4; opacity:.92; margin-bottom:14px;
}
.dh-banner-inner h1 {
  font-family:var(--serif); font-size:44px; color:#fff; letter-spacing:10px; text-indent:10px;
  text-shadow:0 4px 24px rgba(0,0,0,.45); font-weight:700; margin:0;
}
.dh-banner-inner .b-line {
  width:66px; height:2px; background:var(--sand); margin:22px auto 0; position:relative;
}
.dh-banner-inner .b-line::before,
.dh-banner-inner .b-line::after {
  content:""; position:absolute; top:-2px; width:6px; height:6px;
  background:var(--seal); border-radius:50%;
}
.dh-banner-inner .b-line::before { left:-14px; }
.dh-banner-inner .b-line::after  { right:-14px; }
.dh-banner-crumb {
  position:absolute; right:0; bottom:22px; z-index:2;
  color:rgba(255,248,235,.85); font-size:12.5px; letter-spacing:1px;
  padding:6px 40px 6px 22px; background:rgba(24,16,8,.42);
  border-left:2px solid var(--sand);
}
.dh-banner-crumb a { color:rgba(255,248,235,.92); }
.dh-banner-crumb a:hover { color:#EBD7B4; }

/* ---------- 内页内容容器 ---------- */
.dh-page { max-width:1100px; margin:0 auto; padding:54px 20px 80px; }
.dh-card {
  background:#FFFDF9; border:1px solid var(--line); border-radius:5px;
  box-shadow:0 10px 30px rgba(74,59,44,.08);
}

/* ---------- 子栏目筛选（敦煌风 tab） ---------- */
.dh-sortnav { display:flex; flex-wrap:wrap; gap:10px; margin:0 0 30px; }
.dh-sortnav a {
  display:inline-block; padding:8px 22px; font-size:14px; letter-spacing:2px;
  border:1px solid var(--line); border-radius:999px; color:var(--ink-soft);
  background:#FFFDF9; transition:all .3s;
}
.dh-sortnav a:hover { border-color:var(--sand); color:var(--sand-deep); }
.dh-sortnav a.active { background:var(--seal); border-color:var(--seal); color:#fff; }

/* ---------- 图文列表（高端大气版） ---------- */
.dh-list { display:flex; flex-direction:column; gap:22px; }
.dh-item {
  display:flex; gap:0; background:#FFFDF9; border:1px solid var(--line);
  border-radius:5px; overflow:hidden; transition:all .35s ease;
  box-shadow:0 6px 20px rgba(74,59,44,.07);
}
.dh-item:hover {
  transform:translateY(-5px); border-color:var(--sand);
  box-shadow:0 20px 44px rgba(74,59,44,.16);
}
.dh-item .pic {
  flex:0 0 300px; min-height:200px; overflow:hidden; position:relative;
  background:var(--paper-deep);
}
.dh-item .pic img {
  width:100%; height:100%; object-fit:cover; position:absolute; inset:0;
  transition:transform .6s ease;
}
.dh-item:hover .pic img { transform:scale(1.06); }
.dh-item .info {
  flex:1; padding:26px 30px; display:flex; flex-direction:column; justify-content:center;
  position:relative;
}
.dh-item .info::before {
  content:""; position:absolute; left:0; top:24px; bottom:24px; width:3px;
  background:linear-gradient(to bottom, var(--sand), transparent); border-radius:2px;
  opacity:0; transition:opacity .35s;
}
.dh-item:hover .info::before { opacity:1; }
.dh-item .meta { display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.dh-item .meta .date { font-size:12.5px; color:var(--sand-deep); letter-spacing:1px; }
.dh-item .meta .badge {
  font-size:11px; padding:2px 12px; border-radius:999px; letter-spacing:2px;
  background:rgba(166,61,47,.1); color:var(--seal);
}
.dh-item .meta .badge.top { background:rgba(166,61,47,.12); }
.dh-item .meta .badge.rec { background:rgba(185,138,69,.14); color:var(--sand-deep); }
.dh-item .info h4 {
  font-family:var(--serif); font-size:20px; color:var(--ink); letter-spacing:1px;
  line-height:1.55; margin-bottom:10px; transition:color .3s;
}
.dh-item:hover .info h4 { color:var(--seal); }
.dh-item .info p {
  font-size:13.5px; color:var(--text-soft); line-height:1.85; text-align:justify;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.dh-item .info .more {
  margin-top:14px; font-size:12.5px; letter-spacing:2px; color:var(--sand-deep);
}
.dh-item:hover .info .more { color:var(--seal); }

/* ---------- 详情页 ---------- */
.dh-article { padding:44px 52px 50px; }
.dh-article .a-title {
  font-family:var(--serif); font-size:28px; color:var(--ink); letter-spacing:2px;
  text-align:center; line-height:1.6; margin-bottom:16px;
}
.dh-article .a-meta {
  display:flex; justify-content:center; gap:26px; padding-bottom:22px; margin-bottom:30px;
  border-bottom:1px solid var(--line); font-size:13px; color:var(--text-soft); letter-spacing:1px;
}
.dh-article .a-meta span b { color:var(--sand-deep); font-weight:600; }
.dh-article .a-content { font-size:15px; line-height:2.05; color:var(--text); }
.dh-article .a-content p { margin-bottom:14px; text-align:justify; }
.dh-article .a-content img { max-width:100%; height:auto; border-radius:4px; margin:10px auto; display:block; }
.dh-article .a-content h2, .dh-article .a-content h3 {
  font-family:var(--serif); color:var(--ink); margin:26px 0 14px; letter-spacing:2px;
}
.dh-article .a-nav {
  display:flex; gap:16px; margin-top:36px; padding-top:24px; border-top:1px dashed var(--line);
}
.dh-article .a-nav a {
  flex:1; padding:14px 18px; font-size:13.5px; color:var(--ink-soft);
  border:1px solid var(--line); border-radius:4px; line-height:1.6;
  transition:all .3s; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;
}
.dh-article .a-nav a:hover { border-color:var(--sand); color:var(--seal); background:rgba(185,138,69,.05); }
.dh-article .a-nav .lab { display:block; font-size:11.5px; color:var(--sand-deep); letter-spacing:2px; margin-bottom:4px; }

/* ---------- 单页（关于我们/联系我们） ---------- */
.dh-single { padding:48px 56px 54px; }
.dh-single .s-content { font-size:15px; line-height:2.1; color:var(--text); }
.dh-single .s-content p { margin-bottom:14px; text-align:justify; }
.dh-single .s-content img { max-width:100%; border-radius:4px; }
.dh-single .s-content b { color:var(--sand-deep); }

/* ---------- 留言表单页 ---------- */
.dh-form { padding:48px 56px 54px; }
.dh-form .f-title {
  font-family:var(--serif); font-size:22px; color:var(--ink); letter-spacing:3px;
  text-align:center; margin-bottom:6px;
}
.dh-form .f-sub { text-align:center; font-size:13px; color:var(--text-soft); letter-spacing:2px; margin-bottom:30px; }
.dh-form label.fld { display:block; margin-bottom:18px; font-size:13.5px; color:var(--ink-soft); letter-spacing:1px; }
.dh-form input, .dh-form textarea {
  width:100%; margin-top:8px; padding:12px 15px; font-size:14px;
  background:#FCFAF5; color:var(--text); border:1px solid var(--line); border-radius:3px;
  outline:none; font-family:var(--sans); transition:border .3s;
}
.dh-form input:focus, .dh-form textarea:focus { border-color:var(--sand); background:#fff; }
.dh-form textarea { min-height:130px; resize:vertical; }
.dh-form .f-row { display:flex; gap:16px; }
.dh-form .f-row label.fld { flex:1; }
.dh-form .f-code { display:flex; gap:14px; align-items:center; margin-bottom:18px; }
.dh-form .f-code input { flex:1; margin-top:0; }
.dh-form .f-code img { height:44px; border-radius:3px; cursor:pointer; }
.dh-form .btn-submit {
  width:100%; padding:14px; cursor:pointer; background:var(--seal); color:#fff;
  border:none; border-radius:3px; font-size:15px; letter-spacing:6px; transition:background .3s;
}
.dh-form .btn-submit:hover { background:#8F3021; }

/* ---------- 分页 ---------- */
.dh-page .pagination { display:flex; justify-content:center; gap:8px; margin-top:44px; flex-wrap:wrap; }
.dh-page .pagination a, .dh-page .pagination span {
  min-width:40px; height:40px; padding:0 14px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--line); border-radius:3px; font-size:13.5px; color:var(--ink-soft);
  background:#FFFDF9; transition:all .3s; line-height:1;
}
.dh-page .pagination a:hover { border-color:var(--sand); color:var(--sand-deep); }
.dh-page .pagination .active, .dh-page .pagination span.current {
  background:var(--seal); border-color:var(--seal); color:#fff;
}
.dh-page .pagination .disabled { opacity:.45; cursor:not-allowed; }

/* ---------- 无数据 ---------- */
.dh-empty { text-align:center; padding:80px 0; color:var(--text-soft); letter-spacing:2px; }

/* ============================================================
   响应式
   ============================================================ */
@media (max-width:900px) {
  /* 移动端海报高度 230px */
  .dh-banner { height:230px; }
  .dh-banner-inner h1 { font-size:30px; letter-spacing:6px; text-indent:6px; }
  .dh-banner-inner .b-en { font-size:11.5px; letter-spacing:4px; margin-bottom:10px; }
  .dh-banner-inner .b-line { margin-top:14px; }
  .dh-banner-crumb { bottom:12px; font-size:11.5px; padding:5px 16px; }

  .dh-page { padding:34px 16px 60px; }
  .dh-item { flex-direction:column; }
  .dh-item .pic { flex:none; height:200px; }
  .dh-item .info { padding:20px 22px 24px; }
  .dh-item .info::before { display:none; }

  .dh-article, .dh-single, .dh-form { padding:30px 22px 36px; }
  .dh-article .a-title { font-size:22px; }
  .dh-article .a-meta { flex-wrap:wrap; gap:10px; }
  .dh-article .a-nav { flex-direction:column; }

  .dh-form .f-row { flex-direction:column; gap:0; }
}

/* ============================================================
   联系我们页（contact.html 专属）
   ============================================================ */
.dh-contact { max-width:1100px; }

/* 三张联系信息卡 */
.contact-cards {
  display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-bottom:40px;
}
.ccard {
  background:#FFFDF9; border:1px solid var(--line); border-radius:5px;
  padding:36px 26px 30px; text-align:center;
  transition:all .35s; box-shadow:0 8px 24px rgba(74,59,44,.08);
  position:relative; overflow:hidden;
}
.ccard::after {
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background:linear-gradient(to right, var(--sand), var(--seal));
  opacity:0; transition:opacity .35s;
}
.ccard:hover { transform:translateY(-6px); border-color:var(--sand); box-shadow:0 20px 44px rgba(74,59,44,.16); }
.ccard:hover::after { opacity:1; }
.ccard .c-ico {
  width:58px; height:58px; margin:0 auto 16px; border-radius:50%;
  background:linear-gradient(135deg, var(--sand), var(--sand-deep));
  color:#fff; font-size:24px; display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 20px rgba(185,138,69,.35);
}
.ccard:nth-child(2) .c-ico { background:linear-gradient(135deg, var(--seal), #8F3021); box-shadow:0 8px 20px rgba(166,61,47,.35); }
.ccard:nth-child(3) .c-ico { background:linear-gradient(135deg, var(--qing), #2E524D); box-shadow:0 8px 20px rgba(62,107,100,.35); }
.ccard h4 { font-family:var(--serif); font-size:18px; color:var(--ink); letter-spacing:2px; margin-bottom:12px; }
.ccard .big { font-family:var(--serif); font-size:26px; color:var(--seal); letter-spacing:1px; font-weight:700; margin-bottom:8px; }
.ccard .mid { font-size:13.5px; color:var(--ink-soft); line-height:1.9; margin-bottom:8px; }
.ccard .sub { font-size:12px; color:var(--text-soft); letter-spacing:1px; padding-top:10px; border-top:1px dashed var(--line); }

/* 左：服务信息 / 右：预约表单 */
.contact-split { display:grid; grid-template-columns:1.05fr 1fr; gap:26px; margin-bottom:74px; align-items:stretch; }
.cs-info {
  background:#FFFDF9; border:1px solid var(--line); border-radius:5px; padding:38px 40px;
  box-shadow:0 8px 24px rgba(74,59,44,.08);
}
.cs-info h3 {
  font-family:var(--serif); font-size:19px; color:var(--ink); letter-spacing:2px;
  margin:0 0 14px; display:flex; align-items:center; gap:10px;
}
.cs-info h3 .ico {
  width:36px; height:36px; border-radius:8px; font-size:17px;
  background:rgba(185,138,69,.12); color:var(--sand-deep);
  display:inline-flex; align-items:center; justify-content:center;
}
.cs-info h3:not(:first-child) { margin-top:30px; }
.cs-info ul { list-style:none; margin-bottom:6px; }
.cs-info li {
  position:relative; padding:7px 0 7px 20px; font-size:13.5px; color:var(--text-soft); line-height:1.8;
  border-bottom:1px dashed rgba(226,215,195,.6);
}
.cs-info li:last-child { border-bottom:none; }
.cs-info li::before {
  content:""; position:absolute; left:2px; top:16px;
  width:7px; height:7px; background:var(--sand); transform:rotate(45deg);
}
.cs-info li b { color:var(--ink); font-weight:600; }

.cs-form {
  background:linear-gradient(160deg, #2E2318, #221910); border-radius:5px;
  padding:38px 40px 42px; color:#E8DFCE;
  box-shadow:0 16px 40px rgba(43,33,24,.3);
  display:flex; flex-direction:column;
}
.cs-form .f-title {
  font-family:var(--serif); font-size:24px; color:#F5EFE3; letter-spacing:4px; text-align:center;
}
.cs-form .f-sub { text-align:center; font-size:12.5px; color:#C9BBA4; letter-spacing:2px; margin:8px 0 26px; padding-bottom:20px; border-bottom:1px solid rgba(233,215,180,.18); }
.cs-form label.fld { display:block; margin-bottom:16px; font-size:13px; color:#C9BBA4; letter-spacing:1px; }
.cs-form input, .cs-form textarea {
  width:100%; margin-top:8px; padding:12px 15px; font-size:14px;
  background:rgba(255,253,249,.07); color:#F5EFE3;
  border:1px solid rgba(233,215,180,.28); border-radius:3px; outline:none;
  font-family:var(--sans); transition:border .3s;
}
.cs-form input::placeholder, .cs-form textarea::placeholder { color:#9C8E77; }
.cs-form input:focus, .cs-form textarea:focus { border-color:var(--sand); background:rgba(255,253,249,.1); }
.cs-form textarea { min-height:110px; resize:vertical; }
.cs-form .f-row { display:flex; gap:14px; }
.cs-form .f-row label.fld { flex:1; }
.cs-form .f-code { display:flex; gap:12px; align-items:center; margin-bottom:16px; }
.cs-form .f-code input { flex:1; margin-top:0; }
.cs-form .f-code img { height:44px; border-radius:3px; cursor:pointer; }
.cs-form .btn-submit {
  width:100%; padding:14px; cursor:pointer; background:var(--seal); color:#fff;
  border:none; border-radius:3px; font-size:15px; letter-spacing:6px; transition:background .3s;
}
.cs-form .btn-submit:hover { background:#8F3021; }
.cs-form .f-call {
  margin-top:18px; text-align:center; font-size:13px; color:#C9BBA4; letter-spacing:1px;
}
.cs-form .f-call b { color:#EBD7B4; font-size:16px; letter-spacing:1px; }

/* 常见问题 FAQ */
.contact-faq { margin-bottom:6px; }
.faq-list { max-width:860px; margin:0 auto; display:flex; flex-direction:column; gap:14px; }
.faq-item {
  background:#FFFDF9; border:1px solid var(--line); border-radius:5px;
  overflow:hidden; transition:border .3s;
}
.faq-item[open] { border-color:var(--sand); box-shadow:0 12px 30px rgba(74,59,44,.12); }
.faq-item summary {
  list-style:none; cursor:pointer; padding:18px 52px 18px 22px;
  font-family:var(--serif); font-size:16.5px; color:var(--ink); letter-spacing:1px;
  position:relative; user-select:none;
}
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::before {
  content:"问"; position:absolute; left:22px; margin-left:-38px;
  width:26px; height:26px; border-radius:6px; background:var(--sand);
  color:#fff; font-size:13px; display:inline-flex; align-items:center; justify-content:center;
  top:50%; transform:translateY(-50%);
}
.faq-item summary::after {
  content:"+"; position:absolute; right:20px; top:50%; transform:translateY(-50%);
  font-size:20px; color:var(--sand-deep); font-family:var(--sans); transition:transform .3s;
}
.faq-item[open] summary::after { content:"−"; }
.faq-item summary { padding-left:64px; }
.faq-item .a {
  padding:2px 24px 20px 64px; font-size:13.5px; color:var(--text-soft); line-height:1.95; text-align:justify;
}
.faq-item .a::before { content:"答："; color:var(--seal); font-weight:600; }

/* ---------- 响应式 ---------- */
@media (max-width:900px) {
  .contact-cards { grid-template-columns:1fr; gap:16px; }
  .ccard { padding:28px 20px 24px; }
  .contact-split { grid-template-columns:1fr; margin-bottom:56px; }
  .cs-info, .cs-form { padding:28px 22px 32px; }
  .faq-item summary { font-size:15px; padding:15px 44px 15px 56px; }
  .faq-item .a { padding:0 20px 18px 56px; }
}

/* ============================================================
   图片网格列表（产品/团队/培训/见证）
   ============================================================ */
.dh-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:26px;
}
.dg-card {
  background:#FFFDF9; border:1px solid var(--line); border-radius:5px;
  overflow:hidden; transition:all .35s ease;
  box-shadow:0 6px 20px rgba(74,59,44,.07);
  display:flex; flex-direction:column;
}
.dg-card:hover {
  transform:translateY(-6px); border-color:var(--sand);
  box-shadow:0 22px 48px rgba(74,59,44,.17);
}
.dg-card .pic {
  height:230px; overflow:hidden; position:relative; background:var(--paper-deep);
}
.dg-card .pic img {
  width:100%; height:100%; object-fit:cover; position:absolute; inset:0;
  transition:transform .6s ease;
}
.dg-card:hover .pic img { transform:scale(1.07); }
.dg-card .pic .rec {
  position:absolute; left:14px; top:14px; z-index:2;
  padding:3px 14px; border-radius:999px; font-size:11px; letter-spacing:2px;
  background:rgba(166,61,47,.92); color:#fff;
}
.dg-card .info { padding:20px 22px 24px; flex:1; display:flex; flex-direction:column; }
.dg-card .info .meta { font-size:12.5px; color:var(--sand-deep); letter-spacing:1px; margin-bottom:8px; }
.dg-card .info h4 {
  font-family:var(--serif); font-size:19px; color:var(--ink); letter-spacing:1px;
  line-height:1.55; margin-bottom:8px; transition:color .3s;
}
.dg-card:hover .info h4 { color:var(--seal); }
.dg-card .info p {
  font-size:13px; color:var(--text-soft); line-height:1.8;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.dg-card .info .more {
  margin-top:auto; padding-top:14px; font-size:12.5px; letter-spacing:2px; color:var(--sand-deep);
}
.dg-card:hover .info .more { color:var(--seal); }

@media (max-width:900px) {
  .dh-grid { grid-template-columns:repeat(2,1fr); gap:16px; }
  .dg-card .pic { height:180px; }
  .dg-card .info { padding:16px 16px 20px; }
  .dg-card .info h4 { font-size:16.5px; }
}
@media (max-width:560px) {
  .dh-grid { grid-template-columns:1fr; }
}