/* Neon Social Media Footer Styles */
.footer-social {
  background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%);
  padding: 40px 20px;
  text-align: center;
  border-top: 2px solid #00ffff;
  box-shadow: 0 -10px 30px rgba(0, 255, 255, 0.1);
}

.social-container h3 {
  color: #ffffff;
  font-size: 1.8rem;
  margin-bottom: 20px;
  text-transform: uppercase;
  letter-spacing: 2px;
  text-shadow: 0 0 10px #00ffff, 0 0 20px #00ffff;
}

.social-icons {
  display: flex;
  justify-content: center;
  gap: 30px;
  margin-bottom: 20px;
}

.social-icon {
  display: inline-block;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: linear-gradient(45deg, #0a0a0a, #1a1a1a);
  border: 2px solid #00ffff;
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 20px rgba(0, 255, 255, 0.3);
}

.social-icon::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(0, 255, 255, 0.4), transparent);
  transition: left 0.5s;
}

.social-icon:hover::before {
  left: 100%;
}

.social-icon:hover {
  transform: scale(1.1) rotate(5deg);
  box-shadow: 0 0 30px rgba(0, 255, 255, 0.6), 0 0 60px rgba(0, 255, 255, 0.3);
  border-color: #ff00ff;
}

.social-icon i {
  font-size: 24px;
  color: #00ffff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: all 0.3s ease;
  text-shadow: 0 0 10px #00ffff;
}

.social-icon:hover i {
  color: #ff00ff;
  text-shadow: 0 0 15px #ff00ff, 0 0 30px #ff00ff;
  transform: translate(-50%, -50%) scale(1.2);
}

/* Specific colors for each platform */
.social-icon.instagram:hover {
  border-color: #e4405f;
  box-shadow: 0 0 30px rgba(228, 64, 95, 0.6), 0 0 60px rgba(228, 64, 95, 0.3);
}

.social-icon.instagram:hover i {
  color: #e4405f;
  text-shadow: 0 0 15px #e4405f, 0 0 30px #e4405f;
}

.social-icon.facebook:hover {
  border-color: #1877f2;
  box-shadow: 0 0 30px rgba(24, 119, 242, 0.6), 0 0 60px rgba(24, 119, 242, 0.3);
}

.social-icon.facebook:hover i {
  color: #1877f2;
  text-shadow: 0 0 15px #1877f2, 0 0 30px #1877f2;
}

.social-icon.tiktok:hover {
  border-color: #000000;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.8), 0 0 60px rgba(0, 0, 0, 0.5);
}

.social-icon.tiktok:hover i {
  color: #ffffff;
  text-shadow: 0 0 15px #ffffff, 0 0 30px #ffffff;
}

.footer-social p {
  color: #cccccc;
  font-size: 0.9rem;
  margin: 0;
  text-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
}

/* Responsive Design */
@media (max-width: 768px) {
  .social-icons {
    gap: 20px;
  }

  .social-icon {
    width: 50px;
    height: 50px;
  }

  .social-icon i {
    font-size: 20px;
  }

  .social-container h3 {
    font-size: 1.5rem;
  }
}

@media (max-width: 480px) {
  .social-icons {
    gap: 15px;
  }

  .social-icon {
    width: 45px;
    height: 45px;
  }

  .social-icon i {
    font-size: 18px;
  }
}