/* ==========================================================================
   Parishrama Marketing — Animations
   Scroll reveals, keyframes, hover glows, floating elements.
   ========================================================================== */

/* ------------------------- SCROLL REVEAL SYSTEM ------------------------- */
/* Elements opt in with data-anim="fade-up" etc. main.js toggles .is-visible.
   Delay via data-anim-delay="120" (ms) -> inline --anim-delay.               */

[data-anim] {
  opacity: 0;
  transition:
    opacity .95s var(--ease-out) var(--anim-delay, 0ms),
    transform 1.05s var(--ease-out) var(--anim-delay, 0ms),
    filter .95s var(--ease-out) var(--anim-delay, 0ms),
    clip-path 1.1s var(--ease-out) var(--anim-delay, 0ms);
  will-change: opacity, transform;
}

[data-anim="fade"] { transform: none; }
[data-anim="fade-up"] { transform: translate3d(0, 46px, 0); }
[data-anim="fade-down"] { transform: translate3d(0, -40px, 0); }
[data-anim="fade-left"] { transform: translate3d(-52px, 0, 0); }
[data-anim="fade-right"] { transform: translate3d(52px, 0, 0); }
[data-anim="zoom"] { transform: scale(.9); }
[data-anim="zoom-out"] { transform: scale(1.08); }
[data-anim="blur"] { filter: blur(12px); transform: translate3d(0, 24px, 0); }
[data-anim="tilt"] { transform: perspective(1000px) rotateX(12deg) translate3d(0, 40px, 0); }
[data-anim="reveal-x"] { clip-path: inset(0 100% 0 0); opacity: 1; }
[data-anim="flip-in"] { transform: perspective(1200px) rotateY(-24deg) translate3d(40px, 0, 0); }

[data-anim].is-visible {
  opacity: 1;
  transform: none;
  filter: none;
  clip-path: inset(0 0 0 0);
}

/* Staggered children (e.g. grids) */
[data-anim-group] > * {
  opacity: 0;
  transform: translate3d(0, 38px, 0);
  transition: opacity .85s var(--ease-out), transform .95s var(--ease-out);
}
[data-anim-group].is-visible > * { opacity: 1; transform: none; }
[data-anim-group].is-visible > *:nth-child(1) { transition-delay: 0ms; }
[data-anim-group].is-visible > *:nth-child(2) { transition-delay: 90ms; }
[data-anim-group].is-visible > *:nth-child(3) { transition-delay: 180ms; }
[data-anim-group].is-visible > *:nth-child(4) { transition-delay: 270ms; }
[data-anim-group].is-visible > *:nth-child(5) { transition-delay: 360ms; }
[data-anim-group].is-visible > *:nth-child(6) { transition-delay: 450ms; }
[data-anim-group].is-visible > *:nth-child(7) { transition-delay: 540ms; }
[data-anim-group].is-visible > *:nth-child(8) { transition-delay: 630ms; }
[data-anim-group].is-visible > *:nth-child(9) { transition-delay: 720ms; }
[data-anim-group].is-visible > *:nth-child(n + 10) { transition-delay: 800ms; }

/* Underline sweep for headings */
.anim-underline {
  position: relative;
  display: inline-block;
}
.anim-underline::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: 2px;
  background: var(--grad-gold);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 1s var(--ease-out) .3s;
}
.anim-underline.is-visible::after,
.is-visible .anim-underline::after { transform: scaleX(1); }

/* --------------------------- HOVER EFFECTS ----------------------------- */
.hover-lift { transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
.hover-lift:hover { transform: translateY(-8px); box-shadow: var(--sh-lg); }

.hover-glow { transition: box-shadow .5s var(--ease), transform .5s var(--ease); }
.hover-glow:hover {
  transform: translateY(-4px);
  box-shadow: 0 0 0 1px rgba(199, 154, 46, .5), 0 18px 44px rgba(167, 121, 26, .28);
}

.hover-zoom { overflow: hidden; }
.hover-zoom img { transition: transform 1.15s var(--ease); }
.hover-zoom:hover img { transform: scale(1.08); }

.shine {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.shine::after {
  content: "";
  position: absolute;
  top: 0;
  left: -120%;
  width: 55%;
  height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .5), transparent);
  transform: skewX(-22deg);
  pointer-events: none;
}
.shine:hover::after { animation: shine-sweep 1.1s var(--ease-out); }

/* Floating decorative elements */
.float-slow { animation: float-y 8s ease-in-out infinite; }
.float-med { animation: float-y 6s ease-in-out infinite; }
.float-fast { animation: float-y 4.4s ease-in-out infinite; }
.float-delay-1 { animation-delay: -1.4s; }
.float-delay-2 { animation-delay: -2.8s; }
.spin-slow { animation: spin 26s linear infinite; }
.pulse-ring { animation: pulse-ring 3s ease-out infinite; }

/* ---------------------------- KEYFRAMES -------------------------------- */
@keyframes float-y {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-14px); }
}

@keyframes hero-pan {
  0% { transform: scale(1.06) translate3d(0, 0, 0); }
  100% { transform: scale(1.13) translate3d(-1.6%, -1.2%, 0); }
}

@keyframes gradient-drift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes aurora {
  0% { transform: translate3d(0, 0, 0) scale(1); opacity: .85; }
  50% { transform: translate3d(-2%, 2%, 0) scale(1.08); opacity: 1; }
  100% { transform: translate3d(2%, -1%, 0) scale(1.03); opacity: .9; }
}

@keyframes ripple-out {
  to { transform: scale(2.6); opacity: 0; }
}

@keyframes shine-sweep {
  to { left: 130%; }
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

@keyframes pop-in {
  0% { transform: scale(.5) rotate(-14deg); opacity: 0; }
  60% { transform: scale(1.08) rotate(4deg); opacity: 1; }
  100% { transform: scale(1) rotate(0); opacity: 1; }
}

@keyframes shake-in {
  0% { transform: translateX(0); }
  25% { transform: translateX(-4px); }
  50% { transform: translateX(4px); }
  75% { transform: translateX(-2px); }
  100% { transform: translateX(0); }
}

@keyframes toast-in {
  from { transform: translateX(26px) scale(.96); opacity: 0; }
  to { transform: none; opacity: 1; }
}

@keyframes toast-out {
  to { transform: translateX(26px) scale(.96); opacity: 0; }
}

@keyframes scroll-hint {
  0% { transform: scaleY(0); transform-origin: top; opacity: 0; }
  40% { transform: scaleY(1); transform-origin: top; opacity: 1; }
  70% { transform: scaleY(1); transform-origin: bottom; opacity: 1; }
  100% { transform: scaleY(0); transform-origin: bottom; opacity: 0; }
}

@keyframes pulse-ring {
  0% { box-shadow: 0 0 0 0 rgba(199, 154, 46, .45); }
  70% { box-shadow: 0 0 0 18px rgba(199, 154, 46, 0); }
  100% { box-shadow: 0 0 0 0 rgba(199, 154, 46, 0); }
}

@keyframes page-glint {
  0% { opacity: 0; }
  35% { opacity: .55; }
  100% { opacity: 0; }
}

/* Page-turn glint that rides along a flipping leaf */
.leaf.is-turning .face::before { animation: page-glint .9s var(--ease) forwards; }

/* --------------------- REDUCED MOTION PREFERENCE ----------------------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

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

  [data-anim],
  [data-anim-group] > * {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    clip-path: none !important;
  }
}