/* ═══════════════════════════════════════════
   A&B PROJECTS — Animations
   All animations respect prefers-reduced-motion.
═══════════════════════════════════════════ */

/* ── KEYFRAMES ── */
@keyframes scrollPulse {
  0%, 100% { opacity: 0.4; transform: scaleY(1); }
  50%       { opacity: 1;   transform: scaleY(1.15); }
}

@keyframes fabBounce {
  0%, 100% { transform: translateY(0); }
  40%       { transform: translateY(-8px); }
  60%       { transform: translateY(-4px); }
}

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

@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}

/* ── SCROLL-TRIGGERED FADE-UP ── */
[data-animate] {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
              transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

[data-animate].is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Delay helpers (data-delay="N") */
[data-animate][data-delay="1"] { transition-delay: 0.1s; }
[data-animate][data-delay="2"] { transition-delay: 0.2s; }
[data-animate][data-delay="3"] { transition-delay: 0.3s; }
[data-animate][data-delay="4"] { transition-delay: 0.4s; }
[data-animate][data-delay="5"] { transition-delay: 0.5s; }
[data-animate][data-delay="6"] { transition-delay: 0.6s; }

/* ── FAB ENTRANCE — bounce when container first becomes visible ── */
.fab-container.is-visible .fab-item:nth-child(1) .fab {
  animation: fabBounce 0.9s cubic-bezier(0.36, 0.07, 0.19, 0.97) 0.4s both;
}
.fab-container.is-visible .fab-item:nth-child(2) .fab {
  animation: fabBounce 0.9s cubic-bezier(0.36, 0.07, 0.19, 0.97) 0.25s both;
}
.fab-container.is-visible .fab-item:nth-child(3) .fab {
  animation: fabBounce 0.9s cubic-bezier(0.36, 0.07, 0.19, 0.97) 0.1s both;
}

/* ── GALLERY ITEM TRANSITION ── */
.gallery-item {
  transition: opacity 0.3s ease;
}
.gallery-item.is-hiding {
  opacity: 0;
  transform: scale(0.97);
  pointer-events: none;
}

/* ── LIGHTBOX ── */
.lightbox-img {
  animation: none;
}
.lightbox.is-open .lightbox-img {
  animation: counterTick 0.3s ease both;
}

/* ── HERO WORDS — initial state ── */
.hero-word {
  transform: translateY(24px);
  opacity: 0;
  display: block;
}
/* Overridden by is-visible via [data-animate] system */

/* ── PROCESS STEP ── */
.process-step {
  transition: border-color 0.25s ease, transform 0.3s ease, box-shadow 0.3s ease;
}

/* ── GOLD SHIMMER on active filter tab ── */
.filter-btn.active {
  background-image: linear-gradient(
    90deg,
    var(--color-accent) 0%,
    var(--color-accent-hover) 40%,
    var(--color-accent) 60%,
    var(--color-accent) 100%
  );
  background-size: 200% auto;
  animation: shimmer 2.5s linear infinite;
}

/* ── BACK TO TOP ── */
.back-to-top {
  transition: background 0.25s ease,
              border-color 0.25s ease,
              color 0.25s ease,
              opacity 0.3s ease,
              transform 0.3s ease;
}

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

  [data-animate] {
    opacity: 1;
    transform: none;
  }

  .service-card {
    opacity: 1;
    transform: none;
  }

  .hero-word {
    opacity: 1;
    transform: none;
  }

  .hero-scroll-line {
    animation: none;
  }
}