/* ============================================================
 * site-chrome.css —— 全站公共层
 * ------------------------------------------------------------
 * 放在每页自身 <style> 与页面级 CSS 之后加载，只做两件事：
 *   A. 全站通用修正（第三方客服浮标形态等）
 *   B. 把案例页的语言对齐到主站设计体系（黑 / 中性灰 / 品牌蓝）
 *      —— 主站 token：--black #0a0a0a、--gray-500 #737373、
 *         --gray-200 #e5e5e5、--blue #2563eb、卡片圆角 18px、
 *         标题 800 / letter-spacing -0.03em、主按钮蓝色渐变
 * 作用域全部收敛在 .page-cases 或第三方选择器上，不影响其它页面。
 * ============================================================ */

/* ============================================================
   A. 全站通用修正
   ============================================================ */

/* A1. Udesk 客服浮标
   现状：40×241 的竖长条，在窄屏与平板宽度下压住正文（首页会盖住
   AI 对话演示卡）。宽屏时它落在 1200px 内容区外的空白里，可以保留。
   处理：≤1200px 收成右下角圆形按钮，只留图标，文字隐藏。 */
@media (max-width: 1200px) {
  a.udesk-client-btn {
    width: 48px !important;
    height: 48px !important;
    border-radius: 50% !important;
    padding: 0 !important;
    margin: 0 16px 20px 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background-color: #2563eb !important;
    box-shadow: 0 10px 24px -8px rgba(13, 104, 189, 0.55);
  }

  /* 只保留第一个图标，隐藏竖排文字与分隔线 */
  a.udesk-client-btn > div > *:not(:first-child) {
    display: none !important;
  }

  a.udesk-client-btn > div > span:first-child {
    float: none !important;
    margin: 0 !important;
    width: 22px !important;
    height: 22px !important;
  }
}

/* A2. 移动端抽屉打开时，客服浮标让位（common.js 会给 body 加 .mm-open） */
body.mm-open a.udesk-client-btn {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.2s ease;
}

/* ============================================================
   B. 案例页：对齐主站设计语言
   ============================================================ */

/* B1. 页面底色：去掉 #f7f9fc 冷灰蓝 + 顶部径向蓝光 */
.page-cases { background: #ffffff; }

.page-cases .v-main {
  background: #ffffff;
  color: #0a0a0a;
  padding-top: 8.5rem;   /* 与 about 页首屏留白一致 */
}

/* B2. 页标题
   原：34px / 750 / 字距 +0.035em / 藏青，包在带渐变头的白卡里
   改：主站 section-header 规格 —— 居中、黑、800、字距 -0.03em，
       并去掉外层卡片外壳（主站没有"卡片装标题"这种结构） */
.page-cases .case-opening {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  overflow: visible;
}

.page-cases .case-panel-heading {
  margin: 0 0 2.75rem;
  padding: 0;
  border: 0;
  background: none;
  text-align: center;
}

.page-cases .v-main .case-panel-heading h1 {
  font-size: clamp(2.25rem, 4vw, 3rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.03em;
  color: #0a0a0a;
  margin: 0;
}

.page-cases .case-panel-sub {
  max-width: 640px;
  margin: 1rem auto 0;
  font-size: 1.05rem;
  line-height: 1.7;
  color: #737373;
}

/* B3. 卡片外壳：藏青描边 / 蓝调阴影 / 14px 圆角 → 中性灰描边 / 18px 圆角 */
.page-cases .v-case {
  border: 1px solid #e5e5e5;
  border-radius: 18px;
  box-shadow: none;
}

.page-cases .v-case:hover {
  border-color: #d4d4d4;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
}

/* B4. 案例文案：藏青色文字 → 主站的近黑 + 中性灰 */
.page-cases .v-case-copy h3,
.page-cases .v-case-copy .case-project { color: #0a0a0a; }

.page-cases .v-case-copy .case-client { color: #737373; }

.page-cases .v-case-copy .case-intro,
.page-cases .v-case-copy p { color: #737373; }

/* B5. 轮播控件：青蓝 → 品牌蓝 */
.page-cases .feature-controls button { color: #404040; }

.page-cases .feature-controls button:hover {
  background: #2563eb;
  color: #ffffff;
}

/* B6. "值得信赖" 舞台
   原：淡蓝径向底 + #23428f→#127fc5 自造蓝渐变 + 字距 +0.12em
   改：中性灰舞台 + 主站主蓝渐变 + 收拢字距 */
.page-cases .trust-scene {
  background: radial-gradient(ellipse at center, #ededed 0%, #f7f7f7 67%);
  border-radius: 18px;
}

.page-cases .trust-cta {
  background: linear-gradient(135deg, #2396ea 0%, #0d68bd 100%);
  border-radius: 18px;
  box-shadow: 0 24px 60px -28px rgba(13, 104, 189, 0.5);
}

.page-cases .trust-cta .trust-title {
  font-weight: 800;
  letter-spacing: -0.03em;
  padding-left: 0;
}

.page-cases .trust-cta .trust-invitation {
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.82);
}

.page-cases .trust-cta .btn {
  color: #0d68bd;
  font-weight: 600;
}

.page-cases .trust-cta .btn:hover { background: #f2f7ff; }

/* B7. 客户 logo 卡片：蓝调描边 → 中性灰 */
.page-cases .orbit-logo {
  border: 1px solid #e5e5e5;
  border-radius: 16px;
  box-shadow: 0 8px 20px -14px rgba(0, 0, 0, 0.2);
}

.page-cases .logo-wing h3 { color: #a3a3a3; }

@media (max-width: 800px) {
  .page-cases .v-main { padding-top: 6.5rem; }
  .page-cases .case-panel-heading { margin-bottom: 1.75rem; }
  .page-cases .case-panel-sub { font-size: 0.95rem; margin-top: 0.75rem; }
}

