 @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;800&display=swap');

        body {
            font-family: 'Inter', sans-serif;
            background-color: #0a0a0a;
            color: #ededed;
            overflow-x: hidden;
        }

        /* Efeito de brilho que segue o mouse */
        #mouse-glow {
            width: 600px;
            height: 600px;
            background: radial-gradient(circle, rgba(99, 102, 241, 0.15) 0%, rgba(0,0,0,0) 70%);
            position: fixed;
            top: 0;
            left: 0;
            pointer-events: none;
            z-index: 0;
            transform: translate(-50%, -50%);
            transition: opacity 0.3s;
        }

        .glass-card {
            background: rgba(23, 23, 23, 0.8);
            backdrop-filter: blur(12px);
            border: 1px solid rgba(255, 255, 255, 0.1);
            transition: all 0.3s ease;
        }

        .glass-card:hover {
            border-color: rgba(99, 102, 241, 0.5);
            transform: translateY(-5px);
            box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.5);
        }

        .gradient-text {
            background: linear-gradient(90deg, #818cf8, #c084fc);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        /* Animação suave de fade-in */
        .reveal {
            opacity: 0;
            transform: translateY(20px);
            transition: all 0.6s ease-out;
        }

        .reveal.active {
            opacity: 1;
            transform: translateY(0);
        }

        .projeto1{
            display:absolute;
            background-image:url(img/Riberio-fishing.png);
            background-position: center;
            background-size: cover;
            background-repeat: no-repeat;
            background-position-y: top;
        }

        .projeto2{
            display:absolute;
            background-image:url(img/em-breve.png);
            background-position: center;
            background-size: cover;
            background-repeat: no-repeat;
            
        }

        .projeto3{
            display:absolute;
            background-image:url(img/em-breve.png);
            background-position: center;
            background-size: cover;
            background-repeat: no-repeat;
            
        }