/* ═══════════════════════════════════════════
   KEYFRAMES
═══════════════════════════════════════════ */

@keyframes blob1 {
  0%   { transform: translate(0,0) scale(1); }
  50%  { transform: translate(60px,20px) scale(1.15); }
  100% { transform: translate(20px,10px) scale(0.92); }
}
@keyframes blob2 {
  0%   { transform: translate(0,0) scale(1); }
  50%  { transform: translate(-50px,15px) scale(1.1); }
  100% { transform: translate(-20px,5px) scale(0.95); }
}
@keyframes blob3 {
  0%   { transform: translate(0,0) scale(1); }
  50%  { transform: translate(30px,-20px) scale(1.2); }
  100% { transform: translate(-30px,10px) scale(0.9); }
}

@keyframes grid-move {
  0%   { transform: translate(0,0); }
  100% { transform: translate(22px,22px); }
}

@keyframes cur-blink {
  0%, 100% { opacity: .9; }
  50%       { opacity: 0; }
}

@keyframes sep-blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: .1; }
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: .2; }
}

@keyframes fillBar {
  from { width: 0 !important; }
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* ── Hero bio wave text ── */
.wave-text { display: inline-flex; gap: 0; }
.wave-text .wc {
  display: inline-block;
  animation: waveChar 2.4s cubic-bezier(.36,.07,.19,.97) infinite;
}
.wave-text .ws { display: inline-block; width: 0.3em; }

@keyframes waveChar {
  0%   { transform: translateY(0)    rotateZ(0deg);   color: var(--accent); }
  15%  { transform: translateY(-5px) rotateZ(-2deg);  color: var(--violet); }
  30%  { transform: translateY(0)    rotateZ(0deg);   color: var(--accent); }
  100% { transform: translateY(0)    rotateZ(0deg);   color: var(--accent); }
}
/* ── Hero bio wave text ── */
.wave-text { display: inline-flex; gap: 0; }
.wave-text .wc {
  display: inline-block;
  animation: waveChar 4s cubic-bezier(.36,.07,.19,.97) infinite;
}
.wave-text .ws { display: inline-block; width: 0.3em; }

@keyframes waveChar {
  0%   { transform: translateY(0)    rotateZ(0deg);  color: var(--accent); }
  15%  { transform: translateY(-5px) rotateZ(-2deg); color: var(--violet); }
  30%  { transform: translateY(0)    rotateZ(0deg);  color: var(--accent); }
  100% { transform: translateY(0)    rotateZ(0deg);  color: var(--accent); }
}
