/* Moved unchanged from the inline <style> in Views/Pricing/Index.cshtml */
    .pricing-group {
        margin-bottom: 2rem;
    }

    .tutorial-cursor {
        position: absolute;
        top: 38%; /* You can adjust these */
        left: 25%;
        width: 48px;
        height: 48px;
        background-image: url(/img/assetslanding/cursor.png);
        background-size: contain;
        background-repeat: no-repeat;
        z-index: 1000;
        animation: cursor-click 2.5s ease-in-out infinite;
        animation-iteration-count: 2;
        pointer-events: none; /* Make sure it doesn't block real clicks */
        transform: translate(-50%, -50%);
        opacity: 0;
    }

    @keyframes cursor-click {
        0% {
            transform: translate(10%, 10%) scale(1);
            opacity: 0;
        }

        10% {
            transform: translate(10%, 15%) scale(1);
            opacity: 1;
        }


        40% {
            transform: translate(-88%, -85%) scale(1);
            opacity: 1;
            background-image: url(/img/assetslanding/cursor.png);
        }

        50% {
            transform: translate(-88%, -85%) scale(0.8);
            opacity: 1;
            background-image: url(/img/assetslanding/cursor-click.png);
        }

        60% {
            transform: translate(-88%, -85%) scale(1);
            opacity: 1;
            background-image: url(/img/assetslanding/cursor.png);
        }

        90% {
            transform: translate(10%, 15%) scale(1);
            opacity: 0;
        }

        100% {
            transform: translate(10%, 10%) scale(1);
            opacity: 0;
        }
    }


    .swal2-confirm {
        background-color: #25a9e0 !important;
    }
