﻿  
       .footer-scroll {
  position: relative; padding: 80px 20px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  color: #fff; overflow: hidden;
}

/* Aurora Background */
.footer-overlay {
  position: absolute; top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(135deg,#000428,#004e92,#0f9b8e,#1f4037,#001f3f);
  background-size: 400% 400%; animation: aurora 20s ease infinite; z-index: -3;
}
@keyframes aurora { 0%{background-position:0% 50%;} 50%{background-position:100% 50%;} 100%{background-position:0% 50%;} }

/* Light beams */
.footer-light { position:absolute; top:0; left:0; right:0; bottom:0;
  background: radial-gradient(circle at 20% 30%, rgba(0,255,255,0.2), transparent 70%),
              radial-gradient(circle at 80% 70%, rgba(255,0,255,0.2), transparent 70%);
  mix-blend-mode: screen; animation: lightmove 12s ease-in-out infinite alternate; z-index:-2; }
@keyframes lightmove { 0%{transform:translateX(-15%) translateY(-10%);} 100%{transform:translateX(15%) translateY(10%);} }

/* Particles */
.particles::before,.particles::after{
  content:""; position:absolute; top:0; left:0; right:0; bottom:0;
  background-image: radial-gradient(2px 2px at 20% 30%, white, transparent),
                    radial-gradient(3px 3px at 80% 70%, #00e6ff, transparent),
                    radial-gradient(4px 4px at 50% 50%, #ff00ff, transparent);
  background-size:200px 200px; animation:stars 50s linear infinite; z-index:-1; opacity:0.6;
}
.particles::after { animation-direction: reverse; }
@keyframes stars { from{background-position:0 0;} to{background-position:1500px 1500px;} }

/* Columns */
.footer-content-three { display:flex; flex-wrap:wrap; justify-content:center; gap:30px; margin-bottom:40px; }
.footer-column { flex:1; min-width:250px; }
.footer-column h4 { margin-top:20px; margin-bottom:10px; font-size:18px; font-weight:bold; }
.footer-column .subheading { font-size:14px; line-height:1.6; margin-bottom:15px; opacity:0.9; }
/* Indent list items under headings */
.footer-column ul {
  list-style: none;
  padding-left: 18px;  /* indent list */
  margin: 8px 0 20px 0; 
}

.footer-column li {
  display: flex;
  align-items: center;
  margin: 8px 0;
}

.footer-column li .icon { margin-right:8px; font-size:16px; color:#00e6ff; }

/* Divider */
.footer-divider { width:2px; background: linear-gradient(180deg,#00ffff,#ff00ff,#00ffff); margin:0 15px; border-radius:1px; }

/* Links hover */
.footer-column a {
  text-decoration: none;
  color: #fff;
  font-weight: normal;
  position: relative;
  padding: 4px 8px;
  border-radius: 6px;
  transition: all 0.4s ease;
}

/* Background + bold + glow on hover */
.footer-column a:hover {
  color: #000;
  font-weight:500;
  background: rgba(255,255,255,0.85);
  box-shadow: 0 0 12px rgba(0,255,255,0.6), 0 0 18px rgba(255,0,255,0.6);
}

/* Underline animation (from center to both sides) */
.footer-column a::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -3px;
  width: 0;
  height: 2px;
  background: linear-gradient(90deg, #00e6ff, #ff00ff);
  transition: width 0.4s ease, left 0.4s ease;
}
.footer-column a:hover::after {
  width: 100%;
  left: 0;
}

/* Gradient glow on icons */
/* Links hover */
/* Gradient glow on icons */
.footer-column li .icon {
  margin-right: 8px;
  font-size: 14px;
  background: linear-gradient(90deg, #00e6ff, #ff00ff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: bold;
  display: inline-block;
  transition: transform 0.3s ease, filter 0.3s ease;
}
.footer-column li:hover .icon {
  transform: rotate(180deg) scale(1.2);
  filter: drop-shadow(0 0 6px rgba(0, 230, 255, 0.8));
}



/* Footer Bottom */
.footer-bottom { font-size:14px; opacity:0.9; text-align:center; margin-top:20px; text-shadow:0 0 3px #00ffff; }
.footer-bottom .signature { display:inline-block; border-right:2px solid #fff; white-space:nowrap; overflow:hidden; width:0;
  animation:typing 6s steps(40,end) forwards, glow 2s ease-in-out infinite alternate; }
@keyframes typing { from{width:0;} to{width:100%;} }
@keyframes glow { from{text-shadow:0 0 3px #0ff;} to{text-shadow:0 0 10px #0ff,0 0 20px #0ff;} }

/* Scroll reveal */
.scroll-reveal { opacity:0; transform:translateY(40px); transition:opacity 1s ease, transform 1s ease; }
.scroll-reveal.visible { opacity:1; transform:translateY(0); }

/* Responsive */
@media(max-width:1024px){ .footer-content-three{flex-direction:column;}.footer-divider{display:none;} }

