.carousel-slide {
    position: relative;
    height: 70vh;
    color: #fff;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;

    .carousel-image {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;

        img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        &::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 10%, rgba(0, 0, 0, 0.1) 100%);
        }
    }

    .carousel-legend {
        padding: 2rem 4rem;
        text-align: left;
        max-width: 50%;

        h2 {
            font-size: 2.5rem;
            margin-bottom: 1rem;
        }

        p {
            font-size: 1.1rem;
            margin-bottom: 1.5rem;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        .legend-button {
            background-color: #e50914;
            color: #fff;
            padding: 0.75rem 1.5rem;
            border-radius: 4px;
            text-decoration: none;
            font-weight: bold;
            transition: background-color 0.3s;

            &:hover {
                background-color: #f40612;
            }
        }
    }
}

.carousel .control-dots {
    bottom: 20px;
}





// Responsivo
@media (max-width: 768px) {
    .carousel-slide .carousel-legend {
        padding: 2rem 4rem;
        text-align: left;
        max-width: 100%;
        padding-bottom: 50%;
    }

}