/* ============================================
   星河入梦工作室 — 动画关键帧（炫酷增强版）
   ============================================ */

/* —— 淡入上浮 —— */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* —— 淡入左移 —— */
@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translateX(-40px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* —— 淡入右移 —— */
@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translateX(40px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* —— 缩放淡入 —— */
@keyframes fadeInScale {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* —— 弹跳 —— */
@keyframes bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

/* —— 脉冲光晕 —— */
@keyframes pulse {
  0%, 100% { opacity: 0.5; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.05); }
}

/* —— 强脉冲（用于CTA环） —— */
@keyframes pulseRing {
  0% { transform: scale(1); opacity: 0.6; }
  100% { transform: scale(1.5); opacity: 0; }
}

/* —— 渐变位移 —— */
@keyframes gradientShift {
  0% { background-position: 0% center; }
  50% { background-position: 100% center; }
  100% { background-position: 0% center; }
}

/* —— 微光闪烁 —— */
@keyframes shimmer {
  0% { opacity: 0.3; }
  50% { opacity: 0.9; }
  100% { opacity: 0.3; }
}

/* —— 旋转 —— */
@keyframes rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* —— 光效扫描 —— */
@keyframes scan {
  0% { left: -100%; }
  100% { left: 200%; }
}

/* —— 浮动 —— */
@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-12px); }
}

/* —— 光晕呼吸 —— */
@keyframes glowBreath {
  0%, 100% {
    box-shadow: 0 0 20px rgba(201, 168, 76, 0.1),
                0 0 40px rgba(201, 168, 76, 0.05);
  }
  50% {
    box-shadow: 0 0 30px rgba(201, 168, 76, 0.25),
                0 0 60px rgba(201, 168, 76, 0.1),
                0 0 90px rgba(201, 168, 76, 0.05);
  }
}

/* —— 流星光尾 —— */
@keyframes shootingStar {
  0% {
    transform: translateX(0) translateY(0) rotate(-35deg);
    opacity: 1;
  }
  70% { opacity: 1; }
  100% {
    transform: translateX(-600px) translateY(400px) rotate(-35deg);
    opacity: 0;
  }
}

/* —— 边框流光 —— */
@keyframes borderGlow {
  0% { border-color: var(--color-accent); }
  50% { border-color: rgba(255, 255, 255, 0.3); }
  100% { border-color: var(--color-accent); }
}

/* ===== 滚动揭示类（增强版：增加模糊过渡） ===== */
.reveal {
  opacity: 0;
  transform: translateY(50px);
  filter: blur(8px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              filter 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.revealed {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}

.reveal-left {
  opacity: 0;
  transform: translateX(-60px);
  filter: blur(6px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              filter 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-left.revealed {
  opacity: 1;
  transform: translateX(0);
  filter: blur(0);
}

.reveal-right {
  opacity: 0;
  transform: translateX(60px);
  filter: blur(6px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              filter 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-right.revealed {
  opacity: 1;
  transform: translateX(0);
  filter: blur(0);
}

.reveal-scale {
  opacity: 0;
  transform: scale(0.85);
  filter: blur(10px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              filter 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-scale.revealed {
  opacity: 1;
  transform: scale(1);
  filter: blur(0);
}

/* —— 阶梯延迟（更多档位） —— */
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }
.reveal-delay-5 { transition-delay: 0.5s; }
.reveal-delay-6 { transition-delay: 0.6s; }

/* —— Hero 逐字动画（增强版：缩放+模糊 → 清晰） —— */
.hero-char {
  display: inline-block;
  opacity: 0;
  transform: translateY(40px) scale(0.8);
  filter: blur(10px);
  animation: heroCharReveal 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  will-change: transform, opacity, filter;
}

@keyframes heroCharReveal {
  0% {
    opacity: 0;
    transform: translateY(40px) scale(0.8);
    filter: blur(10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

/* —— 向下箭头动画 —— */
.scroll-indicator {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  animation: bounce 2s ease-in-out infinite;
  cursor: pointer;
  margin-top: var(--space-xl);
}

.scroll-indicator span {
  display: block;
  width: 1px;
  height: 24px;
  background: linear-gradient(to bottom, transparent, var(--color-accent), transparent);
  animation: shimmer 2s ease-in-out infinite;
}

.scroll-indicator .arrow-head {
  width: 8px;
  height: 8px;
  border-right: 1px solid var(--color-accent);
  border-bottom: 1px solid var(--color-accent);
  transform: rotate(45deg);
}

/* ===== CTA 光环脉动 ===== */
.cta-glow-ring {
  position: relative;
}

.cta-glow-ring::before,
.cta-glow-ring::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: var(--radius-full);
  pointer-events: none;
}

.cta-glow-ring::before {
  width: 120%;
  height: 140%;
  border: 1px solid var(--color-accent);
  opacity: 0.3;
  animation: pulseRing 2.5s ease-out infinite;
}

.cta-glow-ring::after {
  width: 110%;
  height: 120%;
  border: 1px solid var(--color-accent);
  opacity: 0.2;
  animation: pulseRing 2.5s ease-out 0.8s infinite;
}

/* ===== 卡片光效扫描（hover时） ===== */
.card-glass-scan {
  position: relative;
  overflow: hidden;
}

.card-glass-scan::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.03),
    transparent
  );
  transform: skewX(-15deg);
  transition: none;
  pointer-events: none;
}

.card-glass-scan:hover::after {
  animation: scan 1.2s ease-in-out;
}

/* ===== 浮动装饰元素 ===== */
.float-slow {
  animation: float 6s ease-in-out infinite;
}

.float-medium {
  animation: float 4s ease-in-out infinite;
}

/* ===== 边框流光卡 ===== */
.card-glow-border:hover {
  animation: borderGlow 2s ease-in-out infinite;
}

/* ===== Hero 标题区域光晕 ===== */
.hero-glow {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 600px;
  height: 300px;
  background: radial-gradient(
    ellipse at center,
    rgba(201, 168, 76, 0.08) 0%,
    rgba(201, 168, 76, 0.03) 40%,
    transparent 70%
  );
  pointer-events: none;
  animation: glowBreath 4s ease-in-out infinite;
  filter: blur(30px);
}
