/* ============================================================
   VEDA — masked scroll reveal
   Concept ref: GSAP "responsive line splits on scroll".
   · Text  → split into lines, each line rises out of an
             overflow-clip mask (mask added by SplitText).
   · Blocks (images, cards, rows, buttons, badges, everything
             that isn't text) → clip-path wipe-up + fade, so the
             SAME rising-from-a-mask gesture applies site-wide.
   Motion uses the brand --ease-out. Reduced motion shows all.
   ============================================================ */

/* ---- Text lines ---------------------------------------------------- */
/* Once an element is split, it is always visible; the masks do the hiding. */
.vr-split { opacity: 1 !important; transform: none !important; }

.vr-line {
  transform: translateY(118%);
  transition-property: transform;
  transition-duration: 0.92s;
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: calc(var(--vr-i, 0) * 0.065s);
  will-change: transform;
}
.vr-split.is-in .vr-line { transform: translateY(0); }

/* ---- Block elements ------------------------------------------------ */
/* Animation (not transition) so it never clobbers an element's own
   hover transition; JS clears clip-path on animationend to free shadows. */
.vr-block {
  clip-path: inset(112% 0 0 0);
  opacity: 0;
  will-change: clip-path, opacity;
}
.vr-block.is-in {
  animation: vrRise 1000ms cubic-bezier(0.22, 1, 0.36, 1) calc(var(--vr-i, 0) * 0.075s) forwards;
}
@keyframes vrRise {
  from { clip-path: inset(112% 0 0 0); opacity: 0; }
  to   { clip-path: inset(0 0 0 0);    opacity: 1; }
}

/* ---- Safety / accessibility --------------------------------------- */
.vr-off .vr-line  { transform: none !important; transition: none !important; }
.vr-off .vr-block { clip-path: none !important; opacity: 1 !important; animation: none !important; }

@media (prefers-reduced-motion: reduce) {
  .vr-line  { transform: none !important; transition: none !important; }
  .vr-block { clip-path: none !important; opacity: 1 !important; animation: none !important; }
}