.elementor-3868 .elementor-element.elementor-element-11a52e0{--display:flex;--min-height:80vh;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:center;--gap:0px 10px;--row-gap:0px;--column-gap:10px;--background-transition:0.3s;--overlay-opacity:0.37;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:200px;--padding-bottom:70px;--padding-left:0px;--padding-right:0px;}.elementor-3868 .elementor-element.elementor-element-11a52e0:not(.elementor-motion-effects-element-type-background), .elementor-3868 .elementor-element.elementor-element-11a52e0 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:radial-gradient(at top right, #0C2541 0%, #05091B 39%);}.elementor-3868 .elementor-element.elementor-element-11a52e0::before, .elementor-3868 .elementor-element.elementor-element-11a52e0 > .elementor-background-video-container::before, .elementor-3868 .elementor-element.elementor-element-11a52e0 > .e-con-inner > .elementor-background-video-container::before, .elementor-3868 .elementor-element.elementor-element-11a52e0 > .elementor-background-slideshow::before, .elementor-3868 .elementor-element.elementor-element-11a52e0 > .e-con-inner > .elementor-background-slideshow::before, .elementor-3868 .elementor-element.elementor-element-11a52e0 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#03030300;--background-overlay:'';}.elementor-3868 .elementor-element.elementor-element-11a52e0::before{filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate( 0deg );}.elementor-3868 .elementor-element.elementor-element-8170e1e{--display:flex;--min-height:396px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--gap:40px 0px;--row-gap:40px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:10;}.elementor-3868 .elementor-element.elementor-element-8170e1e.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3868 .elementor-element.elementor-element-278b781 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3868 .elementor-element.elementor-element-278b781{text-align:start;}.elementor-3868 .elementor-element.elementor-element-278b781 .elementor-heading-title{font-family:"Red Hat Display", Sans-serif;font-size:48px;font-weight:700;color:#FFFFFF;}@media(max-width:1024px){.elementor-3868 .elementor-element.elementor-element-11a52e0{--overlay-opacity:0;}.elementor-3868 .elementor-element.elementor-element-8170e1e{--justify-content:space-evenly;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-3868 .elementor-element.elementor-element-278b781{text-align:center;}}@media(min-width:768px){.elementor-3868 .elementor-element.elementor-element-11a52e0{--content-width:80%;}.elementor-3868 .elementor-element.elementor-element-8170e1e{--width:54%;}}@media(max-width:1024px) and (min-width:768px){.elementor-3868 .elementor-element.elementor-element-11a52e0{--content-width:85%;}.elementor-3868 .elementor-element.elementor-element-8170e1e{--width:100%;}}@media(max-width:767px){.elementor-3868 .elementor-element.elementor-element-11a52e0{--content-width:90%;--margin-top:0em;--margin-bottom:0em;--margin-left:0em;--margin-right:0em;--padding-top:150px;--padding-bottom:10px;--padding-left:0px;--padding-right:0px;}.elementor-3868 .elementor-element.elementor-element-8170e1e{--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3868 .elementor-element.elementor-element-278b781 .elementor-heading-title{font-size:46px;}}/* Start custom CSS for theme-post-title, class: .elementor-element-278b781 *//* ==========================================================
   1. HERO LOCKUP (Aligns the lines)
   ========================================================== */
.hero-lockup {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 0 !important;
}

/* ==========================================================
   2. TOP LINE (Sharp & Clean)
   ========================================================== */
.hero-top-text {
    font-size: clamp(20px, 2.5vw, 38px) !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

/* ==========================================================
   3. BOTTOM LINE (The "Anchor" for the Dot)
   ========================================================== */
.hero-main-text {
    font-size: clamp(50px, 5.5vw, 130px) !important;
    font-weight: 650 !important;
    color: #ffffff !important;
    line-height: 1 !important;
    margin: 0 !important;
    letter-spacing: -0.02em !important;
    transform: translateX(-0.04em);
    
    /* CRITICAL FIX: This stops the dot from jumping to a new line */
    display: inline !important; 
    white-space: nowrap !important;
    position: relative !important;
}

/* ==========================================================
   4. THE FLUID LIQUID DOT (Enhanced Animation)
   ========================================================== */
.hero-main-text::after {
    content: '' !important;
    display: inline-block !important;
    vertical-align: bottom !important;
    
    /* SCALING */
    width: 0.15em !important;
    height: 0.15em !important;
    border-radius: 50% !important;
    
    /* POSITIONAL TWEAKS */
    margin-left: 0.07em !important;
    position: relative !important;
    top: -0.16em !important; 

    /* GRADIENT - Added a third color for more fluid "swirl" */
    background: linear-gradient(135deg, #612DF0, #6ec1e4, #9d72ff, #612DF0) !important;
    
    /* CRITICAL: This makes the gradient large enough to move inside the dot */
    background-size: 400% 400% !important; 
    
    box-shadow: 0 0 15px rgba(110, 193, 228, 0.6) !important;
    
    /* ANIMATION: We run the movement and the pulse on the same timer */
    animation: fluidDot 10s ease-in-out infinite !important;
}

/* THE LIQUID PULSE & SWIRL EFFECT */
@keyframes fluidDot {
    0% { 
        transform: scale(1);
        background-position: 0% 50%;
        filter: brightness(1) hue-rotate(0deg);
    }
    50% { 
        background-position: 100% 50%; /* Swirling the gradient colors */
        filter: brightness(1.3) hue-rotate(10deg); /* Subtle color shift */
    }
    100% {         background-position: 0% 50%;
        filter: brightness(1) hue-rotate(0deg);
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-11a52e0 */.elementor-3868 .elementor-element.elementor-element-11a52e0 {
    background-color: #05091B !important; /* The base fallback color */
    
    /* Layer 1: The Fade Mask (Keeps the bottom perfectly solid #111)
      Layer 2: The Purple Orb
      Layer 3: The Cyan Orb
      Layer 4: The Deep Violet Orb
    */
    background-image: 
        linear-gradient(to bottom, rgba(17, 17, 17, 0) 0%, #05091B 85%),
        radial-gradient(circle at 50% 50%, #05091B 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, #6ec1e4 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, #3a1a91 0%, transparent 50%) !important;
        
    /* Oversize the orbs so they overlap and bleed into each other */
    background-size: 100% 100%, 200% 200%, 200% 200%, 200% 200% !important;
    background-repeat: no-repeat !important;
    
    /* The animation engine */
    animation: liquidRipple 12s ease-in-out infinite alternate !important;
}

@keyframes liquidRipple {
    0% { 
        /* The Mask stays totally still at 0% 0%, the orbs start at the edges */
        background-position: 
            0% 0%, 
            0% 0%, 
            100% 0%, 
            50% 100%; 
    }
    50% { 
        /* The orbs swirl to the middle and opposite sides */
        background-position: 
            0% 0%, 
            100% 50%, 
            0% 50%, 
            50% 0%; 
    }
    100% { 
        /* The orbs reach their final stretch before reversing */
        background-position: 
            0% 0%, 
            50% 100%, 
            50% 0%, 
            0% 100%; 
    }
}/* End custom CSS */