/* ============================================================
   资讯详情 show.html 专属样式（护腰靠垫风 · 独立原创布局）
   ============================================================ */

/* ---------- 文章页导语 ---------- */
.show-intro{ padding:34px 0 0; }
.show-intro-inner{
  background:var(--c-green-pale); border-radius:22px; padding:26px 34px;
  display:flex; align-items:center; justify-content:space-between; gap:26px; flex-wrap:wrap;
}
.show-intro-inner p{ margin:0; font-size:14.5px; line-height:1.9; color:var(--c-body); max-width:88ch; }
@media (max-width:760px){
  .show-intro-inner{ padding:22px 20px; }
}

/* ---------- 文章主体 ---------- */
.article{ padding:36px 0 70px; }
.article-layout{ display:grid; grid-template-columns:1fr 320px; gap:44px; align-items:start; }
.article-card{ background:#fff; border-radius:24px; padding:44px 52px 56px; box-shadow:var(--shadow-soft); }
.article-head{ border-bottom:1px solid var(--c-line); padding-bottom:26px; margin-bottom:30px; }
.article-head h1{ font-size:clamp(22px,3vw,32px); line-height:1.4; margin-bottom:18px; }
.article-meta{ display:flex; gap:26px; flex-wrap:wrap; font-size:13.5px; color:var(--c-mute); }
.article-meta time{ color:var(--c-green-deep); font-weight:600; }
.article-body{ font-size:16px; line-height:2; }
.article-body img{ width:100%; height:auto; border-radius:16px; margin-bottom:24px; }
.article-body p{ margin-bottom:1.4em; }
.article-body h2{ margin:1.8em 0 .8em; font-size:22px; }
.article-body h3{ margin:1.6em 0 .7em; font-size:18px; }
.article-body ul{ margin:1em 0; padding-left:0; list-style:none; }
.article-body ul li{ padding-left:1.6em; position:relative; margin-bottom:.6em; }
.article-body ul li::before{ content:""; position:absolute; left:0; top:.62em; width:7px; height:7px; border-radius:50%; background:var(--c-green); }

/* ---------- 侧栏 ---------- */
.article-side{ display:flex; flex-direction:column; gap:20px; position:sticky; top:96px; }
.aside-card{ background:#fff; border-radius:20px; padding:26px 24px; box-shadow:var(--shadow-soft); }
.aside-card h3{ font-size:16.5px; margin-bottom:16px; position:relative; padding-bottom:10px; }
.aside-card h3::after{ content:""; position:absolute; left:0; bottom:0; width:26px; height:3px; border-radius:3px; background:var(--c-green); }
.aside-card ul li{ margin-bottom:10px; }
.aside-card ul a{ font-size:14.5px; color:var(--c-body); }
.aside-card ul a:hover{ color:var(--c-green-deep); }
.aside-touch p{ font-size:14px; color:var(--c-mute); margin-bottom:16px; }
.aside-touch .btn-block{ margin-bottom:12px; }
.aside-tel{ display:block; text-align:center; color:var(--c-green-deep); font-size:18px; font-weight:800; letter-spacing:.04em; }
.aside-tel:hover{ color:var(--c-green-mid); }

/* ---------- 延伸阅读区 ---------- */
.related{ padding:10px 0 90px; }
.related-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:start; }
.related-card{
  display:block; background:#fff; border-radius:18px; overflow:hidden;
  box-shadow:var(--shadow-soft); transition:transform .35s ease, box-shadow .35s ease;
}
.related-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-float); }
.related-lg{ grid-row:span 2; }
.rc-photo{ display:block; overflow:hidden; }
.rc-photo img{ width:100%; height:176px; object-fit:cover; transition:transform .5s ease; }
.related-lg .rc-photo img{ height:340px; }
.related-card:hover .rc-photo img{ transform:scale(1.05); }
.rc-body{ display:block; padding:16px 18px 18px; }
.rc-body b{
  display:block; font-size:15px; color:var(--c-ink); line-height:1.55; margin-bottom:8px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.related-lg .rc-body b{ font-size:17px; -webkit-line-clamp:3; }
.rc-body time{ font-size:12.5px; color:var(--c-green-mid); }

/* ---------- 延伸服务 ---------- */
.show-service{ padding:0 0 90px; }
.ss-head{ max-width:760px; margin-bottom:30px; }
.ss-head h2{ margin-bottom:10px; }
.ss-head p:last-child{ color:var(--c-mute); margin:0; }
.ss-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:26px; }
.ss-card{
  display:flex; flex-direction:column; gap:8px;
  background:var(--c-cream); border:1px solid var(--c-line); border-radius:20px;
  padding:28px 26px 24px; transition:transform .3s ease, box-shadow .3s ease;
}
.ss-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-float); }
.ss-card b{ font-size:17px; color:var(--c-ink); }
.ss-card p{ font-size:14px; color:var(--c-body); margin:0; line-height:1.8; flex:1; }
.ss-card span{ font-size:13.5px; font-weight:600; color:var(--c-green-deep); }
.ss-note{ font-size:13px; color:var(--c-mute); text-align:center; max-width:880px; margin:0 auto; }
@media (max-width:900px){ .ss-cards{ grid-template-columns:1fr; } }

/* ---------- 响应式 ---------- */
@media (max-width:1080px){
  .article-layout{ grid-template-columns:1fr 280px; gap:28px; }
  .related-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:980px){
  .article-layout{ grid-template-columns:1fr; }
  .article-side{ position:static; }
  .article-card{ padding:30px 26px 40px; }
}
@media (max-width:760px){
  .related-grid{ grid-template-columns:1fr; }
  .related-lg{ grid-row:auto; }
  .related-lg .rc-photo img{ height:200px; }
}
