/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Nov 24 2025 | 15:19:20 */
/* ===========================
   TOP BANNER ANIMATION EFFECTS
   =========================== */

/* Helps performance */
.topbanner,
.topbannerbutton {
  will-change: transform, box-shadow, filter;
}

/* --- EFFECT: PULSE --- */
.tb-effect-pulse {
  animation: tbPulse 0.7s ease-in-out;
}

@keyframes tbPulse {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.05); }
  60%  { transform: scale(0.98); }
  100% { transform: scale(1); }
}

/* --- EFFECT: SHAKE (HORIZONTAL) --- */
.tb-effect-shake {
  animation: tbShake 0.5s ease-in-out;
}

@keyframes tbShake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-4px); }
  40% { transform: translateX(4px); }
  60% { transform: translateX(-3px); }
  80% { transform: translateX(3px); }
}

/* --- EFFECT: FLOAT (SUBTLE UP/DOWN) --- */
.tb-effect-float {
  animation: tbFloat 1.1s ease-in-out;
}

@keyframes tbFloat {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-4px); }
  100% { transform: translateY(0); }
}

/* --- EFFECT: TILT --- */
.tb-effect-tilt {
  animation: tbTilt 0.6s ease-in-out;
}

@keyframes tbTilt {
  0%   { transform: rotate(0deg); }
  25%  { transform: rotate(-2deg); }
  50%  { transform: rotate(2deg); }
  75%  { transform: rotate(-1deg); }
  100% { transform: rotate(0deg); }
}

/* --- EFFECT: GLOW (EMPHASIZE CTA) --- */
.tb-btn-glow {
  animation: tbBtnGlow 0.8s ease-in-out;
}

@keyframes tbBtnGlow {
  0% {
    box-shadow: 0 3px 10px rgba(255, 255, 255, 0.2);
    filter: brightness(1);
  }
  50% {
    box-shadow: 0 0 18px rgba(255, 255, 255, 0.7);
    filter: brightness(1.1);
  }
  100% {
    box-shadow: 0 3px 10px rgba(255, 255, 255, 0.2);
    filter: brightness(1);
  }
}

/* Make sure animations don’t stack visually if multiple classes collide */
.tb-effect-pulse,
.tb-effect-shake,
.tb-effect-float,
.tb-effect-tilt {
  animation-fill-mode: both;
}

.tb-btn-glow {
  animation-fill-mode: both;
}


