/* =================================================================
   DC ANIMATED HEADING WIDGET - Styles
   ================================================================= */

.dcs-animated-heading {
    display: block;
    font-weight: 700;
    line-height: 1.2;
}

.dcs-animated-text-wrapper {
    display: inline-block;
    position: relative;
}

.dcs-animated-text {
    display: inline-block;
    position: relative;
}

/* Typing Cursor */
.dcs-cursor {
    display: inline-block;
    margin-left: 3px;
    animation: blink 1s infinite;
    font-weight: 400;
}

@keyframes blink {

    0%,
    49% {
        opacity: 1;
    }

    50%,
    100% {
        opacity: 0;
    }
}

/* Fade Animation */
.dcs-animated-heading.anim-fade .dcs-animated-text {
    animation: fadeInOut 0.5s ease-in-out;
}

@keyframes fadeInOut {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

/* Slide Animation */
.dcs-animated-heading.anim-slide .dcs-animated-text {
    animation: slideUp 0.5s ease-out;
}

@keyframes slideUp {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Rotate Animation */
.dcs-animated-heading.anim-rotate .dcs-animated-text-wrapper {
    perspective: 300px;
}

.dcs-animated-heading.anim-rotate .dcs-animated-text {
    transform-style: preserve-3d;
    animation: rotateIn 0.6s ease-out;
}

@keyframes rotateIn {
    0% {
        opacity: 0;
        transform: rotateX(-90deg);
    }

    100% {
        opacity: 1;
        transform: rotateX(0);
    }
}

/* Flip Animation */
.dcs-animated-heading.anim-flip .dcs-animated-text {
    animation: flipIn 0.6s ease-out;
}

@keyframes flipIn {
    0% {
        opacity: 0;
        transform: rotateY(90deg);
    }

    100% {
        opacity: 1;
        transform: rotateY(0);
    }
}

/* Zoom Animation */
.dcs-animated-heading.anim-zoom .dcs-animated-text {
    animation: zoomIn 0.5s ease-out;
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* Glitch Animation */
.dcs-animated-heading.anim-glitch .dcs-animated-text {
    position: relative;
    animation: glitch 0.5s ease-in-out;
}

@keyframes glitch {
    0% {
        transform: translate(0);
        opacity: 0;
    }

    20% {
        transform: translate(-2px, 2px);
    }

    40% {
        transform: translate(-2px, -2px);
    }

    60% {
        transform: translate(2px, 2px);
    }

    80% {
        transform: translate(2px, -2px);
    }

    100% {
        transform: translate(0);
        opacity: 1;
    }
}

/* Ensure smooth transitions */
.dcs-animated-text {
    transition: opacity 0.3s ease;
}