
@keyframes fadeDown {
  from { opacity: 0; transform: translateY(-26px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(26px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes slideL {
  from { opacity: 0; transform: translateX(-38px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes slideR {
  from { opacity: 0; transform: translateX(38px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes scaleIn {
  from { opacity: 0; transform: scale(.88); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes glow {
  0%, 100% { text-shadow: 0 0 30px var(--red-glow); }
  50%       { text-shadow: 0 0 65px rgba(204,0,0,.65), 0 0 120px rgba(204,0,0,.25); }
}
@keyframes bob {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50%       { transform: translateX(-50%) translateY(8px); }
}
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-10px); }
}
@keyframes pdot {
  0%, 100% { transform: scale(1); opacity: 1; }
  50%       { transform: scale(1.65); opacity: .55; }
}
@keyframes ripple {
  0%   { transform: scale(1); opacity: .55; }
  100% { transform: scale(2.8); opacity: 0; }
}
@keyframes borderFlow {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
@keyframes memberIn {
  from { opacity: 0; transform: translateX(-16px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes scanPulse {
  0%, 100% { opacity: .03; }
  50%       { opacity: .08; }
}
@keyframes glitch1 {
  0%,100% { clip-path: inset(0 0 100% 0); transform: translate(0); }
  10%     { clip-path: inset(10% 0 60% 0); transform: translate(-2px, 1px); }
  20%     { clip-path: inset(40% 0 30% 0); transform: translate(2px, -1px); }
  30%     { clip-path: inset(70% 0 5% 0);  transform: translate(-1px, 2px); }
  40%     { clip-path: inset(0 0 80% 0);   transform: translate(2px, 0); }
  50%     { clip-path: inset(55% 0 20% 0); transform: translate(-2px, 1px); }
  60%     { clip-path: inset(25% 0 50% 0); transform: translate(1px, -2px); }
  70%     { clip-path: inset(80% 0 0% 0);  transform: translate(-1px, 1px); }
  80%     { clip-path: inset(5% 0 75% 0);  transform: translate(2px, -1px); }
  90%     { clip-path: inset(45% 0 15% 0); transform: translate(-2px, 2px); }
}
@keyframes glitch2 {
  0%,100% { clip-path: inset(100% 0 0 0); transform: translate(0); }
  10%     { clip-path: inset(50% 0 30% 0); transform: translate(2px, -1px); }
  30%     { clip-path: inset(20% 0 65% 0); transform: translate(-2px, 1px); }
  50%     { clip-path: inset(75% 0 10% 0); transform: translate(1px, 2px); }
  70%     { clip-path: inset(35% 0 45% 0); transform: translate(-2px, -2px); }
  90%     { clip-path: inset(60% 0 25% 0); transform: translate(2px, 0px); }
}
@keyframes blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}
@keyframes countUp {
  from { opacity: 0; transform: translateY(10px) scale(.9); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes ld {
  0%, 100% { opacity: .2; transform: scale(.8); }
  50%       { opacity: 1;  transform: scale(1.2); }
}
@keyframes shimmerBar {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}
@keyframes lineGrow {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
@keyframes tagPop {
  0%   { opacity: 0; transform: translateY(10px) scale(.9); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes iconSpin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes cardShine {
  0%   { left: -80%; }
  100% { left: 140%; }
}
@keyframes statCount {
  from { opacity: 0; transform: scale(.7) translateY(6px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}
@keyframes navIn {
  from { opacity: 0; transform: translateY(-100%); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes heroLogoIn {
  0%   { opacity: 0; transform: translateY(-20px) scale(.85); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes footerLine {
  from { width: 0; }
  to   { width: 100%; }
}
@keyframes pulseRed {
  0%, 100% { box-shadow: 0 0 0 0 rgba(204,0,0,.4); }
  50%       { box-shadow: 0 0 0 8px rgba(204,0,0,0); }
}
@keyframes textFlicker {
  0%,100% { opacity: 1; }
  41%      { opacity: 1; }
  42%      { opacity: .8; }
  43%      { opacity: 1; }
  45%      { opacity: .3; }
  46%      { opacity: 1; }
}


.rev {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity .7s var(--transition), transform .7s var(--transition);
}
.rev.on  { opacity: 1; transform: none; }

.rev-l {
  opacity: 0;
  transform: translateX(-34px);
  transition: opacity .7s var(--transition), transform .7s var(--transition);
}
.rev-l.on { opacity: 1; transform: none; }

.rev-r {
  opacity: 0;
  transform: translateX(34px);
  transition: opacity .7s var(--transition), transform .7s var(--transition);
}
.rev-r.on { opacity: 1; transform: none; }

.rev-scale {
  opacity: 0;
  transform: scale(.9);
  transition: opacity .7s var(--transition), transform .7s var(--transition);
}
.rev-scale.on { opacity: 1; transform: scale(1); }

.rev-flip {
  opacity: 0;
  transform: rotateX(-15deg) translateY(20px);
  transform-origin: top center;
  transition: opacity .6s var(--transition), transform .6s var(--transition);
}
.rev-flip.on { opacity: 1; transform: rotateX(0) translateY(0); }
