@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

 html {
     scroll-behavior: smooth;
 }

 body {
     font-family: 'Poppins', sans-serif;
 }

 .section-comment {
     @apply bg-lightblue text-accent p-2 rounded-md text-xs font-mono mb-4;
 }

 .neon-text {
     text-shadow: 0 0 10px rgba(57, 255, 20, 0.7);
 }

 .neon-border {
     box-shadow: 0 0 10px rgba(57, 255, 20, 0.3);
 }

 .card {
     transition: all 0.3s ease;
 }

 .card:hover {
     transform: translateY(-10px);
 }

 .grid-pattern {
     background-image: linear-gradient(rgba(100, 255, 218, 0.05) 1px, transparent 1px),
         linear-gradient(90deg, rgba(100, 255, 218, 0.05) 1px, transparent 1px);
     background-size: 20px 20px;
 }

 .team-member:hover .member-overlay {
     opacity: 1;
 }

 .project-card:hover .project-overlay {
     opacity: 0;
 }

 .navbar {
     backdrop-filter: blur(10px);
     -webkit-backdrop-filter: blur(10px);
 }

 .animated-bg {
     background: linear-gradient(-45deg, #0A192F, #172A46, #0A192F, #172A46);
     background-size: 400% 400%;
     animation: gradient 15s ease infinite;
 }

 @keyframes gradient {
     0% {
         background-position: 0% 50%;
     }

     50% {
         background-position: 100% 50%;
     }

     100% {
         background-position: 0% 50%;
     }
 }