.nine-home-area {
    position: relative;
    z-index: 1;
    height: 100vh;
    padding-top: 130px;

    .hero-background {
        position: absolute;
        inset: 0;
        object-fit: cover;
        width: 100%;
        height: 100%;
        z-index: -1;
    }
}

@keyframes jump {
    0% {
        transform: translate3d(0, 15px, 0);
    }
    100% {
        transform: translate3d(0, 0, 0);
    }
}

.nine-jump {
    transform-origin: 0;
    animation: jump 1s linear alternate infinite;
}

.nine-btn-social {
    @apply text-nine-sand-200 border-blue-gray-400 rounded-full border-2 text-shadow-lg;

    transition: 0.5s;
    transition-delay: 0.3s;

    &:hover {
        @apply rounded-full;

        background: linear-gradient(to right bottom, var(--color-nine-blue-900) 0%, var(--color-nine-cyan-500) 51%, var(--color-nine-blue-900) 100%);
        border-color: var(--color-nine-cyan-500);
    }
}

.nine-border-gradient {
    border-radius: 100%;
    border: 6px solid transparent;
    background: linear-gradient(45deg, var(--color-nine-blue-500), var(--color-nine-cyan-500)) border-box;
}