/*
 * Structural CSS only.
 * Font, size, weight, colour, hover colour, spacing, borders, background,
 * padding, width and height continue to come from Elementor.
 */

.ii-scramble-word {
    position: relative;
    display: inline-block;
    vertical-align: baseline;
    overflow: hidden;
}

.ii-scramble-original {
    display: inline-block;
}

.ii-scramble-overlay {
    position: absolute;
    inset: 0;
    display: block;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
}

.ii-scramble-word.ii-is-scrambling > .ii-scramble-original {
    opacity: 0 !important;
}

.ii-scramble-word.ii-is-scrambling > .ii-scramble-overlay {
    opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
    .ii-scramble-overlay {
        display: none !important;
    }

    .ii-scramble-original {
        opacity: 1 !important;
    }
}