/*
Theme Name: NepalPhotoLibrary
Description: Nepal's premier platform for news photography and creative image marketplace.
Version: 1.0
Author: NepalPhotoLibrary
*/

/* Import the hand-written custom CSS (components/base overrides not covered by Tailwind). */
@import url('assets/custom.css');

@keyframes scroll-reveal-up {
  from {
    opacity: 0;
    transform: translateY(200px) scale(0.85);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.scroll-reveal {
  animation: scroll-reveal-up linear both;
  animation-timeline: view();
  animation-range: entry 0% entry 100%;
  will-change: transform, opacity;
}

/* Stagger cards across a row: siblings in the same grid row share the same
   vertical scroll geometry, so shifting each column's entry range earlier/later
   (as a % of that shared range) makes column 2 lag behind column 1, etc. */
.grid:has(.scroll-reveal) > :nth-child(3n+1) .scroll-reveal {
  animation-range: entry 0% entry 75%;
}

.grid:has(.scroll-reveal) > :nth-child(3n+2) .scroll-reveal {
  animation-range: entry 12% entry 87%;
}

.grid:has(.scroll-reveal) > :nth-child(3n+3) .scroll-reveal {
  animation-range: entry 24% entry 100%;
}

@supports not (animation-timeline: view()) {
  .scroll-reveal {
    animation: none;
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .scroll-reveal {
    animation: none;
    opacity: 1;
    transform: none;
  }
}

/* Auth pages (login/signup/reset): slide the form card down from the top on load. */
@keyframes auth-form-slide-down {
  from {
    opacity: 0;
    transform: translateY(-60px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.auth-form-enter {
  animation: auth-form-slide-down 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@media (prefers-reduced-motion: reduce) {
  .auth-form-enter {
    animation: none;
  }
}

/* Homepage hero banner: slow Ken Burns zoom on the active slide's image,
   plus a staggered fade-up on its badge/headline/description. */
@keyframes hero-ken-burns {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(1.08);
  }
}

.banner-slide img {
  transform: scale(1);
}

.banner-slide.is-active img {
  animation: hero-ken-burns 6.5s ease-out forwards;
}

@keyframes hero-text-up {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.banner-slide a .container > div > * {
  opacity: 0;
  transform: translateY(24px);
}

.banner-slide.is-active a .container > div > * {
  animation: hero-text-up 0.7s ease-out forwards;
}

.banner-slide.is-active a .container > div > *:nth-child(1) {
  animation-delay: 0.1s;
}

.banner-slide.is-active a .container > div > *:nth-child(2) {
  animation-delay: 0.25s;
}

.banner-slide.is-active a .container > div > *:nth-child(3) {
  animation-delay: 0.4s;
}

@media (prefers-reduced-motion: reduce) {
  .banner-slide img {
    animation: none;
  }

  .banner-slide a .container > div > * {
    opacity: 1;
    transform: none;
    animation: none;
  }
}
