/* 趣龙岗 — 活力特效 */

/* ============ 基础 keyframes ============ */
@keyframes qlg-bob {
  0%, 100% { transform: translateY(0) rotate(var(--r, 0deg)); }
  50%      { transform: translateY(calc(-6 * var(--u))) rotate(var(--r, 0deg)); }
}
@keyframes qlg-bob-rev {
  0%, 100% { transform: translateY(0) rotate(var(--r, 0deg)); }
  50%      { transform: translateY(calc(6 * var(--u))) rotate(var(--r, 0deg)); }
}
@keyframes qlg-wiggle {
  0%, 100% { transform: rotate(var(--r, 0deg)); }
  25%      { transform: rotate(calc(var(--r, 0deg) + 4deg)); }
  75%      { transform: rotate(calc(var(--r, 0deg) - 4deg)); }
}
@keyframes qlg-pop {
  0%   { transform: scale(0.6); opacity:0; }
  60%  { transform: scale(1.1); }
  100% { transform: scale(1); opacity:1; }
}
@keyframes qlg-spin-slow {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes qlg-shine-pulse {
  0%, 100% { box-shadow: var(--sh-base), 0 0 0 0 rgba(253,235,0,0.5); }
  50%      { box-shadow: var(--sh-base), 0 0 0 calc(14 * var(--u)) rgba(253,235,0,0); }
}
@keyframes qlg-cta-pulse-v1 {
  0%, 100% { box-shadow: calc(4 * var(--u)) calc(5 * var(--u)) 0 #000, 0 0 0 0 rgba(45,42,74,0.4); transform: translateY(0); }
  50%      { box-shadow: calc(4 * var(--u)) calc(5 * var(--u)) 0 #000, 0 0 0 calc(12 * var(--u)) rgba(45,42,74,0); transform: translateY(calc(-1 * var(--u))); }
}
@keyframes qlg-cta-pulse-v2 {
  0%, 100% { transform: translateY(0) scale(1); box-shadow: 0 calc(-2 * var(--u)) 0 rgba(255,255,255,.7) inset, 0 calc(4 * var(--u)) 0 #C29A00, 0 calc(12 * var(--u)) calc(22 * var(--u)) calc(-4 * var(--u)) rgba(194,154,0,.5); }
  50%      { transform: translateY(calc(-2 * var(--u))) scale(1.02); box-shadow: 0 calc(-2 * var(--u)) 0 rgba(255,255,255,.7) inset, 0 calc(6 * var(--u)) 0 #C29A00, 0 calc(18 * var(--u)) calc(28 * var(--u)) calc(-4 * var(--u)) rgba(194,154,0,.65); }
}
@keyframes qlg-drift {
  0%, 100% { transform: translate(0,0) rotate(var(--r,0deg)); }
  33%      { transform: translate(calc(8 * var(--u)),calc(-6 * var(--u))) rotate(calc(var(--r,0deg) + 6deg)); }
  66%      { transform: translate(calc(-6 * var(--u)),calc(4 * var(--u))) rotate(calc(var(--r,0deg) - 4deg)); }
}
@keyframes qlg-stamp-in {
  0%   { transform: scale(2) rotate(-12deg); opacity:0; filter:blur(calc(4 * var(--u))); }
  60%  { transform: scale(0.9) rotate(2deg); opacity:1; filter:blur(0); }
  100% { transform: scale(1) rotate(0deg); }
}
@keyframes qlg-shake {
  0%, 100% { transform: translateX(0); }
  25%      { transform: translateX(calc(-1.5 * var(--u))); }
  75%      { transform: translateX(calc(1.5 * var(--u))); }
}
@keyframes qlg-march {
  to { stroke-dashoffset: -24; }
}
@keyframes qlg-rainbow-edge {
  0%   { box-shadow: 0 0 0 calc(2 * var(--u)) #FF6B6B, 0 0 0 calc(4 * var(--u)) #FDEB00; }
  25%  { box-shadow: 0 0 0 calc(2 * var(--u)) #6BCB77, 0 0 0 calc(4 * var(--u)) #FF6B6B; }
  50%  { box-shadow: 0 0 0 calc(2 * var(--u)) #4D96FF, 0 0 0 calc(4 * var(--u)) #6BCB77; }
  75%  { box-shadow: 0 0 0 calc(2 * var(--u)) #B388FF, 0 0 0 calc(4 * var(--u)) #4D96FF; }
  100% { box-shadow: 0 0 0 calc(2 * var(--u)) #FF6B6B, 0 0 0 calc(4 * var(--u)) #FDEB00; }
}
@keyframes qlg-sparkle {
  0%, 100% { transform: scale(0) rotate(0deg); opacity: 0; }
  50%      { transform: scale(1) rotate(180deg); opacity: 1; }
}
@keyframes qlg-conf-fall {
  0%   { transform: translateY(calc(-20 * var(--u))) rotate(0deg); opacity: 0; }
  10%  { opacity: 1; }
  90%  { opacity: 1; }
  100% { transform: translateY(calc(80 * var(--u))) rotate(540deg); opacity: 0; }
}
@keyframes qlg-bg-pan {
  0%   { background-position: 0% 0%; }
  100% { background-position: 100% 0%; }
}

/* ============ 应用到元素 ============ */

/* 吉祥物在 hero 中漂浮 */
.qlg-bob   { animation: qlg-bob 3.2s ease-in-out infinite; }
.qlg-bob-2 { animation: qlg-bob 4.1s ease-in-out infinite; }
.qlg-bob-rev { animation: qlg-bob-rev 3.6s ease-in-out infinite; }

/* 装饰漂移 */
.qlg-drift   { animation: qlg-drift 6s ease-in-out infinite; }
.qlg-drift-2 { animation: qlg-drift 7.5s ease-in-out infinite reverse; }

/* 慢转 */
.qlg-spin    { animation: qlg-spin-slow 12s linear infinite; transform-origin: center; }

/* CTA 按钮脉动 */
.qlg-cta-v1 { animation: qlg-cta-pulse-v1 2.4s ease-in-out infinite; }
.qlg-cta-v2 { animation: qlg-cta-pulse-v2 2.6s ease-in-out infinite; }

/* 进入弹出 */
.qlg-pop   { animation: qlg-pop .5s cubic-bezier(.34,1.56,.64,1) both; }

/* 印章盖章 */
.qlg-stamp { animation: qlg-stamp-in .6s cubic-bezier(.34,1.56,.64,1) both; }

/* 摇晃 */
.qlg-wiggle { animation: qlg-wiggle 2s ease-in-out infinite; }

/* 主图自带 hover 缩放 */
.qlg-hover-pop { transition: transform .25s cubic-bezier(.34,1.56,.64,1); cursor:pointer; }
.qlg-hover-pop:active { transform: scale(0.96); }
.qlg-hover-pop:hover  { transform: scale(1.04); }

/* 蓝衫 dashed 时间线动画 */
.qlg-march path,
.qlg-march line {
  stroke-dasharray: 6 6;
  animation: qlg-march 1.2s linear infinite;
}

/* Sparkle dots (装饰小星) */
.qlg-sparkle-dot {
  position: absolute;
  width: calc(14 * var(--u)); height: calc(14 * var(--u));
  pointer-events: none;
}
.qlg-sparkle-dot::before {
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(currentColor,currentColor) center / calc(2 * var(--u)) 100% no-repeat,
    linear-gradient(currentColor,currentColor) center / 100% calc(2 * var(--u)) no-repeat;
  animation: qlg-sparkle 2.4s ease-in-out infinite;
}

/* Confetti container */
.qlg-confetti {
  position: absolute;
  pointer-events: none;
  inset: 0;
  overflow: hidden;
}
.qlg-confetti i {
  position: absolute;
  width: calc(8 * var(--u)); height: calc(12 * var(--u));
  border-radius: calc(2 * var(--u));
  top: calc(-10 * var(--u));
  animation: qlg-conf-fall 3.5s linear infinite;
}

/* Hover effects on chips/buttons */
.v1-chip, .v2-chip {
  transition: transform .15s cubic-bezier(.34,1.56,.64,1);
  cursor: pointer;
}
.v1-chip:hover, .v2-chip:hover { transform: translateY(calc(-2 * var(--u))) rotate(-1deg); }
.v1-chip:active, .v2-chip:active { transform: scale(0.95); }
.v1-chip.active, .v2-chip.active {
  animation: qlg-wiggle 3s ease-in-out infinite;
}

/* Cards subtle lift on hover */
.v2-card { transition: transform .2s ease, box-shadow .2s ease; }
.v2-card.qlg-lift:hover { transform: translateY(calc(-3 * var(--u))); }

.v1-card { transition: transform .2s ease; }
.v1-card.qlg-lift:hover { transform: translate(calc(-2 * var(--u)),calc(-2 * var(--u))) rotate(-1deg); }

/* Action buttons squish on click */
.act-btn { transition: transform .12s cubic-bezier(.34,1.56,.64,1); }
.act-btn:active { transform: scale(0.92); }

/* Tab bar active bounce - subtle */
.tab-item.active > div:first-child {
  animation: qlg-bob 2.2s ease-in-out infinite;
}

/* Big stamp char on detail hero */
.qlg-bigchar {
  animation: qlg-stamp-in 0.8s cubic-bezier(.34,1.56,.64,1) both,
             qlg-bob 5s ease-in-out 0.8s infinite;
}

/* Marquee for English subtitle */
.qlg-marquee {
  display: inline-block;
  white-space: nowrap;
  animation: qlg-shake 8s ease-in-out infinite;
}

/* Hero bg subtle motion */
.qlg-bg-pan {
  background-size: 200% 100%;
  animation: qlg-bg-pan 12s linear infinite;
}
