/* === VISUAL OVERRIDE - Premium Cyber Enhancements === */

.vg-page-hero--support,
.vg-page-hero--faq,
.vg-page-hero--contact,
.vg-page-hero--ranking,
.vg-page-hero--guide {
  background-size: 200% 200% !important;
  animation: vg-gradient-shift 8s ease infinite !important;
  position: relative;
  overflow: hidden;
}

.vg-page-hero--support::before,
.vg-page-hero--faq::before,
.vg-page-hero--contact::before,
.vg-page-hero--ranking::before,
.vg-page-hero--guide::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  opacity: 0.5;
}

.vg-page-hero--support::after,
.vg-page-hero--faq::after,
.vg-page-hero--contact::after,
.vg-page-hero--ranking::after,
.vg-page-hero--guide::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(124,58,237,0.05) 1px, transparent 1px),
             linear-gradient(rgba(124,58,237,0.05) 1px, transparent 1px);
  background-size: 30px 30px;
  pointer-events: none;
}

.vg-section-divider {
  display: block;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--c1s, #ddd6fe), var(--c1, #7c3aed), var(--c1s, #ddd6fe), transparent);
  margin: 40px 0;
  position: relative;
}

.vg-section-divider::after {
  content: '';
  position: absolute;
  left: 50%;
  top: -4px;
  transform: translateX(-50%);
  width: 8px;
  height: 8px;
  background: var(--c1, #7c3aed);
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  box-shadow: 0 0 8px rgba(124,58,237,0.5);
}

.vg-animate-in {
  animation: vg-fade-in-up 0.6s ease forwards;
  opacity: 0;
}

.vg-btn-primary {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.vg-btn-primary::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
  transition: left 0.5s ease;
  z-index: -1;
}

.vg-btn-primary:hover::before {
  left: 100%;
}

.vg-game-card {
  position: relative;
  overflow: hidden;
}

.vg-game-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, var(--c1), #a78bfa);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s cubic-bezier(0.4,0,0.2,1);
  z-index: 3;
}

.vg-game-card:hover::before {
  transform: scaleX(1);
}

.vg-space__social-glow {
  transition: all 0.3s ease;
}

.vg-space__social-glow:hover {
  animation: vg-pulse-glow 1.5s ease infinite;
}

.vg-fp-cat-card__live {
  animation: vg-live-pulse 2s infinite;
}

.vg-fp-hero__scanline::before {
  animation: vg-cyber-scan 4s linear infinite;
}

.vg-neon-core__glow-text {
  animation: vg-neon-flicker 4s ease infinite;
}

.vg-fp-ranking__rank--1 {
  text-shadow: 0 0 8px rgba(217,119,6,0.4), 0 0 16px rgba(217,119,6,0.2);
}

.vg-fp-ranking__rank--2 {
  text-shadow: 0 0 6px rgba(107,114,128,0.3), 0 0 12px rgba(107,114,128,0.15);
}

.vg-fp-ranking__rank--3 {
  text-shadow: 0 0 6px rgba(180,83,9,0.3), 0 0 12px rgba(180,83,9,0.15);
}

.vg-fp-section__title {
  text-shadow: 0 0 10px rgba(124,58,237,0.15);
}

.vg-footer-stats__num {
  text-shadow: 0 0 10px rgba(124,58,237,0.4), 0 0 20px rgba(124,58,237,0.15);
}

.vg-space__neon-title {
  text-shadow: 0 0 8px rgba(124,77,255,0.3), 0 0 16px rgba(124,77,255,0.1);
}

.vg-fp-catbar__tab--active {
  box-shadow: 0 0 8px rgba(124,58,237,0.15), inset 0 0 8px rgba(124,58,237,0.05);
}

.vg-neon-search-box__fire:hover {
  animation: vg-pulse-glow 1.5s ease infinite;
}

.vg-back-to-top:hover {
  animation: vg-glow-pulse 2s ease infinite;
}

@keyframes vg-terminal-line-in {
  0%{opacity:0;transform:translateX(-10px)}
  100%{opacity:1;transform:translateX(0)}
}

@keyframes vg-neon-border-cycle {
  0%,100%{border-color:#7c3aed;box-shadow:0 0 10px rgba(124,58,237,0.3),inset 0 0 10px rgba(124,58,237,0.05)}
  33%{border-color:#3b82f6;box-shadow:0 0 10px rgba(59,130,246,0.3),inset 0 0 10px rgba(59,130,246,0.05)}
  66%{border-color:#8b5cf6;box-shadow:0 0 10px rgba(139,92,246,0.3),inset 0 0 10px rgba(139,92,246,0.05)}
}

@keyframes vg-scanline-move {
  0%{top:-100%}
  100%{top:100%}
}

@keyframes vg-glitch-flicker {
  0%,95%,100%{opacity:1;transform:translate(0)}
  96%{opacity:0.8;transform:translate(-2px,1px)}
  97%{opacity:1;transform:translate(1px,-1px)}
  98%{opacity:0.7;transform:translate(-1px,2px)}
  99%{opacity:1;transform:translate(0)}
}

@keyframes vg-gold-glow {
  0%,100%{text-shadow:0 0 8px rgba(217,119,6,0.5),0 0 16px rgba(217,119,6,0.25)}
  50%{text-shadow:0 0 12px rgba(217,119,6,0.7),0 0 24px rgba(217,119,6,0.35),0 0 36px rgba(217,119,6,0.15)}
}

.vg-fp-terminal__line {
  opacity:0;
  animation:vg-terminal-line-in 0.4s ease forwards;
}

.vg-fp-terminal__line:nth-child(1){animation-delay:0.1s}
.vg-fp-terminal__line:nth-child(2){animation-delay:0.2s}
.vg-fp-terminal__line:nth-child(3){animation-delay:0.3s}
.vg-fp-terminal__line:nth-child(4){animation-delay:0.4s}
.vg-fp-terminal__line:nth-child(5){animation-delay:0.5s}
.vg-fp-terminal__line:nth-child(6){animation-delay:0.6s}
.vg-fp-terminal__line:nth-child(7){animation-delay:0.7s}
.vg-fp-terminal__line:nth-child(8){animation-delay:0.8s}
.vg-fp-terminal__line:nth-child(9){animation-delay:0.9s}
.vg-fp-terminal__line:nth-child(10){animation-delay:1.0s}

.vg-card--neon {
  border:2px solid transparent;
  transition:all 0.35s ease;
}

.vg-card--neon:hover {
  animation:vg-neon-border-cycle 3s ease infinite;
}

.vg-fp-hero__scanline {
  position:relative;
  overflow:hidden;
}

.vg-fp-hero__scanline::after {
  content:'';
  position:absolute;
  left:0;
  width:100%;
  height:2px;
  background:linear-gradient(90deg,transparent,rgba(124,58,237,0.4),transparent);
  animation:vg-scanline-move 4s linear infinite;
  pointer-events:none;
}

.vg-404__code {
  transition:all 0.1s ease;
  cursor:pointer;
}

.vg-404__code:hover {
  animation:vg-glitch-flicker 2s ease infinite;
}

.vg-rank-list__num--1 {
  animation:vg-gold-glow 2s ease infinite;
  color:#f59e0b;
  font-weight:900;
}
