@keyframes gradient-shift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}


.footer {
  position: relative;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(16px);
  border-top: 1px solid rgba(255,255,255,0.1);
}

.copyright-text {
  background: linear-gradient(45deg, #fff, #aaa);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: gradient-shift 8s ease infinite;
  background-size: 200% 200%;
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.fusion-credit {
  position: relative;
  display: inline-block;
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.fusion-credit:hover {
  transform: translateY(-2px);
  text-shadow: 0 4px 15px rgba(255,255,255,0.3);
}

.fusion-credit::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent);
  transition: width 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.fusion-credit:hover::after {
  width: 100%;
}
.service-card {
  position: relative;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.05);
  backdrop-filter: blur(12px);
  overflow: hidden;
  transform: translateZ(0);
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.service-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(45deg, 
    rgba(255,255,255,0.1) 0%, 
    rgba(255,255,255,0.05) 50%, 
    rgba(255,255,255,0.1) 100%);
  opacity: 0.4;
  pointer-events: none;
}

.service-card:hover {
  transform: translateY(-8px) rotateX(3deg) rotateY(-2deg);
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.5);
  border-color: rgba(255,255,255,0.3);
}

.service-card:hover::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, 
    rgba(255,0,110,0.15) 0%, 
    rgba(0,204,255,0.15) 50%, 
    rgba(255,230,0,0.15) 100%);
  animation: gradient-shift 8s ease infinite;
}

@keyframes border-pulse {
  0% { border-color: rgba(255,255,255,0.3); }
  50% { border-color: rgba(100,217,255,0.6); }
  100% { border-color: rgba(255,255,255,0.3); }
}

.service-card:hover {
  animation: border-pulse 2s ease infinite,
             chromatic 0.4s ease-out;
}

@keyframes chromatic {
  0% { filter: drop-shadow(0 0 2px rgba(255,0,0,0.5)) drop-shadow(0 0 4px rgba(0,255,0,0.5)) drop-shadow(0 0 6px rgba(0,0,255,0.5)); }
  100% { filter: none; }
}
.service-card:hover::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  right: -50%;
  bottom: -50%;
  background: linear-gradient(
    to right,
    transparent 20%,
    rgba(255,255,255,0.1) 50%,
    transparent 80%
  );
  transform: rotate(30deg) translateY(-150%);
  animation: reflection 1.5s ease-in-out;
}


.footer {
  position: relative;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(16px);
  border-top: 1px solid rgba(255,255,255,0.1);
}

.copyright-text {
  background: linear-gradient(45deg, #fff, #aaa);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: gradient-shift 8s ease infinite;
  background-size: 200% 200%;
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.fusion-credit {
  position: relative;
  display: inline-block;
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.fusion-credit:hover {
  transform: translateY(-2px);
  text-shadow: 0 4px 15px rgba(255,255,255,0.3);
}

.fusion-credit::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent);
  transition: width 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.fusion-credit:hover::after {
  width: 100%;
}
@keyframes reflection {
  0% { transform: rotate(30deg) translateY(-150%); }
  100% { transform: rotate(30deg) translateY(150%); }
}