/* =========================================================
   ROSE TRUST — motion layer
   ========================================================= */

[data-reveal]{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
[data-reveal].in{
  opacity:1;
  transform:translateY(0);
}
[data-reveal="fade"]{ transform:none; }
[data-reveal="left"]{ transform:translateX(-32px); }
[data-reveal="left"].in{ transform:translateX(0); }
[data-reveal="right"]{ transform:translateX(32px); }
[data-reveal="right"].in{ transform:translateX(0); }
[data-reveal="scale"]{ transform:scale(.92); }
[data-reveal="scale"].in{ transform:scale(1); }

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

@keyframes loaderFade{
  0%{ opacity:1; visibility:visible; }
  100%{ opacity:0; visibility:hidden; }
}
.loader{
  position:fixed; inset:0; z-index:9999;
  background:var(--navy);
  display:flex; align-items:center; justify-content:center;
  animation:loaderFade .6s var(--ease) 1.1s forwards;
}
.loader-mark{
  width:64px; height:64px;
  border:2px solid rgba(255,255,255,.15);
  border-top-color:var(--cyan);
  border-radius:50%;
  animation:spin .9s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }

@keyframes drift{
  0%,100%{ transform:translate(0,0) rotate(0deg); }
  50%{ transform:translate(14px,-18px) rotate(6deg); }
}
.blob{
  position:absolute; border-radius:50%;
  filter:blur(50px);
  animation:drift 12s ease-in-out infinite;
  z-index:-1;
}

.cursor-glow{
  position:fixed; width:340px; height:340px; border-radius:50%; pointer-events:none; z-index:0;
  background:radial-gradient(circle, rgba(0,212,255,.10), transparent 70%);
  transform:translate(-50%,-50%);
  transition:opacity .3s;
  display:none;
}
@media (hover:hover) and (pointer:fine){ .cursor-glow{ display:block; } }

.magnetic{ transition:transform .25s var(--ease); }

.stagger-in > *{ opacity:0; animation:riseIn .7s var(--ease) forwards; }
@keyframes riseIn{ from{ opacity:0; transform:translateY(20px);} to{ opacity:1; transform:translateY(0);} }

.pulse-badge{ animation:pulseSoft 2.6s ease-in-out infinite; }
@keyframes pulseSoft{ 0%,100%{ box-shadow:0 0 0 0 rgba(0,212,255,.35);} 50%{ box-shadow:0 0 0 10px rgba(0,212,255,0);} }