/* Tambahkan ini agar dropdown tetap muncul saat diklik */
.dropdown-content {
    display: none;
}
.dropdown-content.show {
    display: block;
}
/* Tambahkan garis bawah pada link dan rotasi SVG */
.dropdown-active {
    border-bottom: 2px solid #29cfe1; /* Ganti warna sesuai dengan keinginan */
}
.svg-rotate {
    transform: rotate(180deg);
}

/* WEBPAGE STYLING BACKGROUND */
.neon-index {
    background-image: radial-gradient(
            circle at 0% 40%,
            rgba(41, 99, 255, 0.5),
            transparent 25%
        ),
        radial-gradient(
            circle at 110% 40%,
            rgba(41, 207, 225, 0.5),
            transparent 30%
        ),
        radial-gradient(
            circle at 50% 12%,
            rgba(93, 0, 169, 0.6),
            transparent 25%
        );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.neon-works {
    background-image: radial-gradient(
            circle at 0% 40%,
            rgba(41, 99, 255, 0.5),
            transparent 25%
        ),
        radial-gradient(
            circle at 110% 40%,
            rgba(41, 207, 225, 0.5),
            transparent 30%
        ),
        radial-gradient(
            circle at 50% 12%,
            rgba(93, 0, 169, 0.6),
            transparent 25%
        );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.neon-service {
    background-image: radial-gradient(
            circle at 2% 30%,
            rgba(93, 0, 169, 1),
            transparent 15%
        ),
        radial-gradient(
            circle at 0% 20%,
            rgba(41, 99, 255, 0.9),
            transparent 23%
        ),
        radial-gradient(
            circle at 25% -20%,
            rgba(41, 207, 225, 100%),
            transparent 40%
        );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Component styling*/

.neon-navbar {
    background-image: radial-gradient(
            circle at 50% 65%,
            rgba(93, 0, 169, 0.3),
            transparent 40%
        ),
        radial-gradient(
            circle at 100% 75%,
            rgba(41, 207, 255, 0.3),
            transparent 25%
        ),
        radial-gradient(
            circle at 100% 55%,
            rgba(41, 99, 225, 0.3),
            transparent 25%
        ),
        radial-gradient(
            circle at 0% 75%,
            rgba(41, 99, 225, 0.3),
            transparent 25%
        ),
        radial-gradient(
            circle at 0% 55%,
            rgba(41, 207, 225, 0.3),
            transparent 25%
        );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.mobile-nav-neon {
    background-image: radial-gradient(
            circle at 0% 40%,
            rgba(41, 99, 255, 0.5),
            transparent 25%
        ),
        radial-gradient(
            circle at 110% 40%,
            rgba(41, 207, 225, 0.5),
            transparent 30%
        ),
        radial-gradient(
            circle at 50% 12%,
            rgba(93, 0, 169, 0.6),
            transparent 25%
        );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.neon-card-about {
    background-image: radial-gradient(
        circle at 50% 120%,
        rgba(19, 0, 229, 0.3),
        transparent 60%
    );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.neon-card-profile {
    background-image: radial-gradient(
        circle at 50% 120%,
        rgba(55, 114, 197, 0.5),
        transparent 80%
    );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.neon-card-develop-white {
    background-image: radial-gradient(
        circle at 50% 90%,
        rgba(41, 207, 225, 0.8),
        transparent 88%
    );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.neon-card-develop-blue {
    background-image: radial-gradient(
        circle at 20% 120%,
        rgba(41, 99, 255, 1),
        transparent 85%
    );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.neon-card-develop-purple {
    background-image: radial-gradient(
        circle at 50% 90%,
        rgba(151, 71, 255, 1),
        transparent 88%
    );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.neon-card-works {
    background-image: radial-gradient(
        circle at 50% 20%,
        rgba(19, 0, 229, 1),
        transparent 60%
    );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.gradient-text {
    background: linear-gradient(90deg, #29CFE1 18%, #D100EC 100%);
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }