/* ============================================================
   hhlsq.com — show.css 资讯详情页专属样式
   布局指纹：文章主体 + 右栏 / 五列表错位网格（相关+最新宽格，周日月三列）
   ============================================================ */

/* ---------- 1. 文章主体 ---------- */
.show-main{ background:#fff; }
.show-layout{ display:grid; grid-template-columns:1.62fr 1fr; gap:34px; align-items:start; }

.show-article{ background:#fff; }
.show-head{ padding:22px 0 24px; border-bottom:1px solid var(--gray-200); margin-bottom:26px; }
.show-head__title{ font-size:clamp(24px,3vw,34px); line-height:1.35; margin-bottom:14px; }
.show-head__meta{ display:flex; align-items:center; gap:18px; font-size:13px; color:var(--gray-500); flex-wrap:wrap; }
.show-head__src{ color:var(--gray-400); }

.show-content{ font-size:15.5px; line-height:1.95; color:var(--gray-700); }
.show-content img{
  width:100%; height:auto; aspect-ratio:16/9; object-fit:cover;
  border-radius:var(--radius-lg); margin-bottom:22px; box-shadow:var(--shadow-sm);
}
.show-content h2{ font-size:21px; margin:26px 0 12px; }
.show-content h3{ font-size:18px; margin:22px 0 10px; }
.show-content p{ margin-bottom:16px; }
.show-content ul{ list-style:disc; padding-left:22px; margin-bottom:16px; }
.show-content li{ margin-bottom:6px; }

.show-foot{
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
  margin-top:34px; padding-top:24px; border-top:1px solid var(--gray-200);
}

/* ---------- 2. 侧栏 ---------- */
.show-sidebar{ display:flex; flex-direction:column; gap:20px; position:sticky; top:120px; }
.side-card{ background:var(--gray-100); border-radius:var(--radius-lg); padding:24px; }
.side-card--contact{ background:linear-gradient(150deg,var(--navy-800),var(--navy-700)); color:#fff; }
.side-card__title{ font-size:16.5px; margin-bottom:12px; display:flex; align-items:center; gap:8px; color:var(--navy-900); }
.side-card--contact .side-card__title{ color:#fff; }
.side-card--contact .side-card__title::before{ content:""; width:18px; height:2px; background:var(--gold); }
.side-card__text{ font-size:13.5px; color:rgba(232,238,245,.8); margin-bottom:16px; }
.side-card--contact .btn{ width:100%; }
.side-card__mini{ font-size:12px; color:rgba(232,238,245,.65); margin-top:10px; text-align:center; }
.side-links li{ border-bottom:1px dashed var(--gray-300); }
.side-links li:last-child{ border-bottom:none; }
.side-links a{ display:block; padding:9px 2px; font-size:14px; color:var(--gray-700); }
.side-links a:hover{ color:var(--navy-600); padding-left:8px; }
.side-links--dot a::before{ content:"·"; color:var(--gold); font-weight:700; margin-right:6px; }

/* ---------- 3. 更多资讯五列表 ---------- */
.more-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:start;
}
.more-panel{ background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); padding:22px; }
.more-panel:nth-child(1){ grid-row:span 1; }
.more-panel:nth-child(2){ grid-row:span 1; }
.more-panel:nth-child(n+3){ margin-top:6px; }
.more-panel__title{
  font-size:15.5px; margin-bottom:14px; padding-bottom:10px;
  border-bottom:2px solid var(--navy-700); position:relative; display:flex; align-items:center; gap:8px;
}
.more-panel__title::after{ content:""; position:absolute; left:0; bottom:-2px; width:44px; height:2px; background:var(--gold); }

.more-mini li a{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:9px 0; border-bottom:1px dashed var(--gray-200);
}
.more-mini li:last-child a{ border-bottom:none; }
.more-mini__title{
  font-size:13.5px; color:var(--gray-700); min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.more-mini a:hover .more-mini__title{ color:var(--navy-600); }
.more-mini__time{ font-size:12px; color:var(--gray-400); flex-shrink:0; }

.more-list{ display:flex; flex-direction:column; gap:12px; }
.more-item{
  display:grid; grid-template-columns:96px 1fr; gap:12px; align-items:center;
  padding:8px; border-radius:var(--radius-md); background:var(--gray-50);
  transition:all .3s ease;
}
.more-item:hover{ background:var(--gray-100); transform:translateY(-2px); }
.more-item__thumb{ display:block; aspect-ratio:16/10; border-radius:var(--radius-sm); overflow:hidden; }
.more-item__thumb img{ width:100%; height:100%; object-fit:cover; }
.more-item__body{ min-width:0; }
.more-item__title{
  display:block; font-size:13.5px; font-weight:600; color:var(--navy-900);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-bottom:4px;
}
.more-item__time{ font-size:12px; color:var(--gray-400); }

/* ---------- 4. 服务速览 ---------- */
.svc-strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.svc-chip{
  display:flex; align-items:center; gap:10px; background:var(--gray-100);
  border:1px solid var(--gray-200); border-radius:var(--radius-md); padding:16px 18px;
  font-size:14.5px; font-weight:600; color:var(--navy-900); transition:all .3s ease;
}
.svc-chip span{ color:var(--gold); font-size:12.5px; font-weight:700; }
.svc-chip:hover{ background:var(--navy-700); color:#fff; transform:translateY(-4px); box-shadow:var(--shadow-md); }
.svc-chip:hover span{ color:var(--gold-soft); }

/* ---------- 5. CTA ---------- */
.show-cta__inner{ text-align:center; }
.show-cta__inner h2{ color:#fff; font-size:clamp(22px,3vw,30px); margin-bottom:10px; }
.show-cta__inner p{ color:rgba(232,238,245,.78); font-size:15px; margin-bottom:26px; }
.show-cta__actions{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.show-cta__ghost{ border-color:rgba(255,255,255,.5); color:#fff; }
.show-cta__ghost:hover{ background:#fff; color:var(--navy-700); }

/* ---------- 响应式 ---------- */
@media (max-width: 992px){
  .show-layout{ grid-template-columns:1fr; }
  .show-sidebar{ position:static; }
  .more-grid{ grid-template-columns:1fr 1fr; }
  .svc-strip{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 640px){
  .more-grid{ grid-template-columns:1fr; }
  .svc-strip{ grid-template-columns:1fr 1fr; gap:12px; }
  .svc-chip{ padding:13px 14px; font-size:13.5px; }
  .show-foot .btn{ width:100%; }
}
