/* Custom Animations */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 20px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translate3d(50px, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInLeft {
    from {
        transform: translate3d(-50px, 0, 0);
        opacity: 0;
    }
    to {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

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

.animate-fadeIn {
    animation-name: fadeIn;
}

.animate-fadeInUp {
    animation-name: fadeInUp;
}

.animate-fadeInRight {
    animation-name: fadeInRight;
}

.animate-slideInLeft {
    animation-name: slideInLeft;
}

.animate-float {
    animation-name: float;
}


  /* Base Animation Keyframes */
  @keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideInUp {
    from {
        transform: translate3d(0, 30px, 0);
        opacity: 0;
    }
    to {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

@keyframes slideInRight {
    from {
        transform: translate3d(100px, 0, 0);
        opacity: 0;
    }
    to {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

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

/* Specialized Animation Keyframes */
@keyframes float-slow {
    0% { transform: translateY(0px) translateX(0px); }
    25% { transform: translateY(10px) translateX(5px); }
    50% { transform: translateY(0px) translateX(10px); }
    75% { transform: translateY(-10px) translateX(5px); }
    100% { transform: translateY(0px) translateX(0px); }
}

@keyframes highlight {
    0% { text-shadow: 0 0 0 rgba(255, 149, 53, 0); }
    25% { text-shadow: 0 0 10px rgba(255, 149, 53, 0.7); }
    50% { text-shadow: 0 0 20px rgba(255, 149, 53, 0.5); }
    75% { text-shadow: 0 0 10px rgba(255, 149, 53, 0.7); }
    100% { text-shadow: 0 0 0 rgba(255, 149, 53, 0); }
}
@keyframes highlight-blue {
    0% { text-shadow: 0 0 0 rgba(255, 149, 53, 0); }
    25% { text-shadow: 0 0 10px rgba(18, 100, 177, 0.7); }
    50% { text-shadow: 0 0 20px rgba(20, 86, 185, 0.5); }
    75% { text-shadow: 0 0 10px rgba(18, 100, 177, 0.7); }
    100% { text-shadow: 0 0 0 rgba(255, 149, 53, 0); }
}
@keyframes highlight-white {
    0% { text-shadow: 0 0 0 rgba(255, 149, 53, 0); }
    25% { text-shadow: 0 0 10px rgba(255, 255, 255, 0.7); }
    50% { text-shadow: 0 0 10px rgba(255, 255, 255, 0.3); }
    75% { text-shadow: 0 0 10px rgba(255, 255, 255, 0.7); }
    100% { text-shadow: 0 0 0 rgba(255, 149, 53, 0); }
}

@keyframes pulse-subtle {
    0% { box-shadow: 0 0 0 0 rgba(255, 149, 53, 0.4); }
    70% { box-shadow: 0 0 0 10px rgba(255, 149, 53, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 149, 53, 0); }
}

@keyframes shadow-pulse {
    0% { transform: translateY(0) scale(1) translateX(-50%); opacity: 0.1; }
    50% { transform: translateY(5px) scale(1.05) translateX(-50%); opacity: 0.15; }
    100% { transform: translateY(0) scale(1) translateX(-50%); opacity: 0.1; }
}

@keyframes rayRotate {
    0% { transform: rotate(0deg); opacity: 0.3; }
    50% { opacity: 0.6; }
    100% { transform: rotate(360deg); opacity: 0.3; }
}

@keyframes glint {
    0% { transform: translateX(-100%) translateY(-100%); }
    100% { transform: translateX(100%) translateY(100%); }
}

/* Animation Classes */
.animate-fadeIn { animation-name: fadeIn; }
.animate-slideInUp { animation-name: slideInUp; }
.animate-slideInRight { animation-name: slideInRight; }
.animate-float { animation-name: float; }
.animate-float-slow { animation-name: float-slow; animation-duration: 15s; animation-timing-function: ease-in-out; animation-iteration-count: infinite; }
.animate-highlight { animation-name: highlight; animation-duration: 4s; animation-iteration-count: infinite; }
.hover\:animate-pulse-subtle:hover,
.animate-pulse-subtle { animation-name: pulse-subtle; animation-duration: 1.5s; animation-iteration-count: 4; }
.animate-shadow-pulse { animation-name: shadow-pulse; }
.animate-rayRotate { animation-name: rayRotate; animation-duration: 30s; animation-timing-function: linear; animation-iteration-count: infinite; }
.animate-glint { animation-name: glint; }

/* Custom hover effect for button */
.hover\:shadow-glow:hover {
    box-shadow: 0 0 15px 5px rgba(255, 149, 53, 0.5);
}

  /* Base Animations */
  @keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 50px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInDown {
    from {
        opacity: 0;
        transform: translate3d(0, -30px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes float-slow {
    0% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(15px, 15px) rotate(5deg); }
    50% { transform: translate(0, 25px) rotate(0deg); }
    75% { transform: translate(-15px, 15px) rotate(-5deg); }
    100% { transform: translate(0, 0) rotate(0deg); }
}

@keyframes highlight {
    0% { text-shadow: 0 0 0 rgba(255, 149, 53, 0); }
    25% { text-shadow: 0 0 10px rgba(255, 149, 53, 0.7); }
    50% { text-shadow: 0 0 20px rgba(255, 149, 53, 0.5); }
    75% { text-shadow: 0 0 10px rgba(255, 149, 53, 0.7); }
    100% { text-shadow: 0 0 0 rgba(255, 149, 53, 0); }
}

/* Animation Classes */
.animate-fadeIn {
    animation-name: fadeIn;
    animation-fill-mode: both;
}

.animate-fadeInUp {
    animation-name: fadeInUp;
    animation-duration: 0.8s;
    animation-fill-mode: both;
}

.animate-slideInDown {
    animation-name: slideInDown;
    animation-fill-mode: both;
}

.animate-float-slow {
    animation-name: float-slow;
    animation-duration: 20s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    opacity: 0.5;
}

.animate-highlight {
    animation-name: highlight;
    animation-duration: 4s;
    animation-iteration-count: infinite;
}
.animate-highlight-blue {
    animation-name: highlight-blue;
    animation-duration: 4s;
    animation-iteration-count: infinite;
}
.animate-highlight-white {
    animation-name: highlight-white;
    animation-duration: 3s;
    animation-iteration-count: infinite;
}

/* Card hover effects */
.card {
    position: relative;
    transition: all 0.3s ease;
}

.card::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 5%;
    width: 90%;
    height: 20px;
    background: radial-gradient(ellipse at center, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0) 70%);
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: -1;
    filter: blur(5px);
}

.card:hover::after {
    opacity: 0.5;
}


/* Animation keyframes */
@keyframes fadeInDown {
    from {
      opacity: 0;
      transform: translate3d(0, -30px, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }

  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translate3d(0, 30px, 0);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0);
    }
  }

  @keyframes highlight {
    0% { text-shadow: 0 0 0 rgba(255, 149, 53, 0); }
    25% { text-shadow: 0 0 10px rgba(255, 149, 53, 0.7); }
    50% { text-shadow: 0 0 20px rgba(255, 149, 53, 0.5); }
    75% { text-shadow: 0 0 10px rgba(255, 149, 53, 0.7); }
    100% { text-shadow: 0 0 0 rgba(255, 149, 53, 0); }
  }

  @keyframes pulse-subtle {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 149, 53, 0.4); }
    50% { transform: scale(1.05); box-shadow: 0 0 20px 0 rgba(255, 149, 53, 0.6); }
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 149, 53, 0.4); }
  }

  /* Animation classes */
  .animate-fadeInDown {
    animation-name: fadeInDown;
    animation-fill-mode: both;
  }

  .animate-fadeInUp {
    animation-name: fadeInUp;
    animation-fill-mode: both;
  }

  .animate-highlight {
    animation-name: highlight;
    animation-iteration-count: infinite;
  }

  .animate-pulse {
    animation-name: pulse;
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
  }

  /* Card styles */
  .container {
    border-radius: 12px;
    transition: all 0.3s ease;
  }
  
     /* Animation classes */
     .fade-in {
        animation: fadeIn 1.5s ease-in-out forwards;
    }
    
    .float {
        animation: float 3s ease-in-out infinite;
    }
    
    .pulse {
        animation: pulse 2s ease-in-out infinite;
    }
    
    .scale-in {
        animation: scaleIn 1s ease-out forwards;
    }
    
    .rotate-in {
        animation: rotateIn 1.2s ease-out forwards;
    }
    
    /* Animation keyframes */
    @keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }
    
    @keyframes float {
        0% { transform: translateY(0); }
        50% { transform: translateY(-8px); }
        100% { transform: translateY(0); }
    }
    
    @keyframes pulse {
        0% { transform: scale(1); }
        50% { transform: scale(1.05); }
        100% { transform: scale(1); }
    }
    
    @keyframes scaleIn {
        from { transform: scale(0); opacity: 0; }
        to { transform: scale(1); opacity: 1; }
    }
    
    @keyframes rotateIn {
        from { transform: rotate(-15deg) scale(0.8); opacity: 0; }
        to { transform: rotate(0) scale(1); opacity: 1; }
    }