body {
  font-family: 'Baloo Bhaijaan 2', sans-serif;
  background-color: #f9faf9;
  color: #131313;
  margin: 0;
  overflow-x: hidden;
}
@media (max-width: 768px) {
  ::-webkit-scrollbar { display: none; }
  body { -ms-overflow-style: none; scrollbar-width: none; }
}
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-thumb { background: #78716c; border-radius: 10px; }
html { scroll-behavior: smooth; }

@keyframes draw-top { 0% { width: 0; left: 0; } 100% { width: 100%; left: 0; } }
@keyframes draw-right { 0% { height: 0; top: 0; } 100% { height: 100%; top: 0; } }
@keyframes draw-bottom { 0% { width: 0; right: 0; } 100% { width: 100%; right: 0; } }
@keyframes draw-left { 0% { height: 0; bottom: 0; } 100% { height: 100%; bottom: 0; } }
@keyframes scan { 0% { transform: translateY(-100px); opacity: 0; } 50% { opacity: 1; } 100% { transform: translateY(100px); opacity: 0; } }
@keyframes loader-progress { from { width: 0%; } to { width: 100%; } }

.animate-draw-top { animation: draw-top 1.5s ease-in-out infinite alternate; }
.animate-draw-right { animation: draw-right 1.5s ease-in-out infinite alternate; }
.animate-draw-bottom { animation: draw-bottom 1.5s ease-in-out infinite alternate; }
.animate-draw-left { animation: draw-left 1.5s ease-in-out infinite alternate; }
.animate-scan { animation: scan 2s ease-in-out infinite; }
.animate-loader-progress { animation: loader-progress 3s linear forwards; }