/* Custom CSS untuk Animasi dan Efek Transisi */

/* Efek Transisi Fade pada Slider Hero */
.slide {
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
    position: absolute;
    inset: 0;
}

.slide.active {
    opacity: 1;
    position: relative;
}


/* Animasi Putaran Halus untuk Lingkaran Halaman About */
.animate-spin-slow {
    animation: spin 20s linear infinite;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Utilitas Kustom Box Ikon Sosial Media di Footer */
.social-icon-box {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    background-color: #111827;
    border: 1px solid #1f2937;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease-in-out;
}

.social-icon-box:hover {
    color: #06b6d4;
    border-color: #06b6d4;
}


/* Sembunyikan scrollbar bawaan browser tapi track tetep fungsional */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}