/* ============================================================
   见山实景 · 全站公共补丁 (fix.css)
   由运维护理加入，站点所有页面 </head> 前统一引用。
   回滚方式：删除页面中的 <link rel="stylesheet" href="/css/fix.css"> 一行即可。
   ------------------------------------------------------------
   2026-10-19  FIX-1  桌面端不再渲染移动端底部咨询条
      原因：.mobile-cta 的全部样式原本只写在 @media(max-width:768px) 内，
            桌面端没有兜底规则，导致它按浏览器默认样式显示成一行无格式链接。
   ============================================================ */

/* ---- FIX-1：桌面端隐藏移动端底部咨询条（不影响 768px 以下） ---- */
.mobile-cta { display: none; }
@media (max-width: 768px) {
  .mobile-cta { display: flex; }
}

/* ---- FIX-2：宽屏下分区标题与 1400 内容网格对齐（2026-10-19） ----
   临界点 1668px：可用宽度 = 视口 × 0.84，超过 1400 后
   .cap-grid / .cases-grid / .news-grid 开始居中收缩，
   而 .section-head 仍贴着 8vw 内边距，于是标题与卡片错开（1920 实测差 106px）。
   只作用于 section 的直接子级，about/contact 两栏内部的标题不受影响。 ---- */
@media (min-width: 1668px) {
  .section > .section-head {
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* ---- FIX-3：给列表页补 H1 后还原标题样式（2026-10-19） ----
   cases.html / news.html 原来的标题是 <h2>，样式写在各自内联 <style> 的
   .list-head h2 规则里。提升为 h1 后该规则失配，这里补一条等价的 h1 规则，
   保证字号/字重/字距与改之前完全一致（about.html 的标题带 .section-title 类，无需处理）。 ---- */
.list-head h1 {
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  font-weight: 300;
  letter-spacing: .05em;
  margin: 0;
}

/* ---- FIX-5：侧边「咨询服务」改描边风 + 深色面板（2026-10-19） ----
   原来是金色渐变实心条 + 纯白面板，与整站「暗金 + 宋体 + 低饱和」的体系冲突，
   视觉重量也偏重。这里只换样式不动结构：
   按钮 -> 半透明深底 + 金色描边，悬停时才填成实心金；
   面板 -> 深色卡面，二维码加白底像一张小卡片，电话改成金色。
   同时按钮已由 <div> 换成 <button>（见 fix.js 的 aria 同步）。 ---- */
.sidebar-btn {
  background: rgba(10, 10, 12, .92);
  border: 1px solid rgba(201, 169, 110, .45);
  border-right: none;
  border-radius: 4px 0 0 4px;
  color: var(--gold);
  font-family: inherit;
  box-shadow: -3px 0 18px rgba(0, 0, 0, .45);
  backdrop-filter: blur(10px);
  transition: background .4s ease, color .4s ease, border-color .4s ease;
}
.sidebar-btn:hover,
.sidebar-btn:focus-visible {
  background: var(--gold);
  border-color: var(--gold);
  color: #0b0b0e;
  outline: none;
}
.sidebar-btn:focus-visible { outline: 2px solid var(--gold-2); outline-offset: 2px; }

.sidebar-panel {
  background: #121216;
  border: 1px solid var(--line-2);
  border-right: none;
  border-radius: 6px 0 0 6px;
  box-shadow: -8px 0 30px rgba(0, 0, 0, .5);
}
.sidebar-qr { background: #fff; padding: 4px; border-radius: 4px; }
.sidebar-qr-text { color: var(--text-3); font-size: .72rem; }
.sidebar-divider { background: rgba(201, 169, 110, .18); }
.sidebar-phone-label { color: var(--text-3); font-size: .72rem; letter-spacing: .12em; }
.sidebar-phone-num { color: var(--gold); }
.sidebar-phone-num a { color: inherit; }

/* FIX-5 补充：面板收起时描边设为透明，避免在按钮左侧留下一根 1px 细线 */
.sidebar-panel { border-color: transparent; transition: width .4s var(--ease), border-color .4s ease; }
.sidebar.open .sidebar-panel { border-color: var(--line-2); }

/* ---- FIX-5 第二轮修正（2026-10-19） ----
   1) 收起时面板宽度虽为 0，但 1px 边框盒仍渲染出 1×242px 的深色竖线，
      改为收起时背景/阴影一并透明，展开后再淡入；
   2) 展开宽度 150px 会把 150px 宽的内容裁掉 1px，放宽到 152px。 ---- */
.sidebar-panel {
  background: transparent;
  box-shadow: none;
  transition: width .4s var(--ease), border-color .4s ease, background-color .4s ease;
}
.sidebar.open .sidebar-panel {
  background: #121216;
  box-shadow: -8px 0 30px rgba(0, 0, 0, .5);
  width: 152px;
}

/* ---- FIX-5 第三轮：右侧做出弧度（2026-10-19） ----
   原来整个组件贴着视口右缘，左侧圆角右侧是直角，看着像“半张卡”。
   现在整体离右边 10px 浮起来，面板与按钮各自全圆角，中间留 6px 缝，
   收起时是一枚圆角小标签，展开时是「卡片 + 把手」的组合。 ---- */
.sidebar { right: 10px; gap: 6px; }
.sidebar-panel { border-radius: 10px; border-right: 1px solid transparent; }
.sidebar-btn   { border-radius: 10px; border-right: 1px solid rgba(201, 169, 110, .45); }
.sidebar.open .sidebar-panel { border-right-color: var(--line-2); }

/* ---- FIX-5 第四轮（2026-10-19）：按用户要求恢复贴边 ----
   整体紧贴视口右缘（right:0），右角为直角，仅左侧做弧度；
   面板与按钮之间不留缝，展开时像从右边缘抽出来的一张卡。 ---- */
.sidebar { right: 0; gap: 0; }
.sidebar-panel { border-radius: 12px 0 0 12px; border-right: none; }
.sidebar-btn   { border-radius: 12px 0 0 12px; border-right: none; }
.sidebar.open .sidebar-panel { border-right: none; }