/* Mats Malheur – Keyframes */

@keyframes coin-fall {
  0% {
    transform: translateY(0) rotate(0deg);
    opacity: 0;
  }
  8% {
    opacity: 1;
  }
  100% {
    transform: translateY(420%) rotate(120deg);
    opacity: 0.9;
  }
}

@keyframes flicker {
  0%, 100% { opacity: 1; }
  92% { opacity: 1; }
  93% { opacity: 0.82; }
  94% { opacity: 1; }
  96% { opacity: 0.88; }
  97% { opacity: 1; }
}

body.crt-on .crt-overlay {
  animation: flicker 6s infinite;
}

@keyframes shake {
  0%, 100% { transform: translate(0, 0); }
  20% { transform: translate(-6px, 3px); }
  40% { transform: translate(5px, -4px); }
  60% { transform: translate(-4px, 4px); }
  80% { transform: translate(6px, -2px); }
}

body.egg-shake {
  animation: shake 0.4s ease-in-out 4;
}

@keyframes paper-fall {
  0% {
    transform: translateY(-10vh) rotate(0deg);
    opacity: 0;
  }
  10% { opacity: 1; }
  100% {
    transform: translateY(110vh) rotate(340deg);
    opacity: 0.95;
  }
}

.egg-paper {
  position: fixed;
  top: 0;
  z-index: 2999;
  font-family: var(--f-display);
  font-size: 0.7rem;
  color: var(--c-text-dim);
  background: var(--c-bg-panel);
  border: 1px solid var(--c-line);
  padding: 2px 6px;
  animation: paper-fall linear forwards;
  pointer-events: none;
}

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

.boot-cursor {
  display: inline-block;
  width: 0.6em;
  animation: blink-cursor 1s step-end infinite;
}

@keyframes team-idle-bob {
  0%, 100% { transform: scale(1.04) translateY(0); }
  50% { transform: scale(1.04) translateY(-3%); }
}

@keyframes team-blink {
  0%, 92%, 100% { opacity: 0; }
  94%, 97% { opacity: 1; }
}

@keyframes team-steam-rise {
  0% { transform: translateY(0) scaleY(0.6); opacity: 0; }
  20% { opacity: 0.8; }
  100% { transform: translateY(-26px) scaleY(1.3); opacity: 0; }
}

@keyframes hero-punch-in {
  0% { transform: scale(1); }
  60% { transform: scale(1.32); }
  100% { transform: scale(1.08); }
}

@keyframes hotspot-ripple {
  0% { transform: scale(0.6); opacity: 0.95; }
  100% { transform: scale(1.9); opacity: 0; }
}

@keyframes team-photo-kenburns {
  0% { transform: scale(1) translate(0, 0); }
  50% { transform: scale(1.08) translate(-1.5%, -1%); }
  100% { transform: scale(1) translate(0, 0); }
}

@keyframes dennis-walk {
  0%   { left: 10%; transform: translateX(-50%) translateY(0)     scaleX(1); }
  28%  { left: 10%; transform: translateX(-50%) translateY(0)     scaleX(1); }
  32%  { left: 20%; transform: translateX(-50%) translateY(-2.5%) scaleX(1); }
  36%  { left: 30%; transform: translateX(-50%) translateY(0)     scaleX(1); }
  40%  { left: 40%; transform: translateX(-50%) translateY(-2.5%) scaleX(1); }
  44%  { left: 50%; transform: translateX(-50%) translateY(0)     scaleX(1); }
  48%  { left: 58%; transform: translateX(-50%) translateY(-1%)   scaleX(1); }
  49%  { left: 58%; transform: translateX(-50%) translateY(0)     scaleX(-1); }
  77%  { left: 58%; transform: translateX(-50%) translateY(0)     scaleX(-1); }
  81%  { left: 50%; transform: translateX(-50%) translateY(-2.5%) scaleX(-1); }
  85%  { left: 40%; transform: translateX(-50%) translateY(0)     scaleX(-1); }
  89%  { left: 30%; transform: translateX(-50%) translateY(-2.5%) scaleX(-1); }
  93%  { left: 20%; transform: translateX(-50%) translateY(0)     scaleX(-1); }
  97%  { left: 10%; transform: translateX(-50%) translateY(-1%)   scaleX(-1); }
  98%  { left: 10%; transform: translateX(-50%) translateY(0)     scaleX(1); }
  100% { left: 10%; transform: translateX(-50%) translateY(0)     scaleX(1); }
}

[data-reveal] {
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

[data-reveal].reveal-pending {
  opacity: 0;
  transform: translateY(24px);
}

[data-reveal].is-revealed {
  opacity: 1;
  transform: translateY(0);
}

@keyframes stamp-slam {
  0% { transform: rotate(-12deg) scale(2.4); opacity: 0; }
  60% { transform: rotate(-12deg) scale(0.85); opacity: 1; }
  100% { transform: rotate(-12deg) scale(1); opacity: 1; }
}

@keyframes hero-cup-pop {
  0% { transform: scale(0.4) translateY(6%); opacity: 0; }
  18% { transform: scale(1.1) translateY(-3%); opacity: 1; }
  28% { transform: scale(1) translateY(0); opacity: 1; }
  78% { transform: scale(1) translateY(0); opacity: 1; }
  100% { transform: scale(0.6) translateY(4%); opacity: 0; }
}

@keyframes hero-gag-pop-in {
  0% { transform: scale(0.85) translateY(12px); opacity: 0; }
  100% { transform: scale(1) translateY(0); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  body.egg-shake { animation: none; }
  .egg-paper { animation: none; opacity: 0; }
  body.crt-on .crt-overlay { animation: none; }
  .team-card__pixel img { animation: none; }
  .team-card__blink { animation: none; opacity: 0; }
  .team-card__steam::before, .team-card__steam::after { animation: none; opacity: 0; }
  .team-card__flip { transition: none; }
  .char-card__flip { transition: none; }
  .hero__map-wrap.is-activating img { animation: none; }
  .hotspot.is-activated::after { animation: none; opacity: 0; }
  .dennis-walker { animation: none; left: 10%; transform: translateX(-50%); }
  .team-intro-photo > img:first-child { animation: none; }
  [data-reveal].reveal-pending { opacity: 1; transform: none; }
  .event-card__stamp { animation: none; opacity: 1; transform: rotate(-12deg) scale(1); }
  .hero-coffee-cup.is-popping { animation: none; opacity: 1; transform: scale(1); }
  .hero-coffee-cup__steam { animation: none; opacity: 0; }
  .hero-gag-popover-overlay { transition: none; }
  .hero-gag-popover-overlay.is-shown .hero-gag-popover { animation: none; }
}