/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 30 2026 | 19:35:52 */
/* =====================================================
   TYPING TEXT EFFECT
   Works on: plain <span class="typing-text">...</span>
   AND: Elementor Heading widget with wrapper class "typing-text"
   ===================================================== */

/* Exact text color — works whether the class is on the
   element itself (plain span) or on an Elementor wrapper
   with an .elementor-heading-title inside it */
.typing-text,
.typing-text .elementor-heading-title,
.typing-text .elementor-heading-title a,
.typing-text .elementor-heading-title a:hover,
.typing-text .elementor-heading-title a:focus,
.typing-text .elementor-heading-title a:visited {
    color: #F70FB5 !important;
    -webkit-text-fill-color: #F70FB5 !important;
}

/* Font size, family, weight ya style yahan set nahi ki gayi —
   typography Elementor / aapki own CSS control karegi */
.typing-text,
.typing-text .elementor-heading-title {
    display: inline-block;
    width: auto;
    overflow: visible;
}

/* Position for cursor — self-case (plain span) aur
   nested-case (Elementor heading) dono cover kiya */
.typing-text.typing-target,
.typing-text .typing-target {
    position: relative;
}

/* Typing cursor — self-case aur nested-case dono */
.typing-text.is-typing.typing-target::after,
.typing-text.is-typing .typing-target::after {
    content: "";
    display: inline-block;
    width: 0.055em;
    height: 0.9em;
    margin-left: 0.08em;

    background-color: #F70FB5;
    vertical-align: -0.06em;

    animation: typing-cursor-blink 0.65s steps(1, end) infinite;
}

@keyframes typing-cursor-blink {
    0%,
    49% {
        opacity: 1;
    }

    50%,
    100% {
        opacity: 0;
    }
}

/* Cursor animation complete hone ke baad remove —
   self-case aur nested-case dono */
.typing-text.typing-complete.typing-target::after,
.typing-text.typing-complete .typing-target::after {
    display: none;
}


/* =====================================================
   ELEMENTOR / STANDALONE ONE-TIME RGB GLITCH

   Cyan:  #07F0F5
   Pink:  #F70FB5
   White: #FFFFFF

   Works on: plain <span class="exact-rgb-glitch">...</span>
   AND: Elementor Heading widget with wrapper class "exact-rgb-glitch"
   ===================================================== */

.exact-rgb-glitch {
    --rgb-offset: 0.05em;
}


/* Base reset — self-case (plain span) aur nested-case
   (Elementor heading) dono */
.exact-rgb-glitch,
.exact-rgb-glitch .elementor-heading-title {
    position: relative !important;
    display: inline-block !important;
    overflow: visible !important;
    isolation: isolate;

    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}


/* All three layers container */
.exact-rgb-glitch .rgb-glitch-stack {
    position: relative;
    display: inline-block;

    font: inherit;
    font-size: inherit;
    font-weight: inherit;
    font-style: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    text-align: inherit;
    text-transform: inherit;

    isolation: isolate;
}


/* Shared styling */
.exact-rgb-glitch .rgb-glitch-layer {
    display: block;

    font: inherit;
    font-size: inherit;
    font-weight: inherit;
    font-style: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    text-align: inherit;
    text-transform: inherit;

    white-space: inherit;
    word-break: inherit;

    margin: 0;
    padding: 0;

    will-change: transform, clip-path;
}


/* Pink and cyan layers overlap the white text */
.exact-rgb-glitch .rgb-glitch-pink,
.exact-rgb-glitch .rgb-glitch-cyan {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    pointer-events: none !important;
}


/* Pink layer */
.exact-rgb-glitch .rgb-glitch-pink {
    z-index: 1;

    color: #F70FB5 !important;
    -webkit-text-fill-color: #F70FB5 !important;

    transform: translate3d(
        calc(var(--rgb-offset) * -1),
        0,
        0
    );
}


/* Cyan layer */
.exact-rgb-glitch .rgb-glitch-cyan {
    z-index: 2;

    color: #07F0F5 !important;
    -webkit-text-fill-color: #07F0F5 !important;

    transform: translate3d(
        var(--rgb-offset),
        0,
        0
    );
}


/* Main white layer */
.exact-rgb-glitch .rgb-glitch-white {
    position: relative;
    z-index: 3;

    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;

    transform: translate3d(0, 0, 0);
    pointer-events: auto !important;
}


/* =====================================================
   SITE TITLE / LINK SUPPORT
   ===================================================== */

.exact-rgb-glitch .rgb-glitch-layer a {
    display: block;

    font: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    font-style: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    text-align: inherit !important;
    text-transform: inherit !important;

    text-decoration: none !important;
    text-shadow: none !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    transition: none !important;
}


/* Exact pink on all link states */
.exact-rgb-glitch .rgb-glitch-pink a,
.exact-rgb-glitch .rgb-glitch-pink a:link,
.exact-rgb-glitch .rgb-glitch-pink a:visited,
.exact-rgb-glitch .rgb-glitch-pink a:hover,
.exact-rgb-glitch .rgb-glitch-pink a:focus,
.exact-rgb-glitch .rgb-glitch-pink a:active {
    color: #F70FB5 !important;
    -webkit-text-fill-color: #F70FB5 !important;
}


/* Exact cyan on all link states */
.exact-rgb-glitch .rgb-glitch-cyan a,
.exact-rgb-glitch .rgb-glitch-cyan a:link,
.exact-rgb-glitch .rgb-glitch-cyan a:visited,
.exact-rgb-glitch .rgb-glitch-cyan a:hover,
.exact-rgb-glitch .rgb-glitch-cyan a:focus,
.exact-rgb-glitch .rgb-glitch-cyan a:active {
    color: #07F0F5 !important;
    -webkit-text-fill-color: #07F0F5 !important;
}


/* Exact white on all link states */
.exact-rgb-glitch .rgb-glitch-white a,
.exact-rgb-glitch .rgb-glitch-white a:link,
.exact-rgb-glitch .rgb-glitch-white a:visited,
.exact-rgb-glitch .rgb-glitch-white a:hover,
.exact-rgb-glitch .rgb-glitch-white a:focus,
.exact-rgb-glitch .rgb-glitch-white a:active {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}


/* =====================================================
   ANIMATION — ONCE ON EVERY PAGE LOAD
   Self-case (plain span) aur nested-case (Elementor
   heading) dono ke liye combined selectors
   ===================================================== */

.exact-rgb-glitch.rgb-animation-start .rgb-glitch-white,
.exact-rgb-glitch .elementor-heading-title.rgb-animation-start .rgb-glitch-white {
    animation: rgb-white-once 1.15s steps(1, end) 1 both;
}

.exact-rgb-glitch.rgb-animation-start .rgb-glitch-cyan,
.exact-rgb-glitch .elementor-heading-title.rgb-animation-start .rgb-glitch-cyan {
    animation: rgb-cyan-once 1.15s steps(1, end) 1 both;
}

.exact-rgb-glitch.rgb-animation-start .rgb-glitch-pink,
.exact-rgb-glitch .elementor-heading-title.rgb-animation-start .rgb-glitch-pink {
    animation: rgb-pink-once 1.15s steps(1, end) 1 both;
}


/* White text movement */
@keyframes rgb-white-once {
    0% {
        transform: translate3d(0, 0, 0);
    }

    7% {
        transform: translate3d(-0.06em, 0, 0);
    }

    12% {
        transform: translate3d(0.05em, -0.01em, 0);
    }

    18% {
        transform: translate3d(-0.025em, 0.01em, 0);
    }

    24% {
        transform: translate3d(0.035em, 0, 0);
    }

    31% {
        transform: translate3d(0, 0, 0);
    }

    41% {
        transform: translate3d(-0.035em, 0, 0);
    }

    47% {
        transform: translate3d(0.03em, 0, 0);
    }

    54%,
    100% {
        transform: translate3d(0, 0, 0);
    }
}


/* Cyan layer movement */
@keyframes rgb-cyan-once {
    0% {
        transform: translate3d(0.18em, 0, 0);
        clip-path: inset(0 0 0 0);
    }

    7% {
        transform: translate3d(0.25em, -0.01em, 0);
        clip-path: inset(8% 0 66% 0);
    }

    13% {
        transform: translate3d(-0.07em, 0.015em, 0);
        clip-path: inset(38% 0 37% 0);
    }

    19% {
        transform: translate3d(0.21em, -0.01em, 0);
        clip-path: inset(69% 0 7% 0);
    }

    26% {
        transform: translate3d(0.1em, 0, 0);
        clip-path: inset(18% 0 54% 0);
    }

    33% {
        transform: translate3d(0.14em, 0, 0);
        clip-path: inset(0 0 0 0);
    }

    42% {
        transform: translate3d(-0.06em, 0, 0);
        clip-path: inset(54% 0 20% 0);
    }

    49% {
        transform: translate3d(0.16em, -0.01em, 0);
        clip-path: inset(26% 0 49% 0);
    }

    56% {
        transform: translate3d(0.08em, 0, 0);
        clip-path: inset(0 0 0 0);
    }

    66%,
    100% {
        transform: translate3d(
            var(--rgb-offset),
            0,
            0
        );

        clip-path: inset(0 0 0 0);
    }
}


/* Pink layer movement */
@keyframes rgb-pink-once {
    0% {
        transform: translate3d(-0.18em, 0, 0);
        clip-path: inset(0 0 0 0);
    }

    7% {
        transform: translate3d(-0.25em, 0.01em, 0);
        clip-path: inset(66% 0 8% 0);
    }

    13% {
        transform: translate3d(0.07em, -0.015em, 0);
        clip-path: inset(10% 0 66% 0);
    }

    19% {
        transform: translate3d(-0.21em, 0.01em, 0);
        clip-path: inset(42% 0 33% 0);
    }

    26% {
        transform: translate3d(-0.1em, 0, 0);
        clip-path: inset(72% 0 5% 0);
    }

    33% {
        transform: translate3d(-0.14em, 0, 0);
        clip-path: inset(0 0 0 0);
    }

    42% {
        transform: translate3d(0.06em, 0, 0);
        clip-path: inset(21% 0 55% 0);
    }

    49% {
        transform: translate3d(-0.16em, 0.01em, 0);
        clip-path: inset(56% 0 18% 0);
    }

    56% {
        transform: translate3d(-0.08em, 0, 0);
        clip-path: inset(0 0 0 0);
    }

    66%,
    100% {
        transform: translate3d(
            calc(var(--rgb-offset) * -1),
            0,
            0
        );

        clip-path: inset(0 0 0 0);
    }
}


/* Reduced motion users ke liye final static state */
@media (prefers-reduced-motion: reduce) {
    .exact-rgb-glitch .rgb-glitch-layer {
        animation-duration: 0.01ms !important;
    }
}