/* =========================================================
   ANIMATIONS
   ========================================================= */

@media (prefers-reduced-motion: no-preference){
  .reveal{ opacity:0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
  .reveal.in-view{ opacity:1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce){
  .ball{ animation:none !important; opacity:1 !important; transform:none !important; }
}

/* Fade in */
@keyframes fadeIn{ from{opacity:0;} to{opacity:1;} }
.fade-in{ animation: fadeIn .5s ease both; }

/* Slide up */
@keyframes slideUp{ from{opacity:0; transform:translateY(30px);} to{opacity:1; transform:translateY(0);} }
.slide-up{ animation: slideUp .5s ease both; }

/* Zoom */
@keyframes zoomIn{ from{opacity:0; transform:scale(.9);} to{opacity:1; transform:scale(1);} }
.zoom-in{ animation: zoomIn .4s ease both; }

/* Floating icons */
@keyframes floaty{ 0%,100%{ transform: translateY(0);} 50%{ transform: translateY(-10px);} }
.hero-glow{ animation: floaty 8s ease-in-out infinite; }
.glow-b{ animation-duration: 10s; }

/* Hover glow / card lift handled via .mini-card, .archive-card transitions in style.css */

/* Button ripple */
.btn{ position:relative; overflow:hidden; }
.btn::after{
  content:""; position:absolute; inset:0; border-radius:inherit;
  background: radial-gradient(circle, rgba(255,255,255,0.5) 0%, transparent 60%);
  opacity:0; transform: scale(0);
  transition: opacity .5s, transform .5s;
}
.btn:active::after{ opacity:1; transform:scale(2); transition:0s; }

/* Gradient animation for hero background */
@keyframes gradientShift{ 0%{ filter:hue-rotate(0deg);} 100%{ filter:hue-rotate(15deg);} }

/* Shimmer / loading skeleton (available for future async content) */
.skeleton{
  background: linear-gradient(90deg, #E9EBF3 25%, #F5F6FB 37%, #E9EBF3 63%);
  background-size: 400% 100%;
  animation: shimmer 1.4s ease infinite;
  border-radius: var(--radius-sm);
}
@keyframes shimmer{ 0%{ background-position:100% 0;} 100%{ background-position:0 0;} }

/* Counter pulse when finishing */
.counter-num.done, .stat-num.done{ animation: pulseOnce .4s ease; }
@keyframes pulseOnce{ 0%{ transform:scale(1);} 50%{ transform:scale(1.08);} 100%{ transform:scale(1);} }

/* Smooth accordion handled via max-height transition in style.css */

/* Nav mobile menu slide */
@media (max-width: 960px){
  .main-nav{
    position:fixed; inset: var(--header-h) 0 0 0; background:#fff;
    transform: translateX(100%); transition: transform .3s ease;
    padding: 24px; overflow-y:auto;
  }
  .main-nav.open{ transform: translateX(0); }
  .main-nav ul{ flex-direction:column; gap:4px; }
  .nav-link{ display:block; padding:14px 16px; }
}