/* ==========================================================================
   BookZen — animations.css
   Keyframes, hero entrance choreography and scroll reveals.
   Scroll reveals are opt-in: add data-reveal="up|left|right|scale" to an element.
   Children of [data-reveal-group] reveal with a stagger.
   ========================================================================== */

@keyframes fadeUp   { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes fadeLeft { from { opacity: 0; transform: translateX(-24px); } to { opacity: 1; transform: none; } }
@keyframes fadeRight{ from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: none; } }
@keyframes riseIn   { from { opacity: 0; transform: translateY(60px); } to { opacity: 1; transform: none; } }
@keyframes scaleIn  { from { opacity: 0; transform: scale(.9); } to { opacity: 1; transform: none; } }
@keyframes fadeIn   { from { opacity: 0; } to { opacity: 1; } }
@keyframes floaty   { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
@keyframes sway     { 0%, 100% { rotate: 0deg; } 50% { rotate: 4deg; } }
@keyframes spin     { to { transform: rotate(360deg); } }
@keyframes pulse    { 0% { transform: scale(1); opacity: .6; } 100% { transform: scale(3); opacity: 0; } }
@keyframes cardIn   { from { opacity: 0; transform: translateY(20px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes bookIn   { from { opacity: 0; translate: 0 36px; } to { opacity: 1; translate: 0 0; } }

.floaty { animation: floaty 7s ease-in-out infinite; }
.sway   { animation: sway 8s ease-in-out infinite; transform-origin: bottom center; }

/* Hero: elements animate only while their slide is active */
.hs-slide [data-anim] { opacity: 0; }
.hs-slide.is-active [data-anim] {
  animation: var(--a, fadeUp) .9s var(--ease) both;
  animation-delay: var(--d, 0s);
}

/* Hero slide 1: the three books are set down on the shelf one after another
   (the one orchestrated motion moment on the page) */
.hs-slide.is-active .book-stage .book3d { animation: bookIn 1s var(--ease) both; }
.hs-slide.is-active .book-stage .book3d:nth-child(1) { animation-delay: .25s; }
.hs-slide.is-active .book-stage .book3d:nth-child(2) { animation-delay: .1s; }
.hs-slide.is-active .book-stage .book3d:nth-child(3) { animation-delay: .4s; }
.page-hero-art.is-book .book3d { animation: bookIn 1.1s var(--ease) both .15s; }
.page-hero-art.is-book .book3d.is-back { animation-delay: .3s; }

/* Scroll reveal (activated by js/animations.js; without JS content stays visible) */
.js-reveal [data-reveal] { opacity: 0; transition: opacity .8s var(--ease), transform .8s var(--ease); transition-delay: var(--rd, 0s); }
.js-reveal [data-reveal="up"]    { transform: translateY(22px); }
.js-reveal [data-reveal="left"]  { transform: translateX(-24px); }
.js-reveal [data-reveal="right"] { transform: translateX(24px); }
.js-reveal [data-reveal="scale"] { transform: scale(.97); }
.js-reveal [data-reveal].is-visible { opacity: 1; transform: none; }

/* Portfolio cards entering after filter / show more */
.pf-card.is-entering { animation: cardIn .55s var(--ease) both; animation-delay: var(--cd, 0s); }

/* Reduced motion ------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .js-reveal [data-reveal] { opacity: 1; transform: none; }
}