/* Hero shape entrance — mirrors framer-motion ElegantShape */
@keyframes heroShapeEnter {
  from {
    opacity: 0;
    transform: translateY(-150px) rotate(calc(var(--shape-rotate, 0deg) - 15deg));
  }
  to {
    opacity: 1;
    transform: translateY(0) rotate(var(--shape-rotate, 0deg));
  }
}

@keyframes heroShapeFloat {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(15px);
  }
}

@keyframes heroContentEnter {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.hero-shape-enter {
  animation: heroShapeEnter 2.4s cubic-bezier(0.23, 0.86, 0.39, 0.96) var(--shape-delay, 0s) both;
}

.hero-shape-enter .hero-shape-float {
  animation: heroShapeFloat 12s ease-in-out infinite;
}

.hero-content-enter {
  animation: heroContentEnter 1s ease-out var(--content-delay, 0s) both;
}

/* Nav menu entrance */
@keyframes navMenuEnter {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.nav-menu-enter {
  animation: navMenuEnter 0.5s ease-out both;
}

#glow-menu:hover .nav-menu-glow {
  opacity: 1;
  transition: opacity 0.5s;
}

.nav-menu-glow {
  opacity: 0;
}

.nav-menu-active-bg.is-active {
  opacity: 1 !important;
  transform: scale(1) !important;
}

/* Footer scroll-in */
.footer-animate {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.footer-animate.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.footer-animate-delay-1.is-visible { transition-delay: 0.1s; }
.footer-animate-delay-2.is-visible { transition-delay: 0.2s; }
.footer-animate-delay-3.is-visible { transition-delay: 0.3s; }

.footer-animate-x {
  opacity: 0;
  transform: translateX(-20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.footer-animate-x-reverse {
  opacity: 0;
  transform: translateX(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.footer-animate-x.is-visible,
.footer-animate-x-reverse.is-visible {
  opacity: 1;
  transform: translateX(0);
}

/* Cookie consent spring-like entrance */
@keyframes cookieConsentEnter {
  from {
    opacity: 0;
    transform: translateY(100px) scale(0.9);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.cookie-consent-panel.is-visible {
  animation: cookieConsentEnter 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

/* Privacy modal */
@keyframes privacyModalBackdrop {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes privacyModalPanel {
  from {
    opacity: 0;
    transform: scale(0.95) translateY(20px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

#privacy-modal:not(.hidden) #privacy-modal-backdrop {
  animation: privacyModalBackdrop 0.2s ease both;
}

#privacy-modal:not(.hidden) #privacy-modal-panel {
  animation: privacyModalPanel 0.25s ease both;
}

/* Blog page — fadeInUp (arbitrary Tailwind classes are not in app.css build) */
@keyframes blogFadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.blog-fade-in-up {
  opacity: 0;
  animation: blogFadeInUp 0.6s ease-out forwards;
}

.blog-fade-in-up-delay-2 {
  animation-delay: 0.2s;
}
