/* Enhanced Scroll Animations - Maman Corp Inspired */

/* Scroll Progress Bar */
.scroll-progress-bar {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  background: linear-gradient(90deg, #1a365d, #87ceeb);
  z-index: 9999;
  transition: width 0.2s ease-out;
}

/* Base animation states - opacity only to prevent CLS */
.fade-up,
.fade-in,
.slide-left,
.slide-right,
.scale-in {
  opacity: 0;
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Animated state */
.fade-up.animate-in,
.fade-in.animate-in,
.slide-left.animate-in,
.slide-right.animate-in,
.scale-in.animate-in {
  opacity: 1;
}

/* Stagger delay utilities */
.delay-100 { animation-delay: 100ms !important; }
.delay-200 { animation-delay: 200ms !important; }
.delay-300 { animation-delay: 300ms !important; }
.delay-400 { animation-delay: 400ms !important; }
.delay-500 { animation-delay: 500ms !important; }

/* Text reveal animation */
.reveal-text {
  opacity: 0;
}

.char-reveal {
  display: inline-block;
  opacity: 0;
  animation: charFadeIn 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes charFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Sophisticated hover effects */
.hover-lift {
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.hover-lift:hover {
  transform: translateY(-8px);
}

.hover-scale {
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.hover-scale:hover {
  transform: scale(1.05);
}

/* Smooth underline effect */
.underline-effect {
  position: relative;
  display: inline-block;
}

.underline-effect::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 0;
  height: 2px;
  background: linear-gradient(90deg, #1a365d, #87ceeb);
  transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.underline-effect:hover::after {
  width: 100%;
}

/* Gradient text animation */
.gradient-text {
  background: linear-gradient(135deg, #1a365d, #4a90a4, #87ceeb);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: gradientShift 3s ease infinite;
}

@keyframes gradientShift {
  0%, 100% {
    background-position: 0% center;
  }
  50% {
    background-position: 100% center;
  }
}

/* Pulse animation for CTAs */
.pulse-cta {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
}

/* Floating animation */
.float {
  animation: float 6s ease-in-out infinite;
}

@keyframes float {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-20px);
  }
}

/* Shimmer effect */
.shimmer {
  position: relative;
  overflow: hidden;
}

.shimmer::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
  animation: shimmer 3s infinite;
}

@keyframes shimmer {
  to {
    left: 100%;
  }
}

/* Line draw animation */
.draw-line {
  position: relative;
}

.draw-line::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, #1a365d, #87ceeb);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.draw-line.animate-in::after {
  transform: scaleX(1);
}

/* Counter animation placeholder */
.counter-number {
  font-variant-numeric: tabular-nums;
}

/* Image lazy load effect */
img[data-src] {
  opacity: 0;
  transition: opacity 0.6s ease;
}

img[data-src].loaded {
  opacity: 1;
}

/* Sophisticated card entrance */
.card-entrance {
  opacity: 0;
  transform: translateY(40px) scale(0.95);
  transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-entrance.animate-in {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* Parallax container */
.parallax-container {
  position: relative;
  overflow: hidden;
}

.parallax-bg {
  will-change: transform;
}

/* Smooth fade in for sections */
.section-reveal {
  opacity: 0;
  transform: translateY(60px);
  transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.section-reveal.animate-in {
  opacity: 1;
  transform: translateY(0);
}

/* Number counter styles */
.stat-counter {
  font-family: 'Playfair Display', serif;
  font-size: 3.5rem;
  font-weight: 700;
  color: #1a365d;
  line-height: 1;
}

/* Process step animation */
.process-step {
  opacity: 0;
  transform: scale(0.9);
  transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.process-step.animate-in {
  opacity: 1;
  transform: scale(1);
}

/* Smooth entrance for nav items */
.nav__item {
  opacity: 0;
  transform: translateY(-10px);
  animation: navItemFadeIn 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes navItemFadeIn {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Button ripple effect */
.ripple-effect {
  position: relative;
  overflow: hidden;
}

.ripple-effect::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.5);
  transform: translate(-50%, -50%);
  transition: width 0.6s, height 0.6s;
}

.ripple-effect:active::after {
  width: 300px;
  height: 300px;
}

/* Scroll indicator */
.scroll-indicator {
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  animation: scrollBounce 2s infinite;
}

@keyframes scrollBounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateX(-50%) translateY(0);
  }
  40% {
    transform: translateX(-50%) translateY(-20px);
  }
  60% {
    transform: translateX(-50%) translateY(-10px);
  }
}

/* Testimonial card slide */
.testimonial-slide {
  opacity: 0;
  transform: translateX(-30px);
  transition: all 0.7s cubic-bezier(0.4, 0, 0.2, 1);
}

.testimonial-slide.animate-in {
  opacity: 1;
  transform: translateX(0);
}

/* Enhanced project card hover */
.project-card-enhanced {
  position: relative;
  overflow: hidden;
}

.project-card-enhanced::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(26, 54, 93, 0.9), rgba(135, 206, 235, 0.9));
  opacity: 0;
  transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 1;
}

.project-card-enhanced:hover::before {
  opacity: 1;
}

/* Split text animation */
.split-text {
  display: inline-block;
}

.split-text span {
  display: inline-block;
  opacity: 0;
  transform: translateY(20px);
  animation: splitTextFade 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes splitTextFade {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Loading animation */
.loading-fade {
  animation: loadingPulse 1.5s ease-in-out infinite;
}

@keyframes loadingPulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}

/* Reveal from bottom */
.reveal-bottom {
  clip-path: inset(100% 0 0 0);
  transition: clip-path 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.reveal-bottom.animate-in {
  clip-path: inset(0 0 0 0);
}

/* Elegant border animation */
.border-animate {
  position: relative;
}

.border-animate::before,
.border-animate::after {
  content: '';
  position: absolute;
  width: 0;
  height: 2px;
  background: linear-gradient(90deg, #1a365d, #87ceeb);
  transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.border-animate::before {
  top: 0;
  left: 0;
}

.border-animate::after {
  bottom: 0;
  right: 0;
}

.border-animate:hover::before,
.border-animate:hover::after {
  width: 100%;
}