/* Rise Baking Lab - Modern Animations */

/* Keyframes */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@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 zoomIn {
  from { opacity: 0; transform: scale(0.8); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes rotateIn {
  from { opacity: 0; transform: rotate(-15deg) scale(0.8); }
  to { opacity: 1; transform: rotate(0deg) scale(1); }
}
@keyframes bounceIn {
  0% { opacity: 0; transform: scale(0.3); }
  50% { opacity: 1; transform: scale(1.05); }
  70% { transform: scale(0.9); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes slideInUp {
  from { opacity: 0; transform: translateY(60px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-60px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes slideInRight {
  from { opacity: 0; transform: translateX(60px); }
  to { opacity: 1; transform: translateX(0); }
}

/* Immediate Animations (for hero) */
.animate-fadeIn { animation: fadeIn 1.2s cubic-bezier(0.23,1,0.32,1) both; }
.animate-fadeInUp { animation: fadeInUp 1.2s cubic-bezier(0.23,1,0.32,1) both; }
.animate-fadeInLeft { animation: fadeInLeft 1.2s cubic-bezier(0.23,1,0.32,1) both; }
.animate-fadeInRight { animation: fadeInRight 1.2s cubic-bezier(0.23,1,0.32,1) both; }
.animate-zoomIn { animation: zoomIn 1.2s cubic-bezier(0.23,1,0.32,1) both; }
.animate-rotateIn { animation: rotateIn 1.2s cubic-bezier(0.23,1,0.32,1) both; }
.animate-bounceIn { animation: bounceIn 1.2s cubic-bezier(0.68,-0.55,0.265,1.55) both; }
.animate-slideInUp { animation: slideInUp 1.2s cubic-bezier(0.23,1,0.32,1) both; }
.animate-slideInLeft { animation: slideInLeft 1.2s cubic-bezier(0.23,1,0.32,1) both; }
.animate-slideInRight { animation: slideInRight 1.2s cubic-bezier(0.23,1,0.32,1) both; }

/* Scroll-triggered Animations */
.scroll-fade-in { opacity:0; transition: all 0.8s cubic-bezier(0.23,1,0.32,1); }
.scroll-fade-in.animate { opacity:1; }

.scroll-fade-in-up { opacity:0; transform: translateY(40px); transition: all 0.8s cubic-bezier(0.23,1,0.32,1); }
.scroll-fade-in-up.animate { opacity:1; transform: translateY(0); }

.scroll-fade-in-left { opacity:0; transform: translateX(-40px); transition: all 0.8s cubic-bezier(0.23,1,0.32,1); }
.scroll-fade-in-left.animate { opacity:1; transform: translateX(0); }

.scroll-fade-in-right { opacity:0; transform: translateX(40px); transition: all 0.8s cubic-bezier(0.23,1,0.32,1); }
.scroll-fade-in-right.animate { opacity:1; transform: translateX(0); }

.scroll-zoom-in { opacity:0; transform: scale(0.8); transition: all 0.8s cubic-bezier(0.23,1,0.32,1); }
.scroll-zoom-in.animate { opacity:1; transform: scale(1); }

.scroll-rotate-in { opacity:0; transform: rotate(-15deg) scale(0.8); transition: all 0.8s cubic-bezier(0.23,1,0.32,1); }
.scroll-rotate-in.animate { opacity:1; transform: rotate(0deg) scale(1); }

.scroll-bounce-in { opacity:0; transform: scale(0.3); transition: all 0.8s cubic-bezier(0.68,-0.55,0.265,1.55); }
.scroll-bounce-in.animate { opacity:1; transform: scale(1); }

.scroll-slide-in-up { opacity:0; transform: translateY(60px); transition: all 0.8s cubic-bezier(0.23,1,0.32,1); }
.scroll-slide-in-up.animate { opacity:1; transform: translateY(0); }

.scroll-slide-in-left { opacity:0; transform: translateX(-60px); transition: all 0.8s cubic-bezier(0.23,1,0.32,1); }
.scroll-slide-in-left.animate { opacity:1; transform: translateX(0); }

.scroll-slide-in-right { opacity:0; transform: translateX(60px); transition: all 0.8s cubic-bezier(0.23,1,0.32,1); }
.scroll-slide-in-right.animate { opacity:1; transform: translateX(0); }

/* Animation Delays */
.delay-10 { animation-delay: 0.1s; transition-delay: 0.1s; }
.delay-20 { animation-delay: 0.2s; transition-delay: 0.2s; }
.delay-30 { animation-delay: 0.3s; transition-delay: 0.3s; }
.delay-40 { animation-delay: 0.4s; transition-delay: 0.4s; }
.delay-50 { animation-delay: 0.5s; transition-delay: 0.5s; }
.delay-60 { animation-delay: 0.6s; transition-delay: 0.6s; }
.delay-70 { animation-delay: 0.7s; transition-delay: 0.7s; }
.delay-80 { animation-delay: 0.8s; transition-delay: 0.8s; }
.delay-90 { animation-delay: 0.9s; transition-delay: 0.9s; }
.delay-100 { animation-delay: 1s; transition-delay: 1s; }

/* Newsletter Animation Utilities */
.animate-scaleIn { animation: scaleIn 1.1s cubic-bezier(0.23, 1, 0.32, 1) both; }
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}
.btn-rounded-white {
  border-radius: 0.75rem;
  border-width: 2px;
  border-color: #fff;
}

/* People Gallery Animation Enhancements */
.people-gallery-item.scroll-zoom-in {
    opacity: 0;
    transform: scale(0.8) translateY(20px);
    transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

.people-gallery-item.scroll-zoom-in.animate {
    opacity: 1;
    transform: scale(1) translateY(0);
}

/* Responsive: disable animations for reduced motion */
@media (prefers-reduced-motion: reduce) {
  .animate-fadeIn, .animate-fadeInUp, .animate-fadeInLeft, .animate-fadeInRight, .animate-zoomIn, .animate-rotateIn, .animate-bounceIn, .animate-slideInUp, .animate-slideInLeft, .animate-slideInRight,
  .scroll-fade-in, .scroll-fade-in-up, .scroll-fade-in-left, .scroll-fade-in-right, .scroll-zoom-in, .scroll-rotate-in, .scroll-bounce-in, .scroll-slide-in-up, .scroll-slide-in-left, .scroll-slide-in-right,
  .people-gallery-item.scroll-zoom-in {
    animation: none !important;
    transition: none !important;
  }
} 