/* ==========================================================================
   vivid-bg.css v6 — 磨砂玻璃浅色背景系统（纯 CSS，无图片）
   --------------------------------------------------------------------------
   严格按用户确认的小样 preview-bg/a9-frosted-glass.html：
   - 基底：冷银蓝渐变 165deg(#cfd9e8 → #dde4ef → #c9d3e4)，明确不是纯白
     （基底写在 style.css 的 body 上；这里只做氛围层）
   - 氛围层 .vivid-orbs：顶部柔光 + 底部冷调，极淡，无气泡、无网格、无噪点
   - 各 section::before：极淡的冷白提亮，section 间无生硬切色
   - 禁止：气泡圆圈、云朵、纯白底、黑钻石一切深色残留

   挂载（layout.html）：
     <link rel="stylesheet" href="/assets/vivid-bg.css">
     <body> 下第一行：<div class="vivid-orbs" aria-hidden="true"><i></i><i></i><i></i></div>
     （<i> 保留占位但不渲染任何内容，保证 HTML 零改动）

   层级：.vivid-orbs fixed z-index:-1；各 section::before z-index:-1
   （section 自身 isolation:isolate 内）；内容永远在上。
   注意：radial-gradient 一律平滑过渡到 transparent 100%，
   中途 hard-stop 会在浅色底上渲染出可见圆弧（2026-10-07 实测教训）。
   动画只用 transform/opacity；prefers-reduced-motion 下全静止。
   ========================================================================== */

/* ---------- 全局固定氛围层：顶部柔光 + 底部冷调 ---------- */
.vivid-orbs{
  position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;
  background:
    radial-gradient(85% 46% at 50% 0%,rgba(255,255,255,.50),rgba(255,255,255,0) 100%),
    radial-gradient(70% 42% at 88% 100%,rgba(140,170,220,.22),rgba(140,170,220,0) 100%),
    radial-gradient(60% 38% at 8% 88%,rgba(160,190,235,.16),rgba(160,190,235,0) 100%);
}
/* 旧版 <i> 元素：不再渲染任何装饰，保证 HTML 零改动 */
.vivid-orbs i{display:none}
.vivid-orbs::before,.vivid-orbs::after{content:none}

/* ---------- 分区氛围：极淡的冷白提亮，每屏略有呼吸感 ---------- */
.hv-hero,.trust,section{
  position:relative;isolation:isolate;
}
.hv-hero::before,.trust::before,section::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
}

/* 1) Hero：顶部提亮，视线聚向玻璃大卡片 */
.hv-hero::before{
  background:linear-gradient(180deg,rgba(255,255,255,.35) 0%,rgba(255,255,255,0) 34%);
}
/* 2) 信任条：自身已是玻璃带，这里不再叠加 */
.trust::before{background:none}
/* 3)–8) 内容区：极淡的顶部提亮，保持阅读节奏 */
#flow::before,#services::before,#before-after::before,
#pilot::before,#pricing::before,#faq::before{
  background:linear-gradient(180deg,rgba(255,255,255,.22) 0%,rgba(255,255,255,0) 26%);
}
/* 9) Final CTA：底部柔和收束 */
.hv-final::before{
  background:linear-gradient(0deg,rgba(140,170,220,.20) 0%,rgba(140,170,220,0) 40%);
}

/* ---------- 内页兜底 ---------- */
section::before{
  background:linear-gradient(180deg,rgba(255,255,255,.20) 0%,rgba(255,255,255,0) 24%);
}

/* ---------- 减弱动态 ---------- */
@media (prefers-reduced-motion: reduce){
  .vivid-orbs,.hv-hero::before{animation:none}
}
