/* ============================================================
   inner.css · 内页通用骨架（页首/内容版式/并排结构/图文分栏）
   提供多套页首与版式变体，配合 blocks.css 使用
   ============================================================ */

/* ---------- 页首 变体A：横向分割（默认） ---------- */
.page-hero--a .container{display:grid;grid-template-columns:1.5fr 1fr;gap:40px;align-items:end}

/* ---------- 页首 变体B：全宽居中徽章 ---------- */
.page-hero--b{text-align:center}
.page-hero--b h1{margin-left:auto;margin-right:auto}
.page-hero--b p.lead{margin-left:auto;margin-right:auto}
.page-hero--b .hero-tags{justify-content:center}

/* ---------- 页首 变体C：左标题 + 右侧信息柱 ---------- */
.page-hero--c .hero-side{
  padding:24px;border-radius:14px;background:rgba(255,255,255,.03);
  border:1px solid var(--line-2);backdrop-filter:blur(6px);
}
.page-hero--c .hero-side li{display:flex;gap:10px;font-size:13.5px;color:var(--paper-2);padding:9px 0;border-bottom:1px dashed rgba(176,141,87,.18)}
.page-hero--c .hero-side li:last-child{border-bottom:none}
.page-hero--c .hero-side li svg{width:16px;height:16px;color:var(--bronze);flex-shrink:0;margin-top:3px}

/* ---------- 内容版式 变体A：左文右图 ---------- */
.split-a{display:grid;grid-template-columns:1.15fr 1fr;gap:52px;align-items:center}
.split-a.flip .text{order:2}
.split-a .media{position:relative}
.split-a .media img{border-radius:16px;box-shadow:var(--shadow);border:1px solid var(--line-2);width:100%;aspect-ratio:16/11;object-fit:cover}
.split-a .media .cap{
  position:absolute;left:18px;bottom:18px;padding:10px 18px;border-radius:10px;
  background:rgba(15,12,9,.85);border:1px solid var(--line);font-size:12.5px;color:var(--bronze-l);letter-spacing:.1em;
}
.split-a h3{margin-bottom:16px}
.split-a p{color:var(--paper-2);font-size:14.5px}
.split-a .points{display:flex;flex-direction:column;gap:12px;margin-top:20px}
.split-a .points li{display:flex;gap:12px;font-size:14px;color:var(--paper)}
.split-a .points li svg{width:18px;height:18px;color:#a3c37a;flex-shrink:0;margin-top:3px}

/* ---------- 内容版式 变体B：图文交替（之字形） ---------- */
.zigzag{display:flex;flex-direction:column;gap:0}
.zz{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;padding:34px 0}
.zz:nth-child(even) .zz-text{order:2}
.zz img{border-radius:16px;width:100%;aspect-ratio:16/11;object-fit:cover;border:1px solid var(--line-2);box-shadow:var(--shadow)}
.zz .k{font-size:12px;letter-spacing:.3em;color:var(--red);display:block;margin-bottom:10px}
.zz h3{margin-bottom:12px}
.zz p{color:var(--paper-2);font-size:14px}

/* ---------- 内容版式 变体C：三栏说明卡 ---------- */
.tri{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.tri .tri-item{padding:26px 22px;border-radius:14px;background:rgba(255,255,255,.022);border:1px solid var(--line-2);transition:.35s}
.tri .tri-item:hover{border-color:var(--line);background:rgba(176,141,87,.05);transform:translateY(-5px)}
.tri .tri-item .no{font-family:var(--font-h);font-size:30px;color:var(--bronze);display:block;margin-bottom:10px}
.tri .tri-item h4{font-size:16px;margin-bottom:8px}
.tri .tri-item p{font-size:13px;color:var(--paper-2);margin:0}

/* ---------- 内容版式 变体D：横幅大图 + 文字叠层 ---------- */
.band-img{position:relative;border-radius:18px;overflow:hidden;min-height:360px;display:flex;align-items:flex-end}
.band-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.band-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(10,8,5,.92))}
.band-img .band-text{position:relative;z-index:2;padding:32px;max-width:620px}
.band-img .band-text h3{color:#f6ead5;margin-bottom:8px}
.band-img .band-text p{color:var(--paper-2);font-size:14px;margin:0}

/* ---------- 正文段落排版（百科式） ---------- */
.prose h3{margin:30px 0 12px;position:relative;padding-left:16px}
.prose h3::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:4px;border-radius:4px;background:var(--grad-bronze)}
.prose p{color:var(--paper-2);font-size:14.5px}
.prose ul,.prose ol{margin:10px 0 16px;padding-left:6px}
.prose ul li,.prose ol li{position:relative;padding:6px 0 6px 22px;color:var(--paper-2);font-size:14px}
.prose ul li::before{content:"";position:absolute;left:4px;top:14px;width:7px;height:7px;border-radius:50%;background:var(--bronze)}
.prose ol{counter-reset:pr}
.prose ol li{counter-increment:pr}
.prose ol li::before{content:counter(pr);position:absolute;left:0;top:6px;width:16px;height:16px;border-radius:5px;background:var(--grad-bronze);color:#241b10;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center}

/* ---------- 页内锚点导航 ---------- */
.anchor-nav{
  display:flex;gap:10px;flex-wrap:wrap;padding:14px;border-radius:14px;
  background:rgba(255,255,255,.024);border:1px solid var(--line-2);margin-bottom:38px;
  position:sticky;top:76px;z-index:60;
}
.anchor-nav a{padding:8px 18px;border-radius:999px;font-size:13px;color:var(--paper-2);border:1px solid transparent;transition:.3s}
.anchor-nav a:hover{color:var(--bronze-l);border-color:var(--line)}

/* ---------- 侧边栏骨架（资讯/详情通用） ---------- */
.two-col{display:grid;grid-template-columns:1fr 330px;gap:40px;align-items:start}
.side-panel{position:sticky;top:90px;display:flex;flex-direction:column;gap:22px}
.side-card{border-radius:14px;padding:22px;background:linear-gradient(160deg,#211a12,#18130d);border:1px solid var(--line-2)}
.side-card h4{font-size:14px;letter-spacing:.16em;color:#f0e4cd;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line-2);display:flex;align-items:center;gap:8px}
.side-card h4::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--red)}
.side-card li{margin-bottom:9px}
.side-card li a{font-size:13px;color:var(--paper-2);display:flex;justify-content:space-between;gap:10px;transition:.25s}
.side-card li a:hover{color:var(--bronze-l)}
.side-card li time{font-size:11.5px;color:var(--paper-3);flex-shrink:0}
.side-cta{background:linear-gradient(150deg,#6e2323,#221a12);border:1px solid rgba(176,141,87,.35)}
.side-cta h4::before{display:none}
.side-cta h4{color:#f6ead5}
.side-cta p{font-size:12.5px;color:rgba(233,223,205,.7);margin-bottom:14px}
.side-cta .tel{display:block;font-family:var(--font-h);font-size:24px;color:var(--bronze-l);margin-bottom:12px;letter-spacing:.04em}
.side-cta .btn{width:100%}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .page-hero--a .container,.split-a,.zz{grid-template-columns:1fr;gap:28px}
  .split-a.flip .text{order:0}
  .zz:nth-child(even) .zz-text{order:0}
  .two-col{grid-template-columns:1fr}
  .side-panel{position:static}
  .tri{grid-template-columns:1fr 1fr}
  .anchor-nav{position:static}
}
@media (max-width:640px){
  .tri{grid-template-columns:1fr}
}
