/* Animations utility file for INHOUSE website */

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInLeft {
  from { opacity: 0; transform: translateX(-28px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes fadeInRight {
  from { opacity: 0; transform: translateX(28px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes slideDown {
  from { opacity: 0; transform: translateY(-28px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes pulse {
  0%, 100% { transform: scale(1); }
  50%       { transform: scale(1.03); }
}

@keyframes borderDraw {
  from { transform: scaleY(0); opacity: 0; transform-origin: top; }
  to   { transform: scaleY(1); opacity: 1; transform-origin: top; }
}

@keyframes shimmer {
  0%, 100% { background-position: 0% 50%; }
  50%       { background-position: 100% 50%; }
}

.fade-in-up { animation: fadeInUp 0.85s ease-out both; }
.fade-in-left { animation: fadeInLeft 0.85s ease-out both; }
.fade-in-right { animation: fadeInRight 0.85s ease-out both; }
.fade-in { animation: fadeIn 0.75s ease-out both; }
.slide-down { animation: slideDown 0.85s ease-out both; }
.pulse { animation: pulse 2.5s ease-in-out infinite; }
.border-draw { animation: borderDraw 0.8s ease-out both; }
.shimmer-glow { animation: shimmer 6s ease-in-out infinite; background-size: 200% 200%; }

.animate-smooth {
  transition: opacity .6s ease, transform .6s ease;
}

.scroll-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .7s ease-out, transform .7s ease-out;
}

.scroll-reveal.visible {
  opacity: 1;
  transform: translateY(0);
}