/* ==========================================================================
   Museum Full —— 大屏动态增强（motion.css）
   原则：只用 transform / opacity（走 GPU 合成层），不触发重排重绘；
        不引入任何第三方库；内存增量约 0。
   ========================================================================== */

/* ---------- 顶部滚动进度：金色细线 ---------- */
.scroll-progress {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, rgba(217, 195, 150, .15), var(--gold-soft) 45%, var(--gold));
  transform: scaleX(0);
  transform-origin: 0 50%;
  will-change: transform;
  pointer-events: none;
  z-index: 9999;
}

/* ---------- 首屏暖光呼吸：只动 opacity，不用 filter blur ---------- */
.hero-veil::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at 50% 38%, rgba(255, 226, 178, .15), rgba(255, 226, 178, 0) 62%);
  opacity: .40;
  animation: veilBreath 11s ease-in-out infinite;
}
@keyframes veilBreath {
  0%, 100% { opacity: .30; }
  50%      { opacity: .70; }
}

/* ---------- 金色分隔线：自左抽出 ---------- */
.hero-line {
  transform: scaleX(0);
  transform-origin: 0 50%;
  animation: heroLineIn 1.35s cubic-bezier(.22, .61, .36, 1) .45s forwards;
}
@keyframes heroLineIn {
  to { transform: scaleX(1); }
}

/* ---------- 馆徽光晕呼吸 ---------- */
.hero-logo::before {
  animation: haloBreath 8s ease-in-out infinite;
}
@keyframes haloBreath {
  0%, 100% { opacity: .55; transform: scale(.95); }
  50%      { opacity: 1;   transform: scale(1.03); }
}

/* ---------- 首屏各层交给 JS 做视差，提前声明为合成层 ---------- */
.hero-veil { will-change: transform; }
.hero-content { will-change: translate; backface-visibility: hidden; }
.hero-logo { will-change: transform; }

/* ---------- 统计数字：等宽数字，跳动时不左右抖 ---------- */
.stat b { font-variant-numeric: tabular-nums; }

/* ---------- 卡片悬停：金色描边浮现（opacity 动画，不改尺寸） ---------- */
.section-dark .card-dark::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(217, 195, 150, .55);
  opacity: 0;
  transition: opacity .45s ease;
  pointer-events: none;
}
.section-dark .card-dark { position: relative; }
.section-dark .card-dark:hover::after { opacity: 1; }

/* ---------- 低配设备保险：粗指针（触屏）不保留常驻合成层 ---------- */
@media (hover: none) {
  .hero-content,
  .hero-veil,
  .hero-logo { will-change: auto; }
}

/* ---------- 无障碍：尊重「减少动态效果」 ---------- */
@media (prefers-reduced-motion: reduce) {
  .scroll-progress { display: none; }
  .hero-veil::after,
  .hero-line,
  .hero-logo::before { animation: none; opacity: .45; transform: none; }
  .hero,
  .hero-content,
  .hero-veil,
  .hero-logo {
    will-change: auto;
    transform: none !important;
    translate: none !important;
    opacity: 1 !important;
  }
}
