/* ==============================================
   एनिमेशन
   ============================================== */
/*@keyframes fadeInUp {*/
/*    from { opacity: 0; transform: translateY(25px); }*/
/*    to { opacity: 1; transform: translateY(0); }*/
/*}*/

/*.animate-fade-in-up {*/
    opacity: 0; /* शुरू में अदृश्य */
/*    animation: fadeInUp 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;*/
/*    animation-delay: 0.2s;*/
/*}*/
/*.hero-title.animate-fade-in-up {*/
/*    animation-delay: 0.1s;*/
/*}*/
/*.hero-subtitle.animate-fade-in-up {*/
/*    animation-delay: 0.3s;*/
/*}*/
/*.reveal {*/
/*  opacity: 0;*/
/*  transform: translateY(30px);*/
/*  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);*/
/*  transition-delay: 0.1s;*/
/*}*/
/*.reveal.active {*/
/*  opacity: 1;*/
/*  transform: translateY(0);*/
/*}*/




@tailwind base;
@tailwind components;
@tailwind utilities;

 ================== Animations ================== 

 Gradient Background Animation 
@keyframes gradient-move {
    0%   { transform: translate(-50%, -50%) rotate(0deg); }
    25%  { transform: translate(-45%, -55%) rotate(90deg); }
    50%  { transform: translate(-55%, -45%) rotate(180deg); }
    75%  { transform: translate(-50%, -50%) rotate(270deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

 Page Load Animations 
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

.animate-fade-in {
    animation: fadeIn 1s ease forwards;
}
.animate-fade-in-up {
    opacity: 0;
    animation: fadeInUp 0.8s ease 0.3s forwards;
}

 Scroll Reveal Animation 
.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
  transition-delay: 0.1s;
}

.reveal.active {
  opacity: 1;
  transform: translateY(0);
}