/* ==========================================================================
   DRA. ANDREZA RODRIGUES - MICRO ANIMATIONS & VISUAL EFFECTS
   ========================================================================== */

/* Floating Ambient Glow Animation */
@keyframes floatAmbient {
  0% {
    transform: translate(-50%, 0%) scale(1);
    opacity: 0.5;
  }
  50% {
    transform: translate(-45%, 15px) scale(1.1);
    opacity: 0.7;
  }
  100% {
    transform: translate(-55%, -10px) scale(0.95);
    opacity: 0.45;
  }
}

/* Float Animation for Hero Composition Elements */
@keyframes softFloat {
  0%, 100% {
    transform: rotate(-8deg) translateX(12px) translateY(0px);
  }
  50% {
    transform: rotate(-7.5deg) translateX(12px) translateY(-7px);
  }
}

@keyframes softFloatRight {
  0%, 100% {
    transform: rotate(8deg) translateX(-12px) translateY(0px);
  }
  50% {
    transform: rotate(8.5deg) translateX(-12px) translateY(-9px);
  }
}

.photo-left {
  animation: softFloat 6s ease-in-out infinite;
}

.photo-right {
  animation: softFloatRight 7s ease-in-out infinite 0.5s;
}

/* Liquid Shimmer Effect for CTA Buttons */
@keyframes shimmerLiquid {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

.btn-shimmer {
  background: linear-gradient(
    90deg,
    #8C5C5C 0%,
    #A87777 25%,
    #DCC9C2 50%,
    #A87777 75%,
    #8C5C5C 100%
  );
  background-size: 200% 100%;
  animation: shimmerLiquid 4s infinite linear;
}

/* Ripple Touch Effect */
.ripple {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.4);
  transform: scale(0);
  animation: rippleEffect 0.6s linear;
  pointer-events: none;
}

@keyframes rippleEffect {
  to {
    transform: scale(4);
    opacity: 0;
  }
}

/* Blur Reveal Keyframes */
@keyframes blurReveal {
  from {
    filter: blur(12px);
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    filter: blur(0);
    opacity: 1;
    transform: translateY(0);
  }
}

.blur-reveal {
  animation: blurReveal 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Soft Glow Pulse */
@keyframes glowPulse {
  0%, 100% {
    box-shadow: 0 10px 28px rgba(140, 92, 92, 0.3);
  }
  50% {
    box-shadow: 0 14px 36px rgba(140, 92, 92, 0.5);
  }
}

.hub-card-primary {
  animation: glowPulse 3s ease-in-out infinite;
}

/* Magnet Hover Smoothing */
.magnetic-element {
  transition: transform 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}