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

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

    @keyframes slideInRight {
      from { opacity: 0; transform: translateX(50px); }
      to { opacity: 1; transform: translateX(0); }
    }

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

    @keyframes pulse {
      0%, 100% { opacity: 1; }
      50% { opacity: 0.8; }
    }

    @keyframes shimmer {
      0% { background-position: -1000px 0; }
      100% { background-position: 1000px 0; }
    }

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

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

    @keyframes scaleIn {
      from { opacity: 0; transform: scale(0.9); }
      to { opacity: 1; transform: scale(1); }
    }

    .animate-fade-in { animation: fadeIn 0.8s ease-out; }
    .animate-slide-in-left { animation: slideInLeft 0.8s ease-out; }
    .animate-slide-in-right { animation: slideInRight 0.8s ease-out; }
    .animate-float { animation: float 4s ease-in-out infinite; }
    .animate-pulse-custom { animation: pulse 3s ease-in-out infinite; }
    .animate-shimmer { animation: shimmer 3s infinite linear; }
    .animate-scale-in { animation: scaleIn 0.6s ease-out; }

    .glass-effect {
      background: rgba(255, 255, 255, 0.12);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border: 1px solid rgba(255, 255, 255, 0.25);
      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
    }

    .glass-effect-strong {
      background: rgba(255, 255, 255, 0.18);
      backdrop-filter: blur(25px);
      -webkit-backdrop-filter: blur(25px);
      border: 1px solid rgba(255, 255, 255, 0.3);
      box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
    }

    .gradient-bg {
      background: linear-gradient(135deg, #1e3c72 0%, #2a5298 25%, #1e3c72 50%, #2a5298 75%, #1e3c72 100%);
      background-size: 400% 400%;
      animation: gradientShift 8s ease infinite;
    }

    .transition-all-smooth {
      transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .shimmer-text {
      background: linear-gradient(90deg, #ffffff 20%, rgba(255,255,255,0.6) 50%, #ffffff 80%);
      background-size: 200% 100%;
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      animation: shimmer 3s infinite;
    }

    #vanta-bg {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: -1;
    }

    .logo-container {
      background: rgba(255, 255, 255, 0.95);
      padding: 0.6rem;
      border-radius: 16px;
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
      backdrop-filter: blur(10px);
      transition: all 0.3s ease;
    }

    .logo-container:hover {
      transform: translateY(-2px);
      box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
    }

    .mobile-menu {
      transform: translateX(100%);
      transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .mobile-menu.active {
      transform: translateX(0);
    }

    body {
      overflow-x: hidden !important;
    }

    .mobile-menu-overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100vh;
      background: rgba(0, 0, 0, 0.6);
      backdrop-filter: blur(4px);
      z-index: 40;
      opacity: 0;
      visibility: hidden;
      transition: all 0.3s ease-in-out;
    }

    .mobile-menu-overlay.active {
      opacity: 1;
      visibility: visible;
    }

    .hamburger-line {
      width: 28px;
      height: 3px;
      background: white;
      border-radius: 2px;
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      transform-origin: center;
    }

    .hamburger.active .line1 {
      transform: rotate(45deg) translate(7px, 7px);
    }

    .hamburger.active .line2 {
      opacity: 0;
      transform: translateX(10px);
    }

    .hamburger.active .line3 {
      transform: rotate(-45deg) translate(7px, -7px);
    }

    .mobile-menu-item {
      animation: slideDown 0.3s ease-out;
    }

    .nav-link {
      position: relative;
      overflow: hidden;
    }

    .nav-link::before {
      content: '';
      position: absolute;
      top: 0;
      left: -100%;
      width: 100%;
      height: 100%;
      background: rgba(255, 255, 255, 0.1);
      transition: left 0.3s ease;
    }

    .nav-link:hover::before {
      left: 100%;
    }

    .content-card {
      background: rgba(255, 255, 255, 0.15);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border: 1px solid rgba(255, 255, 255, 0.25);
      border-radius: 24px;
      box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
      transition: all 0.4s ease;
    }

    .content-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 16px 50px rgba(0, 0, 0, 0.2);
      border-color: rgba(255, 255, 255, 0.35);
    }

    .logo-glow {
      filter: drop-shadow(0 10px 30px rgba(255, 255, 255, 0.3));
      transition: all 0.4s ease;
    }

    .logo-glow:hover {
      filter: drop-shadow(0 15px 40px rgba(255, 255, 255, 0.4));
    }

    /* Enhanced scrollbar */
    ::-webkit-scrollbar {
      width: 10px;
    }

    ::-webkit-scrollbar-track {
      background: rgba(255, 255, 255, 0.05);
    }

    ::-webkit-scrollbar-thumb {
      background: rgba(255, 255, 255, 0.3);
      border-radius: 5px;
    }

    ::-webkit-scrollbar-thumb:hover {
      background: rgba(255, 255, 255, 0.5);
    }

    /* Mobile improvements */
    @media (max-width: 768px) {
      .mobile-menu {
        width: min(320px, 85vw);
      }
    }

    /* Navbar shadow on scroll */
    .navbar-scrolled {
      box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
    }