/* ============================================================
   MASHAL DEVELOPMENT ORGANIZATION — animation system
   Scroll-triggered reveals · image reveals · page load · reduced motion
   ============================================================ */

/* ---------- Reveal system ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  transition:
    opacity 0.9s var(--ease),
    transform 0.9s var(--ease);
  transition-delay: var(--rd, 0s);
  will-change: opacity, transform;
}

[data-reveal="left"] {
  transform: translateX(-44px);
}

[data-reveal="right"] {
  transform: translateX(44px);
}

[data-reveal="scale"] {
  transform: scale(0.94);
}

[data-reveal="fade"] {
  transform: none;
}

[data-reveal].is-in {
  opacity: 1;
  transform: none;
}

/* clip reveal for imagery */
[data-clip] {
  clip-path: inset(0 0 100% 0);
  transition: clip-path 1.1s var(--ease);
  transition-delay: var(--rd, 0s);
}

[data-clip].is-in {
  clip-path: inset(0 0 0 0);
}

/* image zoom-as-reveal (on scroll into view) */
.img-zoom {
  overflow: hidden;
}

.img-zoom img {
  transition: transform 1.4s var(--ease), opacity 0.9s var(--ease);
  opacity: 0.92;
}

.img-zoom.is-in img {
  transform: scale(1.05);
  opacity: 1;
}

/* stagger helper */
.stagger>* {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
}

.stagger.is-in>* {
  opacity: 1;
  transform: none;
}

.stagger.is-in>*:nth-child(1) {
  transition-delay: 0.05s;
}

.stagger.is-in>*:nth-child(2) {
  transition-delay: 0.12s;
}

.stagger.is-in>*:nth-child(3) {
  transition-delay: 0.19s;
}

.stagger.is-in>*:nth-child(4) {
  transition-delay: 0.26s;
}

.stagger.is-in>*:nth-child(5) {
  transition-delay: 0.33s;
}

.stagger.is-in>*:nth-child(6) {
  transition-delay: 0.4s;
}

.stagger.is-in>*:nth-child(7) {
  transition-delay: 0.47s;
}

.stagger.is-in>*:nth-child(8) {
  transition-delay: 0.54s;
}

/* ---------- Page load ---------- */
.page-fade {
  animation: pageIn 0.7s var(--ease) both;
}

@keyframes pageIn {
  from {
    opacity: 0;
    transform: translateY(14px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

/* hero load sequence */
.hero-load [data-hl] {
  opacity: 0;
  transform: translateY(26px);
  animation: heroUp 0.9s var(--ease) forwards;
}

.hero-load [data-hl="1"] {
  animation-delay: 0.25s;
}

.hero-load [data-hl="2"] {
  animation-delay: 0.38s;
}

.hero-load [data-hl="3"] {
  animation-delay: 0.52s;
}

.hero-load [data-hl="4"] {
  animation-delay: 0.66s;
}

.hero-load [data-hl="5"] {
  animation-delay: 0.8s;
}

@keyframes heroUp {
  from {
    opacity: 0;
    transform: translateY(26px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

/* ---------- misc micro motion ---------- */
.float-soft {
  animation: floatSoft 7s ease-in-out infinite;
}

@keyframes floatSoft {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-14px);
  }
}

.pulse-ring {
  position: relative;
}

.pulse-ring::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: 0 0 0 0 rgba(232, 163, 61, 0.5);
  animation: pulseRing 2.4s var(--ease) infinite;
}

@keyframes pulseRing {
  0% {
    box-shadow: 0 0 0 0 rgba(232, 163, 61, 0.45);
  }

  100% {
    box-shadow: 0 0 0 22px rgba(232, 163, 61, 0);
  }
}

/* tilt hover for cards handled in JS via inline transform */

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    animation-duration: 0.001s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001s !important;
    scroll-behavior: auto !important;
  }

  [data-reveal],
  [data-clip],
  .stagger>* {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
  }

  .home-hero__media img {
    animation: none;
    transform: scale(1.03);
  }

  .marquee__track {
    animation: none;
  }
}