/* ==========================================================================
   ANIMATIONS — keyframes only. Transition-based motion lives with its
   component in components.css / sections.css.
   ========================================================================== */

@keyframes portraitFloat{
  0%, 100%{ transform:translateY(0); }
  50%{ transform:translateY(-14px); }
}

@keyframes ringSpin{
  to{ transform:rotate(360deg); }
}

@keyframes scrollTravel{
  0%{ top:-34px; }
  100%{ top:34px; }
}

@keyframes blobDriftA{
  0%, 100%{ transform:translate(0,0) scale(1); }
  50%{ transform:translate(30px,-20px) scale(1.08); }
}
@keyframes blobDriftB{
  0%, 100%{ transform:translate(0,0) scale(1); }
  50%{ transform:translate(-24px,18px) scale(0.94); }
}
@keyframes blobDriftC{
  0%, 100%{ transform:translate(0,0) scale(1); }
  50%{ transform:translate(18px,24px) scale(1.05); }
}

@keyframes letterIn{
  from{ opacity:0; transform:translateY(16px); }
  to{ opacity:1; transform:translateY(0); }
}

@keyframes blink{
  0%, 49%{ opacity:1; }
  50%, 100%{ opacity:0.25; }
}

@keyframes shimmer{
  0%{ background-position:200% 0; }
  100%{ background-position:-200% 0; }
}

@keyframes bob{
  0%, 100%{ transform:translateY(0); opacity:0.6; }
  50%{ transform:translateY(6px); opacity:1; }
}

.letter{
  display:inline-block;
  opacity:0;
  animation:letterIn 0.7s var(--ease-luxury) forwards;
}
