/* =========================================================================
   ArchiMass — animations.css
   Keyframes, scroll-reveal primitives, the Z-depth parallax system.
   All motion is opacity/transform only (GPU-friendly, no layout thrash).
   ========================================================================= */

@keyframes heroLine{ to{ transform:translateY(0); } }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:translateY(0); } }
@keyframes fadeIn{ to{ opacity:1; } }
@keyframes blink{ 50%{ opacity:0; } }
@keyframes marquee{ to{ transform:translateX(-50%); } }
@keyframes shimmer{ to{ background-position:-200% 0; } }
@keyframes pulseRing{
  0%{ transform:scale(.7); opacity:.8; }
  100%{ transform:scale(2.2); opacity:0; }
}
@keyframes sweep{
  0%{ transform:translateY(-100%); opacity:0; }
  30%{ opacity:1; }
  100%{ transform:translateY(100%); opacity:0; }
}

/* --- Scroll reveal (driven by js/animations.js IntersectionObserver) ----- */
[data-reveal]{
  opacity:0;
  transform:translate3d(0, var(--rv-y, 26px), 0);
  transition:
    opacity .85s var(--ease),
    transform 1.05s var(--ease-io);
  transition-delay:var(--rv-delay, 0ms);
  will-change:opacity, transform;
}
[data-reveal="left"]{ --rv-y:0px; transform:translate3d(-28px,0,0); }
[data-reveal="right"]{ --rv-y:0px; transform:translate3d(28px,0,0); }
[data-reveal="scale"]{ transform:translate3d(0,22px,0) scale(.97); }
[data-reveal].is-in{ opacity:1; transform:translate3d(0,0,0) scale(1); will-change:auto; }

/* stagger helper */
[data-reveal-group] > *{ transition-delay:calc(var(--i, 0) * 70ms); }

/* --- Z-DEPTH PARALLAX ---------------------------------------------------
   Elements declare a depth from -3 (far) to +3 (near). js/scroll-depth.js
   writes a single --p (progress) variable per layer, per frame, using one
   rAF loop and one IntersectionObserver — no scroll handlers doing layout.
   ----------------------------------------------------------------------- */
[data-depth]{
  transform:translate3d(0, calc(var(--p, 0) * var(--depth-amp, 0px)), 0);
  will-change:transform;
}
[data-depth="-3"]{ --depth-amp:-120px; }
[data-depth="-2"]{ --depth-amp:-80px;  }
[data-depth="-1"]{ --depth-amp:-40px;  }
[data-depth="1"] { --depth-amp:34px;   }
[data-depth="2"] { --depth-amp:68px;   }
[data-depth="3"] { --depth-amp:104px;  }

/* perspective containers: real Z, not just offset speed */
.z-scene{
  perspective:1400px;
  perspective-origin:50% 50%;
  transform-style:preserve-3d;
}
.z-plane{
  transform:translate3d(0,0,var(--z,0px)) scale(calc(1 - (var(--z,0px) / 1400px)));
  transform-style:preserve-3d;
}

/* pointer parallax (very subtle camera drift) — js/animations.js sets --mx/--my */
[data-tilt]{
  transform:
    translate3d(calc(var(--mx,0) * var(--tilt-t, 8px)), calc(var(--my,0) * var(--tilt-t, 8px)), 0)
    rotateX(calc(var(--my,0) * -1 * var(--tilt-r, .6deg)))
    rotateY(calc(var(--mx,0) * var(--tilt-r, .6deg)));
  transition:transform .6s cubic-bezier(.19,.9,.24,1);
}

/* a pane of glass passing behind fixed type */
.passing-sheet{
  position:absolute; inset:auto 0 0 0; height:52vh;
  background:linear-gradient(180deg, color-mix(in srgb, var(--instrument) 8%, transparent), transparent 70%);
  border-top:1px solid var(--line-1);
  pointer-events:none;
}

/* scan sweep used on viewports when the agent acts */
.scan{
  position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:3;
}
.scan i{
  position:absolute; left:0; right:0; height:38%;
  background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--agent) 18%, transparent), transparent);
  opacity:0;
}
.scan.is-on i{ animation:sweep 1.1s var(--ease-io); }

/* mark-in text (letters lift) */
.lift > span{ display:inline-block; transform:translateY(.7em); opacity:0;
  transition:transform .8s var(--ease-io), opacity .6s var(--ease); }
.lift.is-in > span{ transform:translateY(0); opacity:1; }

/* --- Reduced motion: honour it completely -------------------------------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  [data-reveal]{ opacity:1 !important; transform:none !important; }
  [data-depth]{ transform:none !important; }
  [data-tilt]{ transform:none !important; }
  .hero__title .l > span{ transform:none; }
  .strip__track{ animation:none; }
  .hero__brandline,.hero__sub,.hero__actions,.hero__bar,.hero__readout{ opacity:1 !important; }
}