.step-slip {
  z-index: 1;
}

.step-slip:hover > span {
  color: #050d1e;
  background: var(--yellow);
  animation: wk-badge-pulse .48s steps(2, end);
}

.provider-ribbon {
  position: relative;
  overflow: hidden;
}

.provider-ribbon::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(80, 247, 255, .18), transparent);
  transform: translateX(-100%);
  animation: wk-tag-signal 4.5s ease-in-out infinite;
}

.provider-ribbon span {
  position: relative;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
  animation: wk-tag-breathe 3.4s ease-in-out infinite;
}

.provider-ribbon span:nth-child(2n) {
  animation-delay: .35s;
}

.provider-ribbon span:nth-child(3n) {
  animation-delay: .7s;
}

.provider-ribbon span:hover,
.provider-ribbon span:focus-visible {
  transform: translate3d(0, -3px, 0) rotate(-2deg);
  box-shadow: 4px 5px 0 #000, 0 0 18px rgba(37, 99, 235, .5);
}

.faq-file::after {
  content: "";
  position: absolute;
  right: 18px;
  top: -10px;
  width: 74px;
  height: 20px;
  background:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, .28) 0 7px, transparent 8px 13px),
    var(--yellow);
  border: 2px solid #050d1e;
  transform: rotate(4deg);
  transition: transform .2s ease;
}

.faq-file:hover::after {
  transform: translateX(8px) rotate(6deg);
}

.faq-file[open] p {
  animation: wk-faq-open .28s ease;
}

.faq-file.is-open summary {
  text-shadow: 1px 1px 0 rgba(37, 99, 235, .18);
}

.review-note:hover {
  transform: translate3d(0, -7px, 0) rotate(calc(var(--tilt, 0deg) * .45));
}

.review-note::before {
  animation: wk-badge-bob 3.6s ease-in-out infinite;
}

.review-head p {
  background: linear-gradient(90deg, var(--pink), var(--yellow), var(--pink));
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: wk-star-shine 2.8s linear infinite;
}

.shout-wall .float-sticker {
  animation: wk-soft-float 4.8s ease-in-out infinite;
}

.footer-inner {
  position: relative;
  overflow: hidden;
}

.footer-inner::before {
  content: "//// online_signal ////// pixel_path ////// KOPI4D //////";
  position: absolute;
  left: 0;
  right: 0;
  bottom: .35rem;
  color: rgba(80, 247, 255, .55);
  font-family: "Courier New", monospace;
  font-size: .72rem;
  white-space: nowrap;
  animation: wk-footer-line 12s linear infinite;
}

.footer-bottom span:last-child {
  animation: wk-online-blink 2.2s steps(2, end) infinite;
}

.footer-links a {
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.footer-links a:hover,
.footer-links a:focus-visible {
  transform: translate3d(0, -3px, 0) rotate(-1deg);
  box-shadow: 4px 4px 0 var(--pink);
}

@keyframes wk-grid-drift {
  0% { background-position: 0 0, 0 0, 0 0; }
  100% { background-position: 72px 36px, 36px 72px, 22px 44px; }
}

@keyframes wk-scanline {
  0% { background-position: 0 0, 0 0; }
  100% { background-position: 0 30px, 52px 0; }
}

@keyframes wk-sticker-shadow {
  0%, 100% { background-position: 0 0, 0 0; opacity: .18; }
  50% { background-position: 18px -12px, -18px 12px; opacity: .28; }
}

@keyframes wk-signal-run {
  0% { background-position: 220% 0; }
  100% { background-position: -220% 0; }
}

@keyframes wk-nav-wiggle {
  0%, 100% { rotate: 0deg; }
  35% { rotate: -2deg; }
  70% { rotate: 2deg; }
}

@keyframes wk-border-pulse {
  0%, 100% { border-color: #050d1e; }
  50% { border-color: var(--cyan); }
}

@keyframes wk-logo-glitch {
  0% { transform: translateX(-130%) rotate(12deg); }
  45% { transform: translateX(0) rotate(12deg); }
  100% { transform: translateX(130%) rotate(12deg); }
}

@keyframes wk-terminal-blink {
  0%, 80%, 100% { opacity: 1; }
  90% { opacity: .48; }
}

@keyframes wk-path-pixel {
  0%, 100% { transform: translate3d(0, -50%, 0) scale(1); }
  50% { transform: translate3d(3px, -50%, 0) scale(1.28); }
}

@keyframes wk-reveal-up {
  0% { opacity: 0; transform: translate3d(0, 18px, 0); }
  100% { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes wk-title-impact-reveal {
  0% { opacity: 0; transform: translate3d(-18px, 18px, 0) skewX(-8deg); clip-path: inset(0 100% 0 0); }
  55% { opacity: 1; transform: translate3d(3px, -3px, 0) skewX(2deg); clip-path: inset(0 0 0 0); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) skewX(0); clip-path: inset(0 0 0 0); }
}

@keyframes wk-sticker-slap {
  0% { opacity: 0; transform: translate3d(-28px, 62px, 0) rotate(-8deg) scale(.86); }
  45% { opacity: 1; transform: translate3d(8px, -10px, 0) rotate(4deg) scale(1.07); }
  68% { opacity: 1; transform: translate3d(-3px, 4px, 0) rotate(-2deg) scale(.99); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) var(--reveal-rotate, rotate(0deg)) scale(1); }
}
