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

    &::before {
        position: absolute;
        inset: 0;
        z-index: -1;
        content: "";
        background: url("https://carolinenoyer.fr/images/volcans-cnoyer.png")
            no-repeat 50%;
        background-size: cover;
    }
}

.nine-btn-social {
    @apply text-nine-light 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-dark) 0%,
            var(--color-nine-turquoise) 51%,
            var(--color-nine-blue-dark) 100%
        );
        border-color: var(--color-nine-turquoise);
    }
}

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