/* ═══ 鲸帆智投 · Apple 毛玻璃 + 动态效果 ═══ */

/* ─── 浓烈背景网格 — 毛玻璃需要鲜艳背景才能透视 ─── */
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 70% 60% at 30% 20%,rgba(var(--color-hermes-rgb),.12),transparent 60%),
    radial-gradient(ellipse 50% 50% at 75% 65%,rgba(var(--color-hermes-rgb),.06),transparent 55%),
    radial-gradient(ellipse 40% 40% at 50% 50%,rgba(var(--color-hermes-rgb),.03),transparent 60%);
  animation:bg-mesh-shift 15s ease-in-out infinite alternate}
@keyframes bg-mesh-shift{0%{opacity:.85;transform:scale(1)}100%{opacity:1;transform:scale(1.06)}}

/* ─── 噪声纹理 ─── */
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.04;mix-blend-mode:overlay;
  background:url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.3'/%3E%3C/svg%3E")}

/* ─── Apple 毛玻璃 — 透亮感关键：saturate(200%) + 薄底色 ─── */
.scard,.fcard,.tcard,.ccard,.hstep,.hcard,.contact-block,.hm-drawer,.k-card,.q-item,.timeline-card{
  background:var(--glass-bg)!important;
  backdrop-filter:blur(28px) saturate(220%) brightness(1.08);
  -webkit-backdrop-filter:blur(28px) saturate(220%) brightness(1.08);
  border:1px solid var(--glass-border)!important;
  box-shadow:var(--glass-inset),0 8px 32px rgba(0,0,0,.12)}
.hd{
  background:var(--glass-bg);
  backdrop-filter:blur(28px) saturate(220%);
  -webkit-backdrop-filter:blur(28px) saturate(220%);
  border-bottom:1px solid var(--color-border-subtle)!important}

/* ─── 卡片悬停 — 边框发光 + 更透亮 ─── */
.scard:hover,.fcard:hover,.ccard:hover,.hstep:hover,.hcard:hover,.k-card:hover{
  transform:translateY(-6px);
  border-color:rgba(var(--accent-rgb,var(--color-hermes-rgb)),.25)!important;
  box-shadow:var(--glass-inset),0 24px 60px rgba(var(--accent-rgb,var(--color-hermes-rgb)),.1)!important;
  backdrop-filter:blur(28px) saturate(240%) brightness(1.12)}
.tcard:hover{border-color:rgba(var(--accent-rgb,var(--color-hermes-rgb)),.25)!important;transform:translateX(4px)}

/* ─── 卡片顶部渐变条 ─── */
.scard::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;border-radius:3px 3px 0 0;
  background:linear-gradient(90deg,var(--accent,var(--color-hermes)),var(--accent-light,var(--color-hermes-light)),var(--accent,var(--color-hermes)));
  opacity:.6;transition:opacity .3s}
.scard:hover::before{opacity:1}

/* ─── Hero Orb 浮动 ─── */
.hero .orb{position:absolute;border-radius:50%;filter:blur(120px);pointer-events:none;animation:float-orb 12s ease-in-out infinite}
@keyframes float-orb{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(50px,-40px) scale(1.15)}50%{transform:translate(-30px,40px) scale(.9)}75%{transform:translate(-40px,-30px) scale(1.08)}}

/* ─── 渐变文字 ─── */
@keyframes text-shift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

/* ─── 脉冲徽章 ─── */
@keyframes live-pulse{0%,100%{box-shadow:0 0 0 0 rgba(var(--color-success-rgb),0)}50%{box-shadow:0 0 28px 6px rgba(var(--color-success-rgb),.2)}}
@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(2.2)}}

/* ─── 滚入动画 ─── */
.go{opacity:0;transform:translateY(40px);transition:opacity .8s var(--ease-out-expo),transform .8s var(--ease-out-expo)}
.go.in{opacity:1;transform:translateY(0)}
.del1{transition-delay:.1s}.del2{transition-delay:.2s}.del3{transition-delay:.3s}.del4{transition-delay:.4s}
.st>*{opacity:0;transform:translateY(30px);transition:opacity .6s var(--ease-out-expo),transform .6s var(--ease-out-expo)}
.st.in>*:nth-child(1){transition-delay:0ms}.st.in>*:nth-child(2){transition-delay:.12s}
.st.in>*:nth-child(3){transition-delay:.24s}.st.in>*:nth-child(4){transition-delay:.36s}
.st.in>*:nth-child(5){transition-delay:.48s}.st.in>*:nth-child(6){transition-delay:.6s}
.st.in>*{opacity:1;transform:translateY(0)}

/* ─── 3D tilt ─── */
.tilt{transform-style:preserve-3d;perspective:1200px;transition:transform .5s var(--ease-out-expo)}
.tilt:hover{transition:transform .1s ease-out}

/* ─── 涟漪按钮 ─── */
.ripple-btn{position:relative;overflow:hidden}
.ripple-btn .rip{position:absolute;border-radius:50%;transform:scale(0);animation:ripple .7s ease-out forwards;pointer-events:none;
  background:rgba(255,255,255,.2)}
@keyframes ripple{to{transform:scale(4);opacity:0}}

/* ─── 数字计数弹跳 ─── */
@keyframes bounce-in{0%{transform:scale(.3);opacity:0}50%{transform:scale(1.1)}70%{transform:scale(.95)}100%{transform:scale(1);opacity:1}}

/* ─── 进度条 + 光晕 ─── */
.scroll-bar{position:fixed;top:0;left:0;height:2px;z-index:9999;transition:width .1s linear;
  background:var(--color-hermes)}
.mouse-glow{position:fixed;width:400px;height:400px;border-radius:50%;pointer-events:none;z-index:0;opacity:0;transition:opacity .4s;
  background:radial-gradient(circle,rgba(var(--color-hermes-rgb),.05) 0%,rgba(var(--color-cronus-rgb),.03) 40%,transparent 70%)}

/* ─── 标题发光 ─── */
.hero h1 .hl{text-shadow:0 0 80px rgba(var(--accent-rgb,var(--color-hermes-rgb)),.2),0 0 160px rgba(var(--accent-rgb,var(--color-hermes-rgb)),.08)}

/* ─── 盈亏数字发光 ─── */
.tpnl.up{color:var(--color-success);filter:drop-shadow(0 0 10px rgba(var(--color-success-rgb),.4))}
.tpnl.down{color:var(--color-error);filter:drop-shadow(0 0 8px rgba(239,68,68,.35))}

/* ─── Overflow 修复 ─── */
.scard,.fcard,.tcard,.k-card{overflow:hidden}
.hero h1 .hl{color:transparent}

/* ─── 白天模式玻璃增强 ─── */
[data-theme="light"] .scard,[data-theme="light"] .fcard,[data-theme="light"] .tcard,[data-theme="light"] .ccard,
[data-theme="light"] .hstep,[data-theme="light"] .hcard,[data-theme="light"] .contact-block,[data-theme="light"] .k-card{
  background:rgba(255,255,255,.65)!important}
