/* ==========================================================================
   Wolf CA — animations.css
   Scroll-reveal, entrance animations, micro-interactions.
   All CSS-only where possible; JS adds classes for Intersection Observer.
   ========================================================================== */

/* ── Reveal system ────────────────────────────────────────────────────────── */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s var(--ease-out-expo), transform 0.7s var(--ease-out-expo);
}
[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger siblings */
[data-reveal]:nth-child(1) { transition-delay: 0ms; }
[data-reveal]:nth-child(2) { transition-delay: 80ms; }
[data-reveal]:nth-child(3) { transition-delay: 160ms; }
[data-reveal]:nth-child(4) { transition-delay: 240ms; }
[data-reveal]:nth-child(5) { transition-delay: 320ms; }
[data-reveal]:nth-child(6) { transition-delay: 400ms; }

/* ── Hero entrance animations ─────────────────────────────────────────────── */
[data-animate="fade-up"] {
  opacity: 0;
  transform: translateY(32px);
  animation: wolf-fade-up 0.9s var(--ease-out-expo) both;
}
[data-animate="fade-left"] {
  opacity: 0;
  transform: translateX(32px);
  animation: wolf-fade-left 0.9s var(--ease-out-expo) both;
}

[data-delay="0"]   { animation-delay: 0ms; }
[data-delay="100"] { animation-delay: 100ms; }
[data-delay="200"] { animation-delay: 200ms; }
[data-delay="300"] { animation-delay: 300ms; }
[data-delay="400"] { animation-delay: 400ms; }
[data-delay="500"] { animation-delay: 500ms; }
[data-delay="600"] { animation-delay: 600ms; }

@keyframes wolf-fade-up {
  from { opacity: 0; transform: translateY(32px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes wolf-fade-left {
  from { opacity: 0; transform: translateX(32px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ── Filter grid transition ───────────────────────────────────────────────── */
.wolf-products-grid { transition: opacity 0.3s; }
.wolf-products-grid.is-loading { opacity: 0.4; pointer-events: none; }

/* Wolf card entrance on filter */
.wolf-card {
  animation: wolf-card-in 0.5s var(--ease-out-expo) both;
}
@keyframes wolf-card-in {
  from { opacity: 0; transform: translateY(16px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── Number counter animation ─────────────────────────────────────────────── */
.wolf-hero__stat-number[data-count] {
  transition: none; /* JS handles this */
}

/* ── Heading split animation ──────────────────────────────────────────────── */
.wolf-split-word {
  display: inline-block;
  overflow: hidden;
}
.wolf-split-word span {
  display: inline-block;
  animation: wolf-word-in 0.8s var(--ease-out-expo) both;
}
@keyframes wolf-word-in {
  from { transform: translateY(105%); }
  to   { transform: translateY(0); }
}

/* ── Hover shimmer on buttons ─────────────────────────────────────────────── */
.wolf-btn--red {
  background: var(--wolf-red);
  position: relative;
  overflow: hidden;
}
.wolf-btn--red::after {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.12), transparent);
  transition: left 0.5s;
}
.wolf-btn--red:hover::after { left: 160%; }

/* ── Province tags stagger ────────────────────────────────────────────────── */
.wolf-province-tags .wolf-province-tag {
  animation: wolf-fade-up 0.5s var(--ease-out-expo) both;
}
.wolf-province-tags .wolf-province-tag:nth-child(1)  { animation-delay: 50ms; }
.wolf-province-tags .wolf-province-tag:nth-child(2)  { animation-delay: 100ms; }
.wolf-province-tags .wolf-province-tag:nth-child(3)  { animation-delay: 150ms; }
.wolf-province-tags .wolf-province-tag:nth-child(4)  { animation-delay: 200ms; }
.wolf-province-tags .wolf-province-tag:nth-child(5)  { animation-delay: 250ms; }
.wolf-province-tags .wolf-province-tag:nth-child(6)  { animation-delay: 300ms; }
.wolf-province-tags .wolf-province-tag:nth-child(7)  { animation-delay: 350ms; }
.wolf-province-tags .wolf-province-tag:nth-child(8)  { animation-delay: 400ms; }
.wolf-province-tags .wolf-province-tag:nth-child(9)  { animation-delay: 450ms; }
.wolf-province-tags .wolf-province-tag:nth-child(10) { animation-delay: 500ms; }

/* ── Reduced motion ───────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  [data-reveal] { opacity: 1; transform: none; }
  .wolf-hero__scan-line { display: none; }
  .wolf-marquee__track { animation: none; }
  .wolf-cursor { display: none; }
}