/* ============================================================
   IDine — "Warm Table" animation layer (maximal)
   Scroll reveals, hero Ken-Burns, hover motion, parallax,
   animated gradients, count-up. Reduced-motion safe.
   ============================================================ */

/* ---------- Scroll reveal base states ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity 0.8s var(--wt-ease), transform 0.8s var(--wt-ease);
  will-change: opacity, transform;
}
[data-reveal="left"] {
  transform: translateX(-46px);
}
[data-reveal="right"] {
  transform: translateX(46px);
}
[data-reveal="zoom"] {
  transform: scale(0.92);
}
[data-reveal].is-visible {
  opacity: 1;
  transform: none;
}

/* Stagger children (set --i inline or via JS) */
[data-reveal-stagger] > * {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s var(--wt-ease), transform 0.7s var(--wt-ease);
}
[data-reveal-stagger].is-visible > * {
  opacity: 1;
  transform: none;
  transition-delay: calc(var(--i, 0) * 90ms);
}

/* ---------- Hero: Ken-Burns background ---------- */
@keyframes wt-kenburns {
  0% {
    transform: scale(1.06) translate(0, 0);
  }
  100% {
    transform: scale(1.18) translate(-1.5%, -1.5%);
  }
}
.slider .slide-item,
.slider-layout1 .slide-item {
  overflow: hidden;
}
.wt-kenburns,
.slide-item[style*="background"] {
  animation: wt-kenburns 16s ease-out both alternate infinite;
}

/* ---------- Hero text fade-up sequence on load ---------- */
@keyframes wt-fade-up {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.wt-load .slide-content .heading__subtitle {
  animation: wt-fade-up 0.9s var(--wt-ease) 0.15s both;
}
.wt-load .slide-content .slide-title,
.wt-load .slide-content .heading__title {
  animation: wt-fade-up 0.9s var(--wt-ease) 0.35s both;
}
.wt-load .slide-content p {
  animation: wt-fade-up 0.9s var(--wt-ease) 0.55s both;
}
.wt-load .slide-content .btn,
.wt-load .slide-content .slide-action {
  animation: wt-fade-up 0.9s var(--wt-ease) 0.75s both;
}

/* ---------- Hover motion: cards & gallery ---------- */
.menu-box,
.feature-box,
.gallery__item,
.chef-box,
.testimonial-item {
  transition: transform 0.4s var(--wt-ease), box-shadow 0.4s var(--wt-ease);
}
.menu-box:hover,
.feature-box:hover,
.chef-box:hover,
.testimonial-item:hover {
  transform: translateY(-8px);
  box-shadow: var(--wt-shadow);
}

/* Image zoom inside cards/gallery */
.gallery__item img,
.menu-box img,
.banner__content-img img,
.feature-box img {
  transition: transform 0.7s var(--wt-ease);
}
.gallery__item:hover img,
.menu-box:hover img,
.feature-box:hover img {
  transform: scale(1.08);
}

/* ---------- Animated warm gradient accent ---------- */
@keyframes wt-gradient-shift {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.wt-animated-gradient {
  background: linear-gradient(
    120deg,
    var(--wt-cream) 0%,
    var(--wt-cream-deep) 35%,
    #f6ddc4 65%,
    var(--wt-cream) 100%
  );
  background-size: 300% 300%;
  animation: wt-gradient-shift 18s ease infinite;
}

/* ---------- Count-up numbers ---------- */
.wt-count {
  font-variant-numeric: tabular-nums;
}

/* ---------- Floating decorative bob ---------- */
@keyframes wt-float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-12px);
  }
}
.wt-float {
  animation: wt-float 6s ease-in-out infinite;
}

/* ---------- Button shine sweep ---------- */
.btn__primary {
  position: relative;
  overflow: hidden;
}
.btn__primary::before {
  content: "";
  position: absolute;
  top: 0;
  left: -120%;
  width: 60%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 255, 255, 0.35),
    transparent
  );
  transform: skewX(-20deg);
  transition: left 0.6s var(--wt-ease);
}
.btn__primary:hover::before {
  left: 130%;
}

/* ---------- Scroll progress bar ---------- */
#wt-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 0;
  background: linear-gradient(90deg, var(--wt-terracotta), var(--wt-turmeric));
  z-index: 9999;
  transition: width 0.1s linear;
}

/* ---------- Reduced motion: disable all of it ---------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  [data-reveal],
  [data-reveal-stagger] > * {
    opacity: 1 !important;
    transform: none !important;
  }
  #wt-progress {
    display: none;
  }
}