.retro-strip {
  background-image:
    linear-gradient(90deg, rgba(5, 6, 19, 0.5), rgba(5, 6, 19, 0.02)),
    url("assets/arcade-jal-brand-board.png");
  background-size: cover, 325% 465%;
  background-position: center, 100% 100%;
  isolation: isolate;
  box-shadow: inset 0 0 85px rgba(1, 3, 17, 0.72), inset 0 0 34px rgba(255, 182, 0, 0.26);
}

.retro-strip::before,
.retro-strip::after {
  content: "";
  position: absolute;
  inset: -18%;
  z-index: 0;
  pointer-events: none;
}

.retro-strip::before {
  background:
    radial-gradient(circle at 72% 65%, rgba(255, 187, 19, 0.58) 0 3%, rgba(255, 95, 26, 0.22) 15%, transparent 39%),
    radial-gradient(circle at 84% 28%, rgba(58, 160, 255, 0.42) 0 2%, transparent 26%);
  mix-blend-mode: screen;
  animation: arcadeGlow 4.8s ease-in-out infinite alternate;
}

.retro-strip::after {
  inset: 0;
  background: linear-gradient(to bottom, transparent 58%, rgba(5, 6, 17, 0.88) 78%, #050611 100%);
}

.retro-strip-copy {
  text-shadow: 0 2px 12px #03040f, 0 0 28px rgba(255, 194, 43, 0.38);
}

.retro-strip-copy h2 {
  text-shadow: 0 3px 1px #15111f, 0 0 26px rgba(255, 113, 46, 0.7);
}

.brand {
  align-items: center;
  display: flex;
  height: 58px;
  width: 104px;
}

.brand-logo {
  display: block;
  filter: drop-shadow(0 3px 8px rgba(255, 214, 34, 0.24));
  height: 100%;
  object-fit: contain;
  width: 100%;
}

@keyframes arcadeGlow {
  to { transform: scale(1.14) translate(-3%, 2%); opacity: 0.72; }
}
