/* UI Enhancements - Custom cursor, morphing shapes, and interactive elements */

/* Custom Cursor */
.custom-cursor {
  position: fixed;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: rgba(52, 152, 219, 0.5);
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  transition: width 0.3s, height 0.3s, background-color 0.3s;
  mix-blend-mode: difference;
}

.cursor-trail {
  position: fixed;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: rgba(52, 152, 219, 0.3);
  pointer-events: none;
  z-index: 9998;
  transform: translate(-50%, -50%);
}

/* Interactive elements cursor state */
a:hover ~ .custom-cursor,
button:hover ~ .custom-cursor,
.service-card:hover ~ .custom-cursor,
.team-member:hover ~ .custom-cursor {
  width: 40px;
  height: 40px;
  background-color: rgba(231, 76, 60, 0.5);
}

/* Morphing Shape Backgrounds */
.morphing-shape {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  opacity: 0.1;
}

.morphing-shape path {
  animation: morphing 15s ease-in-out infinite alternate;
}

@keyframes morphing {
  0% {
    d: path("M0,192L48,202.7C96,213,192,235,288,229.3C384,224,480,192,576,165.3C672,139,768,117,864,144C960,171,1056,245,1152,245.3C1248,245,1344,171,1392,133.3L1440,96L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z");
  }
  25% {
    d: path("M0,96L48,122.7C96,149,192,203,288,213.3C384,224,480,192,576,160C672,128,768,96,864,106.7C960,117,1056,171,1152,197.3C1248,224,1344,224,1392,224L1440,224L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z");
  }
  50% {
    d: path("M0,160L48,149.3C96,139,192,117,288,128C384,139,480,181,576,213.3C672,245,768,267,864,266.7C960,267,1056,245,1152,224C1248,203,1344,181,1392,170.7L1440,160L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z");
  }
  75% {
    d: path("M0,64L48,85.3C96,107,192,149,288,154.7C384,160,480,128,576,133.3C672,139,768,181,864,186.7C960,192,1056,160,1152,154.7C1248,149,1344,171,1392,181.3L1440,192L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z");
  }
  100% {
    d: path("M0,224L48,213.3C96,203,192,181,288,154.7C384,128,480,96,576,85.3C672,75,768,85,864,122.7C960,160,1056,224,1152,245.3C1248,267,1344,245,1392,234.7L1440,224L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z");
  }
}

/* Scroll-Triggered 3D Transformations */
.reveal-3d {
  opacity: 0;
  transform: perspective(1000px) rotateX(10deg);
  transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.reveal-3d.active {
  opacity: 1;
  transform: perspective(1000px) rotateX(0);
}

/* Micro-interactions */
.btn {
  position: relative;
  overflow: hidden;
}

/* Ripple effect removed */
.btn {
  position: relative;
  overflow: hidden;
}

/* Text Effects */
.gradient-text {
  background: linear-gradient(45deg, var(--primary-color), var(--accent-color), var(--primary-light), var(--accent-light));
  background-size: 300% 300%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: gradient-shift 8s ease infinite;
}

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

/* Glassmorphism with Depth */
.glass-card {
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

html[data-theme="dark"] .glass-card {
  background: rgba(30, 30, 30, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Animated SVG Icons */
.animated-icon {
  transition: transform 0.3s ease;
}

.animated-icon:hover {
  transform: scale(1.2);
}

.service-icon:hover i {
  animation: icon-bounce 0.5s ease infinite alternate;
}

@keyframes icon-bounce {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-10px);
  }
}

/* Parallax Depth Mapping */
.parallax-layer {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.parallax-layer-1 {
  transform: translateZ(-100px) scale(1.5);
}

.parallax-layer-2 {
  transform: translateZ(-50px) scale(1.25);
}

.parallax-layer-3 {
  transform: translateZ(0) scale(1);
}

/* Split Screen Transitions - Removed */

/* Media Queries */
@media (max-width: 768px) {
  .custom-cursor, .cursor-trail {
    display: none;
  }
}
