/* ==========================================================================
   HOCHWALD — Animations
   ========================================================================== */

@keyframes shimmer {
  to {
    transform: translateX(100%);
  }
}

@keyframes fade-up {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes hero-float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}

@keyframes tag-wobble {
  0%,
  100% {
    transform: rotate(-17deg);
  }
  50% {
    transform: rotate(-14deg);
  }
}

@keyframes pop-in {
  0% {
    opacity: 0;
    transform: scale(0.6) rotate(-9deg);
  }
  70% {
    opacity: 1;
    transform: scale(1.06) rotate(-9deg);
  }
  100% {
    transform: scale(1) rotate(-9deg);
  }
}

@keyframes heart-beat {
  0%,
  100% {
    transform: scale(1);
  }
  35% {
    transform: scale(1.28);
  }
  60% {
    transform: scale(0.92);
  }
}

/* Reveal on scroll (toggled by app.js IntersectionObserver) */
.reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity var(--duration-slow) var(--ease-out), transform var(--duration-slow) var(--ease-out);
  transition-delay: var(--reveal-delay, 0ms);
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

.home-hero__content > * {
  animation: fade-up 700ms var(--ease-out) both;
}

.home-hero__content > :nth-child(2) {
  animation-delay: 80ms;
}

.home-hero__content > :nth-child(3) {
  animation-delay: 160ms;
}

.home-hero__content > :nth-child(4) {
  animation-delay: 240ms;
}

.home-hero__content > :nth-child(5) {
  animation-delay: 320ms;
}

.home-hero__media {
  animation: fade-in 900ms ease both;
}

.home-hero__image {
  animation: hero-float 7s ease-in-out 1s infinite;
}

.home-hero__brush-tag {
  animation: tag-wobble 5s ease-in-out 1.2s infinite;
}

.page-title,
.offers-hero,
.contact-hero__content {
  animation: fade-up 700ms var(--ease-out) both;
}

.offer-card .ribbon {
  animation: pop-in 520ms var(--ease-out) 300ms both;
}

.offer-feature__favorite.is-active .icon {
  animation: heart-beat 480ms var(--ease-out);
}

.menu-item.is-entering {
  animation: fade-up 420ms var(--ease-out) both;
}

.page-enter {
  animation: fade-in 360ms ease both;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}