/* =========================================
   Local Fonts Setup (Ravi)
   ========================================= */
   @font-face {
    font-family: 'Ravi';
    src: url('ravi/Ravi-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Ravi';
    src: url('ravi/Ravi-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'Ravi';
    src: url('ravi/Ravi-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

/* =========================================
   Animations
   ========================================= */
@keyframes float {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(25px, -40px) scale(1.05); }
    66% { transform: translate(-15px, 20px) scale(0.95); }
}

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

@keyframes spinSlow {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes drawCircle {
    to { stroke-dashoffset: 0; }
}

.animate-float { animation: float 9s ease-in-out infinite; }
.animate-float-delayed { animation: float 9s ease-in-out 4.5s infinite; }
.fade-in { opacity: 0; animation: fadeIn 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
.delay-200 { animation-delay: 0.2s; }
.animate-spin-slow { animation: spinSlow 3s linear infinite; }
.animate-draw { animation: drawCircle 1.5s ease-out forwards; }

/* =========================================
   Decorative Sprinkles & Utilities
   ========================================= */
.sprinkle {
    position: absolute;
    width: 6px;
    height: 20px;
    border-radius: 10px;
    opacity: 0.7;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.05);
}

.dir-ltr { direction: ltr; }
.pb-safe { padding-bottom: env(safe-area-inset-bottom); }

/* Hide Number Input Arrows for Captcha */
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
input[type=number] { -moz-appearance: textfield; }