.slide {
            opacity: 0;
            visibility: hidden;
            transition: opacity .8s ease;
        }

        .slide.active {
            opacity: 1;
            visibility: visible;
        }

        .slide-image {
            animation: heroZoom 10s linear infinite alternate;
        }

        @keyframes heroZoom {

            from {
                transform: scale(1);
            }

            to {
                transform: scale(1.08);
            }

        }

        .slide-content {

            opacity: 0;
            transform: translateY(40px);
            transition: all .9s ease;

        }

        .slide.active .slide-content {

            opacity: 1;
            transform: translateY(0);

        }

        #prev,
        #next {

            transition: .35s;

        }

        #prev:hover,
        #next:hover {

            transform: translateY(-50%) scale(1.12);

        }

        .dot {

            transition: .35s;

        }

        .dot:hover {

            transform: scale(1.4);

        }

        .dot.active {

            width: 32px;

            border-radius: 9999px;

            background: #ffffff;

        }

        .hero-btn {

            transition: .35s;

        }

        .hero-btn:hover {

            transform: translateY(-3px);

            box-shadow: 0 20px 40px rgba(0, 0, 0, .25);

        }

        @keyframes marquee {
            0% {
                transform: translateX(0);
            }

            100% {
                transform: translateX(-50%);
            }
        }

        .animate-marquee {
            display: flex;
            width: max-content;
            animation: marquee 25s linear infinite;
        }