:root {
            --cursor-size: 20px;
        }
        
        body {
            background-color: #050505;
            color: #e2e8f0;
            overflow-x: hidden;
        }

        /* Custom Scrollbar */
        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: #050505; }
        ::-webkit-scrollbar-thumb { background: #333; border-radius: 4px; }
        ::-webkit-scrollbar-thumb:hover { background: #6366f1; }

        /* Glassmorphism Utilities */
        .glass {
            background: rgba(255, 255, 255, 0.03);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.05);
        }
        
        .glass-high {
            background: rgba(20, 20, 20, 0.6);
            backdrop-filter: blur(16px);
            -webkit-backdrop-filter: blur(16px);
            border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        }

        /* Particle Canvas */
        #canvas-container {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 0;
            overflow: hidden;
        }

        /* Text Glow */
        .text-glow {
            text-shadow: 0 0 20px rgba(99, 102, 241, 0.5);
        }

        /* Project Card Hover Effects */
        .project-card {
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }
        .project-card:hover {
            transform: translateY(-10px);
            border-color: rgba(99, 102, 241, 0.3);
            box-shadow: 0 20px 40px -15px rgba(99, 102, 241, 0.2);
        }

        /* Tech Icon Interaction */
        .tech-item {
            transition: all 0.3s ease;
            opacity: 0.6;
            cursor: pointer;
        }
        .tech-item.active {
            opacity: 1;
            transform: translateY(-5px);
        }
        .tech-item.active img {
            filter: drop-shadow(0 0 8px rgba(99, 102, 241, 0.8));
        }
        .tech-item.active p {
            color: #6366f1;
            font-weight: 700;
        }

        /* Loader */
        .loader {
            border-top-color: #6366f1;
            -webkit-animation: spinner 1.5s linear infinite;
            animation: spinner 1.5s linear infinite;
        }
        @keyframes spinner {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }

        /* Swiper Customization */
        .swiper-pagination-bullet {
            background: #fff;
            opacity: 0.2;
        }
        .swiper-pagination-bullet-active {
            background: #6366f1;
            opacity: 1;
          }
