/* ============================================================
   QAF – Animations
   ============================================================ */

/* ── Scroll Reveal ── */
.reveal{opacity:0;transform:translateY(30px);transition:opacity 0.7s var(--ease-out),transform 0.7s var(--ease-out)}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-left{opacity:0;transform:translateX(-40px);transition:opacity 0.7s var(--ease-out),transform 0.7s var(--ease-out)}
.reveal-left.visible{opacity:1;transform:translateX(0)}
.reveal-right{opacity:0;transform:translateX(40px);transition:opacity 0.7s var(--ease-out),transform 0.7s var(--ease-out)}
.reveal-right.visible{opacity:1;transform:translateX(0)}
.reveal-scale{opacity:0;transform:scale(0.9);transition:opacity 0.7s var(--ease-out),transform 0.7s var(--ease-out)}
.reveal-scale.visible{opacity:1;transform:scale(1)}

/* Stagger children */
.stagger-children .reveal:nth-child(1){transition-delay:0s}
.stagger-children .reveal:nth-child(2){transition-delay:0.1s}
.stagger-children .reveal:nth-child(3){transition-delay:0.2s}
.stagger-children .reveal:nth-child(4){transition-delay:0.3s}
.stagger-children .reveal:nth-child(5){transition-delay:0.4s}
.stagger-children .reveal:nth-child(6){transition-delay:0.5s}
.stagger-children .reveal:nth-child(7){transition-delay:0.6s}
.stagger-children .reveal:nth-child(8){transition-delay:0.7s}

/* ── Fade Animations ── */
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeInDown{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeInLeft{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}
@keyframes fadeInRight{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}

.anim-fade-in{animation:fadeIn 0.5s var(--ease-out) forwards}
.anim-fade-up{animation:fadeInUp 0.5s var(--ease-out) forwards}
.anim-fade-down{animation:fadeInDown 0.5s var(--ease-out) forwards}

/* ── Scale Animations ── */
@keyframes scaleIn{from{opacity:0;transform:scale(0.8)}to{opacity:1;transform:scale(1)}}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
@keyframes pulseGlow{0%,100%{box-shadow:0 0 0 0 rgba(201,168,76,0.3)}50%{box-shadow:0 0 20px 4px rgba(201,168,76,0.15)}}

.anim-scale-in{animation:scaleIn 0.4s var(--ease-spring) forwards}
.anim-pulse{animation:pulse 2s var(--ease-in-out) infinite}
.anim-glow{animation:pulseGlow 2s var(--ease-in-out) infinite}

/* ── Slide Animations ── */
@keyframes slideInRight{from{transform:translateX(100%)}to{transform:translateX(0)}}
@keyframes slideInLeft{from{transform:translateX(-100%)}to{transform:translateX(0)}}
@keyframes slideInUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes slideDown{from{max-height:0;opacity:0}to{max-height:500px;opacity:1}}

/* ── Counter Animation ── */
@keyframes countUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* ── Float Animation ── */
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.anim-float{animation:float 3s var(--ease-in-out) infinite}

/* ── Rotate ── */
@keyframes rotateIn{from{opacity:0;transform:rotate(-10deg) scale(0.9)}to{opacity:1;transform:rotate(0) scale(1)}}
@keyframes rotateSlow{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.anim-rotate-slow{animation:rotateSlow 20s linear infinite}

/* ── Shimmer Effect ── */
@keyframes shimmer{0%{background-position:-200% center}100%{background-position:200% center}}
.shimmer-gold{background:linear-gradient(90deg,var(--clr-gold-dark),var(--clr-gold-light),var(--clr-gold-dark));background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:shimmer 3s linear infinite}

/* ── Ticker Animation ── */
@keyframes ticker{0%{transform:translateX(100%)}100%{transform:translateX(-100%)}}
.anim-ticker{animation:ticker 20s linear infinite}

/* ── Typewriter ── */
@keyframes typewriter{from{width:0}to{width:100%}}
@keyframes blink{0%,100%{border-color:transparent}50%{border-color:var(--clr-gold)}}

/* ── Page Transition ── */
.page-enter{animation:fadeInUp 0.4s var(--ease-out) forwards}
.page-exit{animation:fadeIn 0.3s var(--ease-out) reverse forwards}

/* ── Reduced Motion ── */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}
  .reveal,.reveal-left,.reveal-right,.reveal-scale{opacity:1;transform:none}
}