/*
  Kyronix Solutions - Animations Stylesheet
*/

/* Floating animation for icons/cards */
@keyframes float {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0px);
  }
}

.animate-float {
  animation: float 6s ease-in-out infinite;
}

.animate-float-delayed {
  animation: float 6s ease-in-out infinite;
  animation-delay: 2s;
}

/* Pulsing background glow */
@keyframes pulseGlow {
  0% {
    opacity: 0.6;
    transform: scale(1) translate(0px, 0px);
  }
  50% {
    opacity: 0.8;
    transform: scale(1.1) translate(10px, -10px);
  }
  100% {
    opacity: 0.6;
    transform: scale(1) translate(0px, 0px);
  }
}

.pulse-glow-1 {
  animation: pulseGlow 12s ease-in-out infinite;
}

.pulse-glow-2 {
  animation: pulseGlow 15s ease-in-out infinite;
  animation-delay: 3s;
}

/* Glowing border effect on hover */
.glow-border-hover {
  position: relative;
}

.glow-border-hover::after {
  content: '';
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
  border-radius: inherit;
  background: linear-gradient(135deg, var(--accent-cyan), var(--primary-blue), var(--primary-indigo));
  z-index: -2;
  opacity: 0;
  transition: var(--transition-smooth);
}

.glow-border-hover:hover::after {
  opacity: 1;
}

/* Card hover accessibility readability overrides */
.glow-border-hover:hover {
  color: var(--text-white) !important;
  transform: translateY(-8px);
}

.glow-border-hover:hover .text-muted,
.glow-border-hover:hover p,
.glow-border-hover:hover .card-text {
  color: rgba(255, 255, 255, 0.8) !important;
}

.glow-border-hover:hover h1,
.glow-border-hover:hover h2,
.glow-border-hover:hover h3,
.glow-border-hover:hover h4,
.glow-border-hover:hover h5,
.glow-border-hover:hover h6,
.glow-border-hover:hover .card-title,
.glow-border-hover:hover .font-bold {
  color: var(--text-white) !important;
}

.glow-border-hover:hover a,
.glow-border-hover:hover .text-cyan {
  color: var(--accent-sky) !important;
}

.glow-border-hover:hover .mega-menu-icon {
  background: var(--text-white) !important;
  color: var(--primary-blue) !important;
  box-shadow: 0 0 15px rgba(255, 255, 255, 0.4);
}

/* Card image reveal */
.img-reveal-wrapper {
  position: relative;
  overflow: hidden;
}

.img-reveal-wrapper::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--primary-blue);
  transform: translateX(-100%);
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.img-reveal-wrapper.active::after {
  transform: translateX(101%);
}

/* Shimmer load placeholder effect */
@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

.shimmer-placeholder {
  background: linear-gradient(90deg, rgba(15,23,42,0.03) 25%, rgba(15,23,42,0.08) 50%, rgba(15,23,42,0.03) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}

/* Page transitions */
.page-transition-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--bg-primary);
  z-index: 9999;
  transform: translateY(0);
  transition: transform 0.8s var(--ease-out-smooth);
}

.page-transition-overlay.loaded {
  transform: translateY(-100%);
  pointer-events: none;
}

/* Opening Preloader animation */
.preloader-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--bg-primary);
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.8s var(--ease-out-smooth);
}

.preloader-wrapper.fade-out {
  transform: translateY(-100%);
  pointer-events: none;
}

.preloader-content {
  width: 320px;
  max-width: 90%;
  text-align: center;
}

.preloader-logo {
  opacity: 0;
  transform: scale(0.85);
  animation: fadeInPreloaderLogo 1s forwards cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes fadeInPreloaderLogo {
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.preloader-bar {
  width: 180px;
  height: 2px;
  background: rgba(15, 23, 42, 0.08);
  margin: 25px auto 0;
  position: relative;
  overflow: hidden;
  border-radius: 2px;
}

.preloader-bar::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 40%;
  background: linear-gradient(90deg, transparent, var(--accent-cyan), transparent);
  animation: preloaderTrack 1.5s infinite ease-in-out;
}

@keyframes preloaderTrack {
  0% { left: -40%; }
  100% { left: 100%; }
}
